JQMGenerator = new Blockly.Generator( "CafeSQL" ) ; CafeGenerator = JQMGenerator $ = Agregar ; VALUE = "input_value" STATEMENT = "input_statement" FIELDINPUT = "field_input" FIELDDROPDOWN = "field_dropdown" ID = '{DId|field_variable|{"variable":"idPagina1","variableTypes":["idPagina"],"defaultType":"idPagina"}' ATRIBUTOS = '{DAtributos|input_value}' TEMAPPAL = '{DTema|field_dropdown|{"options":[["Normal",""],["Flat UI redondeado","flr"],["Flat UI cuadrado","flq"],["Rojo","red"],["Rosa","pink"],["Violeta","purple"],["Púrpura","deep-purple"],["Índigo","indigo"],["Azul","blue"],["Celeste","lightblue"],["Cian","cyan"],["Turquesa","teal"],["Verde","green"],["Verde limón","light-green"],["Lima","lime"],["Amarillo","yellow"],["Ámbar","amber"],["Oro","orange"],["Naranja","deep-orange"],["Marrón","brown"],["Gris","grey"],["Gris azulado","blue-grey"],["Modo oscuro","dark"]]}' ; TEMA = '{DTema|field_dropdown|{"options":[["A","a"],["B","b"],["C","c"],["D","d"],["E", "e"],["F", "f"],["G", "g"],["H", "h"],["I", "i"],["J", "j"],["K", "k"],["L", "l"],["M", "m"],["N", "n"]]}' ; DTEMA = `red.pink.amber.orange.blue.green.lime.black`.split(".").map(function(n){return `["${n}","${n}"]`}).join(",") ; DORG = `responsive.izquierda.centrado.derecha.justificado`.split(".").map(function(n){return `["${n}","${n}"]`}).join(",") ; DTIPOS = `div.section.article.header.footer.aside.ul.ol.main.form.fieldset.legend.iframe.audio.title.table.thead.tbody.tfooter.tr.td.th.video`.split(".").map(function(n){return `["${n}","${n}"]`}).join(",") ; DROLES = `Ninguno.panel.none.page.header.footer.content.main.navbar.listview.listdivider.controlgroup.button.popup.dialog`.split(".").map(function(n){return `["${n}","${n}"]`}).join(","); DEFECTOSTEXTO = `b.strong.i.em.u.strike.strikethrough.sub.super.span`.split(".").map(function(n){return `["${n}","${n}"]`}).join(","); DINPUTTYPES = `text.hidden.search.password.number.range.email.url..tel.button.checkbox.radio.color.date.datetime.datetime-local.time.month.week.file.image.reset.submit`.split(".").map(function(n){return `["${n}","${n}"]`}).join(","); DPARRAFO = `párrafo P.botón BUTTON.anclaje/hipervínculo A.item de lista LI.citación blockquote.titular H1.titular H2.titular H3.titular H4.titular H5.titular H6.desplegable SELECT.opción OPTION.etiqueta LABEL.leyenda LEGEND.resumen SUMMARY`.split(".").map(function(n){return `["${n}","${n.split(" ").at(-1)}"]`}).join(","); DDATA = `role.button.position.theme.icon.iconpos.transition.reverse.ajax.mini.inset.filter.filter-placeholder`.split(".").map(function(n){return `["${n}","${n}"]`}).join(","); DATRI = `src.href.rel.id.class.name.type.src.r.cx.cy.rx.ry.width.height.fill.stroke.min.max.step.download.target.alt.title`.split(".").map(function(n){return `["${n}","${n}"]`}).join(","); NARANJA = "#FFA500" BLOQUES = "#1E90FF" LISTAS = "#FF4500" DATO = "#8B0045" FUNCIONES = "#8B008B" COLOR = {} COLOR.NARANJA_CLARO = NARANJA.replace("FF","CC") COLOR.NARANJA_OSCURO = "red" COLOR.REGLA = "#630235" COLOR.REGLA1 = "#721250" Agregar( `TPuntoComa`, ';', { salida: true, color: "#CC0022" }, [' ;\n',0] ) ; function AgrStat(Nombre,Mensaje,Color,Fn) { Agregar( Nombre, Mensaje, { esStatement:true,color: Color||"#550055"},Fn) } AgrStat( "TIdea", "// {DIdea|field_input}", "#340099", `\n// {DIdea}\n` ) AgrStat( "TIdea2", "// {DIdea|field_input}{A|input_dummy}{DContenido|input_statement}", "#340099", `\n// {DIdea}\n{DContenido}\n` ) AgrStat( "TIdea3", " {A|input_dummy}{DContenido|input_statement}", "#340099", `\n<${"!--"} {DIdea} -->\n{DContenido}\n` ) Agregar( `TEvento` , `{DDato|field_input|{"text":"idAbc"}.on{DEvento|field_input|{"text":"dblclick"} = {DFn|input_value}` , { esStatement: true, color: "#CC0011" } , function(D){ if( D.DDato.trim() == "" || D.DFn.trim() == "" ) return "/* Acá debiera haber un evento "+D.DEvento+" */\n" ; return `${D.DDato}.on${D.DEvento} = ${D.DFn} ;\n` } ) Agregar( `TEventoAdd` , `{DDato|field_input|{"text":"idAbc"}.addEventListener( "{DEvento|field_input|{"text":"dblclick"}", {DFn|input_value}, {DTrue|field_dropdown|["false","false"],["true","true"]} );` , { esStatement: true, color: "#CC0011" } , function(D){ if( D.DDato.trim() == "" || D.DFn.trim() == "" ) return "/* Acá debiera haber un evento "+D.DEvento+" */\n" ; return `${D.DDato}.addEventListener( "${D.DEvento}", ${D.DFn}, ${D.DTrue.toLowerCase()} ) ;\n`; } ) Agregar( `TEventoRemove` , `{DDato|field_input|{"text":"idAbc"}.removeEventListener( "{DEvento|field_input|{"text":"dblclick"}" );` , { esStatement: true, color: "#CC0011" } , function(D){ if( D.DDato.trim() == "" || D.DFn.trim() == "" ) return "/* Acá debiera haber un evento "+D.DEvento+" */\n" ; return `${D.DDato}.removeEventListener( "${D.DEvento}" ) ;\n`; } ) Agregar( "TRepetir" , `Repetir {N|field_number|{"value":"10"} veces con {T|field_input|{"text":"%%"}{A|input_dummy}{DContenido|input_statement}` , { esStatement: true , color: "#111" } , function(D){ var s = "" ; for( var i = 1; i <= Math.abs(D.N) ; i++ ) { s+= D.DContenido.replace( new RegExp( D.T, "gi" ) , i+"" ) } return s ; } ) $( "TTData", ` data-{clave|field_input}="{valor|field_input}"` , {esStatement:true, color: "fuchsia"} , ` data-{clave}="{valor}"` ) $( "TImpressSlide", `
{DContenido|input_statement}
` , {esStatement:true,color:"purple"} , `
\n{DContenido}
\n` ) $( `TImpress` , `
{D|input_dummy}{DContenido|input_statement}
{B|input_dummy}{C|input_dummy}` , { color: "purple", esStatement: true } ,`
{DContenido}
` ) $( "TImpressCircular" , `Diapositivas en círculo{A|input_dummy}Radio:{DRadio|field_input}{B|input_dummy}{DContenido|input_statement}` , { color: "#400040", esStatement: true } , function(D){ $list = D.DContenido.match(/xxyy/g).length || 1 ; $radio = D.DRadio || 100 $x = 0 ; D.DContenido = D.DContenido.replace( /xxyy/g, function(a,b){ $ang = 360 / $list * $x ; $d = "" ; $d += ` data-x="${ $radio*Math.cos($ang/180*Math.PI) }" ` $d += ` data-z="${ $radio*Math.sin($ang/180*Math.PI) }" ` $d += ` data-rotate-y="${$ang}" ` $x++ ; return $d; } ) return D.DContenido ; } ) $( "TImpressHoriz" , `Diapositivas Horiz:{A|input_dummy} X:{DXPrimer|field_number} Y:{DYPrimir|field_number}{B|input_dummy} Separación:{DSeparacion|field_number} {C|input_dummy}{DContenido|input_statement}` , { color: "#400040", esStatement: true } , function(D){ $list = D.DContenido.match(/xxyy/g).length || 1 ; $radio = D.DRadio || 100 $x = D.DXPrimer ; $y = D.DYPrimir ; D.DContenido = D.DContenido.replace( /xxyy/g, function(a,b){ $ang = 360 / $list * $x ; $d = "" ; $d += ` data-x="${ $x }" ` $d += ` data-y="${ $y }" ` //$d += ` data-rotate-y="${$ang}" ` $x+=D.DSeparacion ; return $d; } ) return D.DContenido ; } ) $( "TImpressVerti" , `Diapositivas Vertical:{A|input_dummy} X:{DXPrimer|field_number} Y:{DYPrimir|field_number}{B|input_dummy} Separación:{DSeparacion|field_number} {C|input_dummy}{DContenido|input_statement}` , { color: "#400040", esStatement: true } , function(D){ $list = D.DContenido.match(/xxyy/g).length || 1 ; $radio = D.DRadio || 100 $x = D.DXPrimer ; $y = D.DYPrimir ; D.DContenido = D.DContenido.replace( /xxyy/g, function(a,b){ $d = "" ; $d += ` data-x="${ $x }" ` $d += ` data-y="${ $y }" ` //$d += ` data-rotate-y="${$ang}" ` $y+=D.DSeparacion ; return $d; } ) return D.DContenido ; } ) // --------------------------------------------------[ PHP ] $( 'TPHPInclude' , 'Incluir con PHP el archivo __DIR__{DDir|field_checkbox}{DArchivo|field_input|{"text":"archivo"}.php' , { esStatement: true, color: "black" } , '\<\?php include {[DDir]=="TRUE"?`__DIR__ . "/`:`"`}{DArchivo}.php" ; \?\>' , 'Si trabajás con PHP permite incluir el contenido de otro archivo .php' ) $( 'TPHPIfElse' , 'PHP Si ocurriera {DCondicion|field_input|{"text":"isset($variable) AND $a == 25"} entonces mostrar {D|input_dummy}{DSi|input_statement} /Fin Si PHP' , { esStatement: true, color: "black" } ,function(D){return ` \<\?php if( ${D.DCondicion||1} ) { \?\> ${D.DSi} \<\?php } \?\> `} ,`Si trabajás con PHP permite tomar decisiones según la condición que agregues` ) $( 'TPHPElseIf' , `PHP Pero si (elseif) ocurriera que {DCondicion|field_input|{"text":"isset($variable) AND $b==-1"} entonces...` , { esStatement: true, color: "black" } , function(D){return '\n\<\?php } else if( '+D.DCondicion+' ) { \?\>\n'} ) $( `TPHPElse` , `PHP Caso contrario (else) ` , { esStatement: true, color: "black" } , function(D){return '\<\?php } else { \?\>\n'} ) $( 'TPHPForEach' , 'PHP foreach( {DCondicion|field_input|{"text":"$lista as $n => $valor"} ) repetir {D|input_dummy}{DRepetir|input_statement}/Fin Para Cada PHP' , { esStatement: true, color: "black" } ,function(D){return ` \<\?php foreach( ${D.DCondicion||1} ) { \?\> ${D.DRepetir} \<\?php } \?\>`} , `Si trabajás con PHP permite iterar un Array/Conjunto \ny repetir los mismos bloques para cada item` ) $( 'TPHPFor' , 'PHP for( {DCondicion|field_input|{"text":"$i = 0 ; $i < 25 ; $i++"} ) repetir {D|input_dummy}{DSi|input_statement} /Fin For PHP' , { esStatement: true, color: "black" } ,function(D){return ` \<\?php for( ${D.DCondicion||1} ) { \?\> ${D.DSi} \<\?php } \?\> `} ,`Si trabajás con PHP permite repetir un proceso con la variable dada` ) $( 'TPHPIniciarSesiones' , 'Habilitar las sesiones' , {esStatement:true, color: "black"} , `\<\?php session_start() ; \?\>` , `Si trabajás con PHP habilita la variable $_SESSION[]` ) $( 'TPHPDestruirSesiones' , 'Destruir cualquier sesión' , {esStatement: true, color: "black"} , `\<\?php session_destroy() ; \?\>` , `Si trabajás con PHP deshabilita la variable $_SESSION[]` ) $( 'TPHPHeader' , 'PHP Header {DHeader|field_input|{"text":"Location: abc.php"}' , {esStatement: true, color: "black"} , `\<\?php header( "{DHeader}" ) ; \?\>` ) $( "PErrores", 'PHP Habilitar ver errores', {esStatement: true, color: "#A5AA00"} , function(){return"\n\<\?php // Bloque: PErrores\nini_set('display_errors', 1);\nini_set('display_startup_errors', 1);\nerror_reporting(E_ALL);\?\>\n"} , `Si trabajás con PHP habilita la muestra de errores` ) $( 'TPHPVar' , 'PHP Variable {DTipo|field_dropdown|{"options":[["$",""],["$_GET","$_GET"],["$_POST","$_POST"],["$_SESSION","$_SESSION"]]} {DNombre|field_input|{"text":"abc"}' , { salida: "String", color: "black" } , function(D){return [D.DTipo==="$" ? '$'+D.DNombre : `${D.DTipo}["${D.DNombre}"]`,0] } ) $( 'TPHPInline' , 'PHP mostrar {DInline|input_value} {DOtro|input_value}' , { salida: "String", color: "black", renglones: 2} , [`\<\?= {DInline} \?\>{DOtro}`,0] ) // --------------------------------------------------[ /PHP ] ////////////////// SVG Agregar( `AMano` , `Convertir SVG a dibujo pintado a mano` , { esStatement: true } , ` ` ) Agregar( `TSVG` , `<{DItem|field_dropdown|["svg","svg"],["rect","rect"],["circle","circle"],["ellipse","ellipse"],["image","image"],["path","path"],["text","text"],["polygon","polygon"],["polyline","polyline"],["line","line"],["foreignObject","foreignObject"]} atr{DAtributos|input_value}>{DContenido|input_statement}` , { esStatement: true , color: "30" } , `<{DItem} {DAtributos}>\n{DContenido}\n` ) Agregar( `TSVG2` , `<{DItem|field_dropdown|["rect","rect"],["circle","circle"],["ellipse","ellipse"],["image","image"],["path","path"],["text","text"],["polygon","polygon"],["polyline","polyline"],["line","line"],["svg","svg"]} atr{DAtributos|input_value}>{DContenido|input_statement}` , { esStatement: true , color: "50" } , `<{DItem} {DAtributos}>\n{DContenido}\n` ) Agregar( `TSVG3` , `{DCodigo|field_input}` , { esStatement: true , color: "50" } , function(D) { //console.log(7000,D); return D.DCodigo.replace( /\/g, "" ).replace( /\<\/svg(.*?)\>/g, "" ) ; } ) Agregar( `TSVG4` , `{DConte|input_statement}` , { esStatement: true , color: "50" } , `\n{DConte}` ) Agregar( `BSvgColoreable` , `{DTipo|field_dropdown|["fill","fill"],["stroke","stroke"]}={DValor|input_value}{DOtros|input_value}` , { salida: true , color: "fuchsia" } , [` {DTipo}="{DValor}" {DOtros}`,0] ) Agregar( `BXY` , `x="{DX|field_input|{"text":"0"}" y="{DY|field_input|{"text":"0"}" {DOtros|input_value}` , { salida: true , color: "fuchsia" } , [` x="{DX}" y="{DY}" {DOtros}`,0] ) Agregar( `BCXY` , `cx="{DX|field_input|{"text":"0"}" cy="{DY|field_input|{"text":"0"}" {DOtros|input_value}` , { salida: true , color: "fuchsia" } , [` cx="{DX}" cy="{DY}" {DOtros}`,0] ) Agregar( `BWH` , `width="{DW|field_input|{"text":"0"}" height="{DH|field_input|{"text":"0"}" {DOtros|input_value}` , { salida: true , color: "fuchsia" } , [` width="{DW}" height="{DH}" {DOtros}`,0] ) Agregar( `BWHR` , `rx="{DW|field_input|{"text":"0"}" ry="{DH|field_input|{"text":"0"}" {DOtros|input_value}` , { salida: true , color: "fuchsia" } , [` rx="{DW}" ry="{DH}" {DOtros}`,0] ) Agregar( `TEstilos` , `style="{DTexto|field_input|{"text":"background:rgba(150,150,150,0.6)"}"{DOtros|input_value}` , { salida: true , color: "fuchsia" } , [`style="{DTexto}" {DOtros}`,0] ) Agregar( `TEstilos2` , `style="{DTexto|input_statement}" {DOtros|input_value}` , { salida: true , color: "fuchsia" } , [`style="{DTexto}" {DOtros}`,0] ) Agregar( `TAtributos` , `{DContenido|input_statement}` , { salida: true , color: "fuchsia" } , [` {DContenido}`,0] ) Agregar("PAtributos",`Atr {DOtro|input_value}`,{esStatement:true,color:"fuchsia"}, ` {DOtro}`) Agregar( `TPathD` , `d="{DTexto|input_statement}" {DOtros|input_value}` , { salida: true , color: "fuchsia" } , [`d="{DTexto}" {DOtros}`,0] ) Agregar( `TOpD` , `{DMetodo|field_dropdown|{"options":[["M","M"],["m","m"],["L","L"],["l","l"],["Q","Q"],["q","q"],["Z","Z"]]}{DTexto|field_input|{"text":"100 100"}` , { esStatement: true , renglones: 2 , color: "180" } , `{DMetodo} {DTexto} ` ) Agregar( `TSvgCirculo` , `` , { esStatement: true , renglones: 2 , color: "180" } , `\n` ) Agregar( `TSvgElipse` , `` , { esStatement: true , renglones: 2 , color: "180" } , `\n\n` ) Agregar( `TSvgRect` ) ////////////////// JAVASCRIPT Agregar(`JSSimple`, `{DAccion|input_value};`,{esStatement:true,color:"#CC0000"},`{DAccion} ;\n`) Agregar(`JSVar`, `{DTipo|field_dropdown|[" ",""],["var","var"],["const","const"],["let","let"]} {DNombre|input_value}{DOp|field_dropdown|["=","="],["+=","+="],["-=","-="],["*=","*="],["/=","/="]}{DValor|input_value};`,{esStatement:true,color:"#CC0000"}, function(D){ if( D.DTipo == "const" && D.DValor == "" ) return `/* constante no válida */ ;\n` return `${D.DTipo} ${D.DNombre}${D.DValor!=""?` ${D.DOp} ${D.DValor}`:``} ;\n` }); Agregar(`JSVar2`, `{DTipo|field_dropdown|[" ",""],["var","var"],["const","const"],["let","let"]} {DNombre|input_value}{DOp|field_dropdown|["=","="],["+=","+="],["-=","-="],["*=","*="],["/=","/="]}{DNombre2|input_value}({DValor|input_value});`,{esStatement:true,color:"#CC0000"}, function(D){ if( D.DTipo == "const" && D.DValor == "" ) return `/* constante no válida */ ;\n` return `${D.DTipo} ${D.DNombre}${D.DValor!=""?` ${D.DOp}${D.DNombre2}(${D.DValor})`:``} ;\n` }); Agregar( `BTextoX` ,`"{DValor|field_input|{"text":"use strict"}"{DOtros|input_value}` ,{ salida:true ,color:"#770000" } ,[ `"{DValor}"{DOtros}` ,0 ] ) ; Agregar(`BDatop`,`{DValor|field_input|{"text":"abc"}{DOtros|input_value}`,{salida:true,color:"#770000"},[`{DValor}{DOtros}`,0]) ; Agregar(`Ejecutar1`, `{DNombre|field_input|{"text":"console.log"}( {A|input_dummy}{DParam1|input_value} ) ;`,{esStatement:true, renglones:1,color:"#CC0000"},`{DNombre}( {DParam1} ) ;\n`) Agregar(`BEjecutar1`, `{DNombre|field_input|{"text":"console.log"}( {A|input_dummy}{DParam1|input_value} ) `,{salida:true, renglones:1,color:"#AA0000"},[`{DNombre}( {[DParam1].trim()} ) `,0]) Agregar(`setTimeout`, `{DNombre|field_dropdown|{"options":[["setTimeout","setTimeout"],["setInterval","setInterval"],["clearTimeout","clearTimeout"],["clearInterval","clearInterval"]]}( {A|input_dummy}{DParam1|input_value},{DParam2|field_number|{"value":"3000"} ) ;`,{esStatement:true, renglones:1,color:"#CC0000"},`{DNombre}( {DParam1},{DParam2} ) ;\n`) Agregar(`BsetTimeout`, `{DNombre|field_dropdown|{"options":[["setTimeout","setTimeout"],["setInterval","setInterval"]]}( {A|input_dummy}{DParam1|input_value},{DParam2|field_number|{"value":"3000"} ) ;`,{salida:true, renglones:1,color:"#CC0000"},[`{DNombre}( {DParam1},{DParam2} ) ;\n`,0]) Agregar(`Ejecutar2`, `{DNombre|field_input|{"text":"console.log"}( {A|input_dummy}{DParam1|input_value},{DParam2|input_value} ) ;`,{esStatement:true, renglones:1,color:"#CC0000"},`{DNombre}( {DParam1},{DParam2} ) ;\n`) Agregar(`BEjecutar2`, `{DNombre|field_input|{"text":"console.log"}( {A|input_dummy}{DParam1|input_value},{DParam2|input_value} ) `,{salida:true, renglones:1,color:"#AA0000"},[`{DNombre}( {DParam1},{[DParam2].trim()} ) `,0]) Agregar(`Ejecutar3`, `{DNombre|field_input|{"text":"console.log"}( {A|input_dummy}{DParam1|input_value},{DParam2|input_value},{DParam3|input_value} ) ;`,{esStatement:true, renglones:1,color:"#CC0000"},`{DNombre}( {DParam1},{DParam2},{DParam3} ) ;\n`) Agregar(`BEjecutar3`, `{DNombre|field_input|{"text":"console.log"}( {A|input_dummy}{DParam1|input_value},{DParam2|input_value},{DParam3|input_value} ) `,{salida:true, renglones:1,color:"#AA0000"},[`{DNombre}( {DParam1},{DParam2},{[DParam3].trim()} ) `,0]) Agregar(`Ejecutar4`, `{DNombre|field_input|{"text":"console.log"}( {A|input_dummy}{DParam1|input_value},{DParam2|input_value},{DParam3|input_value},{DParam4|input_value} ) ;`,{esStatement:true, renglones:1,color:"#CC0000"},`{DNombre}(\n{DParam1},{DParam2},{DParam3},{DParam4}) ;\n`) Agregar(`BEjecutar4`, `{DNombre|field_input|{"text":"console.log"}( {A|input_dummy}{DParam1|input_value},{DParam2|input_value},{DParam3|input_value},{DParam4|input_value} ) `,{salida:true, renglones:1,color:"#AA0000"},[`{DNombre}(\n{DParam1},{DParam2},{DParam3},{[DParam4].trim()} ) `,0]); Agregar(`BEjecutarMetodo4`, `.{DNombre|field_input|{"text":"log"}( {A|input_dummy}{DParam1|input_value},{DParam2|input_value},{DParam3|input_value},{DParam4|input_value} ) `,{salida:true, renglones:1,color:"#AA0000"},[`.{DNombre}({DParam1},{DParam2},{DParam3},{[DParam4].trim()} ) `,0]); Agregar(`BEjecutarMetodo1`, `.{DNombre|field_input|{"text":"log"}( {A|input_dummy}{DParam1|input_value} ) `,{salida:true, renglones:1,color:"#AA0000"},[`.{DNombre}({DParam1} ) `,0]); Agregar(`BEjecutarMetodo2`, `.{DNombre|field_input|{"text":"log"}( {A|input_dummy}{DParam1|input_value},{DParam2|input_value} ) `,{salida:true, renglones:1,color:"#AA0000"},[`.{DNombre}({DParam1},{DParam2} ) `,0]); Agregar(`BEjecutarMetodo3`, `.{DNombre|field_input|{"text":"log"}( {A|input_dummy}{DParam1|input_value},{DParam2|input_value},{DParam3|input_value} ) `,{salida:true, renglones:1,color:"#AA0000"},[`.{DNombre}({DParam1},{DParam2},{DParam3} )`,0]); Agregar(`TFuncion`, `function {DNombre|field_input}({DParams|field_input}){{A|input_dummy}{DContenido|input_statement}}`,{esStatement:true,color:"#CC0022"},function(D){ return `function ${D.DNombre}( ${D.DParams} ){\n${D.DContenido}}\n` }) Agregar(`TAFuncion`, `async function {DNombre|field_input}({DParams|field_input}){{A|input_dummy}{DContenido|input_statement}}`,{esStatement:true,color:"#CC0022"},function(D){ return `async function ${D.DNombre}( ${D.DParams} ){\n${D.DContenido}}\n` }) Agregar(`TArduUsb`, `{DContenido|input_statement}`, { esStatement: true, color: "#BB0033" }, function(D){ return `\n ${D.DContenido}\n \n` }) Agregar(`TArduSalida`, ``, { esStatement: true, color: "#BB0033" }, function(D){ return `\n` }) Agregar(`TArduEntrada`, ``, { esStatement: true, color: "#BB0033" }, function(D){ return `\n` }) Agregar(`TFuncionArduinoIniciar`, `function fnArduinoIniciar({DParams|field_input}){{A|input_dummy}{DContenido|input_statement}}`,{esStatement:true,color:"#CC0022"},function(D){ return `function fnArduinoIniciar( ${D.DParams} ){\n${D.DContenido}}\n` }) Agregar(`TFuncionArduinoAnalogo`, `function fnArduinoAnalogo({DParams|field_input|{"text":"$pin, $valor"}){{A|input_dummy}{DContenido|input_statement}}`,{esStatement:true,color:"#CC0022"},function(D){ return `function fnArduinoAnalogo( ${D.DParams} ){\n${D.DContenido}}\n` }) Agregar(`TFuncionArduinoDigital`, `function fnArduinoDigital({DParams|field_input|{"text":"$pin, $valor"}){{A|input_dummy}{DContenido|input_statement}}`,{esStatement:true,color:"#CC0022"},function(D){ return `function fnArduinoDigital( ${D.DParams} ){\n${D.DContenido}}\n` }) Agregar(`TFuncionArduinoCM`, `function fnArduinoCM({DParams|field_input|{"text":"$pin, $valor"}){{A|input_dummy}{DContenido|input_statement}}`,{esStatement:true,color:"#CC0022"},function(D){ return `function fnArduinoCM( ${D.DParams} ){\n${D.DContenido}}\n` }) Agregar(`TFuncionArduinoHumedad`, `function fnArduinoHumedad({DParams|field_input|{"text":"$valor"}){{A|input_dummy}{DContenido|input_statement}}`,{esStatement:true,color:"#CC0022"},function(D){ return `function fnArduinoHumedad( ${D.DParams} ){\n${D.DContenido}}\n` }) Agregar(`TFuncionArduinoTemperatura`, `function fnArduinoTemperatura({DParams|field_input|{"text":"$valor"}){{A|input_dummy}{DContenido|input_statement}}`,{esStatement:true,color:"#CC0022"},function(D){ return `function fnArduinoTemperatura( ${D.DParams} ){\n${D.DContenido}}\n` }) Agregar(`TFuncionArduinoError`, `function fnArduinoError({DParams|field_input|{"text":"$error"}){{A|input_dummy}{DContenido|input_statement}}`,{esStatement:true,color:"#CC0022"},function(D){ return `function fnArduinoError( ${D.DParams} ){\n${D.DContenido}}\n` }) Agregar("TArduinoSALIDA", `SALIDA({DParams|field_input|{"text":"13"})`, {esStatement:true,color:"#BB0022"},`SALIDA({DParams});\n`); Agregar("TArduinoPRENDER", `PRENDER({DParams|field_input|{"text":"13"})`, {esStatement:true,color:"#BB0022"},`PRENDER({DParams});\n`); Agregar("TArduinoAPAGAR", `APAGAR({DParams|field_input|{"text":"13"})`, {esStatement:true,color:"#BB0022"},`APAGAR({DParams});\n`); Agregar("TArduinoSERVO", `SERVO({DParams|field_input|{"text":"13"})`, {esStatement:true,color:"#BB0022"},`SERVO({DParams});\n`); Agregar("TArduinoSERVOHABILITAR", `SERVOHABILITAR({DParams|field_input|{"text":"13"})`, {esStatement:true,color:"#BB0022"},`SERVOHABILITAR({DParams});\n`); Agregar("TArduinoSUSCRIBIR", `SUSCRIBIR({DParams|field_input|{"text":"13"})`, {esStatement:true,color:"#BB0022"},`SUSCRIBIR({DParams});\n`); Agregar("TArduinoDESUSCRIBIR", `DESUSCRIBIR({DParams|field_input|{"text":"13"})`, {esStatement:true,color:"#BB0022"},`DESUSCRIBIR({DParams});\n`); Agregar(`BFuncion`, `function {DNombre|field_input}( {DParams|field_input} ){{A|input_dummy}{DContenido|input_statement}}`,{salida:true,color:"#CC0022"},function(D){ return [`function ${D.DNombre}( ${D.DParams} ){\n${D.DContenido}}`,0] }) Agregar(`BAFuncion`, `async function {DNombre|field_input}( {DParams|field_input} ){{A|input_dummy}{DContenido|input_statement}}`,{salida:true,color:"#CC0022"},function(D){ return [`async function ${D.DNombre}( ${D.DParams} ){\n${D.DContenido}}`,0] }) Agregar(`BFuncionFl`, `( {DParams|field_input} ) => {DContenido|input_value}`,{salida:true,renglones:1,color:"#CC0022"},function(D){ return [`(( ${D.DParams} )=>${D.DContenido})\n`,0] }) Agregar(`BFuncionFl2`, `( {DParams|field_input} ) => {{A|input_dummy}{DContenido|input_statement}}`,{salida:true,color:"#CC0022"},function(D){ return [`(( ${D.DParams} )=>{\n${D.DContenido}})\n`,0] }) Agregar( `TIf1` , `if({DComparacion|input_value}) {{A|input_dummy}{DOk|input_statement}}` , { esStatement: true, color: "#FF0022"} , function(D){return `if( ${D.DComparacion==""? "false": D.DComparacion.trim()} ) {\n${D.DOk}}\n`} ) Agregar( `TElse` , `else {{A|input_dummy}{DOk|input_statement}}` , { esStatement: true, color: "#FF0022"} , function(D){return `else {\n${D.DOk}}\n`} ) Agregar( `TElseIf` , `} else if({DComparacion|input_value}) {` , { esStatement: true, color: "#FF0022"} , function(D){return `} else if( ${D.DComparacion=="" ? "false" : D.DComparacion.trim()} ) {\n`} ) Agregar( `TFor` , `for({DIni|input_value} ; {DCond|input_value} ; {DModif|input_value}){{A|input_dummy}{DContenido|input_statement}}` , { esStatement: true , color: "#CC0055" , renglones: 1 } , function(D){return`for( ${D.DIni} ; ${D.DCond==""?"false":D.DCond} ; ${D.DModif} ) {\n${D.DContenido}}\n`} ); Agregar( `TWhile` , `while( {DCond|input_value} ){{A|input_dummy}{DContenido|input_statement}}` , { esStatement: true , color: "#CC0055" , renglones:1 } , function(D){return`while( ${D.DCond==""?"false":D.DCond} ) {\n${D.DContenido}}\n`} ); Agregar( `TDoWhile` , `do {{A|input_dummy}{DContenido|input_statement}} while( {DCond|input_value} ) ;` , { esStatement: true , color: "#CC0055" } , function(D){return`do{\n${D.DContenido}} while( ${D.DCond==""?"false":D.DCond} ) ;\n`} ); Agregar( `TSwitch` , `switch( {DValor|input_value} ) {{A|input_dummy}{DContenido|input_statement}}` , { esStatement: true, color: "#CC0055" } , function(D){ return `switch( ${D.DValor} ) {\n${D.DContenido}}\n` } ) Agregar(`TBreak`,`break ;`, {esStatement:true,color:"purple"},`break ;\n`) ; Agregar(`TContinue`,`continue ;`, {esStatement:true,color:"purple"},`continue ;\n`) ; Agregar(`TDefault`,`default:`, {esStatement:true,color:"purple"},`default:\n`) ; Agregar(`TCase`,`case {DValor|input_value}:`, {esStatement:true,color:"purple"},`case {DValor}:\n `) ; Agregar(`TBreakCase`,`break; case {DValor|input_value}:`, {esStatement:true,color:"purple"},`break ;\ncase {DValor}:\n `) ; Agregar( `TNotX`, `! {DA|input_value}`, { salida:true,color:"#0044CC",renglones:1}, [`!({DA})`,0] ) Agregar( `TDobleNot`, `!! {DA|input_value}`, { salida:true,color:"#0044CC",renglones:1}, [`!!({DA})`,0] ) Agregar( `TEq`, `{DA|input_value} {DC|field_dropdown|["==","=="],["===","==="],["!=","!="],["!==","!=="],[">",">"],["<","<"],[">=",">="],["<=","<="],["&&","&&"],["||","||"]} {DB|input_value}`, { salida:true,color:"#0044CC",renglones:1}, [`{[DA].trim()} {DC} {[DB].trim()}`,0] ) Agregar( `TParentesis` , `( {DA|input_value} )` ,{ salida:true ,color:"#0044CC" } ,function(D){return[ `( ${D.DA.trim()} )` .replace(/\|\|/g,"____") .split("|") .map( function(a){ // console.log(1000,a) if(a=="____") { return "||" ; } return a ; } ) ,0]} ); ////////////////// JSON Agregar( "TListaArray" , '[ {D|input_dummy}{DContenido|input_statement}]' , { salida: true, color: "#AA0000" } , function(D) { return ['[\n'+D.DContenido.replace(",","")+']\n',0] } ) Agregar( "TListaItemArray" , ', {DInput|input_value}' , { esStatement: true, color: "#CC0000" } , ",{DInput}" ) Agregar( 'TObjeto' , '{{D|input_dummy}{DPares|input_statement}}' , { salida: true, color: "#00AA22" } , function(D){ return ['{\n'+D.DPares.replace(",","")+'}\n',0] } ) Agregar( 'TPar' , ', {Clave|field_input|{"text":"nombre"}:{Valor|input_value}' , { esStatement: true, color: "#00AAE4" } , ', "{Clave}": {Valor}' ) Agregar( 'TFrase' , 'Frase "{Valor|field_input|{"text":"abc...xyz"}"' , { salida: true, color: "green" } , ['"{Valor}"\n', 0] ) Agregar( 'TNumero' , 'Núm {Valor|field_number|{"value":"0"}' , { salida:true, color: "blue" } , ['{Valor}\n', 0] ) Agregar( `TVerdad` , `Valor {Valor|field_dropdown|{"options":[["true","true"],["false","false"]]}` , { salida: true, color: "blue" } , [ '{Valor}\n', 0 ] ) Agregar( 'TColorX' , 'color {Valor|field_colour|{"colour":"#FF8811"}' , { salida: true, color: "#FFD500" } , ['"{Valor}"\n',0] ) ////////////////// HTML Agregar( `TBarraDesplazamiento`, `{DValor|input_value}`, {esStatement:true, color: "maroon"}, function(D){return`\n`}) Agregar(`THtmm`, `<{DCaso|field_dropdown|["html","html"],["head","head"],["body","body"],["title","title"]} {DAtributos|input_value}>{DContenido|input_statement}`,{esStatement:true,color:"#550011"},`<{DCaso} {DAtributos}>\n{DContenido}\n`) Agregar( "TMetaInstalar" , `` , { esStatement: true , color: "maroon" } , `\n` ) Agregar( "TMetaColor" , `` , { esStatement: true , color: "maroon" } , `\n` ) Agregar( `THTML` , `{A|input_dummy}{D|input_dummy}{DHead|input_statement}{B|input_dummy}{E|input_dummy}{DBody|input_statement}{C|input_dummy}` , { esStatement: true , color: "#550011" } , function(D){return` ${D.DHead} ${D.DBody} \n`} ) Agregar( 'BEfectos' , `<{DEfecto|field_dropdown|${DEFECTOSTEXTO}}>{DContenido|input_value}` , { salida: true , color: "green" } , [`<{DEfecto}>{DContenido}`,0] ) Agregar( `TStyle` , `` , { esStatement: true , color: NARANJA } , `\n` ) Agregar( `TInput` , `` , { esStatement: true , color: "blue" } , `\n` , `` ) Agregar( `BOrganizativos` , `{DOrg|field_dropdown|{"options":[${DORG}]}{DOtros|input_value}` , { salida: "atributo" , color: "#CC00CC" } , [` {DOrg}{DOtros}`,0] ) Agregar( "TIMG" , `` , { esStatement: true , color: "blue" } , `{DAlt}` ) Agregar( `TLink` , `` , { esStatement: true , color: "maroon" } , `\n` ) Agregar( `TLinkMavo` , `` , { esStatement: true , color: "maroon" } , `\n` ) Agregar( `TLinkDragula` , `` , { esStatement: true , color: "maroon" } , `\n` ) Agregar( `TLinkSimple` , `` , { esStatement: true , color: "maroon" } , `\n` ) Agregar( `TScript` , `` , { esStatement: true , color: "maroon" } , `\n` ) Agregar( `TScriptG` , `` , { esStatement: true , color: "maroon" } , `\n` ) Agregar( `TScriptJQ` , `` , { esStatement: true , color: "maroon" } , `\n` ) Agregar( `TScriptCom` , `` , { esStatement: true , color: "maroon" } , `\n` ) Agregar( `TScriptMavo` , `` , { esStatement: true , color: "maroon" } , `\n` ) Agregar( `TScriptDragula` , `` , { esStatement: true , color: "maroon" } , `\n` ) Agregar( `TNativeDroid` , `link y script para NativeDroid2 tema {DTema|field_dropdown|{"options":[${DTEMA}]}` , { esStatement: true , color: "maroon" } , ` ` ) Agregar( `TUtf` , `` , { esStatement: true , color: "maroon" } , `\n` ) Agregar( `TVPResponsive` , `` , { esStatement: true , color: "maroon" , renglones:1 } , `\n` ) Agregar( `TDivRole` , `<{DEtiqueta|field_dropdown|{"options":[`+DTIPOS+`]} data-role={DRole|field_dropdown|{"options":[`+DROLES+`]} atr{DAtributos|input_value}>{DContenido|input_statement}` , { esStatement: true , color: "purple" } , function(D){return`<${D.DEtiqueta} ${D.DRole=="Ninguno"?"":`data-role="${D.DRole}"`} ${D.DAtributos} >\n${D.DContenido}\n\n`} ) Agregar( `TDivGenerico` , `<{DEtiqueta|field_input|{"text":"div"} atr{DAtributos|input_value}>{DContenido|input_statement}` , { esStatement: true , color: "purple" } , function(D){return `<${D.DEtiqueta} ${D.DAtributos}>\n${D.DContenido.includes("<")?D.DContenido:D.DContenido+"\n"}\n`} ) Agregar( `TDivGenericoS` , `<{DEtiqueta|field_input|{"text":"input"} atr{DAtributos|input_value} />` , { esStatement: true , color: "purple" } , function(D){return `<${D.DEtiqueta} ${D.DAtributos} />`} ) Agregar( `TDivRole1` , `<{DEtiqueta|field_dropdown|{"options":[`+DTIPOS+`]} data-role={DRole|field_dropdown|{"options":[`+DROLES+`]} atr{DAtributos|input_value}>{DContenido|input_statement}` , { esStatement: true , color: "#660066" } , function(D){return`<${D.DEtiqueta} ${D.DRole=="Ninguno"?"":`data-role="${D.DRole}"`} ${D.DAtributos} >\n${D.DContenido}\n\n`} ) Agregar( `TDivRole2` , `<{DEtiqueta|field_dropdown|{"options":[`+DTIPOS+`]} data-role={DRole|field_dropdown|{"options":[`+DROLES+`]} atr{DAtributos|input_value}>{DContenido|input_statement}` , { esStatement: true , color: "#330033" } , function(D){return`<${D.DEtiqueta} ${D.DRole=="Ninguno"?"":`data-role="${D.DRole}"`} ${D.DAtributos} >\n${D.DContenido}\n\n`} ) Agregar( `THiperVinculo` , `{DContenido|input_statement}` , { esStatement: true , color: "#00BB00" } , function(D){return`${D.DContenido}`} ) Agregar( `TTextoX` , `<{DTipo|field_dropdown|{"options":[${DPARRAFO}]} atr{DAtributos|input_value}>{DContenido|input_statement}` , { esStatement: true , color: "green" } , `<{[DTipo].toLowerCase()} {DAtributos} >{DContenido}\n` ) Agregar( `TTexto1` , `<{DTipo|field_dropdown|{"options":[["párrafo P","p"],["anclaje a","a"],["item de lista LI","li"],["citación blockquote","blockquote"],["titular H1","h1"],["titular H2","h2"],["titular H3","h3"],["titular H4","h4"],["titular H5","h5"],["titular H6","h6"]]} atr{DAtributos|input_value}>{DContenido|input_statement}` , { esStatement: true , color: "#006600" } , `<{[DTipo].toLowerCase()} {DAtributos} >{DContenido}\n` ) Agregar( `TTexto2` , `<{DTipo|field_dropdown|{"options":[["párrafo P","p"],["anclaje a","a"],["item de lista LI","li"],["citación blockquote","blockquote"],["titular H1","h1"],["titular H2","h2"],["titular H3","h3"],["titular H4","h4"],["titular H5","h5"],["titular H6","h6"]]} atr{DAtributos|input_value}>{DContenido|input_statement}` , { esStatement: true , color: "#004400" } , `<{[DTipo].toLowerCase()} {DAtributos} >{DContenido}\n` ) Agregar( `STexto` , `texto {DTexto|input_value}` , { esStatement: true , color: "green" } , `{DTexto}` ) Agregar( `BTexto2` , ` {DTexto|field_input|{"text":"abc xyz"}{DOtro|input_value}` , { salida: true , color: "green" } , [`{DTexto}{DOtro}`,0] ) Agregar( "BAtributoX" , `{DNombre|field_input|{"text":"href"}="{DValor|field_input|{"text":"https://"}" {DOtro|input_value}` , { salida: "atributo" , color: "#CC00CC" } , function(D){ return [` ${ D.DNombre || "id" }="${ D.DValor.replace( /\"/g, "'" ) }" ${D.DOtro}`,0] } ) Agregar( "BAtributoAF" , `{DNombre|field_input|{"text":"preset"}="{DValor|field_input|{"text":"hiro"}" {DOtro|input_value}` , { salida: "atributo" , color: "#CC00CC" } , [` {[DNombre]||"id"}="{DValor}" {DOtro}`,0] ) Agregar( "BAtributoGL" , `{DNombre|field_input|{"text":"gltf-model"}="url({DValor|field_input|{"text":"https://"})" {DOtro|input_value}` , { salida: "atributo" , color: "#CC00CC" } , [` {[DNombre]||"id"}="url( {DValor} )" {DOtro}`,0] ) Agregar( "BAtributoData" , `data-{DNombre|field_dropdown|{"options":[${DDATA}]}="{DValor|field_input|{"text":"https://"}" {DOtro|input_value}` , { salida: "atributo" , color: "#CC00CC" } , [` data-{DNombre}="{DValor}" {DOtro}`,0] ) Agregar( "BAtributoEstan" , `{DNombre|field_dropdown|{"options":[${DATRI}]}="{DValor|field_input|{"text":"https://"}" {DOtro|input_value}` , { salida: "atributo" , color: "#CC00CC" } , [` {DNombre}="{DValor}" {DOtro}`,0] ) ////////////////////////////////////////////////7[ CSS ] Agregar( 'TComentario' , 'Ignorar{B}{DCuales|input_statement}' , {esStatement:true, color: "black"} , '/*\n{DCuales}*/\n' ) Agregar( "TSelectores" , 'ítems{DCuales|input_statement}' , {salida:Boolean, color: "red"} , function(D){ return [D.DCuales.trim().slice(1),0] } ); Agregar( "TTodos" , 'todos los objetos' , {salida:Boolean, color:"red"} , [' *, todos los objetos ', 0] ); Agregar( 'TMargenesTodos' , 'Todos los márgenes {DTipo|field_dropdown|["externos","margin"],["internos","padding"]} {DValor|input_value}' , {esStatement: true, color: "#445523", tooltip: "Propiedad CSS margin:"} , '\n; {DTipo}: {[DValor]||0}' ) Agregar( 'TMargenV' , 'Sólo los márgenes {DTipo|field_dropdown|["externos","margin"],["internos","padding"]}{ENTER}Arr{Ar|field_checkbox} Abj{Ab|field_checkbox} Izq{Iz|field_checkbox} Der{De|field_checkbox} {DValor|input_value}' , {esStatement: true, color: "#445523"} , function(D){ S = [] ; if(D.Ar == "TRUE") S.push("top") ; if(D.Ab == "TRUE") S.push("bottom") ; if(D.Iz == "TRUE") S.push("left") ; if(D.De == "TRUE") S.push("right") ; R = "" ; S.forEach(function(x){ R+="\n; "+D.DTipo+"-"+x+": "+D.DValor ; }) return R ; } ) Agregar( 'TMargenX' , 'Margen {DTipo|field_dropdown|["externos","margin"],["internos","padding"]} {DPos|field_dropdown|["Todos",""],["superior","-top"],["inferior","-bottom"],["izquierdo","-left"],["derecho","-right"]}{DValor|input_value}' , {esStatement: true, color: "#445523"} , '\n; {DTipo}{DPos}: {[DValor]||0}' ) Agregar( 'TBordeX' , 'Borde {DPos|field_dropdown|["Todos",""],["superior","-top"],["inferior","-bottom"],["izquierdo","-left"],["derecho","-right"]}{DValor|input_value}' , {esStatement: true, color: "#445523"} , '\n; border{DPos}: {[DValor]||0}' ) Agregar( 'TBordeOpc' , `grosor: {DGrosor|field_input}tipo línea: {DTipo|field_dropdown|["ninguna","none"],["contínua","solid"],["punteada","dotted"],["rayada","dashed"],["doble","double"],["adentro","inset"]}{D|input_dummy}color:{DColor|field_colour}` , {salida: true, color: "#445523"} , [`{DGrosor} {DTipo} {DColor}`,0] ) Agregar( "TBorderRadius" , `Chanfle de radio {DRadio|field_input} esquina {DEsquina|field_dropdown|["todos",""],["arriba-izq","top-left-"],["abajo-izq","bottom-left-"],["arriba-der","top-right-"],["abajo-der","bottom-right-"]}` , {esStatement: true, color: "#445523"} , function(D){return`\n; border-${D.DEsquina}radius: ${D.DRadio}`} ) Agregar( 'TTomaDeMedidas' , 'Toma de medidas desde {DTipo|field_dropdown|["límites de la caja","border-box"],["límites del contenido","content-box"],["inicial","initial"],["se heredan","inherit"]}' , {esStatement: true, color: "#555523" } , '\n; box-sizing: {DTipo}' ) Agregar( "TReglasNuevas" , `Reglas para{DSelector|input_value|{"check":Boolean}{DReglas|input_statement}` , {esStatement:true, color: COLOR.NARANJA_OSCURO} , function(D){ console.log(D);return D.DSelector + "\n{" + D.DReglas + "\n}\n" ;} ); Agregar( 'TFamiliaFuentes' , 'Familia de fuentes {DValor|input_value}' , {esStatement: true, color: "#00AAE4"} , '\n; font-family: {[DValor]||"Courier New"}' ) Agregar( 'TFuente' , 'fuente {DNombre|field_input|{"text":"Verdana"}' , {salida: true, color: "#00AAE4" } , function(D){return[D.DNombre.split(",").map(function(x){return `"${x.trim()}"`}).join(","),0]} ) Agregar( 'TFuenteMono' , 'fuente monotipo{DNombre|field_dropdown|'+JSON.stringify("Courier New".split(".").map(function(x){return [x,"'"+x+"'"]})).slice(1,-1)+'}' , {salida: true, color: "#00AAE4" } , ['\n; font-family: {DNombre}',0] ) Agregar( 'TFuenteSerif' , 'fuente con marcas{DNombre|field_dropdown|'+JSON.stringify("Times New Roman".split(".").map(function(x){return [x,"'"+x+"'"]})).slice(1,-1)+'}' , {salida: true, color: "#00AAE4" } , ['\n; font-family: {DNombre}',0] ) Agregar( 'TFuenteSansSerif' , 'fuente sin marcas{DNombre|field_dropdown|'+JSON.stringify("Segoe UI".split(".").map(function(x){return [x,"'"+x+"'"]})).slice(1,-1)+'}' , {salida: true, color: "#00AAE4" } , ['\n; font-family: {DNombre}',0] ) Agregar( 'TEtiqueta' , 'de etiqueta {DValor|field_input|{"text":"div"}{DOtros|input_value}' , {esStatement:true, color: "#DD0000"} , ', {DValor}{DOtros}\n' ); Agregar( 'TClase' , 'de clase {DValor|field_input|{"text":"div"}{DOtros|input_value}' , {esStatement:true, color: "#DD0000"} , ', .{DValor}{DOtros}\n' ); Agregar( 'TID' , 'de ID {DValor|field_input|{"text":"div"}{DOtros|input_value}' , {esStatement:true, color: "#DD0000"} , ', #{DValor}{DOtros}\n' ); Agregar( 'TAtributo' , 'de atributo {DValor|field_input|{"text":"div"}{DOtros|input_value}' , {esStatement:true, color: "#DD0000"} , ', [{DValor}]{DOtros}\n' ); Agregar( 'TAtributoSrc' , 'src="https://gorosito.red/ajax.php?q={DValor|field_input|{"text":"div"}{DOtros|input_value}' , {salida:true, color: "#DD0000"} , [' src="https://gorosito.red/ajax.php?q={DValor}" {DOtros}\n',0] ); Agregar( 'TAtributoQue' , 'de atributo{DNombre|field_input|{"text":"class"}que{DRegla|field_dropdown|["sea","="],["contenga","*="],["comience con","^="],["termine con","$="]}{DValor|field_input|{"text":"\"abc\""}{DOtros|input_value}' , {esStatement:true, color: "#DD0000"} , ', [{DNombre}{DRegla}{DValor}]{DOtros}' ); Agregar( "BClase" , ' con clase{DValor|field_input|{"text":"clase1"}{DOtros|input_value}' , {salida:true, color: "#CC0000", renglones:"varios"} , ['.{DValor}{DOtros}',0] ); Agregar( "BID" , ' con id{DValor|field_input|{"text":"clase1"}{DOtros|input_value}' , {salida:true, color: "#CC0000", renglones:"varios"} , ['#{DValor}{DOtros}',0] ); Agregar( "BEtiqueta" , ' con id{DValor|field_input|{"text":"clase1"}{DOtros|input_value}' , {salida:true, color: "#CC0000", renglones:"varios"} , ['{DValor}{DOtros}',0] ); Agregar( "BDentro" , ' con elementos{DOtros|input_value}' , {salida:true, color: "#CC0000", renglones:"varios"} , [' {DOtros}',0] ); Agregar( "BCuyo" , ' cuyos elementos{DOtros|input_value}' , {salida:true, color: "#CC0000", renglones:"varios"} , ['>{DOtros}',0] ); Agregar( "TTexto", "Texto {DContenido|field_input}", {salida: true, color: "240"}, ["'{DContenido}'", 0] ) Agregar( "TCampo", 'Campo {DContenido|field_input|{"text":"Campo"}',{salida:true,color:"green"},["`{DContenido}`",0] ) Agregar( "TTabla", 'Tabla {DContenido|field_input|{"text":"TablaPersonas"}', {salida:true,color:"green"},["`{DContenido}`",0] ) Agregar( "TUrl", "URL {DContenido|field_input}", {salida: true, color: "240"}, ["{DContenido}", 0] ) Agregar("TNumero", 'Núm {DContenido|field_input}', {salida:true,color:"blue"}, ["{Number([DContenido])}",0]) Agregar( "BTexto", "Frase {DContenido|field_input}", {esStatement: true, color: "240"}, "{DContenido}\n" ) Agregar("BNumero", 'Núm {DContenido|field_input}', {esStatement:true,color:"blue"}, "{Number([DContenido])}\n") Agregar( "TAngulo", 'Ángulo {DContenido|field_input}°{OTRO|input_value}', {salida:true,color:"blue"}, '(Number(DContenido)*Math.PI/180) {OTRO}' ) //------------------------------------------------ CSS Agregar( "TEstadoNormalCSS" , 'CSS{BREAK}{DContenido|input_statement}' , { siguiente: "TMediaQuery", color: NARANJA } , '/* Reglas CSS para un estado natural */\n{DContenido}\n' ); Agregar( 'TResponsive' , 'Responsive de ancho {DAncho|input_value}' , {esStatement: true, color: "#445523" } , function(D){ return '\n; width: '+(D.DAncho||1024)+'\n; margin: auto'} ) Agregar( 'TAncho' , 'Ancho ¿Mín{DMin|field_checkbox}?¿Máx{DMax|field_checkbox}?{DAncho|input_value}', {esStatement:true, color: "#445523"} , function(D){ return (D.DAncho && `\n; ${D.DMax=="TRUE"?"max-":""}${D.DMin=="TRUE"?"min-":""}width: `+D.DAncho) || "/* ANCHO VACIO */" } ) Agregar( 'TAlto' , 'Alto ¿Mín{DMin|field_checkbox}?¿Máx{DMax|field_checkbox}?{DAncho|input_value}', {esStatement:true, color: "#445523"} , function(D){ return (D.DAncho && `\n; ${D.DMax=="TRUE"?"max-":""}${D.DMin=="TRUE"?"min-":""}height: `+D.DAncho) || "/* ALTO VACIO */" } ) /* */ Agregar( 'TGrosorFuente' , 'Grosor de fuente {DGrosor|field_dropdown|'+(JSON.stringify("normal0normal1negrita0bold1grueso0bolder1fino0lighter1heredado0inherited".split(1).map(function(x){return x.split(0)})).slice(1,-1))+'}' , { esStatement: true, color: "#00AAE4"} , '\n; font-weight: {DGrosor}' ) Agregar( 'TRayadoTexto' , 'Rayado...{ENTER}Sub {DSub|field_checkbox} Sup {DSup|field_checkbox} Tachado {DTach|field_checkbox} {ENTER}' +'Estilo {DEstilo|field_dropdown|["contínuo","solid"],["doble","double"],["punteado","dotted"],["rayado","dashed"],["ondulado","wavy"]}{ENTER}Color:{DColor|input_value}' , { esStatement: true, color: "#0099CC"} , function(D){ S = "\n; text-decoration:" ; if(D.DSub == "TRUE") S+="underline " ; if(D.DSup == "TRUE") S+="overline " ; if(D.DTach== "TRUE") S+="line-through " ; S+= D.DEstilo+" " ; if(D.DColor) S+=D.DColor ; return S ; } ) Agregar( 'TRayadoNinguno' , 'Ningun rayado' , {esStatement: true, color: "#0099CC"} , '\n; text-decoration: none' ) AAgregar( [ 'TNingunDisplay0Invisible None0none' ,'TBlock0Bloque block0block' ,'TInlineBlock0Bloque entre letras inline-block0inline-block' ,'TInline0una letra inline0inline' ,'TDTabla0una tabla table0table' ,'TFila0la fila de una tabla table-row0table-row' ,'TCelda0la celda de una tabla table-cell0table-cell' ,'TFlexbox0Flexbox flex0flex' , `TGrid0grilla grid0grid` ] , 'display: %' , { esStatement:true, color: "#556699"} , '\n; display: %' ) function AAgregar(Lista, Mensaje, Caracteristicas, Devuelve) { Lista.forEach(function(x){ Agregar( x.split(0)[0] , Mensaje.replace("%", x.split(0)[1]) , Caracteristicas , Devuelve.replace("%",x.split(0)[2] || "") ) }) } Agregar( 'TAlineacionTexto' , 'Texto {DModo|field_dropdown|["centrado","center"],["izquierda","left"],["derecha","right"],["justificado","justify"]}' , {esStatement:true,color:"#778822"} , '\n; text-align: {DModo}' ) Agregar( 'TAlineacionVertical' , 'verticalmente con {DModo|field_dropdown|["el medio","middle"],["línea de base","baseline"],["subíndice","sub"],["superíndice","sup"],["coincide con arriba","top"],["coincide con abajo","bottom"],["arriba del texto","text-top"],["abajo del texto","text-bottom"]}' , {esStatement:true, color:"#778822"} , '\n; vertical-align: {DModo}' ) Agregar( 'TUnidades' , '{DMedida|field_input|{"text":"100"}{DUnidades|field_dropdown|["%","%"],["pixeles","px"],["pulgadas","in"],["centímetros","cm"],["% del ancho del visor","vw"],["% del alto del visor","vh"]}{DOtros|input_value}' , { salida: "Number", color: "green" } , ['{DMedida}{DUnidades}{DOtros}',0] ) Agregar( 'TEstadoHover' , 'cuando se le pase el mouse encima{DOtro|input_value}' , { salida: true, color: "black" } , [':hover{DOtro}',0] ) Agregar( "TMediaQuery" , 'Consulta de medios ' + '{BREAK}@media{BREAK} ({DEspecificacion|input_statement|{"check":"TEspecificacion"}[' + '{DContenido|input_statement}' , { esStatement: true, color: NARANJA } , function( D ) { if( D.DEspecificacion.trim() == "" ) return "/* Media Query vacío */\n" ; D.DEspecificacion = D.DEspecificacion.trim().slice(1) ; return '\n@media {DEspecificacion} '.procesar(D) + '{\n' + D.DContenido + "}\n" } ); Agregar( "TEspecificacion" , 'caso{TValor|input_value}' , { esStatement:true } , ',{TValor}' ) ; Agregar( "TDispositivo" , 'para {DDispo|field_dropdown|{"options":[["Televisión","tv"],["Monitores","screen"],["Impresión","print"],["Braile","braille"],["Palm o similares","handheld"],["Proyector","projection"],["Teletipo","tty"],["Cualquiera/Todos","all"]]}' , { salida: true, color: COLOR.NARANJA_CLARO } , ['{DDispo}',0] ) ; Agregar( "TEspecificacionY" , 'Y...{DOtraRegla|input_value}' , { esStatement: true, color: COLOR.NARANJA } , function(D) { if( D.DOtraRegla.trim() === "" ) return "/* Regla AND faltante */\n" return ' and {DOtraRegla}'.procesar(D) } ); Agregar( "TEspecificacionO" , 'O...{DOtraRegla|input_value}' , { esStatement: true, color: COLOR.NARANJA } , function(D) { if( D.DOtraRegla.trim() === "" ) return "/* Regla OR faltante */\n" return ', {DOtraRegla}'.procesar(D) } ); Agregar( "TAnchoAlto" , '{DCual|field_dropdown|["cualquier",""],["del dispositivo,","device-"]} {DDimension|field_dropdown|["alto","height"],["ancho","width"]} {DTipo|field_dropdown|["exacto",""],["máximo","max-"],["mínimo","min-"]}:{DValor|input_value|{"check":"medida"}' , { salida: true, color: COLOR.NARANJA_CLARO } , function(D) { if( D.DValor.trim() === "" ) return ["",0] return ['({DCual}{DTipo}{DDimension}: {DValor})'.procesar(D), 0] } ); Agregar( "TRelacionAspecto" , '{DTipo|field_dropdown|["exacta",""],["máxima","max-"],["mínima","min-"]} relación de aspecto:{DValor|input_value|{"check":"medida"}' , { salida: true, color: COLOR.NARANJA_CLARO } , function(D) { if( D.DValor.trim() === "" ) return ["",0] return ['({DTipo}aspect-ratio: {DValor})'.procesar(D), 0] } ); Agregar( "TColoresPosibles" , '{DTipo|field_dropdown|["exacto",""],["máximo","max-"],["mínim","min-"]} {DCual|field_dropdown|["color","color"],["índice de color","color-index"],["monocromático","monochrome"],["resolción","resolution"]}:{DValor|input_value|{"check":"medida"}' , { salida: true, color: COLOR.NARANJA_CLARO } , function(D) { if( D.DValor.trim() === "" ) return ["",0] return ['({DTipo}{DCual}: {DValor})'.procesar(D), 0] } ); Agregar( 'BPixeles', '{DCant|field_input}pixeles', {salida:"medida", color:"green"}, ['{[DCant]||0}px',0] ); Agregar( 'BPorciento', '{DCant|field_input}%', {salida:"medida", color:"green"}, ['{[DCant]||0}%',0] ); Agregar( "TNot" , 'que no sea/n {A|input_value}pero además{O|input_value}' , { renglones: "varios", color: "black", salida: true } , [':not({A}){O}',0] ) ; Agregar( "BAtributo" , 'con atributo[{A|field_input|{"text":"src"}]{O|input_value}' , { renglones: "varios", colour: "#FF4500", salida: true } , ['[{A}]{O}',0] ) ; function NormalizarNombre( $texto ) { return ( $texto .replace( /\s/g, "_" ) .replace( /[áÁéÉíÍóÓÚúñÑ]/g, "_" ) ) } Agregar( "TVariableNueva" , 'Crear nuevo/a {DNombre|field_input|{"text":"Nombre del dato"} {D|input_dummy}{DInicial|input_value}' , {esStatement:true, color:DATO,renglones:"varias"} , function(D){ return ('var {NormalizarNombre([DNombre])} = '+( D.DInicial.trim()==="" ? "undefined" : "{DInicial}")+" ;\n").procesar(D) } ) Agregar( "TRegla" , 'regla {A|field_input|{"text":"background-color"}: {B|field_input|{"text":"red"} ;' , {esStatement:true, color: COLOR.REGLA, renglones: "varios"} , '\n; {A}: {B} ' ); Agregar( "TReglaColorLetra" , ' Color de la letra: {B|input_value|{"check":"Colour"}' , {esStatement:true, color: COLOR.REGLA1} , '\n; color: {B}' ); Agregar( "TReglaColorFondo" , 'Color de {DTipo|field_dropdown|["fondo","background-color"],["letra","color"]}: {O|input_value|{"check":"Colour"}' , {esStatement:true, color: COLOR.REGLA1} , '\n; {DTipo}: {O}' ); Agregar( "BColor" , 'color {A|field_colour} o código {B|field_input}' , {salida:"Colour", color: COLOR.REGLA1} , function(D){ if( D.B.trim() !== "" ) D.A = D.B ; return ['{A} '.procesar(D), 0] } ); Agregar( "BColorOpacidad" , 'color {A|field_colour} con opacidad {B|field_dropdown|{"options":['+([1,2,3,4,5,6,7,8,9,10].map(function(a){return "[\""+a*10+"%\",\""+(a/10)+"\"]"}))+']}' , {salida:"Colour", color: COLOR.REGLA1} , function(D){ S = extraer( D.A.slice(1), "001122" ) ; S[0] = parseInt( S[0], 16 ) ; S[1] = parseInt( S[1], 16 ) ; S[2] = parseInt( S[2], 16 ) ; S.push( D.B ) ; return [ 'rgba( {0},{1},{2}, {3} )'.procesar(S), 0 ] } ); Agregar( "BColorTransparencia" , 'color {A|field_colour} con transparencia {B|field_dropdown|{"options":['+([1,2,3,4,5,6,7,8,9,10].map(function(a){return "[\""+a*10+"%\",\""+(1-a/10)+"\"]"}))+']}' , {salida:"Colour", color: COLOR.REGLA1} , function(D){ S = extraer( D.A.slice(1), "001122" ) ; S[0] = parseInt( S[0], 16 ) ; S[1] = parseInt( S[1], 16 ) ; S[2] = parseInt( S[2], 16 ) ; S.push( D.B ) ; return [ 'rgba( {0},{1},{2}, {3} )'.procesar(S), 0 ] } ); Agregar( 'TImagenDeFondo' , 'Imagen de fondo: {A|input_value}' , {esStatement:true, color: COLOR.REGLA} , '\n; background-image: {A}' ); Agregar( 'TFoto' , 'es una foto: {URL|field_input|{"text":"https://picsum.photos/600/400"}' , {salida: true, color: COLOR.REGLA1} , ['url( {URL} )', 0] ); Agregar( "TGradienteLineal" , 'Gradiente lineal{A|input_dummy}dirección ° {grados|input_value} Color1:{c1|input_value} Color2: {c2|input_value} Color3: {c3|input_value}' , {salida: true, color: COLOR.REGLA1} , function(D) { if( D.grados.trim() != "" ) D.grados = D.grados + ", " ; if( D.c3.trim() != "" ) D.c3 = ", "+D.c3 ; return [ 'linear-gradient( {grados} {c1}, {c2} {c3} )'.procesar(D), 0 ] } ) Agregar('BGrados', '{grados|field_angle}°', {salida: true, color: "green"}, ['{-[grados]}deg',0]) Agregar( 'TFondoTamaño' , 'Fondo de ancho {an|input_value} y alto {al|input_value}' , {esStatement: true, color: COLOR.REGLA} , '\n; background-size: {an} {al}' ) Agregar( 'TFondoTamaño2' , 'Fondo de tamaño {o|field_input|["automático","auto"],["que cubra todo lo que puede,"cover"],["que mantenga lo que contiene","contain"],["",""],["",""]}' , {esStatement: true, color: COLOR.REGLA } , '\n; background-size: {o}' ) function RGBToHSL(r,g,b) { console.log(88888,r,g,b) // Make r, g, and b fractions of 1 r /= 255; g /= 255; b /= 255; console.log(88888,r,g,b) // Find greatest and smallest channel values let cmin = Math.min(r,g,b), cmax = Math.max(r,g,b), delta = cmax - cmin, h = 0, s = 0, l = 0; if (delta == 0) h = 0; // Red is max else if (cmax == r) h = ((g - b) / delta) % 6; // Green is max else if (cmax == g) h = (b - r) / delta + 2; // Blue is max else h = (r - g) / delta + 4; h = Math.round(h * 60); // Make negative hues positive behind 360° if (h < 0) h += 360; l = (cmax + cmin) / 2; // Calculate saturation s = delta == 0 ? 0 : delta / (1 - Math.abs(2 * l - 1)); // Multiply l and s by 100 s = +(s * 100).toFixed(1); l = +(l * 100).toFixed(1); return [h, s, l]; } Agregar( "BColorHSL" , 'Color {color|field_colour} en HUE' , {salida: true, } , function(D){ s = extraer( D.color.slice(1), "001122" ).map(function(l){return parseInt(l,16)}) s = RGBToHSL( s[0], s[1], s[2] ) ; console.log(s) return [ 'hsl( {0}, {1}%, {2}% )'.procesar(s), 0 ] } ) Agregar( "BColorHSLOpacidad" , 'color {A|field_colour} con opacidad {B|field_dropdown|{"options":['+([1,2,3,4,5,6,7,8,9,10].map(function(a){return "[\""+a*10+"%\",\""+(a/10)+"\"]"}))+']}' , {salida:"Colour", color: COLOR.REGLA1} , function(D){ S = extraer( D.A.slice(1), "001122" ) ; S[0] = parseInt( S[0], 16 ) ; S[1] = parseInt( S[1], 16 ) ; S[2] = parseInt( S[2], 16 ) ; S = RGBToHSL( S[0], S[1], S[2] ) ; S.push( D.B ) ; return [ 'hsla( {0},{1}%,{2}%, {3} )'.procesar(S), 0 ] } ); ////////////////////////////// Aframe /////////////////// /* */ Agregar( "AFCielo" , '' , { esStatement: true , color: "blue" } , function(D){ return `\n` } ) Agregar( "AFEsfera" , '' , { esStatement: true , color: "blue" , renglones: 2 } , function(D){ return `\n` } ) Agregar( "AFPrisma" , '' , { esStatement: true , color: "blue" , renglones: 2 } , function(D){ return `\n` } ) Agregar( "AFCilindro" , '' , { esStatement: true , color: "blue" , renglones: 2 } , function(D){ return `\n` } ) Agregar( "AFPlano" , '' , { esStatement: true , color: "blue" , renglones: 2 } , function(D){ return `\n` } ) Agregar( "BAFRotation" , 'rotation="{DRotacion|field_input|{"text":"0 0 0"}" {DOtros|input_value}' , { salida: true , color: "240" , renglones: 2 } , function(D){ return [` rotation="${D.DRotacion}" ${D.DOtros}`,0] } ) Agregar( "AFEscena" , '{A|input_dummy}{B|input_dummy}{DContenido|input_statement}' , { esStatement: true , color: "#4422CC" } , function(D){ return `\n${D.DContenido}\n` } ) Agregar( "AFAssets" , '{A|input_dummy}{DContenido|input_statement}' , { esStatement: true , color: "#0022CC" } , function(D){ return `\n${D.DContenido}\n` } ) Agregar( "AFAssetsItem" , '' , { esStatement: true , color: "#0022CC" } , function(D){ return `\n` } ) Agregar( "AFCamera" , '' , { esStatement: true , color: "#0022CC" } , function(D){ return `\n` } ) Agregar( "AFEntity" , '\n` } ) Agregar( "InstalarAframe" , 'Base:' , { esStatement: true , color: "blue" } , `` ) Agregar( "InstalarAframeJoystick" , 'Joystick:' , { esStatement: true , color: "blue" } , `` ) Agregar( "InstalarAframeAR" , 'AR para HIRO:' , { esStatement: true , color: "blue" } , `` ) Agregar( "InstalarEventos" , 'Eventos Aframe:' , { esStatement:true, color: "blue" } , `\n` ) Agregar( "InstalarSuperManos" , `Super manos:` , { esStatement:true, color:"blue" } , `\n` ) Agregar( "InstalarAframeMindar" , 'AR para MindAR:{a|input_dummy}{b|input_dummy}' , { esStatement: true , color: "blue" } , ` ` ) Agregar( "AFAR" , 'AR:' , { esStatement: true , color: "blue" } , `` ) Agregar( `AFMarcador` , `<{DEtiqueta|field_input|{"text":"a-marker"} atr{DAtributos|input_value}>{DContenido|input_statement}` , { esStatement: true , color: "purple" } , function(D){return `<${D.DEtiqueta} ${D.DAtributos}>\n${D.DContenido.includes("<")?D.DContenido:D.DContenido+"\n"}\n`} ) Agregar( "InstalarAframeExtras" , 'Extras:' , { esStatement: true , color: "blue" } , `` ) Agregar( "TTexto", "Texto {DContenido|field_input}", {salida: true, color: "240"}, ["'{DContenido}'", 0] ) Agregar( "TCampo", 'Campo {DContenido|field_variable|{"variableTypes":["EsCampo"],"defaultType":"EsCampo","variable":"CCampo1"}',{salida:"Campo",color:"green"},["`{DContenido}`",0] ) Agregar( "TTabla", 'Tabla {DContenido|field_variable|{"variableTypes":["EsTabla"],"defaultType":"EsTabla","variable":"TTabla1"}', {salida:"Tabla",color:"green"},["`{DContenido}`",0] ) Agregar( "TUrl", "URL {DContenido|field_input}", {salida: true, color: "240"}, ["{DContenido}", 0] ) Agregar("TNumero", 'Núm {DContenido|field_input}', {salida:true,color:"blue"}, ["{Number([DContenido])}",0]) Agregar("TFecha", 'Fecha {Año|field_number|{"min":"1900","max":"2100", "value":"'+((new Date()).getFullYear())+'"}{Mes|field_dropdown|{"options":'+(function(){ return JSON.stringify("ENE0FEB0MAR0ABR0MAY0JUN0JUL0AGO0SEP0OCT0NOV0DIC".split(0).map(function(n,i){return [n, i+""]})) })()+'}{Día|field_number|{"value":"1","min":"1","max":"31"}', {salida:true, color:"green"}, function(D){ D.Mes++ ; if( D["Mes"]<10 ) D["Mes"] = "0"+D["Mes"] ; if( D["Día"]<10 ) D["Día"] = "0"+D["Día"] ; podriaSerBisiesto = D["Año"] % 4 == 0 ; noPuedeSerBisiesto = D["Año"] % 100 == 0 ; maxDiaFebrero = 28 if( podriaSerBisiesto && !noPuedeSerBisiesto ) maxDiaFebrero++ ; if( D.Mes == 2 ) if( D["Día"] > maxDiaFebrero ) D["Día"] = maxDiaFebrero ; return '"{Año}-{Mes}-{Día}"'.procesar(D) ; }) Agregar( 'TCampoTabla' , 'campo {DSubCampo|field_variable|{"variableTypes":["EsCampo"],"defaultType":"EsCampo","variable":"CCampo1"} de la tabla {DTabla|field_variable|{"variableTypes":["EsTabla"],"defaultType":"EsTabla","variable":"TTabla1"}' , { salida: true, color: "green" } , ['`{DTabla}`.`{DSubCampo}`',0] ) //------------------------------------------------ NUEVAS HABILIDADES Agregar( 'TDescargar' , 'Descargar en var. {DVariable|input_value|{"check":"PHPVariable"} desde la url {DUrl|input_value|{"check":"URL"}' , { esStatement: true, color: "#770055" } , '{DVariable} = file_get_contents( "{DUrl}" ) ;\n' ) Agregar( 'TParam' , 'param {DParam|field_variable|{"variable":"Cambia mi nombre"}' , { salida: "Parametro", color: "#007722" } , ['${DParam}',0] ) Agregar( 'TFiltrar' , 'Filtrar variable {DVariable|input_value|{"check":"PHPVariable"} param {DParam|' ) Agregar( 'TTSV' , 'Abrir CSV {DArchivo|field_input|{"text":"miarchivo.tsv"} separador {DSep|field_dropdown|{"options":[ ["Coma ,", ","],["Punto y coma", ";"], ["Tabulado", "\\t"] ]}' , { esStatement: true, color: "#007722" } , function(D){return ` // Abrir archivo TSV ${D.DArchivo} if( file_exists("${D.DArchivo}") ) { $separador = "${D.DSep}" ; $archivo = file_get_contents( "${D.DArchivo}" ) ; $renglones = explode( "\\n", $archivo ) ; if( count($renglones)>1 ) { $tit = explode( $separador, $renglones[0] ) ; $lista = [] ; for( $i = 1 ; $i < count($renglones) ; $i = $i+1 ) { $conjunto = [] ; $extraido = explode( $separador, $renglones[$i] ) ; foreach( $tit as $clave=>$titulo ) { $conjunto[trim($titulo)] = trim( $extraido[$clave] ) ; } $lista[] = (object)$conjunto ; } $resultado = $lista ; } $resultado = [] ; } else $resultado = [] ; `} ) //------------------------------------------------ CREATE TABLE Agregar( 'TCrearTabla' , 'Crear la tabla {DNombre|field_variable}{D|input_dummy}¿Sólo si no existe? {DSiExiste|field_checkbox}{D|input_dummy}{DCampos|input_statement}' , { salida: true, color: "#955500" } , function(D){ return [('CREATE TABLE '+((D.DSiExiste=="TRUE"&&'IF NOT EXISTS')||"")+' `{DNombre}` (\n').procesar(D)+D.DCampos.replace(",","")+');\n',0] } ) Agregar( 'TCampoNuevo' , 'Agregando {A|input_dummy}campo {DCampo|input_value|{"check":"Campo"} del tipo {DTipo|input_value|{"check":"Definicion"} características... {DAdicional|input_value}' , { esStatement: true, color: "#957700" } , function(D){ if( D.DTipo.indexOf("BOOLEAN") > -1 ) D.DAdicional = D.DAdicional.replace( /DEFAULT\s\'(.*?)\'/, function(a,b){ return "DEFAULT "+b } ) ; return ', {DCampo} {DTipo} {DAdicional}\n'.procesar(D) } ) Agregar( 'TAutoIncremental' , 'Auto incremental' , { salida: true, color: "black" } , [ ' AUTOINCREMENT', 0 ] ) Agregar( 'TNumericoEntero' , 'Numérico entero' , { salida: "Definicion", color: "#953300" } , function(D){ return [' INTEGER ',0] } ) Agregar( 'TNumericoDecimales' , 'Numérico con decimales' , { salida: "Definicion", color: "#953300" } , function(D) { return [ ' REAL ' ,0] } ) Agregar( 'TVarChar' , '{DModo|field_dropdown|{"options":[["TEXT","TEXT"],["URL","URL"],["EMAIL","EMAIL"],["DATE","DATE"],["TIME","TIME"],["COLOR","COLOR"]]}' , { salida: "Definicion", color: "#959900" } , function(D) { return [' {DModo}'.procesar(D),0] } ) Agregar( 'TNotNull' , 'No puede ser nulo{DOtro|input_value}' , { salida: true, color: "black" } , [ ' NOT NULL{DOtro}',0 ] ) Agregar( 'TPrimaryKeyInline' , 'Es la clave primaria {DOtro|input_value}' , { salida: true, color: "black" } , [ ' PRIMARY KEY {DOtro}',0 ] ) Agregar( 'TFecha' , 'Fecha ' , { salida: "Definicion", color: "#959900" } , [ ' DATE', 0 ] ) Agregar( 'TMarcaDeTiempo' , 'MARCA DE TIEMPO' , { salida: "Definicion", color: "#959900" } , [ ' TIMESTAMP DEFAULT CURRENT_TIMESTAMP',0 ] ) Agregar( 'TDefault' , 'por default {DValor|field_input}{DOtro|input_value}' , { salida: true, color: "black" } , [ ' DEFAULT \'{DValor}\' {DOtro}',0 ] ) Agregar( 'TBooleano' , 'por sí o por no' , { salida: true, color: "#959900" } , [ ' BOOLEAN', 0 ] ) // ------------------------------------------------ INSERT INTO Agregar( 'TEjecutar' , 'Ejecutar sentencia SQL {DSentencia|input_value} Si OK {DOk|input_value} Si NO {DNo|input_value}' , { esStatement: true, color: "#770055", renglones: 2 } , ` $conexion = conectar() ; $resultado = $conexion->query( "{DSentencia}" ); if( $resultado ) { print "{DOk}" ; } else { print "{DNo}" ; } ` ) Agregar( 'TInsertar' , 'Insertar {B|input_dummy}en la tabla {DTabla|input_value|{"check":"Tabla"}' + 'para {DCampos|input_value|{"check":"OrdenInsertar"}' + 'lista valores {DValoresNuevos|input_value}' , { salida: true, siguiente: "ModoInsertar", color: "#AADD00" } , function(D){return[`INSERT INTO ${D.DTabla}\n${D.DCampos}\n${D.DValoresNuevos.trim()}`,0]}//({DCampos})\nVALUES] ) Agregar( 'TListaValores' , 'comenzando con... {B|input_dummy}{DLista|input_statement}' , { salida: true, color: "#AADD00" } , ['VALUES\n (\n{DLista}\n)',0] ) Agregar( 'TInsertarOrden' , 'los campos {ENTER|input_dummy}{DCampos|input_statement}' , { salida: "OrdenInsertar", color: "#AADD00" } , ['({[DCampos].slice(0,-1)}) \n',0] ) Agregar( 'TInsertarValores' , 'conjunto valores {BR|input_dummy}{DLista|input_statement|{"check":"Valores"}' , { salida: true, color: "#AADD00" } , ['({[DLista].slice(0,-1)}),\n',0] ) Agregar( 'TValores' , 'valor {DValor|field_input|{"text":"abc"}' , { anterior: "Valores", siguiente: "Valores", color: "#88BB00" } , "'{DValor}'," ) Agregar( 'TValores2' , 'valor {DValor|input_value|{"text":"abc"}' , { anterior: "Valores", siguiente: "Valores", color: "#88BB00" } , "'{DValor}'," ) //------------------------------------------------ SELECT FROM Agregar( "TSelect" , 'Seleccionar de la tabla {DTabla|input_value|{"check":"Tabla"} los campos {DCampos|input_statement}' , {salida: "SelectSQL", siguiente: true,renglones:2, color: "red"} , function(E){E.DCampos = E.DCampos.slice(0,-1);return ["SELECT\n{DCampos}\nFROM\n{DTabla}\n".procesar(E),0]} ) Agregar( "TFin", "NADA MÁS", {anterior:true, color: "black"}, ";\n" ) Agregar( "TTodos2" , "TODOS" , {anterior:true, color: "red"} , "_* " ) Agregar( "TCampoSinAlias" , 'Campo de nombre {DCampo|field_variable|{"variableTypes":["EsCampo"],"defaultType":"EsCampo","variable":"CCampo1"}' , {esStatement:true, color: "red"} , "`{DCampo}`," ) Agregar( "TCampoConAlias", 'Campo de nombre {DCampo|field_variable|{"variableTypes":["EsCampo"],"defaultType":"EsCampo","variable":"CCampo1"} alias {DAlias|field_input|{"text":"CAlias1"}' , {esStatement:true, color: "red"} , "`{DCampo}` `{DAlias}`," ) Agregar( "TConcatenar" , 'Juntar frases {D|input_dummy}Junta {DJuntador|field_input}{DCampos|input_statement} alias {DAlias|input_value}' , {esStatement: true, color: "red"} , "CONCAT_WS( '{DJuntador}', {[DCampos].slice(0,-1)} ) {DAlias}," ) //------------------------------------------------ WHERE Agregar("TPre", `Pre{A|input_dummy}{DContenido|input_statement}`,{esStatement:true,renglones:2,color:"black"},`
{DContenido}
`) ; Agregar( "TDonde", "Aquellos registros {D|input_dummy}que complan con{DContenido|input_statement}" , {esStatement:true, renglones:1, color: "#FFA500"} , "WHERE\n{DContenido}\n" ) Agregar( "TCaso", "...primeramente{DContenido|input_value}" , {esStatement:true , color: "#FFA500"} , "{DContenido}\n" ) Agregar( "TY", "Y... {DContenido|input_value}" , {esStatement:true, color: "#FFA500"} , function(D){ if(D.DContenido.trim()=="") return "" ; return "AND {DContenido}\n".procesar(D)} ) Agregar( "TO", "O... {DContenido|input_value}" , {esStatement:true, color: "#FFA500"} , function(D){ if(D.DContenido.trim()=="") return "" ; return "OR {DContenido}\n".procesar(D)} ) Agregar( "TEs", '{DCampo|input_value} {DModo|field_dropdown|{"options":[["es igual","="],["es distinto","!="],["es mayor",">"],["es mayor o igual",">="],["es menor","<"],["es menor o igual","<="]]} que/a {DContenido|input_value}' , {salida:true,renglones:1, color: "#FFA500"} , ["{DCampo}{DModo}{DContenido}\n",0] ) Agregar( "TContiene", '{DCampo|input_value} {DModo|field_dropdown|{"options":[["contiene","%E%"],["comienza con","E%"],["termina con","%E"]]} {DContenido|input_value}' , {salida:true,renglones:1, color: "#FFA500"} , function(D) { D.DContenido = D.DModo.replace( "E", D.DContenido.slice(1,-1) ) ; return ["{DCampo} LIKE '{DContenido}'\n".procesar(D),0] } ) //------------------------------------------------ ORDER BY Agregar( "TOrdenamiento", 'Ordenado por {DContenido|input_statement}' , {esStatement:true, color: "#00AAA5"} , "ORDER BY\n{[DContenido].slice(0,-1)}\n" ) Agregar( "TPrimero", 'primero por...{DContenido|input_value}', {esStatement:true,color:"#00AAA5"}, "{DContenido}" ) Agregar( "TLuego", 'luego por...{DContenido|input_value}', {esStatement:true,color:"#00AAA5"}, "{DContenido}" ) Agregar( "TPrimeroS", 'primero por...{DContenido|input_value}', {esStatement:true,color:"red"}, "{DContenido}," ) Agregar( "TLuegoS", 'luego por...{DContenido|input_value}', {esStatement:true,color:"red"}, "{DContenido}," ) Agregar( "TAscendente", 'De manera ascendente {DCampo|input_value}' ,{salida:true, color:"#00AAA5"} , ["{DCampo} ASC,",0] ) Agregar( "TDescendente", 'De manera descendente {DCampo|input_value}' ,{salida:true, color:"#00AAA5"} , ["{DCampo} DESC,",0] ) //------------------------------------------------ CANTIDAD Agregar( 'TPrimeros' , 'primeros {DNumero|input_value|{"check":"Number"}' , { esStatement: true, color: "" } , 'LIMIT\n{DNumero}\n' ) Agregar( 'TPrimerosDesde' , 'primeros {DNumero|input_value|{"check":"Number"} desde {DOffset|input_value|{"check":"Number"}' , { esStatement: true, color: "" } , 'LIMIT\n{[DNumero]||100}, {[DOffset]||0}\n' ) //------------------------------------------------ PHP Agregar( "PIniciarPHP", "Código PHP {D|input_dummy}{DContenido|input_statement}", {esStatement:true,color:"#FFAA22"}, " \?php\n{DContenido}" ) Agregar( "PErrores", 'Habilitar ver errores', {esStatement: true, color: "#A5AA00"} , function(){return"\n// Bloque: PErrores\nini_set('display_errors', 1);\nini_set('display_startup_errors', 1);\nerror_reporting(E_ALL);"} ) Agregar( "PConector", 'Conector para MySQLi {D|input_dummy}' +'Host: {DHost|field_input|{"text":"localhost"}{D|input_dummy}' +'Usuario: {DUsuario|field_input|{"text":"tu usuario"}{D|input_dummy}' +'Contraseña: {DContra|field_input|{"text":"contraseña"}{D|input_dummy}' +'Base inicial: {DBase|field_input|{"text":"nombre de la base"}' , {esStatement:true, color:"#A5AA00"} , function(D) { return "function conectar() { return new mysqli(" + '"'+D.DHost+'", ' + '"'+D.DUsuario+'", ' + '"'+D.DContra+'", ' + '"'+D.DBase+'" ' +"); }\n" } ) Agregar( 'TGenerar' , 'Imprimir resultados en formato {DFormato|field_dropdown|{"options":[["JSON","json"],["CSV con coma","csvcoma"],["CSV con punto y coma","csvpc"],["TSV", "tsv"],["Tabla HTML","tablahtml"]]}' , { esStatement: true, color: "#554400"} , function(D){ var Extender = "" ; switch( D.DFormato ) { case "tsv": Extender = "print arraytocsv( $resultado, '\\t' ) ;\n" break ; case "csvcoma": Extender = "print arraytocsv( $resultado, ',' ) ;\n" break ; case "csvpc": Extender = "print arraytocsv( $resultado, ';' ) ;\n" break ; case "json": Extender = "print json_encode( $resultado ) ;\n" ; break ; case "tablahtml": Extender = ` print ''."\\n" ; print "" ; foreach( $resultado[0] as $titulo => $valor ) print "" ; print "" ; foreach( $resultado as $renglon => $ficha ) {\n print "" ; foreach( $ficha as $columna ) { print "" ; } print "\\n"; } print "
$titulo
$columna
\\n" ; `; break ; } CodigoCSV = ` function arraytocsv( $array, $separador="\\t" ) { $primer = $array[0] ; $titulos = [] ; foreach( $array[0] as $titulo => $valor ) { $titulos[] = $titulo ; } $resultado = implode( $separador, $titulos ) . "\\n" ; foreach( $array as $cadaConjunto ) { $lista = [] ; foreach( $cadaConjunto as $titulo=>$valor ) { $lista[] = $valor ; } $resultado .= implode( $separador, $lista ) . "\\n" ; } return $resultado ; } ` ; console.log(Extender) return "\n// Generar código\n"+(D.DFormato.indexOf("sv")>-1?CodigoCSV:"")+Extender ; } ) Agregar( 'TGenerarConArchivo' , 'Imprimir resultados con ayuda del archivo {DArchivo|field_input|{"text":"archivovista.php"}' , { esStatement: true, color: "#554400"} , function(D){ return ` // Generar código con ayuda del archivo de view ${D.DArchivo} foreach( $resultado as $x ) { include "${D.DArchivo}" ; } ` } ) Agregar( "TRecuperar", 'Recuperar con SQL {DSQL|input_value|{"check":"SelectSQL"}' , {esStatement:true, color: "#A56644", renglones:"varios"} , function(E){ E.DSQL = E.DSQL.replace( /\n|\t/g, " " ) ; console.log( 4500,E.DFormato ) return ` // Bloque: TRecuperar function recuperar( $sql ) { $conexion = conectar() ; $conexion->set_charset( "utf8" ) ; if( $conexion ) { $resultados = $conexion->query( $sql ) ; if( $resultados ) { $retornar = [] ; while( $retornar[] = $resultados->fetch_object() ) ; array_pop( $retornar ) ; $conexion->close() ; return $retornar ; } else { $conexion->close() ; return [ (object)["error"=>"Error en consulta", "consulta"=>$sql] ] ; } } else { $conexion->close() ; return [ (object)["error"=>"Error en conexión"] ] ; } } $resultado = recuperar( "{DSQL}" ); `.procesar(E) ; } ) //------------------------------------------------ Formulario Agregar( "TGET" , '$_GET["{DDato|field_input}"]' , {salida: true, color: "blue" } , ['$_GET["{DDato}"]',0] ) Agregar( "TPOST" , '$_POST["{DDato|field_input}"]' , {salida: true, color: "blue" } , ['$_POST["{DDato}"]',0] ) Agregar( "TVariable" , '${DNombre|field_variable|{"variable":"Cambia mi nombre"}' , {salida:"PHPVariable", color: "#CC0011"} , ['${DNombre}',0] ) Agregar( `TVariable2` , '${DNombre|field_variable|{"variable":"Cambia mi nombre"} ¿Coma?{TComa|field_checkbox}¿Entre comillas?{TComillas|field_checkbox}' , { esStatement: true, color: "#CC0011" } , function(D){TComillas=D.TComillas=="TRUE"?`'`:"";return `${TComillas}$${D.DNombre}${TComillas}${[D.TComa]=="TRUE"?",":""}`} ) Agregar( 'TUrl' , 'URL {DUrl|field_input|{"text":"https://"}' , { salida: "URL", color: "#006611" } , ['{DUrl}',0] ) Agregar( "TSiExiste" , 'Vale {DNombre|input_value} sino {DOtro|field_input}' , {salida:true, color: "green"} , ['(isset({DNombre}) ? {DNombre} : {DOtro})', 0] ) Agregar( "TAsignar" , 'Asignar a {DVariable|input_value} = {DOtro|input_value}' , {esStatement: true, color: "green", renglones:1} , function(D){ if( D.DVariable.trim() == "" ) return "// Falta la variable\n" ; if( D.DOtro.trim() == "" ) return "// Falta lo que se asigna\n" ; return '{DVariable} = {DOtro} ;\n'.procesar(D) } ) Agregar( `wokInstalar` , `` , { esStatement: true , color: "maroon" } , `\n` ) Agregar( "wokElemento" , `` , { esStatement: true , color: "#550055" } , `\n` , `https://elements.wokwi.com/?path=/story/analog-joystick--joystick` ) Agregar("jqmUl", `
    {DContenido|input_statement}
`,{esStatement:true,color:"purple",renglones:1},`
    {DContenido}
`) Agregar("jqmLiA", `
  • {m|input_dummy}{DContenido|input_statement}{k|input_dummy}
  • `,{esStatement:true,color:"purple",renglones:1},`
  • \n {DContenido}
  • `) Agregar("jqmLi", `
  • {DContenido|input_statement
  • `,{esStatement:true,color:"purple",renglones:1},`
  • {DContenido}
  • `) Agregar("jqmPagina", `
    {DContenido|input_statement}
    `,{esStatement:true,color:"#330033",renglones:1},`
    {DContenido}
    `) Agregar("jqmEncabezado", `
    {DContenido|input_statement}
    `,{esStatement:true,color:"#330033",renglones:1},`
    {DContenido}
    `) Agregar("jqmPie", `
    {DContenido|input_statement}
    `,{esStatement:true,color:"#330033",renglones:1},`
    {DContenido}
    `) Agregar("jqmPanel", ``,{esStatement:true,color:"#330033",renglones:1},``) Agregar("jqmContenido", `
    {DContenido|input_statement}
    `,{esStatement:true,color:"#330033",renglones:1},`
    {DContenido}
    `) // ================================================[ FUNCIONES ]=============== //------------------------------------------------- FUNCIONES ultimoBloque = null ; function setDblClickOnBlock (block, isChild) { return ; if (!block) return let clickedCount = 0 block.getSvgRoot().addEventListener("click",function(e){ ultimoBloque = block ; e.stopPropagation() ; if( e.altKey ) Blockly.duplicate( ultimoBloque ) ; if( e.ctrlKey ) block.setCollapsed( !block.isCollapsed ) ; }) /* block .getSvgRoot() .addEventListener('pointerdown', (e) => { clickedCount += 1 // HACK: imitation of double-click if (clickedCount >= 2) { ultimoBloque = block ; if (isChild) { e.stopPropagation() } block.setCollapsed(!block.isCollapsed()) } setTimeout(() => { clickedCount = 0 }, 200) })*/ } function Agregar( $nombre, $codigo, $datos, $funcion ) { JQMGenerator[$nombre] = function(E) { var aqui = this ; aqui.Data = {} ; Datos = this.Datos.forEach(function(cadaDato, num){ //if(num==0) return cadaDato ; X = cadaDato.replace(/\|\|/g,"____").split("|").map(function(a){ if(a=="____") return "||" ; return a ; }) Tipo = X[1] || "input_dummy" Nombre = X[0] if( Tipo == "input_statement" ) aqui.Data[Nombre] = CafeGenerator.statementToCode( E, Nombre, 0 ); else if( Tipo == "input_value" ) aqui.Data[Nombre] = CafeGenerator.valueToCode( E, Nombre, 0 ); else if( Tipo.substr(0,5) == "field" ) if( Tipo.indexOf("variable") > -1 ) aqui.Data[Nombre] = AreaDeTrabajo.getVariableById(E.getFieldValue( Nombre )).name ; else aqui.Data[Nombre] = E.getFieldValue(Nombre) // return X }) //console.log(aqui.Data) if($funcion.suTipo()=="[object Function]") return $funcion(aqui.Data) ; if($funcion.suTipo()=="[object Array]" ) return [ $funcion[0].procesar(aqui.Data), $funcion[1] ]; return $funcion.procesar(aqui.Data) ; } Blockly.Blocks[$nombre] = { init: function() { $ = {} ; var n = 0 ; $.args0 = [] ; this.Datos = [] ; var aqui = this ; $.message0 = $codigo.replace(/{{/g,"%%{").replace( /{(.*?)}/g, function(a,b){ X = b.replace(/\|\|/g,"____").split("|").map(function(a){ if(a=="____") return "||" ; return a ; }) aqui.Datos.push(b) Y = ({ type: X[1] || "input_dummy" , name: X[0] || "D" }) if( X.length > 2 ) { try { Otro = JSON.parse( X[2]+"}" ) for( var j in Otro ) Y[j] = Otro[j] ; console.log(110,Otro) } catch(E) { if( X[1].trim()=="field_dropdown" ) { try { Y.options = JSON.parse( "["+X[2].replace(/____/g,"||")+"]" ) } catch(E){ } } console.log( -10, Y, X[2]+"}" ) } } // console.log( Y ) $.args0.push(Y) ; s = "%"+(++n) return s }).replace(/%%/g,"{") if( $datos.color ) $.colour = $datos.color ; $.colour = $_GET.color || $.colour ; if( $datos.siguiente ) $.nextStatement = $datos.siguiente === true ? null : $datos.siguiente ; if( $datos.anterior ) $.previousStatement = $datos.anterior === true ? null : $datos.anterior ; if( $datos.salida ) $.output = $datos.salida ===true ? null: $datos.salida ; if( $datos.entrada ) $.input = $datos.entrada===true ? null : $datos.entrada ; if( $datos.renglones == 1 ) $.inputsInline = true ; else if( $datos.renglones ) $.inputsInline = false ; if( $datos.esStatement ) { $.nextStatement = null ; $.previousStatement = null ; } console.log($) this.jsonInit($) setDblClickOnBlock(this,true) } } } function CrearComponenteHTML( $nombre, $etiqueta, $color, $funcion ) { CafeGenerator[$nombre] = $funcion ; Blockly.Blocks[$nombre] = { init: function() { this.jsonInit({ args0: [ { type: "input_statement" , name: "DAtributo" } , { type: "input_statement" , name: "DContenido" } ] , colour: $color || 0 , message0: "Componente "+$etiqueta+" con atributos %1 de contenido %2" }) this.datos = [$etiqueta,"IS|DAtributo", "IS|DContenido"] } } } JQMGenerator.scrub_ = function(block, code, opt_thisOnly) { const nextBlock = block.nextConnection && block.nextConnection.targetBlock(); const nextCode = opt_thisOnly ? '' : JQMGenerator.blockToCode(nextBlock); return code + nextCode; };