library-ts/browser/dom/AttributeValue.ts

import { DOMEditor } from "./DOMEditor";
import { ElementAttribute } from "./ElementAttribute";

export enum AttributeValueMatchMode
{
  EXACTLY,
  STARTS_WITH
}

export class AttributeValue
{
  private _value:string;
  private _attribute:ElementAttribute;
  private _mode:AttributeValueMatchMode = AttributeValueMatchMode.EXACTLY;
  

  static get type_checkbox(){ return new AttributeValue( ElementAttribute.type, "checkbox" ); }
  static get type_email(){ return new AttributeValue( ElementAttribute.type, "email" ); }
  static get type_text(){ return new AttributeValue( ElementAttribute.type, "text" ); }
  static get type_file(){ return new AttributeValue( ElementAttribute.type, "file" ); }
  static get type_number(){ return new AttributeValue( ElementAttribute.type, "number" ); }
  static get type_time(){ return new AttributeValue( ElementAttribute.type, "time" ); }
  static get type_date(){ return new AttributeValue( ElementAttribute.type, "date" ); }
  static get type_password(){ return new AttributeValue( ElementAttribute.type, "password" ); }

  static get target_blank(){ return new AttributeValue( ElementAttribute.target, "_blank" ); }
  
  static get preloadAuto() { return  new AttributeValue( ElementAttribute.preload, "auto" ); }
  static get preloadNone() { return  new AttributeValue( ElementAttribute.preload, "none" ); }
  static get preloadMetaData() { return  new AttributeValue( ElementAttribute.preload, "metadata" ); }

  static parseAttributeValue( source:string )
  {
    let seperator = source.indexOf( "=" );

    let attributeName = source.substring( 0, seperator ).trim();

    let value = source.substring( seperator + 1 ).trim();

    if ( value.startsWith( "\"" ) || value.startsWith( "'") )
    {
      value = value.substring( 1, value.length - 1 );
    } 
    
    
    let attribute = new ElementAttribute( attributeName, false );

    return new AttributeValue( attribute, value );
  }

  constructor( attribute:ElementAttribute, value:string, mode:AttributeValueMatchMode = AttributeValueMatchMode.EXACTLY )
  {
    this._value = value;
    this._attribute = attribute;
    this._mode = mode || AttributeValueMatchMode.EXACTLY;
  }

  get attribute()
  {
    return this._attribute;
  }

  get value()
  {
    return this._value;
  }

  get selector():string
  {
    switch ( this._mode )
    {
      case AttributeValueMatchMode.EXACTLY:
      { 
        return this._attribute.selectorEquals( this._value );
      }
      
      case AttributeValueMatchMode.STARTS_WITH: 
      { 
        return this._attribute.selectorStartsWith( this._value ); 
      }
    }

    console.log( "No selector" );

    return null;
  }

  find( elements:Element[] )
  {
    for ( let i = 0; i < elements.length; i++ )
    {
      if ( this.in( elements[ i ] ) )
      {
        return elements[ i ];
      }
    }

    return null;
  }

  query<T extends Element>( element:Element )
  {
    return element.querySelector( this.selector ) as T;
  }

  queryDoc<T extends Element>()
  {
    return document.querySelector( this.selector ) as T;
  }

  queryAll( element:Element )
  {
    return DOMEditor.nodeListToArray( element.querySelectorAll( this.selector ) );
  }

  queryAllInDoc()
  {
    return DOMEditor.nodeListToArray( document.querySelectorAll( this.selector ) );
  }

  set( element:Element )
  {
    this._attribute.to( element, this._value );
  }

  removeFrom( element:Element )
  {
    this._attribute.removeFrom( element );
  }

  toggle( element:Element )
  {
    if ( this.in( element ) )
    {
      this.removeFrom( element );
    }
    else
    {
      this.set( element );
    }
  }

  isSelected( selectElement:HTMLSelectElement )
  {
    return selectElement.value == this.value;
  }

  in( element:Element )
  {
    let attValue = this._attribute.from( element );

    switch ( this._mode )
    {
      case AttributeValueMatchMode.EXACTLY: return attValue === this._value;
      case AttributeValueMatchMode.STARTS_WITH: return attValue.startsWith( this._value );
    }

    return false;

  }
}