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",""],["Bootstrap","btsp"],["Flat UI redondeado","flr"],["Flat UI cuadrado","flq"],["Vidrio","glass"],["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"]]}' ; // --------------------------------------------------[ ICONOS ] DOpcionesIcono = JSON.stringify( [["Acerca de","about"],["Base de datos acepta","accept_database"],["agregar columna","add_column"],["agregar base de datos","add_database"],["agregar imagen","add_image"],["agregar fila","add_row"],["Agenda","address_book"],["Avanzar","advance"],["Publicidad","advertising"],["Alarma de reloj","alarm_clock"],["Odenar A-Z","alphabetical_sorting_az"],["Ordenar Z-A","alphabetical_sorting_za"],["Respuestas","answers"],["Aprobado","approval"],["Aprobar","approve"],["Gráfico de área","area_chart"],["Asistente","assistant"],["Archivo de audio","audio_file"],["Automático","automatic"],["Automóvil","automotive"],["Mala decisión","bad_decision"],["Gráfico de barras","bar_chart"],["Binoculares","binoculars"],["Biopeligroso","biohazard"],["Biomasa","biomass"],["Biotecnología","biotech"],["Marcalibro","bookmark"],["Resumen","briefcase"],["Link roto","broken_link"],["Negocio","business"],["Contacto de negocio","business_contact"],["Negociador","businessman"],["Negociadora","businesswoman"],["Soltar cable","cable_release"],["Calculadora","calculator"],["Calendario","calendar"],["Cambiar llamada","call_transfer"],["Regresar llamada","callback"],["Videocámara","camcorder"],["Cámara","camera"],["agregar cámara","camera_addon"],["Identificar cámara","camera_identification"],["Cancelar","cancel"],["Capacitor","capacitor"],["Celular","cell_phone"],["Cargar batería","charge_battery"],["Chequeo","checkmark"],["Circuito","circuit"],["Borrar filtros","clear_filters"],["Reloj","clock"],["Modo cercano","close_up_mode"],["Ropa","cloth"],["Colaboración","collaboration"],["Colapsar","collapse"],["Coleccionar","collect"],["Gráfico combinado","combo_chart"],["Comentarios","comments"],["Cámara compacta","compact_camera"],["Videoconferencia","conference_call"],["Contactos","contacts"],["copyleft","copyleft"],["copyright","copyright"],["Cambio de moneda","currency_exchange"],["Cursor","cursor"],["Soporte de usuario","customer_support"],["Copia de respaldo","data_backup"],["Configuración de datos","data_configuration"],["Encriptación de datos","data_encryption"],["Protección de datos","data_protection"],["Recuperación de datos","data_recovery"],["Hoja de datos","data_sheet"],["Base de datos","database"],["Deuda","debt"],["Decisión","decision"],["Borrar columna","delete_column"],["Borrar Base de datos","delete_database"],["Borrar fila","delete_row"],["Departamento","department"],["Desarrollo","deployment"],["Diploma 1","diploma_1"],["Diploma 2","diploma_2"],["Desaprobar","disapprove"],["No gusta","dislike"],["Mostrar","display"],["No inhalar","do_not_inhale"],["No insertar","do_not_insert"],["No mezclar","do_not_mix"],["Documento","document"],["Donar","donate"],["Gráfico de dona","doughnut_chart"],["Abajo","down"],["Abajo a la izq","down_left"],["Abajo a la der","down_right"],["Descargar","download"],["Editar imagen","edit_image"],["Sensor eléctrico","electrical_sensor"],["Electricidad","electricity"],["Aparato eléctrico","electro_devices"],["Electrónicos","electronics"],["Batería vacía","empty_battery"],["Filtro vacío","empty_filter"],["Papelera vacía","empty_trash"],["Terminar llamada","end_call"],["Ingeniería","engineering"],["Expandir","expand"],["Expirado","expired"],["Exportar","export"],["Externo","external"],["Fábrica","factory"],["Fábrica en huelga","factory_breakdown"],["Preguntas","faq"],["Alimentar","feed_in"],["Retroalimentar","feedback"],["Archivo","file"],["Archivero","filing_cabinet"],["Filtro llenado","filled_filter"],["Película","film"],["Película pasando","film_reel"],["Impresión","fine_print"],["Flash automático","flash_auto"],["Sin flash","flash_off"],["Con flash","flash_on"],["Diagrama","flow_chart"],["Carpeta","folder"],["Marco","frame"],["Batería llena","full_battery"],["Papelera llena","full_trash"],["Galería","gallery"],["Genealogía","genealogy"],["Ordenar ascendente","generic_sorting_asc"],["Ordenar descendente","generic_sorting_desc"],["Globo","globe"],["Buena decisión","good_decision"],["Gorra de egresado","graduation_cap"],["Grilla","grid"],["Auriculares","headset"],["Mapa de calor","heat_map"],["Batería alta","high_battery"],["Alta prioridad","high_priority"],["Casa","home"],["Idea","idea"],["Archivo de imagen","image_file"],["Importar","import"],["Info","info"],["Invitar","invite"],["iPad","ipad"],["iPhone","iphone"],["Llave","key"],["Apaisado","landscape"],["Dejar","leave"],["Izquierda","left"],["Abajo a la izq","left_down"],["Arriba a la izq","left_up"],["Biblioteca","library"],["Me gusta","like"],["Gráfico de línea","line_chart"],["Vínculo","link"],["Lista","list"],["Bloquear","lock"],["Batería baja","low_battery"],["Baja prioridad","low_priority"],["Tomar decisión","make_decision"],["Manejador","manager"],["Prioridad media","medium_priority"],["Menú","menu"],["Batería a la mitad","middle_battery"],["Mapa mental","mind_map"],["Menos","minus"],["Llamada perdida","missed_call"],["SMS","mms"],["Música","music"],["Noticias","news"],["Siguiente","next"],["No tengo idea","no_idea"],["no_video","no_video"],["Ordenar números 1-10","numerical_sorting_12"],["Ordenar números 10-1","numerical_sorting_21"],["Aceptar","ok"],["Soporte online","online_support"],["Carpeta abierta","opened_folder"],["Organización","organization"],["Paquete","package"],["Pagado","paid"],["Panorama","panorama"],["Teléfono","phone"],["Teléfono Android","phone_android"],["Imagen","picture"],["Gráfico de torta","pie_chart"],["Planificador","planner"],["Sumar","plus"],["Previo","previous"],["Imprimir","print"],["Privacidad","privacy"],["Proceso","process"],["Rompecabezas","puzzle"],["Preguntas","questions"],["Radar","radar_plot"],["Puntaje","rating"],["Puntajes","ratings"],["Lectura","reading"],["Leyendo libro","reading_ebook"],["Re-hacer","redo"],["Refrescar","refresh"],["Marca registrada","registered_trademark"],["Quitar imagen","remove_image"],["Reutilizar","reuse"],["Derecha","right"],["Abajo a la derecha","right_down"],["Arriba a la derecha","right_up"],["Rotar cámara","rotate_camera"],["Regla","ruler"],["Reglas","rules"],["Seguro","safe"],["Buscar","search"],["Configuraciones","settings"],["Compartir","share"],["Comprado","shipped"],["Compra","shop"],["Firma","signature"],["Parlante","speaker"],["Comenzar","start"],["Estadísticas","statistics"],["Soporte","support"],["Encuesta","survey"],["Sincronizar","synchronize"],["Línea de tiempo","timeline"],["Lista de tareas","todo_list"],["Estructura de árbol","tree_structure"],["Dos teléfonos inteligentes","two_smartphones"],["Deshacer","undo"],["Desbloquear","unlock"],["Arriba","up"],["Arriba a la izq","up_left"],["Arriba a la der","up_right"],["Subir","upload"],["Videollamar","video_call"],["Archivo de video","video_file"],["Proyector de video","video_projector"],["Ver detalles","view_details"],["VIP","vip"]].sort(function(a,b){return a[0].localeCompare(b[0]) }) );// --------------------------------------------------[ SVG ] $( `TSVG` , `Documento de imágenes SVG alto {DAlto|field_input|{"value":"300"} atr {DAtributos|input_value}{DContenido|input_statement}/SVG` , { esStatement: true , color: "30" , renglones: 2 } , function(D){id=""+(1000).cualquiera().entero();return`\n${D.DContenido}\n`+ "" } ); $( `TMedida` , `medida {DMedida|field_number}{DUnidades|field_dropdown|{"options":[["pixeles","px"],["%","%"],["ancho visor","vw"],["alto visor","vh"]]}` , { salida: "svgatributo", color: "blue", renglones: 2 } , [`{DMedida}{DUnidades}`,0] ) $( `TRelleno` , `relleno color {DColor|field_colour}{DOtro|input_value}` , { salida: "atributo", color: 30 } , [` fill="{DColor}" {DOtro}`,0] ) $( `TLinea` , `línea color {DColor|field_colour} grosor {DAncho|field_number} dasharray {D|field_input}{DOtro|input_value}` , { salida: "atributo", color: 30 } , function(D){return[` stroke="${D.DColor}" ${D.DAncho?`stroke-width="${D.DAncho}" `:``} stroke-dasharray="${D.D}"`,0]} ) $( `TSVGRectangulo` , `Rectángulo SVG atr {DAtributos|input_value} ancho {DAncho|input_value|{"check":"svgatributo"} alto {DAlto|input_value|{"check":"svgatributo"} en X {X|field_number} Y {Y|field_number}` , { esStatement: true, color: 30, renglones: 2 } , `\n` )// --------------------------------------------------[ ZEU indicadores ] $( 'TZeuVentilador' , `Ventilador id {DId|field_input} de diámetro {DLado|field_number} color {DColor|field_colour} velocidad {DVel|field_number|{"value":"1"}` , { esStatement: true , color: "black" } , function(D){id=D.DId || ("zeu"+(1000).cualquiera().entero());return` `} ) $( 'TZeuReloj' , `Reloj digital id {DId|field_input} altura {DLado|field_number} color {DColor|field_colour} color fondo {DColorD|field_colour}` , { esStatement: true , color: "black" } , function(D){id=D.DId || ("zeu"+(1000).cualquiera().entero());return`
`} ) $( 'TZeuColumna' , `Columna medidora id {DId|field_input} altura {DAltura|field_number|{"value":"200"} ancho {DAncho|field_number{"value":"100"} color {DColor|field_colour} color fondo {DColorD|field_colour}{D|input_dummy}Entre {DMin|field_number|{"value":"0"} y {DMax|field_number|{"value":"100"}` , { esStatement: true , color: "black" } , function(D){id=D.DId || ("zeu"+(1000).cualquiera().entero());min=D.DMin;max=D.DMax;if(min>max){t=min;min=max;max=t};return` `} ) $( 'TZeuCirculo' , `Círculo velocímetro id {DId|field_input} de diámetro {DLado|field_number} texto {DTexto|field_input|{"text":"Velocidad"} color {DColor|field_colour}{D|input_dummy} Círculo exterior 1 velocidad {DVel1|field_number|{"value":"1"} {DColor1|field_colour}{D|input_dummy} Círculo interior 2 velocidad {DVel2|field_number|{"value":"-1"} {DColor2|field_colour}{D|input_dummy} Círculo interior 3 velocidad {DVel3|field_number|{"value":"1"} {DColor3|field_colour}{D|input_dummy} Círculo interior 4 velocidad {DVel4|field_number|{"value":"-1"} {DColor4|field_colour}{D|input_dummy} ` , { esStatement: true , color: "black" } , function(D){id=D.DId || ("zeu"+(1000).cualquiera().entero());return` `} ) // --------------------------------------------------[ MAVO App ] $( `TMavo` , `Aplicación mavo id {DNombre|field_input|{"text":"subappmavo1"} descargable{DDesc|field_checkbox} autoguarda {DGuarda|field_number} plugins{DPlug|field_input} atr{DSour|input_value}{D|input_dummy}{DContenido|input_statement}/Mavo` , { esStatement: true, color: "120" } , function(D){return`
0 ? `mv-autosave="${D.DGuarda}"`:``} ${D.DPlug ? `mv-plugins="${D.DPlug}"`:``} ${D.DSour} >\n${D.DContenido}
\n`} ) $( `TMavoPropiedad` , `propiedad {DTexto|field_input}{DOtro|input_value}` , { salida: "atributo", color: "120" } , function(D){return[` property="${D.DTexto.replace(/\"/g, "'")}" ${D.DOtro}`,0]} ) $( `TMavoSi` , ` sólo si {DTexto|field_input|{"text":"edad = 21"}{DOtro|input_value}` , { salida: "atributo", color: "120" } , [ ` mv-if="{DTexto}" {DOtro}`, 0 ] ) $( `TMavoReactancia` , `reacciona [{DTexto|field_input}] {DOtro|input_value}` , { salida: "String", color: "120" } , [`[{DTexto}]{DOtro}`,0] ) $( "TMavoSpan" , `propiedad [{DTexto|field_input|{"text":"prop1"}] en {DEn|field_input|{"text":"span"}{DOtro|input_value}` , { salida: "String", color: "green" } , function(D){return[`<${D.DEn} property="${D.DTexto}"> ${D.DOtro}`,0]} ) $( `TMavoMultiple` , `{DD|field_dropdown|{"options":[["múltiple","mul"],["es lista","lis"],["modelo","mod"]]} {DOtro|input_value}` , { salida:"atributo", color: "120"} , [` mv-multiple {DOtro}`,0] ); $( `TMavoAccion` , `click {DAction|field_input|{"text":""} {DOtro|input_value}` , { salida: "atributo", color: "120" } , [ ` mv-action="{DAction}" {DOtro}`, 0 ] ); $( "TMavoSource" , `origen {DOrigen|field_input}{DCORS|field_checkbox} formato {DFormato|field_dropdown|{"options":[ ["json","json"], ["csv","csv"], ["tsv","tsv"] ]} {DOtro|input_value}` , { salida: "atributo" , color: "0" } , function(D){return[` mv-source="${D.DCORS=="TRUE"?"https://gorosito.red/tsv2csv.php?q=":""}${D.DOrigen}" mv-format="${D.DFormato}" ${D.DOtro}`,0 ]} )// --------------------------------------------------[ Firebase ] // --------------------------------------------------[ MMenu ] $( ` ` ) $( `TMMenu` , `MMenu ligero {D|input_dummy}{DContenido|input_statement}` , { esStatement: true , color: 230 } , function(D){ id = "mmenu"+(1000).cualquiera().entero() ; return ` \n `; } ); $( `TMSubMenu` , `Submenú {DTitulo|field_input}{D|input_dummy}{DContenido|input_statement}` , { esStatement: true , color: 230 } , function(D){return `${D.DTitulo?`${D.DTitulo}`:``}\n\n`} ); $( `TABC` ); // --------------------------------------------------[ Vegas ] $( `TVegas` , `Imágenes de fondo Vegas para {DSelector|field_input|{"value":"body"} {DContenido|input_statement}/TVegas` , { esStatement: true , color: "30" , renglones: 2 } , function(D){id=""+(1000).cualquiera().entero();return`\n${D.DContenido}\n`+ "" } ); //////////////////////////// AFRAME //////////////////////////// $( "TTData", ` data-{clave|field_input}="{valor|field_input}"` , {esStatement:true, color: "fuchsia"} , ` data-{clave}="{valor}"` ) $( "TArduinoUsb", `Arduino-usb {A|input_dummy}id {did|field_input} eventos={deventos|field_input}` , { esStatement: true, color: "darkblue" } , `` ) $( "TMenu", `Es-menu posicion={dpos|field_input} titulo={dtitulo|field_input|{"value":"Menú"}{A|input_dummy}{DContenido|input_statement}/Es-menu` , {esStatement: true, color: "darkblue" } , ` {DContenido} ` ) $( "TSocket" , `General-io socket id={did|field_input} clave={dclave|field_input} eventos={dfn|field_input}` , { esStatement: true, color: "blue" } , `` ) $( "TImpressSlide", `
{DContenido|input_statement}
` , {esStatement:true,color:"purple"} , `
\n{DContenido}
` ) $( `TImpress` , `Aplicación Impress{Z|input_dummy}{atributos|input_statement}Contenido:{Y|input_dummy}{DContenido|input_statement}` , { color: "purple" } ,`
{DContenido}
` ) $( 'TAframe' , `A-Frame 3D {A|input_dummy}{DContenido|input_statement}` , { esStatement: true , color: "#884400" } , function(D){ id = "idaframe" + (Math.random()*1000).toFixed(0) ; return ` `; } ); 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( "InstalarAframeExtras" , 'Extras:' , { esStatement: true , color: "blue" } , `` ) /////////////////// FIN AFRAME $( `TDiapositiva` , `Diapositiva {C|input_dummy}de título {DTexto|field_input|{"text":"Acá va tu título"}{B|input_dummy} y tema ${TEMA} ¿Encabezado fijo?{EncFijo|field_checkbox}{A|input_dummy}fondo:{DFondo|field_input|{"text":"transparent"} transicion:{DTran|input_value|{"check":"transicion"}{DContenido|input_statement}` , {esStatement:true, color: "#FFC300", renglones:2} , function(D){return`

${D.DTexto}

${D.DContenido}
`} ) $( 'IconZMDI' , 'Ícono ZMDI {DTexto|field_input}{DOtro|input_value}' , {salida: true, color: "red",renglones:2 } , [`{DOtro}`,0] ) $( `BStyle` , `con estilos CSS {DStyle|input_value}` , {salida: "atributo", color: "red" } , [` style="{DStyle}" `,0] ) $( `TLink` , `Link relación {Rel|field_dropdown|{"options":[["stylesheet","css"],["icon","ícono"],["short icon","ícono atajo"]]} refiriendo hacia {HRef|field_input|{"text":"https://.css"}` , { esStatement: true, color: 300 } , `\n` ) $( `TScript` , `Script de JavaScript origen {Src|field_input|{"text":"https://.js"} ¿Asincrónico?{DAsync|field_checkbox} ¿Es módulo?{DModulo|field_checkbox}` , { esStatement: true, color: 300 } , '\n' ) $( "TVinculo" , `Hipervínculo anclado hacia {D|input_value|{"check":"atributo"}{DContenido|input_statement}` , { esStatement: true , color: "#440044" } , function(D){ if( D.D.indexOf("hacia=")>-1 ) { Destino = D.D.match(/hacia="(.*?)"/)[1] ;} else Destino = "#" ; return `\n${D.DContenido}\n` } ) $( `BMiniPreview` , `darle vista previa {DOtro|input_value}` , { salida:"atributo", color: "black" } , [` mini-preview {DOtro}`,0] ) $( `TRuedaNav` , `Rueda de navegación {DContenido|input_statement}` , { esStatement: true , color: "black" } , function(D){return`
${D.DContenido}
`} ) $( `TIconoDesk`, `Ícono {DIcono|field_dropdown|{"options":${DOpcionesIcono}} texto {DTexto|field_input|{"text":"Servicio"} {DPopup|field_checkbox} hacia {DHacia|input_value}`, { esStatement: true , color: "black" }, `

{DTexto}
` ) $(`TEscritorio`,`Escritorio de íconos {DContenido|input_statement}`,{esStatement:true,color:"black"},`{DContenido}\n`) // --------------------------------------------------[ Tarjetas ] $( `TChatbotPara` , `Para el dato {DDato|field_input}{D|input_dummy}{DContenido|input_statement}` , { esStatement: true, color: "black"} , `
\n{DContenido}
` ) $( 'TChatbotNoResponde' , ` el usuario no debe responder {DOtro|input_value} ` , { salida:"atributo", color:"black"} , [` data-no-answer="true" {DOtro}`,0] ) $( `TChatbotCaso` , `Si responde {DDato|field_input}{D|input_dummy}{DContenido|input_statement}` , { esStatement: true, color: "black"} , `
{DContenido}
\n` ) $( `TIconoSVG` , `Ícono de lado {DLado|field_number} {DCual|field_dropdown|{"options":${DOpcionesIcono}}{DOtro|input_value}` , { salida: "String", color: "green"} , [`{DOtro}`,0] ) $( `TJoystick` , `Joystick` , { esStatement: true, color: "#007833" } , function(D){id="jyst"+(1000).cualquiera().entero();return `
`} ) $( 'TTarjetaSimple' , 'Tarjeta {D|input_dummy}Título:{DTit1|input_value}Subtítulo:{DTit2|input_value}Imagen:{DImagen|input_value}Párrafo:{DTexto|input_value}' , { esStatement: true, color: "130" } , function(D){return`
${D.DTit1 ? `

${D.DTit1}

${D.DTit2}
`:""} ${D.DImagen ? `
`:""} ${D.DTexto?`
${D.DTexto}
`:""}
`}, "Genera una tarjeta (card) - NativeDroid2" ) // ===========================================[ FUERA DE SERIE ] $( 'TRepetir' , 'Repetir {DVeces|field_number} veces usando {DUsando|field_input|{"text":"TANTO"} lo siguiente{D|input_dummy}{DContenido|input_statement}/Repetir' , { esStatement: true, color: "black" } , function( D ) { $s = "" ; for( $ = 0 ; $ < D.DVeces.absoluto().entero() ; $++ ) { $s += D.DContenido.replaceAll( D.DUsando, $ ) ; } return $s ; } , `Te permite repetir varias veces los mismos bloques \ncontrolando la repetición mediante la palabra TANTO` ) $( 'TRepetirPara' , 'Repetir para {DTexto|field_input|{"text":"a,b,c,d"} usando {DUsando|field_input|{"text":"TANTO"}¿Mezclar {DMezclar|field_checkbox}?{D|input_dummy}{DContenido|input_statement}/Repetir' , { esStatement: true, color: "black" } , function( D ) { $l = D.DTexto.split(","); if( D.DMezclar == "TRUE" ) $l = $l.sort( function(x){return Math.random()-.5} ) $s = "" ; //console.log(80000, D.DContenido) for( $ in $l ) { $s += D.DContenido.replaceAll( D.DUsando , $l[$] ) ; } return $s ; } , `Te permite repetir varias veces los mismos bloques \ncontrolando la repetición mediante la palabra TANTO` ) $( 'TMarcar' , 'Comentario con marca {DTexto|field_input|{"text":"$ABCD"}' , { esStatement: true, color: "black" } , '\n' , `Genera un comentario con la palabra que le agregues` ) $( 'TIgnorar' , 'Ignorar los siguientes bloques{D|input_dummy}{DBloques|input_statement}' , { esStatement: true, color: "black" } , '' , `Permite encerrar varios bloques dentro de comentarios HTML` ) // --------------------------------------------------[ /FUERA DE SERIE ] // --------------------------------------------------[ 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 ] // --------------------------------------------------[ ESTILOS ] $( "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)+"\"]" } ) .join(",") ) +']}' , {salida:"Colour", color: "#550080"} , 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 ] } ); $( "BColorLetra" , 'color de letra {A|field_colour} con opacidad {B|field_dropdown|{"options":[' +( [1,2,3,4,5,6,7,8,9,10].reverse() .map( function(a){ return "[\""+a*10+"%\",\""+(a/10)+"\"]" } ) .join(",") ) +']}' , {salida:"Colour", color: "#550080"} , 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 [ 'color:rgba( {0},{1},{2}, {3} );'.procesar(S), 0 ] } ); /*$( `TPecera` , `Pecera con {DCantidad|field_number|{"value":"3"} peces koi altura {DAltura|field_input|{"text":"60vh"}` , { esStatement: true , color: "black" } , function(D){ id = "pecera"+(1024).cualquiera().entero(); return `
`} )*/ $( "BSombraLetra" , 'color de letra {A|field_colour} con opacidad {B|field_dropdown|{"options":[' +( [1,2,3,4,5,6,7,8,9,10].reverse() .map( function(a){ return "[\""+a*10+"%\",\""+(a/10)+"\"]" } ) .join(",") ) +']} separado {DPixeles|field_number|{"number":"2"}px' , {salida:"Colour", color: "#550080"} , 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 [ 'text-shadow: {DPixeles}px {DPixeles}px {[DPixeles]+2}px'.procesar(D)+' rgba( {0},{1},{2}, {3} );'.procesar(S), 0 ] } ); // GCOMponentes $("TDiv", `Objeto {DNombre|field_input|{"value":"arduino-usb"}{DAtributo|field_input}{A|input_dummy}{DContenido|input_statement}`,{esStatement:true,color:"purple"},`<{DNombre} gcompo {DAtributo}>\n{DContenido}\n\n`) $("TClippyAmigos", `Clippy y Amigos {DPersonaje|field_dropdown|{"options":[["Clippy",""],["Genio","genio"],["Loro","loro"],["Gato 1","gato"],["Perro","perro"],["Mago","mago"],["Gorila","gorila"],["Einstein","einstein"]]}`, {esStatement:true,color:"purple"},``) // --GCOMponentes $( `TDivShadow` , `DIVisor con sombra de color {DColor|field_colour} difuminado {DDif|field_number|{"value":"10"}{D|input_dummy}{DContenido|input_statement}` , { esStatement: true, color:"black" } , `
\n{DContenido}
` ) $( "BColorOpacidadGradiente" , 'gradiente {A|field_colour} {C|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}"]` } ) .join(",") ) +']}' , {salida:"Colour", color: "#880090"} , 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 ) ; A = 'rgba( {0},{1},{2}, {3} )'.procesar(S) ; S = extraer( D.C.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 ) ; B = 'rgba( {0},{1},{2}, {3} )'.procesar(S) ; return ['linear-gradient( 45deg, '+A+', '+B+' )',0] } ); // --------------------------------------------------[ /ESTILOS ] // --------------------------------------------------[ VARIEDAD ] $( 'TGrafiquito' , 'Grafiquito {DTipo|field_dropdown|{"options":[ ["de torta","torta"],["de dona","dona"],["de línea","linea"],["de barras","barra"] ]} valores {DValores|field_input|{"text":"1,3,2,3,2,4,2"} altura {DAltura|field_number}{DOtro|input_value}' , { salida: "String", color: "#993300" } , function(D){return[`${D.DValores}${D.DOtro}`,0]} , `Permite generar un gráfico entre las letras (span) - Uso de Peity.js` ) $( 'TLibro' , 'Libro portada {DPortada|input_value}link{DUrl|input_value}' , { esStatement: true, color: "#FF00DD"} , function(D){return`
`}, `Permite generar la portada animada en 3D de un libro sólo con CSS3` ) $( `THablar` , `Decir en voz alta lo que hay en {DId|field_variable}, botón {DTexto|field_input|{"text":"Decir en voz alta"}` , { esStatement: true , color: "50" , renglones: 2 } , function(D){id="hablar"+(1000).cualquiera().entero();return``} ) $( `TReconocer` , `Reconocer mensaje de voz en input {DId|field_variable}, texto del botón {DTexto|input_value|{"check":"String"}Reglas:{D|input_dummy}{DReglas|input_statement|{"check":"ReglasAnnyang"}` , { esStatement: true , color: "50" ,renglones:2 } , function(D){ id = "reconocer"+(1000).cualquiera().entero() ; return ` ` } ) $( `ReglasAnnyang` , `Para {DRegla|field_input|{"text":"hola"} sucede {DAccion|field_input|{"text":"alert('Hola')"}` , { anterior: "ReglasAnnyang" , siguiente: "ReglasAnnyang" , renglones: 2 , color: "54" } , function(D){return`"${D.DRegla}":function(x){(${D.DAccion});},\n`} ) $( 'TVibrate' , `Vibrador id {DId|field_input} texto {DTexto|field_input|{"text":"Vibrar en secuencia"} cantidad {DCantidad|field_input|{"text":"500,300,500"}` , { esStatement: true , color: 50 } , function(D){ id = D.DId || ("vibrador"+(1000).cualquiera().entero()); return ` ` } ) $( 'TSliderImagenes' , 'Muestra de imágenes {D|input_dummy}Tiempo: {DTiempo|field_number|{"number":"2"}segs.{D|input_dummy}¿Repetir?{DLoop|field_checkbox}{D|input_dummy}{DContenido|input_statement}/Muestra' , { esStatement: true, color: "#440044" } , function(D){ D.DContenido = D.DContenido.replace( /\
  • /g,"") ; G = (1000).cualquiera().entero() ; return `
    ${D.DContenido}
    `//'
    \n'+D.DContenido+'
    \n' }, `Permite generar un carrusel de imágenes o DIVs.\nSe deben insertar Items (bloques rojos) de lista por cada imagen a procesar.\nUso de la librería Swiper` ) $(`TBR`, `Break{DOtro|input_value}`,{salida:"String",color:"green"},`
    {DOtro}`) $( 'TRelojAnalogico' , 'Reloj analógico de altura {DAlto|field_number}px, relleno {DColor|field_colour}' , { esStatement: true, color: "black" } , function(D){id = "relojanalogico"+(1000).cualquiera().entero();return `
    `}, `Genera un pequeño reloj analógico - Elegir color y tamaño` ) $( 'TMiniMundo' , `Mini globo lat {DLat|field_number} long {DLon|field_number} alto {DAlto|field_input|{"text":"40vh"} zoom {DZoom|field_dropdown|{"options":${JSON.stringify([0,1,2,3,4,5,6,7,8,9,10].map(x=>[`${x}`,`${x}`]))}}` , { esStatement:true, color: "black"} , function(D){id="minimundo"+(1000).cualquiera().entero();return`
    `} ) $( `TSliderBrz` , 'Muestra de imágenes {D|input_dummy}{DContenido|input_statement}' , { esStatement: true, color: "black" } , `
    {DContenido}
    `, `Genera un carrusel de imágenes. Cuando te acercás a un porcentaje del ancho del objeto se desplaza automáticamente a la imagen correspondiente.` ) $( 'TZoomable' , 'se le puede hacer zoom {DOtro|input_value}' , { salida: "atributos", color: "#33cc88" } , [ " zooming {DOtro}",0 ] , `A la imagen que se le aplique como atributo se le podrá hacer click que se verá en grande como con lupa - Uso de librería Zooming` ) $( 'TLienzo' , 'Lienzo de dibujo id{DId|field_variable}{D|input_dummy}' + 'ancho {DAncho|field_number}px x alto {DAlto|field_number}px{D|input_dummy}' + 'transparente {DTransparencia|field_checkbox}' , { esStatement: true, color: "#CC44DD" } , function(D){ id="lienzo"+(1000).cualquiera().entero(); return `
    `} ) $( 'TImagenZoom' , 'Imagen con zoom hacia {DImagen|input_value}' , { esStatement: true, color: "#33cc88"} , function(D){id="zooming"+(1000).cualquiera().entero();return ``}, `Pegá a este bloque la dirección de una imagen y al hacerle click se agrandará para hacerle zoom - Uso de librería Zooming` ) $('TChat' , 'Conversación de chat {D|input_dummy}{DContenido|input_statement}/Conversación' , { esStatement: true, color: "#CC0044"} , function(D){return`
    ${D.DContenido.replace( /\
  • /g,"") } `}, `Generará globos de conversación. \nInsertar Items de lista (rojo) con los textos de los globos de chat.` ) $('TTemporal' , 'Paso a paso {D|input_dummy}{DContenido|input_statement}/Línea temporal' , { esStatement: true, color: "#CC0044"} , function(D){return`
    ${D.DContenido.replace( /\
  • /g,"") } `}, `Generará un step-by-step con bordes coloridos, \na modo de línea de tiempo vertical intercalados. \nInsertar Items (rojos) de lista.` ) $( 'TReloj' , 'Reloj{DOtro|input_value}' , { salida: "String", color: "green" } , function(D){ id = "reloj"+(1000).cualquiera().entero() ; return [` `,0] }, 'Genera un elemento de texto (span) con la hora cada 100 milisegundos o décimo de segundo' ) $( 'TQR' , 'Código QR lado {DLado|field_number|{"number":"60"}px, texto {DTexto|input_value}' , { esStatement: true, color: "#CC00CC" } , function(D){ G = (1000).cualquiera().entero() ; return `
    ` }, `Permite insertar una imagen Código QR con el texto que elijas - Uso de librería QRCode de David Shim` ); $( 'TQRAqui' , 'Código QR de lado {DLado|field_number|{"number":"60"}px, a este mismo archivo.' , { esStatement: true, color: "#CC00CC" } , function(D){ G = (1000).cualquiera().entero() ; return `
    ` }, `Permite insertar una imagen Código QR cuyo texto es la URL del archivo online final - Uso de librería QRCode de David Shim` ); $( `TCodigoBarra` , `Código de barra formato con texto {DTexto|input_value}` , { esStatement: true, color: "black" } , function(D){ id = "barcode"+(1000).cualquiera().entero() ; return `` } ); $( `TCodigoBarraAqui` , `Código de barra con esta dirección` , { esStatement: true, color: "black" } , function(D){ id = "barcode"+(1000).cualquiera().entero() ; return `` } ); $( 'TImagenQ' , 'Imagen circular tamaño {DTam|field_number|{"number":"60"} {DRuta|input_value}atrib{DAtributos|input_value|{"check":["atributos","atributo"]}' , { esStatement: true, color: "#550080" } , function(D){ D.DRuta = D.DRuta.replace("url(", "").replace(")","") ; return `\n` }, `Inserta una imagen (img) con forma circular` ) $( 'TImagenCu' , 'Imagen cuadrada tamaño {DTam|field_number|{"number":"60"} {DRuta|input_value}chanfle{DChanfle|field_number}atrib{DAtributos|input_value|{"check":"atributos"}' , { esStatement: true, color: "#550080" } , function(D){ D.DRuta = D.DRuta.replace("url(", "").replace(")","") ; return `-1?";background:"+D.DRuta:`" src="${D.DRuta}"`} width="${D.DTam}px" height="${D.DTam}px" ${D.DAtributos} />\n` }, 'Inserta una imagen (img) con forma cuadrada' ) $(`TResponsive`,`DIVisor responsive ${ATRIBUTOS}{DContenido|input_statement}/Responsive`,{esStatement:true,color:"#440044"},`
    \n{DContenido}
    \n`) $( `BResponsive` , ` es responsive {DOtro|input_value}` , { salida: "atributo", color: "#330033" } , [` responsive {DOtro}`,0] ) $( 'TImagenAn' , 'Imagen ancho {DTam|field_number|{"number":"60"} {DRuta|input_value}atrib{DAtributos|input_value}' , { esStatement: true, color: "#550080" } , function(D){ D.DRuta = D.DRuta.replace("url(", "").replace(")","") ; return '\n'.procesar(D) }, `Inserta una imagen (img) consignando sólo su ancho - El alto se acomoda automáticamente para mantener la proporción` ) $( 'TImagenAl' , 'Imagen alto {DTam|field_number|{"number":"60"} {DRuta|input_value}atrib{DAtributos|input_value}' , { esStatement: true, color: "#550080" } , function(D){ D.DRuta = D.DRuta.replace("url(", "").replace(")","") ; return '\n'.procesar(D) }, `Inserta una imagen (img) consignando sólo su alto - El ancho se acomoda automáticamente para mantener la proporción` ) $( 'TBandera' , 'Bandera altura {DTam|field_input|{"text":"60vh"} {DFijo|field_checkbox} {DRuta|input_value}' , { esStatement: true, color: "#550080" } , function(D){ //D.DRuta = D.DRuta.replace("url(", "").replace(")","") ; return `
     
    \n` }, `Inserta una banda, banner o bandera (div) con una imagen de fondo de un alto específico - Por ejemplo, 300px (300 pixeles de alto); 60vh (60% del alto del navegador)...` ) $( 'TBandera2' , 'Tarjeta {DTam|field_input|{"text":"60vh"} {DFijo|field_checkbox} fondo {DRuta|input_value}{DContenido|input_statement}/Tarjeta' , { esStatement: true, color: "#550080", renglones: 2 } , function(D){ //D.DRuta = D.DRuta.replace("url(", "").replace(")","") ; return `
    \n${D.DContenido}
    \n` }, `Genera un divisor con posición relativa para insertar un bloque "Dentro en" directamente` ) $( 'TDentro' , 'Dentro de tarjeta en {DPos|field_dropdown|{"options":[["Arr-izq","top:10;left:10"],["Arr-der","top:10;right:10"],["Aba-izq","bottom:10;left:10"],["Aba-der","bottom:10;right:10"]]} atr'+ATRIBUTOS+'{DContenido|input_statement}/Dentro' , { esStatement: true, color: "#550080",renglones:2 } , function(D){return`
    \n${D.DContenido}
    \n`}, `Genera un divisor con posición absoluta para ubicarse dentro de un bloque "Tarjeta" a partir de la esquina seleccionada` ) $( `TDataAos` , `animar al aparecer {DTipo|field_dropdown|{"options":[["aparecer","fade"],["rotar","flip"],["agrandar","zoom-in"],["achicar","zoom-out"]]} hacia {DDir|field_dropdown|{"options":[["ningún lado",""],["arriba","up"],["abajo","down"],["izquierda","left"],["derecha","right"]]} {DOtro|input_value}` , { salida:"atributo", color:"#550080"} , function(D){return[ ` data-aos="${D.DTipo+(D.DDir?"-"+D.DDir:"")}" ${D.DOtro}`,0 ]} ) $( `TAniJS` , ` anijs {DAni|field_input|{"text":"if:click,do:fade-up"} {DOtro|input_value}` , { salida: "atributo", color: "#550080" } , [ ` data-anijs="{DAni}" {DOtro}`,0 ] ) $( `TMicroLight` , `Código iluminado {D|input_dummy}{DContenido|input_statement}` , { esStatement: true, color: "black" } , `
    {DContenido}
    ` ) $( `TSocial` , `de red social {DOpcion|field_input|{"text":"facebook"}` , { salida: "atributo", color: "#BB0055" } , [` class="zocial {DOpcion}" data-theme="A" {DOtro}`, 0] ) $( `TBubbly` , `Burbujas en el fondo` , { esStatement: true, color: "black" } , ` \n` ) $( `TID` , ` id {DId|field_variable|{"variable":"NuevaVariable"} {DOtro|input_value}` , { salida: "atributo", color: "red" } , [` id="{DId}" {DOtro}`,0] ) $( `TAtributo` , ` atr {DNombre|field_input|{"text":"class"}="{DValor|field_input|{"text":"probando"}" {DOtro|input_value}` , { salida: true, color: "red" } , [` {DNombre}="{DValor}" {DOtro}`,0] ) $( `TPhotoBooth` , `Tomar foto id {DId|field_input} proporción {DAlto|field_number|{"value":"1"}` , { esStatement: true, color: 50 } , function(D){id=D.DId||"webcamjs"+(1024).cualquiera().entero();return `
    `} ) // --------------------------------------------------[ /VARIEDAD ] // --------------------------------------------------[ MUNDO 3D ] $( 'TModelo3D' , 'Modelo 3D {DUrl|input_value}alto {DAlto|field_input|{"text":"60vh"}{D|input_dummy} color cielo {DColor|field_colour}' , { esStatement: true, color: "#F37220" } , function(D){return `
    `}, `Inserta un modelo 3D de formato GLTF especificado - Uso de librería AFrame` ) // --------------------------------------------------[ //MUNDO 3D ] // --------------------------------------------------[ JEXCEL ] Agregar( 'TJExcelBasico' , 'Planilla jExcel básica {D|input_dummy}' +'Nombre (persistencia){DNombre|field_input}{D|input_dummy}' +'Filas{DCols|field_number}' +'x Columnas{DFilas|field_number}{D|input_dummy}' +'Màx. filas {DMaxFilas|field_number}' +'x cols. {DMaxCols|field_number}{D|input_dummy}' +'Ancho {DAncho|field_input|{"text":"100%"}{D|input_dummy}' +'Congelar columnas {DCongelarCol|field_number}{D|input_dummy}' +'Con botón para descargar {DDescargar|field_checkbox}{D|input_dummy}' +'Con buscador {DBuscador|field_checkbox}{D|input_dummy}' +'Prohibido pegar {DNoPegar|field_checkbox}{D|input_dummy}' +'Prohibido click secundario {DNoContext|field_checkbox}{D|input_dummy}' , { esStatement: true, color: "green" } , function(D){id = "jexcel"+(1000).cualquiera().entero();return`
    ${D.DDescargar=="TRUE"?`Descargar planilla`:""} `}, `Inserta una planilla de JExcel con la posibilidad de persistencia - Gracias a la librería jExcel de Bossanova` ) Agregar( 'TJExcelOnline' , 'Planilla online básica {D|input_dummy}' +'URL {DUrl|input_value}' +'en formato {DFormato|field_dropdown|{"options":[["JSON","json"],["TSV","tsv"],["CSV con comas","csvcoma"],["CSV con punto y coma","csvpc"]]}{D|input_dummy}' +'Nombre para descargar: {DNombre|field_input}{D|input_dummy}' +'Ancho {DAncho|field_input|{"text":"100%"}{D|input_dummy}' +'Congelar columnas {DCongelarCol|field_number}{D|input_dummy}' +'Con botón para descargar {DDescargar|field_checkbox}{D|input_dummy}' +'Con buscador {DBuscador|field_checkbox}{D|input_dummy}' +'Prohibido pegar {DNoPegar|field_checkbox}{D|input_dummy}' +'Prohibido click secundario {DNoContext|field_checkbox}{D|input_dummy}' +'Columnas{D|input_dummy}{DColumnas|input_statement}' , { esStatement: true, color: "green" } , function(D){id = "jexcel"+(1000).cualquiera().entero();return`
    ${D.DDescargar=="TRUE"?`Descargar planilla`:""} `}, `Inserta una planilla de JExcel que trae los datos desde una dirección mediante la técnica AJAX - Gracias a la librería jExcel de Bossanova` ) Agregar( 'TJExcelColumnada' , 'Planilla jExcel con columnas {D|input_dummy}' +'Nombre (persistencia){DNombre|field_input}{D|input_dummy}' +'Filas{DCols|field_number}' +'Màx. filas {DMaxFilas|field_number}{D|input_dummy}' +'Ancho {DAncho|field_input|{"text":"100%"}{D|input_dummy}' +'Congelar columnas {DCongelarCol|field_number}{D|input_dummy}' +'Con botón para descargar {DDescargar|field_checkbox}{D|input_dummy}' +'Con buscador {DBuscador|field_checkbox}{D|input_dummy}' +'Prohibido pegar {DNoPegar|field_checkbox}{D|input_dummy}' +'Prohibido click secundario {DNoContext|field_checkbox}{D|input_dummy}' +'Columnas{D|input_dummy}{DColumnas|input_statement}' , { esStatement: true, color: "green" } , function(D){id = "jexcel"+(1000).cualquiera().entero();return`
    ${D.DDescargar=="TRUE"?`Descargar planilla`:""} `}, `Inserta una planilla de JExcel con las columnas que especifiqués - Gracias a la librería jExcel de Bossanova` ) Agregar( 'TJExcelColTextual' , 'De texto con título {DTitulo|field_input|{"text":"Título"} ancho{DAncho|field_number}' , { esStatement: true, color: "#FF44DD"} , function(D){return`{ stripHTML: false,type:'text'${D.DAncho?',width:{DAncho}'.procesar(D):''}${D.DTitulo?',title:"{DTitulo}"'.procesar(D):''} },`} ) Agregar( 'TJExcelColCheck' , 'Chequeo con título {DTitulo|field_input|{"text":"Título"} ancho{DAncho|field_number}' , { esStatement: true, color: "#FF44DD"} , function(D){return`{ type:'checkbox'${D.DAncho?',width:{DAncho}'.procesar(D):''}${D.DTitulo?',title:"{DTitulo}"'.procesar(D):''} },`} ) Agregar( 'TJExcelColColor' , 'Color con título {DTitulo|field_input|{"text":"Título"} ancho{DAncho|field_number}' , { esStatement: true, color: "#FF44DD"} , function(D){return`{ type: "color",render:"square" ${D.DAncho?',width:{DAncho}'.procesar(D):''}${D.DTitulo?',title:"{DTitulo}"'.procesar(D):''} },`} ) Agregar( 'TJExcelColCalendario' , 'Fecha con título {DTitulo|field_input|{"text":"Título"} ancho{DAncho|field_number}' , { esStatement: true, color: "#FF44DD"} , function(D){return`{ type: "calendar" ${D.DAncho?',width:{DAncho}'.procesar(D):''}${D.DTitulo?',title:"{DTitulo}"'.procesar(D):''} },`} ) Agregar( 'TJExcelColImagen' , 'Imagen con título {DTitulo|field_input|{"text":"Título"} ancho{DAncho|field_number}' , { esStatement: true, color: "#FF44DD"} , function(D){return`{ type: "image" ${D.DAncho?',width:{DAncho}'.procesar(D):''}${D.DTitulo?',title:"{DTitulo}"'.procesar(D):''} },`} ) Agregar( 'TJExcelColNumerico' , 'Número con título {DTitulo|field_input|{"text":"Título"} ancho{DAncho|field_number} máscara {DMasc|field_input|{"text":"#,##.00"}' , { esStatement: true, color: "#FF44DD"} , function(D){return`{ type: "numeric",decimal:"," ${D.DAncho?',width:{DAncho}'.procesar(D):''}${D.DTitulo?',title:"{DTitulo}"'.procesar(D):''}${D.DMasc?`, mask:"${D.DMasc}"`:""} },`} ) Agregar( 'TJExcelColLista' , 'Listado con el título {DTitulo|field_input|{"text":"Título"} ancho{DAncho|field_number} valores {DValores|field_input|{"text":"Sí,No,Tal vez,Quizás,Nunca"} múltiple{DMult|field_checkbox} que completa{DAuto|field_checkbox}' , { esStatement: true, color: "#FF44DD"} , function(D){ r=`{ ${D.DAuto=="TRUE"?`type: "autocomplete"`:`type: "dropdown"`} ${D.DAncho?',width:{DAncho}'.procesar(D):''} ${D.DTitulo?',title:"{DTitulo}"'.procesar(D):''} ${D.DValores?`, source:[${ D.DValores .split(",") .map(function(x){return`"${x}"`}) .join(",")}]`:""} ${D.DMult=="TRUE"?', multiple:true':""} },`; console.log( D.DValores .split(",") .map(function(x){return`"${x}"`}) .join(",") ) console.log(20000,r) return r } ); Agregar( 'TTabla' , 'Tabla {D|input_dummy}cabeza {TEncabezado|input_value|{"check":"CabezaTabla"}cuerpo {TCuerpo|input_value|{"check":"CuerpoTabla"} {D|input_dummy}jExcel{DEx|field_checkbox}' , { esStatement: true, color: "#222222", renglones: 2 } , function(D){id="tabla"+(1000).cualquiera().entero();return`${D.TEncabezado}${D.TCuerpo}
    ${D.DEx=="TRUE"?``:""}\n`}, 'Inserta una Tabla HTML (table)' ); Agregar( `TTablaOnline` , `Tabla online desde URL {DUrl|input_value}Formato {DFormato|field_dropdown|{"options":[["TSV","tsv"],["CSV con coma","csvc"],["CSV con punto y coma","csvpc"]]}cada {DPaginacion|field_number}{D|input_dummy}¿jExcel?{DEx|field_checkbox}¿Barras?{DBarras|field_checkbox}` , { esStatement: true, color: "#333333", renglones: 2 } , function(D){ id = "tablaol" + (1024).cualquiera().entero() ; return`
    Descargando datos... aguarde...
    \n` } ) Agregar( 'TTabla2' , `Tabla {DFiltro|field_text|{"text":"Filtrar por..."}{D|input_dummy}encabezado {DEncabezado|field_input|{"text":"Id//number,Nombre,Edad//number,Domicilio,Porciento//percent"}{D|input_dummy}cuerpo{D|input_dummy}{TCuerpo|input_statement|{"check":"RenglonTabla"}jExcel{DEx|field_checkbox}` , { esStatement: true, color: "#222222", renglones: 2 } , function(D){id="tabla"+(1000).cualquiera().entero();return `${D.DEncabezado.split(",").map(function(x){return ``}).join("")}${D.TCuerpo}
    -1?`data-type="${x.split("//")[1]}"`:""} >${x.split("//")[0]}
    ${D.DEx=="TRUE"?``:``}\n`} ) Agregar( 'TTablaFiltro' , 'Tabla {D|input_dummy}{TFiltro|field_input|{"text":"Filtrar por..."}{D|input_dummy}cabeza {TEncabezado|input_value|{"check":"CabezaTabla"}cuerpo {TCuerpo|input_value|{"check":"CuerpoTabla"}' , { esStatement: true, color: "#222222", renglones: 2 } , '\n{TEncabezado}{TCuerpo}
    \n', `Inserta una Tabla HTML (table) con la posibilidad de agregar un filtrado - jQueryMobile` ) Agregar( 'TTablaCuerpo' , 'cuerpo {D|input_dummy}{DContenido|input_statement|{"check":"RenglonTabla"}' , { salida: "CuerpoTabla", color: "#333333" } , ['\n{DContenido}\n',0], `Inserta el cuerpo de la tabla (TBody) - Solamente agregar el bloque de Filas` ) Agregar( 'TTablaHeader' , 'cabeza {DContenido|input_value|{"check":"CeldaEncabezado"}' , { salida: "CabezaTabla", color: "#333333" } , ['\n\n{DContenido}\n\n',0], `Solamente agregar bloques de "título"` ) Agregar( 'TRenglon' , 'fila {DContenido|input_value|{"check":"Celda"} atr{DAtributos|input_value|{"check":"atributo"}' , { anterior: "RenglonTabla", siguiente: "RenglonTabla", color: "#444444" } , '\n{DContenido}\n' ) Agregar( `TRenglon2` , `fila {DContenido|field_input|{"text":"1,2,3"} atr {DAtributos|input_value|{"check":"atributo"}` , { anterior: "RenglonTabla", siguiente: "RenglonTabla", color: "#444444" } , function(D){return`${D.DContenido.split(/(\t)/).filter(function(x){return x.trim()}).map(function(x){return `${x}`}).join("")}\n`} ) Agregar( 'TCeldaHeader' , 'título{DCelda|field_input|{"text":"Columna"}{DOtro|input_value|{"check":"CeldaEncabezado"}' , { salida: "CeldaEncabezado", color: "#555555" } , ['{DCelda}{DOtro}',0] ) Agregar( 'TCeldaNormal' , 'celda {DCelda|field_input|{"text":"Valor"}{DOtro|input_value|{"check":"Celda"}atr {DAtributos|input_value|{"check":"atributo"}' , { salida: "Celda", color: "#555555" } , ["{DCelda}{DOtro}",0] ) /* */ $( 'TPTabla' , 'Franja alt. min{DAltura|input_value}quiebre {DQ|field_number|{"number":"700"}{D|input_dummy}{DContenido|input_statement}' , { esStatement: true, color: "#6600DD"} , function(D){ Id = "divisor"+(1000).cualquiera().entero() ; media = "" ; if( D.DQ ) media = `` ; return`${media}
    \n${D.DContenido.replace(/\$\$\$\_\$\$\$/g,function(){ x = D.DContenido.match(/\$\$\$\_\$\$\$/g).length;return x==0?1:1/x*100 })}
    \n`} , `Inserta un DIV con comportamiento de Tabla (display:table) - $ solamente Celdas` ) $( 'TPCelda' , 'Celda {D|input_dummy}{DContenido|input_statement}' , { esStatement: true, color: "#6600DD" } , `
    \n{DContenido}
    \n` , `Inserta un DIV con comportamiento de Celda de una tabla (display:table-cell) - El ancho se regula automáticamente según la cantidad de celdas que se agreguen a la tabla` ) Agregar( 'TTabla' , 'Tabla {D|input_dummy}cabeza {TEncabezado|input_value|{"check":"CabezaTabla"}cuerpo {TCuerpo|input_value|{"check":"CuerpoTabla"} {D|input_dummy}jExcel{DEx|field_checkbox}' , { esStatement: true, color: "#222222", renglones: 2 } , function(D){id="tabla"+(1000).cualquiera().entero();return`${D.TEncabezado}${D.TCuerpo}
    ${D.DEx=="TRUE"?``:""}\n`}, 'Inserta una Tabla HTML (table)' ); Agregar( `TTablaOnline` , `Tabla online desde URL {DUrl|input_value}Formato {DFormato|field_dropdown|{"options":[["TSV","tsv"],["CSV con coma","csvc"],["CSV con punto y coma","csvpc"]]}cada {DPaginacion|field_number}{D|input_dummy}¿jExcel?{DEx|field_checkbox}¿Barras?{DBarras|field_checkbox}` , { esStatement: true, color: "#333333", renglones: 2 } , function(D){ id = "tablaol" + (1024).cualquiera().entero() ; return`
    Descargando datos... aguarde...
    \n` } ) Agregar( 'TTabla2' , `Tabla {DFiltro|field_text|{"text":"Filtrar por..."}{D|input_dummy}encabezado {DEncabezado|field_input|{"text":"Id//number,Nombre,Edad//number,Domicilio,Porciento//percent"}{D|input_dummy}cuerpo{D|input_dummy}{TCuerpo|input_statement|{"check":"RenglonTabla"}jExcel{DEx|field_checkbox}` , { esStatement: true, color: "#222222", renglones: 2 } , function(D){id="tabla"+(1000).cualquiera().entero();return `${D.DEncabezado.split(",").map(function(x){return ``}).join("")}${D.TCuerpo}
    -1?`data-type="${x.split("//")[1]}"`:""} >${x.split("//")[0]}
    ${D.DEx=="TRUE"?``:``}\n`} ) Agregar( 'TTablaFiltro' , 'Tabla {D|input_dummy}{TFiltro|field_input|{"text":"Filtrar por..."}{D|input_dummy}cabeza {TEncabezado|input_value|{"check":"CabezaTabla"}cuerpo {TCuerpo|input_value|{"check":"CuerpoTabla"}' , { esStatement: true, color: "#222222", renglones: 2 } , '\n{TEncabezado}{TCuerpo}
    \n', `Inserta una Tabla HTML (table) con la posibilidad de agregar un filtrado - jQueryMobile` ) Agregar( 'TTablaCuerpo' , 'cuerpo {D|input_dummy}{DContenido|input_statement|{"check":"RenglonTabla"}' , { salida: "CuerpoTabla", color: "#333333" } , ['\n{DContenido}\n',0], `Inserta el cuerpo de la tabla (TBody) - Solamente agregar el bloque de Filas` ) Agregar( 'TTablaHeader' , 'cabeza {DContenido|input_value|{"check":"CeldaEncabezado"}' , { salida: "CabezaTabla", color: "#333333" } , ['\n\n{DContenido}\n\n',0], `Solamente agregar bloques de "título"` ) Agregar( 'TRenglon' , 'fila {DContenido|input_value|{"check":"Celda"} atr{DAtributos|input_value|{"check":"atributo"}' , { anterior: "RenglonTabla", siguiente: "RenglonTabla", color: "#444444" } , '\n{DContenido}\n' ) Agregar( `TRenglon2` , `fila {DContenido|field_input|{"text":"1,2,3"} atr {DAtributos|input_value|{"check":"atributo"}` , { anterior: "RenglonTabla", siguiente: "RenglonTabla", color: "#444444" } , function(D){return`${D.DContenido.split(/(\t)/).filter(function(x){return x.trim()}).map(function(x){return `${x}`}).join("")}\n`} ) Agregar( 'TCeldaHeader' , 'título{DCelda|field_input|{"text":"Columna"}{DOtro|input_value|{"check":"CeldaEncabezado"}' , { salida: "CeldaEncabezado", color: "#555555" } , ['{DCelda}{DOtro}',0] ) Agregar( 'TCeldaNormal' , 'celda {DCelda|field_input|{"text":"Valor"}{DOtro|input_value|{"check":"Celda"}atr {DAtributos|input_value|{"check":"atributo"}' , { salida: "Celda", color: "#555555" } , ["{DCelda}{DOtro}",0] ) // --------------------------------------------------[ /JEXCEL ] $( 'TArriba' , 'para volver arriba de todo' , { salida: true, color: "#CC0044" } , function(D){return [` onclick='window.scrollTo({top:0,behavior:"smooth"})' `,0]} , `Permite que el botón lleve al usuario hacia el principio de la pantalla` ) $( 'TAjax' , 'Pegar de url {DUrl|input_value} {DArriba|field_checkbox}' , { esStatement: true, color: "blue" } , function(D) { r = (1000).cualquiera().entero() ; rr = `
    ` console.log(rr) return rr } ) $( 'TAjaxLista' , 'Lista {DTexto|field_input|{"text":"Filtrar por..."} autofiltrar {DAuto|field_checkbox} reordenable {DReordenable|field_checkbox}'+ATRIBUTOS+' que proviene de {DUrl|field_input|{"text":"https://abc.com"}' , { esStatement: true, color: "#990000", renglones: 2 } , function (D) { D.Filtro = (D.DTexto.trim()) ? ' data-filter="true" data-filter-placeholder="'+D.DTexto+'"' : "" ; G = (1000).cualquiera().entero() ; D.DId = "ajaxeado"+G ; D.Ordenable = D.DReordenable == "TRUE" ? `` : "" return `
      \n
    \n\n` }, `AJAX hacia un conjunto de
  • con las normas de jQueryMobile` ) $( 'TJQM' , 'Aplicación tema '+TEMAPPAL+'{D|input_value}{DContenido|input_statement}' , { color: "#0056CC" } , function(D){ function VERIF(s){return D.DContenido.indexOf(s)>-1}return` Document ${ D.DTema !== "flq" && D.DTema !== "flr" && D.DTema !== "btsp" && D.DTema !=="glass" && D.DTema !== "" ? '':''} ${ D.DTema === "flq" ? '':'' } ${ D.DTema === "flr" ? '': ''} ${ D.DTema === "btsp" ? '': ''} ${ D.DTema === "glass" ? '': ''} ${D.DTema !== "flq" && D.DTema !== "flr" && D.DTema !== "" ? '':''} ${VERIF("gcompo")?``:""} ${VERIF("data-aos")?``:``} ${VERIF("a-scene")?'':""} ${VERIF("swiper-slide") ? '':''} ${VERIF("qqr") ? '':''} ${VERIF("barcode")?``:``} ${VERIF("dragula") ? '':''} ${VERIF("Escena3d") ? '':''} ${VERIF("jexcel")?'':''} ${VERIF("ibro3d") ? '':''} ${VERIF('class="temporal"') ? ``:""} ${VERIF('class="globo-chat"') ? ``:""} ${VERIF('drawrcanvas')?``:""} ${VERIF("zooming")?``:""} ${VERIF("brzslider")?``:``} ${VERIF("minimundo")?``:""} ${VERIF("tinymce")?``:""} ${VERIF("mv-")?` `: ``} ${VERIF("slizer")?``:``} ${VERIF("microlight")?``:``} ${VERIF("jyst")?``:``} ${VERIF("zocial")?``:``} ${VERIF("data-conv")?``:``} ${VERIF("Nightly")?``:``} ${VERIF("ph-item")?``:``} ${VERIF("skeleton")?``:``} ${VERIF("spoiler")?``:``} ${VERIF("blurrear")?``:``} ${VERIF("new zeu.")?``:``} ${VERIF("jhere")?``:``} ${VERIF("wheelnav")?` `:``} ${VERIF("rough")?``:``} ${VERIF("webcamjs")?``:``} ${VERIF("minipreview")?``:``} ${VERIF("annyang")?` `:``} ${VERIF("HayVoz")?``:``} ${VERIF("koiAnimation")?``:``} ${VERIF("mmenu")?` `:``} ${VERIF("vuejs")?``: ``} ${D.DContenido} ${VERIF("data-editable") ? '':''} ${VERIF("data-tilt") ? '':''} ${VERIF("zooming")?``:""} ${VERIF("grafiquito-")?'':''} ${VERIF("brzslider")?``:""} ${VERIF("data-aos")?``:``} ${VERIF("data-anijs")?``:``} `.replace(/\n\n/g,"") } , 'Este componente debe ser el primero en ubicarse en el área de trabajo' ) $( 'TRol' , 'rol {DRol|field_input}{DOtro|input_value}' , { salida: true, color: "blue" } , [' data-role="{DRol}"{DOtro}',0] ) $( 'TTinyMCE' , 'Editor TinyMCE enriquecido id {DId|field_input|{"text":"idEditor1"} {D|input_dummy}{DContenido|input_statement}' , { esStatement: true, color: "#" } , function(D){id = D.DId || ("editor"+(1000).cualquiera().entero());return `\n` } ) $( 'TPagina' , 'Página id {DId|field_variable|{"variable":"idPagina1","variableTypes":["idPagina"],"defaultType":"idPagina"}'+TEMA+'{DAtributos|input_value}{DContenido|input_statement}/Página' , { esStatement: true, color: "#00CC99" } , '
    \n{DContenido}
    \n' ) $( 'TDialogo' , 'Cuadro de diálogo id {DId|field_variable|{"variable":"idPagina1"}'+TEMA+'{DAtributos|input_value}{DContenido|input_statement}' , { esStatement: true, color: "#00CC99" } , '
    \n{DContenido}
    \n' ) $( 'TEncabezado' , 'Encabezado '+ATRIBUTOS+' {DContenido|input_statement}/Encabezado' , { esStatement: true, color: "#0056DD", renglones: 2 } , '
    \n{DContenido}
    \n' ) $( 'TPie' , 'Pie de página ¿fijo?{DFijo|field_checkbox}'+ATRIBUTOS+' {DContenido|input_statement}/Pie' , { esStatement: true, color: "#0056CC", renglones: 2 } , function(D){return`
    \n${D.DContenido}
    \n`} ) $( 'TContenido' , 'Contenido '+ATRIBUTOS+' {DContenido|input_statement}/Contenido' , { esStatement: true, color: "#0056CC", renglones: 2 } , '
    \n{DContenido}
    \n' ) $( 'TPanel' , 'Panel lateral id{DId|field_variable|{"variable":"idPanel1"} a la {DLugar|field_dropdown|{"options":[["izquierda","left"],["derecha","right"], ["abajo","bottom"]]} '+ATRIBUTOS+' {DContenido|input_statement}/Panel' , { esStatement: true, color: "#00CCCC", renglones: 2 } , function(D){ //if( /header(.*?)data-position\=/.test(D.DContenido) ) D.DContenido = D.DContenido.replace( 'data-position="fixed"', "" ) return '\n'.procesar(D) } ) $( 'TNavegador' , 'Barra de navegación '+ATRIBUTOS+' {DContenido|input_statement}/Navegación' , { esStatement: true, color: "#660000", renglones: 2 } , '\n' ) $( 'TListadoFiltrador' , 'Lista {DTexto|field_input|{"text":"Filtrar por..."} autofiltrar {DAuto|field_checkbox} reordenable {DReordenable|field_checkbox} números{DNumeros|field_checkbox}'+ATRIBUTOS+' {DContenido|input_statement}/TListado' , { esStatement: true, color: "#990000", renglones: 2 } , function (D) { D.Filtro = (D.DTexto.trim()) ? ' data-filter="true" data-filter-placeholder="'+D.DTexto+'"' : "" ; G = (1000).cualquiera().entero() ; D.DId = "listado"+G ; DNumeros = D.DNumeros=="TRUE" ? "ol" : "ul"; D.Ordenable = D.DReordenable == "TRUE" ? `` : "" return `<${DNumeros} data-role="listview" data-inset="true" data-autodividers="${D.DAuto=="TRUE"?"true":"false"}" id="{DId}" {Filtro} {DAtributos} >\n{DContenido}\n{Ordenable}\n`.procesar(D) } , `Permite generar listados interactivos, incluso con filtro. Dentro se colocan directamente bloques de "Item" (rojo) - Original de jQueryMobile` ) // -------------------------------------------------- ITEMS $( 'TToast' , `Cartel abajo {DDisparador|field_input|{"text":"Haceme click"}{D|input_dummy} Mensaje {DMensaje|input_value} Botón {DBoton|input_value} Color botón{DColor|input_value} Duración {DSegundos|field_number} ` , { esStatement: true, color: "red", renglones:2 } , `{DDisparador}\n` ) $( 'TItem' , 'Ítem '+ATRIBUTOS+' {DContenido|input_statement}' , { esStatement: true, color: "#990000", renglones: 2 } , function (D) { if( D.DAtributos.indexOf("hacia=")>-1 ) { Destino = D.DAtributos.match(/hacia="(.*?)"/)[1] ; DTarget=""; if( Destino.substr(0,1)!="#" && Destino.substr(0,4)=="http" ) ;//DTarget = 'target="_blank"' ; DIcono = "" ; if( D.DAtributos.indexOf("icono=")>-1 ) { Icono = D.DAtributos.match(/icono="(.*?)"/)[1] ; DIcono = ' data-icon="'+Icono+'" ' } D.DContenido = ''+D.DContenido+'' ; console.log(D.DContenido) } return '
  • {DContenido}
    • \n'.procesar(D) } ) $( 'TFondo' , 'Fondo {HREF|input_value}' , { salida: true, color: "#550080"} , [' style="background:{HREF};background-size:cover;background-position:center center"',0] , `$ un background; solamente acoplar o bien un degradé de colores o bien un objeto de URL de imagen` ) $( 'TFondoGradiente' , 'gradiente entre {DC1|field_colour} y {DC2|field_colour}' , { salida: true, color: "#880090" } , ['linear-gradient(45deg, {DC1}, {DC2})',0] ) $( 'TFondoRuta' , 'ruta acceso {DRuta|field_input|{"text":"https://picsum.photos/600/400"}' , { salida: true, color: "#880090" } , ['url({DRuta})',0] ); $( 'TFondoRuta2' , `ruta acceso {DRuta|field_input|{"text":"https://placeimg.com/640/480/any"}` , { salida: true, color: "#880090" } , ['url({DRuta})',0] ) $( 'TFondoRuta3' , `ruta acceso http://placehold.jp tamaño {DRuta|field_input|{"text":"640x480"} fondo {DFondo|field_colour} letra {DLetra|field_colour} formato {DFormato|field_dropdown|{"options":[["JPG","jpg"],["PNG","png"]]}` , { salida: true, color: "#880090" } , ['url(http://placehold.jp/{[DFondo].substr(1)}/{[DLetra].substr(1)}/{DRuta}.{DFormato})',0] ); $( 'TFondoRuta4' , `ruta acceso {DRuta|field_input|{"text":"https://www.fillmurray.com/g/200/300"}` , { salida: true, color: "#880090" } , ['url({DRuta})',0] ) $( 'TFondoRuta5' , `ruta acceso {DRuta|field_input|{"text":"https://www.placecage.com/g/200/300"}` , { salida: true, color: "#880090" } , ['url({DRuta})',0] ) $( 'TFondoRuta6' , `ruta acceso {DRuta|field_input|{"text":"http://placekitten.com/200/300"}` , { salida: true, color: "#880090" } , ['url({DRuta})',0] ) $( 'TFondoRuta7' , `ruta acceso {DRuta|field_input|{"text":"https://place-puppy.com/300x300"}` , { salida: true, color: "#880090" } , ['url({DRuta})',0] ) $( 'TItemSeparador' , 'Ítem separador {DTexto|input_value}' , { esStatement:true, color: "#990000" } , '
  • {DTexto}
    • \n' ) $( 'TIconPos' , 'Posición ícono {DPosicion|field_dropdown|{"options":[["Sin texto","notext"],["Arriba","top"],["Abajo","bottom"],["Izquierda","left"],["Derecha","right"]]}{DOtro|input_value}' , { salida: true, color: "#771100" } , [' data-iconpos="{DPosicion}"{DOtro}',0] ) $( 'TTransicion' , 'Transición {DTransicion|field_dropdown|{"options":[ ["Saltar","pop"], ["Mazo","flow"], ["Aparecer","fade"], ["Dar vuelta","flip"], ["Turnar página","turn"], ["Deslizar de costado","slide"], ["Deslizar hacia arriba","slideup"], ["Deslizar hacia abajo","slidedown"] ]}{DOtro|input_value}' , { salida: "transicion", color: "#771111" } , [' data-transition="{DTransicion}"{DOtro}',0] ) $( 'TIcono' , 'Ícono {DIcono|field_dropdown|{'+JSON.stringify({ options: ( function() { return [ "Acción.action" , "Alerta.alert" , "Configuración.gear" , "Inicio.home" , "Abajo.arrow-d" , "Arriba.arrow-u" , "Izquierda.arrow-l" , "Derecha.arrow-r" , "Parlante.sound" , "Barras.bars" , "Atras.back" , "Listado.bullets" , "Almanaque.calendar" , "Cámara.camera" , "Desplegar abajo.carat-d" , "Chequear.check" , "Reloj.clock" , "Nube.cloud" , "Comentario.comment" , "Ojo.eye" , "Borrar.delete" , "Prohibido.forbidden" , "Adelante.forward" , "Grilla.grid" , "Corazón.heart" , "Información.info" , "Ubicación.location" , "Candado.lock" , "Menos.minus" , "Correo.mail" , "Teléfono.phone" , "Buscar.search" , "Estrella.star" , "Etiqueta.tag" , "Persona.user" ].map(function(x){ return [x.split(".")[0], x.split(".")[1]] }) } )() }).slice(1,-1)+'}{DOtro|input_value}' , { salida: true, color: "#771111" } , [' icono="{DIcono}"{DOtro}',0] ) $( 'THaciaLink' , 'hacia {DTexto|field_input|{"text":"https://"}{DOtro|input_value}' , { salida: true, color: "#CC0011" } , [' hacia="{DTexto}"{DOtro}',0] ) $( 'THaciaId' , 'hacia id {DId|field_variable|{"variable":"idPagina1"}{DOtro|input_value}' , { salida: true, color: "#CC0011" } , [' hacia="#{DId}"{DOtro}',0] ) $( 'TDataInset' , 'pequeño{DOtros|input_value}' , { salida: true, color: "red" } , [' data-inset="true"{DOtros}',0] ) $( 'TGrupo' , 'Agrupados ¿Horizontal{DHoriz|field_checkbox}?{DAtributos|input_value} {DContenido|input_statement}/Agrupados' , { esStatement: true, color: "#0022CC", renglones: 2 } , '
    \n{DContenido}
    \n' ) $( 'TTarjeto' , `Con sombra {DOtro|input_value}` , { salida: "atributo", color: "blue" } , [` tiene-sombra {DOtro}\n`,0] ) $( `TFixedDiv` , `Flotante arr {DArr|field_checkbox}{DTop|field_number}` + `abj {DAbj|field_checkbox}{DBottom|field_number}` + `der {DDer|field_checkbox}{DRight|field_number}` + `izq {DIzq|field_checkbox}{DLeft|field_number}` + `{D|input_dummy}{DContenido|input_statement}/Flotante` , { esStatement: true, color: "#550080" } , function(D){return`
    ${D.DContenido}
    \n`} ) $( `TMocka` , `Objeto cargándose` , { esStatement: true, color: "black" } , `
    ` , `Genera una representación de relleno mientras se descargan los datos - Uso de Placeholder Items` ) $( `BSpoiler` , `tapar difuminado {DOtro|input_value}` , { salida: "atributo", color: "black" } , [` hacerle-spoiler {DOtro}`,0] ) $( `BBlurrear` , ` blurrear {DOtro|input_value}` , { salida: "atributo", color: "black" } , [` blurrear {DOtro}`,0] ) $( `TPlaceholder` , `Gráfico de Objetos cargándose{D|input_dummy}Efecto para ver {DEfecto|field_dropdown|{"options":[ ["párrafos","line"],["bloque de contenido","rect"],["perfil de usuario","circle-multi-line"], ["gráfico de barras","chart-columns"], ["gráfico de líneas","chart-line"], ["tarjeta","card-1"], ["video de YouTube","youtube"], ["lista","list"], ["imagen","image"] ]}` , { esStatement: true, color: "black" } , function(D){return`
    `} , `Genera una representación de relleno mientras se descargan los datos - Uso de CSS Skeletons` ) $( "BFullScreen" ,` intentar pantalla completa {DOtro|input_value}` , { salida: "atributo", color: "black" } , [ ` onclick="if(!document.fullscreenElement) document.documentElement.requestFullscreen();else if (document.exitFullscreen)document.exitFullscreen()" {DOtro}`,0] ) $( `BDarkmode` , ` cambia el modo oscuro {DOtro|input_value}` , { salida: "atributo", color: "black" } , [` onclick="(new Nightly()).toggle();console.log('Cambio de modo')" {DOtro}`,0] ) $( `BTerminar` , ` intenta cerrar la ventana` , { salida: "atributo", color: "black" } , [ ` onclick="window.close()" `,0 ] ) $( 'TBoton' , 'Botón {DInset|field_checkbox}'+ATRIBUTOS+'texto{DContenido|input_value|{"check":"String"}' , { esStatement: true, color: "red" } , function (D) { /*if( D.DAtributos.indexOf("hacia=")>-1 ) { Destino = D.DAtributos.match(/hacia="(.*?)"/)[1] ; DTarget=""; if( Destino.substr(0,1)!="#" && Destino.substr(0,4)=="http" ) DTarget = 'target="_blank"' ; DIcono = "" ; if( D.DAtributos.indexOf("icono=")>-1 ) { Icono = D.DAtributos.match(/icono="(.*?)"/)[1] ; DIcono = ' data-icon="'+Icono+'"' } D.DContenido = ''+D.DContenido+'' ; console.log(D.DContenido) }*/ D.DAtributos = D.DAtributos.replace( "hacia", 'href' ).replace("icono", 'data-icon') return '{DContenido}\n'.procesar(D) } ) $( 'TEsDialogo' , 'es diálogo {DOtro|input_value}' , { salida: true, color: "red" } , [ ' data-rel="popup"{DOtro}',0 ] ) $( 'TTilt' , 'inclinable {DEscala|field_number|{"number":"1.0"}{DOtro|input_value}' , { salida: true, color: "#FF00DD" } , [' data-tilt="true" data-tilt-scale="{[DEscala]||1}" data-til-gyroscope="true" {DOtro}',0] ) $( 'TEditable' , 'Lista editable título {DTitulo|field_input|{"text":"Editame"} {DTexto|field_input|{"text":"Filtrar por..."} '+ATRIBUTOS+' {DContenido|input_statement}/TListado' , { esStatement: true, color: "#990000", renglones: 2 } , function (D) { D.Filtro = (D.DTexto.trim()) ? ' data-filter="true" data-filter-placeholder="'+D.DTexto+'"' : "" ; G = (1000).cualquiera().entero() ; return `
      ${D.DContenido}
    ` }) $( 'TItems' , 'Items {DTexto|input_value}' , { esStatement: true, color: "#990000" } , function(D) { return ( D .DTexto .split(",") .map(function(x){ s = x.split(x.indexOf("=>")?"=>":":") ; console.log(s) a = s[0] ; b = s[1] ; if( b===undefined ) return `
  • ${a}
    • \n` ; return `
  • ${a}
    • \n` ; }) .join("") ) } ) $( 'TEsCerrar' , 'para cerrar diálogo {DOtro|input_value}' , { salida: true, color: "red" } , [ ' data-rel="close"',0 ] ) $( 'TEsAtras' , 'para volver atrás {DOtro|input_value}' , { salida: true, color: "red" } , [ ' data-rel="back"',0 ] ) // ------------------------------------------------- Organización $( 'TAlinear' , 'Alinear {DModo|field_dropdown|{"options":[["Izquierda","left"],["Centrado","center"],["Derecha","right"],["Justificado","justify"]]} {DAtributos|input_value}{DContenido|input_statement}' , { esStatement: true, color: "#006611" } , `
    \n{DContenido}
    \n` ) $( 'TCentrado' , 'Centrado {A|input_dummy}{D|input_statement}' , { esStatement: true, color: "#006611" } , '
    \n{D}
    \n' ) $(`BCentrado`, `centrado {DOtro|input_value}`, {salida:"atributo",color:"#006611"}, [` centrado {DOtro}`,0]) $(`BIzquierda`, `a la izquierda {DOtro|input_value}`, {salida:"atributo",color:"#006611"}, [` izquierda {DOtro}`,0]) $(`BDerecha`, `a la derecha {DOtro|input_value}`, {salida:"atributo",color:"#006611"}, [` derecha {DOtro}`,0]) $(`BJustificado`, `justificado {DOtro|input_value}`, {salida:"atributo",color:"#006611"}, [` justificado {DOtro}`,0]) $(`BTachado`, `tachado {DOtro|input_value}`, {salida:"atributo",color:"#006611"}, [` tachado {DOtro}`,0]) $(`BEnNegrita`, `en negrita {DOtro|input_value}`, {salida:"atributo",color:"#006611"}, [` en-negrita {DOtro}`,0]) $(`BEnCursiva`, `en cursiva {DOtro|input_value}`, {salida:"atributo",color:"#006611"}, [` en-cursiva {DOtro}`,0]) $( 'TDerecha' , 'A la derecha {A|input_dummy}{D|input_statement}' , { esStatement: true, color: "#006611" } , '
    \n{D}
    \n' ) $( 'TJustificado' , 'Justificado {A|input_dummy}{D|input_statement}' , { esStatement: true, color: "#006611" } , '
    \n{D}
    \n' ) // ------------------------------------------------- $( 'TPopup' , 'Popup id {DId|field_variable|{"variable":"idPopup1"}{D|input_dummy} {DContenido|input_statement}' , { esStatement: true, color: "#33cccc" } , '
    \n{DContenido}
    \n' ) $( "TColapsable", 'Colapsable {DAtributos|input_value}Título {DTitulo|field_input|{"text":"Soy el título"} {D|input_dummy}{DContenido|input_statement}/Colapsable' , {esStatement:true, color: "#33cc88", renglones: 2} , "
    \n

    {DTitulo}

    \n{DContenido}
    " ) $( "TColapsableSet", 'Acordeón de colapsables {D|input_dummy}{DAtributos|input_field}{DContenido|input_statement}/Colapsables' , {esStatement:true, color: "#33cc88", renglones: 2} , "
    \n{DContenido}
    " ) // -------------------------------------------------[ FORMULARIOS ] $("TFormulario", 'Formulario Método:{DMethod|field_dropdown|{"options":[["GET","get"],["POST","post"]]}Destino:{DAction|input_value}¿Es chatbot? {DConv|field_checkbox}{D|input_dummy}{DContenido|input_statement}/Formulario', {esStatement:true,color:"#333300", renglones:2},function(D){id="formu"+(1000).cualquiera().entero();return (D.DConv==="TRUE"?"
    ":"")+'
    \n{DContenido}
    `.procesar(D)+(D.DConv==="TRUE"?`
    `:"")}) $( `BChatbot` , `bot conversa {DConv|field_input|{"text":"Decime ABC"}` , { salida: "atributo", color: "#CC0011" } , [ " data-conv-question='{DConv}' {DOtro}",0 ] ) $( `BChatbotPatern` , `patron {DConv|field_input|{"text":"si|sí|no"}` , { salida: "atributo", color: "#CC0011" } , [ " data-pattern='{DConv}' {DOtro}",0 ] ) $('THr', 'División horizontal -------------', {esStatement: true,color:"black"}, '
    \n') $( 'TCount' , 'Contar {DTexto|input_value}' , { esStatement: true, color: "green" } , '{DTexto}' ) $( 'TSlizer' , 'Fondo panorámico deslizable {DAltura|field_input|{"text":"40vh"} imagen {DUrl|input_value} ¿vertical? {DVertical|field_checkbox} Tiempo {DTiempo|field_number}' , {esStatement: true, color: "#DD00DD", renglones:2 } , function(D){ xID = "slizer"+(1000).cualquiera().entero() ; return `
     
    \n` } , 'Este fondo será animado de un lado a otro (vertical u horizontal) - Uso de librería Slizer' ) $( `TCampoL` , `Campo id {DId|field_variable|{"variable":"NombreCampo","variableTypes":["idForm"], "defaultType":"idForm"} atr. `+ATRIBUTOS+`¿nm e id?{DEspecial|field_checkbox} Valor inicial:{DValorIni|input_value}de tipo {DTipo|field_dropdown|{"options":[["Texto","text"],["E-mail","email"],["URL","url"],["Contraseña","password"],["Teléfono","tel"],["Buscar","search"],["Área de texto","textarea"],["Color","color"],["Número","number"],["Deslizador","range"],["Rotativo","spinner"],["Fecha","date"],["Mes del año","month"],["Semana del año","week"],["Hora","time"], ["Fecha y hora","datetime"],["Fecha y hora local","datetime-local"]]} con el mensaje {DReplicaMensaje|field_checkbox}: {DTitulo|input_value} Ayuda/guía {DReplicaGuia|field_checkbox}:{DAyuda|input_value}` , {esStatement: true, color: "#223322", renglones:2} , function(D){ D.DAutofoco = D.DAutofoco == "TRUE" ? "autofocus":"" ; D.nm = D.DEspecial === "TRUE" ? "nm":"" D.id = D.DEspecial === "TRUE" ? "id":"" return `
    \n\n${D.DTipo=="textarea" ?`` :``}\n
    `.procesar(D) ; } ) $( "TCampo" , 'Campo id {DId|field_variable|{"variable":"NombreCampo","variableTypes":["idForm"],"defaultType":"idForm"} atr.'+ATRIBUTOS+'¿nm e id?{DEspecial|field_checkbox} {D|input_dummy}de tipo {DTipo|field_dropdown|{"options":[["Texto","text"],["E-mail","email"],["URL","url"],["Contraseña","password"],["Teléfono","tel"],["Buscar","search"],["Área de texto","textarea"],["Color","color"]]} con el mensaje{DTitulo|input_value}Ayuda/guía {DAyuda|input_value}' , { esStatement: true, color: "#333322", renglones: 2} , function(D){ D.DAutofoco = D.DAutofoco == "TRUE" ? "autofocus":"" ; D.nm = D.DEspecial === "TRUE" ? "nm":"" D.id = D.DEspecial === "TRUE" ? "id":"" if( D.DTipo == "textarea" ) return "
    \n\n\n
    ".procesar(D); return "
    \n\n\n
    \n".procesar(D) } ) $( "TCampoNum" , 'Campo numérico id {DId|field_variable|{"variable":"NombreNumerico","variableTypes":["idForm"],"defaultType":"idForm"}'+ATRIBUTOS+'¿nm e id?{DEspecial|field_checkbox} {D|input_dummy}de tipo {DTipo|field_dropdown|{"options":[["Número","number"],["Deslizador","range"],["Rotativo","spinner"],["Fecha","date"],["Mes del año","month"],["Semana del año","week"],["Hora","time"], ["Fecha y hora","datetime"],["Fecha y hora local","datetime-local"]]} con el mensaje{DTitulo|input_value}Ayuda/guía {DAyuda|input_value}Mínimo {DMin|field_number}Máximo {DMax|field_number}Paso/salto{DStep|field_number}' , { esStatement: true, color: "#333322", renglones: 2} , function(D){ D.DAutofoco = D.DAutofoco == "TRUE" ? "autofocus":"" ; D.Spinner = D.DTipo == "spinner" ? ' data-role="spinbox" data-options=\'{"type":"horizontal"}\'' : "" ; D.DTipo = D.DTipo == "spinner" ? 'text' : D.DTipo ; return ("
    \n\n\n
    \n").procesar(D) } ) $( 'TSwitch' , 'Switch id {DId|field_variable|{"variable":"NombreCampo", "variableTypes":["idForm"],"defaultType":"idForm"} {D|input_dummy}Apagado {DApagado|input_value}valor {DValorApagado|input_value} Prendido {DPrendido|input_value} valor {DValorPrendido|input_value}' , { esStatement: true, color: "#CC0044" } , function(D){ return ( '\n" ) } ) $( 'TSwitchCampo' , 'Switch id {DId|field_variable|{"variable":"NombreCampo", "variableTypes":["idForm"],"defaultType":"idForm"} {D|input_dummy}Mensaje {DMensaje|input_value}Apagado {DApagado|input_value}valor {DValorApagado|input_value} Prendido {DPrendido|input_value} valor {DValorPrendido|input_value}' , { esStatement: true, color: "#CC0044" } , function(D){ return ( '
    \n\n
    \n" ) } ) $( 'TSelect' , 'Desplegable id {DId|field_variable|{"variable":"NombreCampo", "variableTypes":["idForm"],"defaultType":"idForm"}¿nativo{DNativo|field_checkbox}?{DAtributos|input_value} {DOpciones|input_statement}/Desplegable' , { esStatement: true, color: "#CC0044", renglones:2 } , function(D){ return ( '\n'.procesar(D) + D.DOpciones.replace( /\
  • \n\n" ) } ) $( 'TCheck' , 'Chequear id {DId|input_variable|{"variable":"idCheck1","variableTypes":["chequeo"],"defaultType":"chequeo"} texto: {DTexto|input_value}atr.{DAtributos|input_value|{"check":"atributo"}¿Tarea?{DTachado|field_checkbox}' , { esStatement: true, color: "#CC0011" } , function(D){return `\n`} ) $( 'TCheckList' , 'Lista de chequeo id {DId|field_variable|{"text":"idListaCheck1"} ¿Horiz.?{DHoriz|field_checkbox}Mensaje:{DMensaje|field_input|{"text":"Seleccioná"}{D|input_dummy}{DContenido|input_statement}' , { esStatement: true, color: "#CC0011" } , function(D){ D.DContenido = D.DContenido.replace( /\/g, function(a,b){ console.log(a, b) ; return '" ) return ( '
    \n{DMensaje}\n
    \n{DContenido}
    \n
    \n' .procesar(D) ) } ) $( 'TOptList' , 'Lista de opciones id {DId|field_variable|{"text":"idListaCheck1"} ¿Horiz.?{DHoriz|field_checkbox}Mensaje:{DMensaje|field_input|{"text":"Seleccioná"}{D|input_dummy}{DContenido|input_statement}' , { esStatement: true, color: "#CC0011" } , function(D){ D.DContenido = D.DContenido.replace( /\/g, function(a,b,c){ console.log(1000,a, b,c) ; return '" ) return ( '
    \n{DMensaje}\n
    \n{DContenido}
    \n
    \n' .procesar(D) ) } ) $( 'TSubmit' , 'Enviar {DTitulo|field_input|{"text":"Enviar formulario"}' , { esStatement:true, color:"#CC0011" } , `` ) $( 'TReset' , 'Reiniciar {DTitulo|field_input|{"text":"Borrar campos"}' , { esStatement:true, color:"#CC0011" } , `` ) $( 'TAutoFoco' , 'Éste primero{DOtro|input_value}' , { salida: true, color: "#CC0011" } , [' autofocus="true"{DOtro}',0] ) $( 'TValue' , 'valor inicial {DValor|field_input}{DOtro|input_value}' , { salida: true, color: "#CC0011" } , [' value="{DValor}"',0] ) $( `BNumerico` , `mínimo: {DMinimo|field_input|{"value":"-10"} ` +`máximo: {DMaximo|field_input|{"value":"100"} ` +`paso: {DPaso|field_input|{"value":"0.25"}` , {salida: true, color: "#CC0011"} , function(D){return[` ${D.DMinimo==""?"":` min="${parseFloat(D.DMinimo)}"`} ${D.DMaximo==""?"":` max="${parseFloat(D.DMaximo)}"`} ${D.DPaso==""?"":` step="${parseFloat(D.DPaso)}"`}"`,0]} ) $( 'TDisabled' , 'está deshabilitado{DOtro|input_value}' , { salida: true, color: "#CC0011" } , [' disabled {DOtro}',0] ) $( 'TSelected' , 'está seleccionado{DOtro|input_value}' , { salida: true, color: "#CC0011" } , [' selected {DOtro}',0] ) $( 'TRequired' , 'es obligatorio{DOtro|input_value}' , { salida: true, color: "#CC0011" } , [' required {DOtro}',0] ) // -------------------------------------------------[ /FORMULARIOS ] // ------------------------------------------------- Textos y mensajes $( 'TLorem' , 'Texto de Relleno palabras {DPalabras|field_number} desordenadas {DDesor|field_checkbox}{DOtro|input_value}' , { salida: "String", color: "green" } , function(D){$ = "Lorem ipsum dolor sit amet consectetur adipiscing elit massa torquent libero, suscipit euismod fringilla magna scelerisque metus taciti ultricies vehicula in, tempus enim cras inceptos congue sem ornare gravida ante. Integer interdum dignissim tellus maecenas sodales mollis leo nunc, habitant sociis pretium feugiat lacus curae blandit, inceptos morbi iaculis gravida sollicitudin vestibulum dictum. Senectus fames proin sollicitudin mollis nostra auctor mus porttitor cursus orci, etiam quam condimentum molestie imperdiet accumsan torquent et arcu".split(" "); if( D.DDesor == "TRUE" ) $ = $.sort(function(a,b){return (2).cualquiera().entero()-1}) return [ $.slice(0,+(D.DPalabras).absoluto()||50).join(" ")+".", 0 ]} ) $( 'TParrafo' , 'Párrafo {B|input_dummy}{DAlinea|field_dropdown|{"options":[["izquierda","izquierda"],["derecha","derecha"],["centrado","centrado"],["justificado","justificado"]]}{DTexto|input_value}atributos:{DAtributos|input_value|{"check":"atributo"}' , { esStatement: true, color: "green" } , '

    {DTexto}

    \n' ) $( 'THttp' , 'url ¿es segura{DSegura|field_checkbox}? {DHttp|field_input|{"text":"gorosito.red/abc"}' , { salida: true, color: "#11CC22" } , ['http{[DSegura]=="TRUE"?"s":""}://{DHttp}',0] ) $( 'TTexto' , 'Texto suelto {DTexto|input_value}' , { esStatement: true, color: "green" } , '{DTexto}\n' ) $( 'TTitulo' , 'Título H{DNivel|field_dropdown|{"options":[["1","1"],["2","2"],["3","3"]]} {B|input_dummy}{DAlinea|field_dropdown|{"options":[["izquierda","izquierda"],["derecha","derecha"],["centrado","centrado"],["justificado","justificado"]]}{DTexto|input_value}atributos:{DAtributos|input_value|{"check":"atributo"}' , { esStatement: true, color: "green" } , '\n{DTexto}\n' ) $( 'TBlockquote' , `Cita textual {DAtributos|input_value|{"check":"atributo"}{DTexto|input_statement}` , { esStatement: true, color: "green", renglones:2 } , `
    {DTexto}
    \n` ) $( 'BFrase' , 'texto {DTexto|field_input|{"text":"abc xyz"}{DOtro|input_value}' , { salida: "String", color: "#008811" } , ['{DTexto}{DOtro}',0] ) $( 'BOtro' , ', otro {DTexto|field_input|{"text":"abc"}{DOtro|input_value}' , { salida: "String", color: "#008811"} , [',{DTexto}{DOtro}',0] ) $( 'BPar' , 'par {DComa|field_checkbox}¿,? {DNombre|field_input|{"text":"abc"}{DSep|field_input|{"text":"=>"}{DValor|field_input|{"text":"xyz"}{DOtro|input_value}' , { salida: "String", color: "#008811" } , function(D){return [`${D.DComa?",":""}${D.DNombre}${D.DSep||"=>"}${D.DValor}${D.DOtro}`,0]} ) $( 'BNegrita' , 'negrita {DTexto|field_input|{"text":"abc xyz"}{DOtro|input_value}' , { salida: "String", color: "#008811" } , ['{DTexto}{DOtro}',0] ) $( 'BCursiva' , 'itálica {DTexto|field_input|{"text":"abc xyz"}{DOtro|input_value}' , { salida: "String", color: "#008811" } , ['{DTexto}{DOtro}',0] ) $( 'BNegCur' , 'negrita itálica {DTexto|field_input|{"text":"abc xyz"}{DOtro|input_value}' , { salida: "String", color: "#008811" } , ['{DTexto}{DOtro}',0] ) $( 'BRemarcado' , 'brillar {DTexto|field_input|{"text":"abc xyz"}{DOtro|input_value}' , { salida: "String", color: "#008811" } , ['{DTexto}{DOtro}',0] ) //------------------------------------------------- /* */ $( 'TAudio' , 'Audio {DRuta|input_value}' , { esStatement: true, color: "#880088" } , function(D){return `\n`} ) $( `TjHere` , 'Here Map lat {DLat|input_value|{"check":"Number"} lon {DLon|input_value|{"check":"Number"} zoom {DZoom|field_number|{"value":"8"} alt {DAlt|field_number|{"number":"300"}' , { esStatement: true, color: "#880088", renglones: 2 } , function(D){id="jheremapa"+(1000).cualquiera().entero();return`
    `} ) $( 'TGMaps' , 'Mapa lat {DLat|input_value} lon {DLon|input_value} alt {DAlt|field_number|{"number":"19"}' , { esStatement: true, color: "#880088", renglones: 2 } , '\n' ) $( 'TMarco' , 'Página en medio {DTam|field_input|{"text":"60vh"} {D|input_dummy} url {DUrl|input_value}' , { esStatement: true, color: "#880088", renglones: 2 } , function(D){return `\n`} ) $( 'TNumero' , 'Núm {DNum|field_number}' , { salida: "Number", color: "blue" } , ['{DNum}',0] ) $( 'TYouTube' , 'Video link {DLink|input_value} altura px{DAlto|field_number}' , { esStatement: true, color: "#880088", renglones: 2 } , function(D){ if(D.DLink.trim() == "" ) return "\n" ; D.DLink = D.DLink.replace( "/watch?v=", "/embed/" ).replace("url(","").replace(")","") ; return '\n'.procesar(D) } ) $( 'TThree' , '3D entorno {DId|field_variable|{"variable":"Nombre3D","variableTypes":["v3d"],"defaultType":"v3d"} {D|input_dummy}Alto {DAlto|field_number|{"number":"300"}Ancho{DAncho|field_number|{"number":"600"}{D|input_dummy}{DContenido|input_statement|{"check":"v3d"}' , { esStatement: true, color: "#F37220" } , function(D){G=D.DId.replace(/\s/g,"_");return `
    \n${D.DContenido.replace(/\$\$\$/g, "Escena"+G)}\n`} ) $( 'TEsfera3d' , 'Esfera {DId|field_variable|{"variable":"Nombre3D","variableTypes":["v3d"],"defaultType":"v3d"} {D|input_dummy} Pos {DPos|input_value|{"check":"Pos3d"} Radio {DRadio|input_value|{"check":"Number"}Color{DColor|input_value}' , { esStatement: true, color: "#F37220" } , function(D){return`\n`} ) $( 'TCubo' , 'Cubo {DId|field_variable|{"variable":"Nombre3D","variableTypes":["v3d"],"defaultType":"v3d"} {D|input_dummy} Pos {DPos|input_value|{"check":"Pos3d"} Lado {DLado|input_value|{"check":"Number"}Color{DColor|input_value}' , { esStatement: true, color: "#F37220" } , function(D){return`\n`} ) $( 'TPrisma' , 'Prisma {DId|field_variable|{"variable":"Nombre3D","variableTypes":["v3d"],"defaultType":"v3d"} {D|input_dummy} Pos {DPos|input_value|{"check":"Pos3d"} Ancho(x) {x|input_value|{"check":["Number","String"]} Alto(y) {y|input_value|{"check":["Number","String"]} Profundo{z|input_value|{"check":["Number","String]}Color{DColor|input_value}' , { esStatement: true, color: "#F37220" } , function(D){return`\n`} ) $( 'TPiramide' , 'Pirámide {DId|field_variable|{"variable":"Nombre3D","variableTypes":["v3d"],"defaultType":"v3d"} {D|input_dummy}de base rectangular{D|input_dummy} Pos {DPos|input_value|{"check":"Pos3d"} Ancho(x) {x|input_value|{"check":"Number"} Alto(y) {y|input_value|{"check":"Number"} Profundo{z|input_value|{"check":"Number"}Color{DColor|input_value}' , { esStatement: true, color: "#F37220" } , function(D){return`\n`} ) $( 'TCilindro' , 'Cilindro {DId|field_variable|{"variable":"Nombre3D","variableTypes":["v3d"],"defaultType":"v3d"} {D|input_dummy} Pos {DPos|input_value|{"check":"Pos3d"} Alto {y|input_value|{"check":"Number"} Radio {DRadio|input_value|{"check":"Number"}Color{DColor|input_value}' , { esStatement: true, color: "#F37220" } , function(D){return`\n`} ) $( 'TCono' , 'Cono {DId|field_variable|{"variable":"Nombre3D","variableTypes":["v3d"],"defaultType":"v3d"} {D|input_dummy} Pos {DPos|input_value|{"check":"Pos3d"} Alto {y|input_value|{"check":"Number"} Radio {DRadio|input_value|{"check":"Number"}Color{DColor|input_value}' , { esStatement: true, color: "#F37220" } , function(D){return`\n`} ) $( 'BPos3d' , 'Pos x{x|field_number|{"number":"0"} y{y|field_number|{"number":"0"} z{z|field_number|{"number":"0"}' , { salida: true, color: "#F37220" } , [`[{x},{y},{z}]`,0] ) $( 'BColor3d' , 'Color {DColor|field_colour}' , { salida: true, color: "#F37220" } , ['{DColor}',0] ) $( `TSolapas` , `Solapas{D|input_dummy}{DContenido|input_statement}` , { esStatement: true, color: "#33cccc" } , `
      {DContenido}
    ` ) $( `BSolapa` , `solapa {DTab|field_variable|{"variable":"idSolapa1","variableTypes":["idSolapa"],"defaultType":"idSolapa"}{DOtros|input_value}` , { salida: "atributos", color: "#33cccc" } , [ ` data-tab="{DTab}{DOtros}"`,0 ] ) $( `TSeccionSolapa` , `Sección de la solapa {DTab|field_variable|{"variable":"idSolapa1","variableTypes":["idSolapa"],"defaultType":"idSolapa"}{D|input_dummy}{DContenido|input_statement}` , { esStatement: true, color: "#33cccc" } , `
    \n{DContenido}
    \n` ) //-------------------------------------------------[ Varios ] Agregar( `TScriptG` , `` , { esStatement: true , color: "maroon" } , `\n` ) Agregar( `TScriptCom` , `` , { esStatement: true , color: "maroon" } , `\n` ) Agregar( `TPuntoComa`, ';', { salida: true, color: "#CC0022" }, [' ;\n',0] ) ; Agregar( "SetAttribute" , '{DDato|field_input|{"text":"idAbc"}.setAttribute("{DAtri|field_input|{"text":"x"}",{DValor|field_input|{"text":"0"});' , { esStatement: true, color: "#CC0011" } , function(D){ return `${D.DDato}.setAttribute("${D.DAtri}", ${D.DValor});\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(`BDatop`,`{DValor|field_input|{"text":"abc"}{DOtros|input_value}`,{salida:true,color:"#770000"},[`{DValor}{DOtros}`,0]) ; Agregar( `BTextoX` ,`"{DValor|field_input|{"text":"use strict"}"{DOtros|input_value}` ,{ salida:true ,color:"#770000" } ,[ `"{DValor}"{DOtros}` ,0 ] ) ; 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(`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(`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(`setTimeout`, `{DNombre|field_dropdown|{"options":[["setTimeout","setTimeout"],["setInterval","setInterval"],["clearTimeout","clearTimeout"],["clearInterval","clearInterval"]]}( {A|input_dummy}{DParam1|input_value},{DParam2|field_input|{"value":"3000"} ) ;`,{esStatement:true, renglones:1,color:"#CC0000"},`{DNombre}( {DParam1},{DParam2} ) ;\n`) Agregar(`setTimeout2`, `{DNombre|field_dropdown|{"options":[["setTimeout","setTimeout"],["setInterval","setInterval"]]}(function(){{M|input_dummy} {A|input_statement}},{DParam2|field_input|{"value":"3000"} ) ;`,{esStatement:true, renglones:1,color:"#CC0000"},function(D){ return `${D.DNombre}( function(){\n${D.A}},${D.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( `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`; } ) // ================================================[ FUNCIONES ]=============== //------------------------------------------------- FUNCIONES function Agregar( $nombre, $codigo, $datos, $funcion, $tooltip ) { CafeGenerator[$nombre] = function(E) { var aqui = this ; aqui.Data = {} ; Datos = this.Datos.forEach(function(cadaDato, num){ //if(num==0) return cadaDato ; X = cadaDato.split("|") Tipo = X[1] 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, function(a,b){ X = b.split("|") aqui.Datos.push(b) Y = ({ type: X[1] , name: X[0] }) if( X.length > 2 ) { console.log(X[2]) try { Otro = JSON.parse( X[2]+"}" ) for( var j in Otro ) Y[j] = Otro[j] ; console.log(110,Otro) } catch(E) { console.log( -10, Y, X[2]+"}" ) } } console.log( Y ) $.args0.push(Y) ; s = "%"+(++n) return s }) if( $datos.color ) $.colour = $datos.color ; 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($) $.tooltip = $tooltip||"Probando"; this.jsonInit($) this.setTooltip($tooltip||""); } } } 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; };