13 noviembre 2017

Componentes JSON&JS (Parte 12 de 12)

El JavaScript     

Una vez creado el fichero JSON del control y agregado a la carpeta Omnis correspondiente, será el momento para añadir el archivo JavaScript que le da soporte (si hemos usado el "JSON Control Editor" esto se habrá hecho automáticamente). Para hacerlo manualmente deberemos añadir lo siguiente al fichero html, que cargue nuestro formulario remoto:
 ≤script type="text/javascript" src="scripts/ctl_net_omnis_mycontrol.js"≥≤/script≥
Si lo colocamos bajo la sección para scripts del archivo "jsctempl.htm" (en la carpeta html) haremos que siempre se incluya en la página HTML que Omnis genera automáticamente para probar nuestro formularios remotos, pero, para la aplicación final, también deberemos incluirlo en la página HTML que lance la aplicación web o móvil desplegada.

06 noviembre 2017

Componentes JSON&JS (Parte 11 de 12)

html    

Es obligatorio y permite especificar cómo se generará el HTML inicial que remitirá al cliente el control (es el contenedor del control). Posee los siguientes elementos:
  • template
Obligatorio. Básicamente consiste en un texto que conforma la plantilla con el "div" que contendrá el control. Por ejemplo: ≤div %o %s data-props='%p' data-mvprops=‘%m’≥≤/div≥:

JsControls sustituirá el "%o" por los atributos del JavaScript, mediante su "id", por lo que deberá especificarse este elemento, reemplazará el "%s" con el atributo de estilo para la "div", basándose en las propiedades que soporta el control, también reemplazará el "%p" según las propiedades de control que siempre que no sean multi-valor. "%p" es reemplazado por una cadena JSON, que describe un objeto, donde cada uno de sus miembros contiene el nombre de la propiedad y su valor. 
El valor puede haber sido asignado por Omnis según lo requerido, para ciertos tipos de propiedades, tales como "color" e "icon". El cliente JavaScript usará esta cadena para componer un objeto adicional, con la configuración de la propiedad.

JsControls también reemplazará "%m" con las propiedades de control multi-valr. "%m" deberá omitirse si el control no hace uso de éste tipo de propiedades. Como en el caso de "%p", "%m" es sustituido por una cadena JSON, excepto que se trata de una matriz de objetos, con una entrada para cada elemento o valor-múltiple.
  • extrastyles
Opcional. Texto no superior a 255 caracteres con los atributos de estilo extra para incluir junto con el atributo de estilo "%s" en la plantilla, por ejemplo: "Margen: 2px".
  • padding
Opcional. Deberá ser un entero utilizado para establecer el "padding" (en píxeles) junto con "%s".
  • relativeposition
Opcional y booleano. (por defecto "false") Si es "true", el atributo de estilo que reemplaza "%s" usará posicionamiento relativo en lugar de absoluto. 
  • nowrap
Opcional y booleano. (por defecto "false") Si es "true", el atributo style que reemplaza el "%s" incluirá "white-space nowrap".
Ejemplo:
"html": {
"template": "
", "extrastyles":"margin:1px;"
}
La "div" resultante para el control podría verse así:

≤div style='position:absolute; top:0px; left:0px; height:106px; width:88px; font- family:'Times New Roman',Georgia,Serif; font-size:12pt;font- weight:bold; font- style:italic;text-align:right;color:#00FFFF; overflow- x:auto; overflow-y:auto;margin:1px;' data-backgroundcolor='#555555; rgba(85,85,85,1.0000)' data-dragmode='1' data- effect='1' data-linestyle='1' data-bordercolor='16711935' data- props='{"headercolor":"#FF0000","headericon":"icons/datafile/omnispic/001663 n16.png? 46", "rangeofinternalconstants":14, "rangeofexternalconstants":5, "headerpattern": 1, "headerfontstyle":4, "headerlinestyle":7, "headermultiline":"Lots of text entered like this\rwith multiple\rlines\r", "headerset": 13, "headerremotemenu":"NewRemoteMenu", "headerfont":"Courier New,Monospace"}'  data- mvprops='[{"mvprop1":1,"mvprop2":false,"mvprop3":""}, {"mvprop1": 2,"mvprop2":true, "mvprop3":"NewRemoteMenu"}, {"mvprop1": 2,"mvprop2":true,"mvprop3":"aaaa"}]'≥≤/div≥
Es importante el uso de comillas simples para encerrar los atributos de la plantilla, ya que JSON incluye comillas dobles. JsControls escapará el uso de comillas simples en el JSON que se inserten en como \u0027.


customtabname

El elemento "customtabname" es opcional y permite especificar el nombre que tendrá en la ficha de propiedades el control, al mostrarse sobre el "Property Manager". 

    30 octubre 2017

    Componentes JSON&JS (Parte 10 de 12)

    methods   

    Es opcional y permite especificar los métodos "client-executed" que proporciona el control. Cada miembro del grupo identifica un método. El nombre de cada uno es el también el nombre del método, incluyendo su prefijo "$". Los elementos válidos para la definición de un método son:
    • id
    Es obligatorio, será el número (entero positivo) del método. Debe ser único dentro del contexto del control. Es utilizado internamente por Omnis.
    • desc
    Es obligatorio, y deberá consistir en un texto descriptivo del método. 
    • type
    Es obligatorio e indica el tipo de dato que retorna el método. ("integer", "boolean", "character" o "list")
    • parameters
    Es opcional. Consiste en una matriz que describe los parámetros del método. Cada miembro de la matriz es un parámetro con los siguientes atributos: 
    • name
    Es obligatorio y es el nombre del parámetro. Omnis insertará el carácter "p" al comienzo de este nombre.
    • desc
    Es obligatorio y deberá consistir en un texto descriptivo del parámetro. 
    • type
    Es obligatorio e indica el tipo de datos que admitirá el parámetro. ("integer", "character", "boolean" o "list").
    • altered
    Opcional. Deberá ser booleano. (por defecto "false") Si es "true", el parámetro se marcará como no-alterable.  
    • optional 
    Opcional. Deberá ser booleano. (por defecto "false"). Si es "true", el parámetro se marcará como opcional. 
     Ejemplo:
    "methods": {
       "$mymethod1": { 
          "id": 1,
          "desc": "This is my method", 
          "type": "integer", "parameters": [
       {
          "name": "p1",
          "type": "character", 
          "altered": true,
          "desc": "The parameter p1"
       },
       {
          "name": "p2",
          "type": "integer",
          "desc": "The parameter p2", 
          "optional":true
        }
       ]
      }
    }