ELEMENT COMPILATION ENGINE

by João Vitor Scheuermann

JavaScript

// FUNCTIONALITY
class HTMLElement {
		constructor (_tag, _atributes, _innerHTML) {
    		this._tag = _tag;
        this._atributes = _atributes || [];
        this._innerHTML = _innerHTML || [];
    }
    
    // :void
    add (_target, _data) {
    		switch(_target) {
            case "atribute":
                this._atributes.push(_data);
                break;
            case "innerHTML":
                this._innerHTML.push(_data);
                break;
            default:
                throw new Error(`Doesn't found: ${_target}`);
        }     	
    }    
    
    // :void
    template () {    		
    		return `
        <${this._tag} ${ this._atributes.map(atribute => atribute.string(true)).join(" ")}>
            ${this._innerHTML.map(item => {            		
                if (typeof item === "string" || typeof item ===  "number") {
                  return `${item}`;
                } else {
                	return `${item.template()}`;
                }                   
            }).join("\n")}
        </${this._tag}>
     	`;
    }    
    
}

class HTMLElementAtribute {
		constructor (_name, data, _separator, _contentseparator) {
    
    		this._separator = _separator || "";
    		this._contentseparator = _contentseparator || "";
        this._container = '"'
        
    		this.name = _name;
        this.data = data ? data : [];
    }
    
    add (... values) {
    		this.data = this.data.concat(values);
        console.log(this.data)
    }
    
    string (root) {    
    		return `${this.name}${this._separator}${root ? this._container : ''}${this.data.map(item => {        		
          	 if (typeof item === "string" || typeof item ===  "number") {
                return `${item}`;
             } else {
                return `${item.string()}`;
             }    
        }).join("")}${root ? this._container : ''}${this._contentseparator}`
    }
}

let tr = new HTMLElement('tr')