xdrm-brackets
/
NxTIC
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity
NxTIC/js/lib/form-builder/main.js

139 lines
4.8 KiB
JavaScript
Raw Normal View History

Définition des premiers comportements du form-builder, dans 'js/form-builder.js'
2016-09-15 17:53:51 +00:00
/* [0] On efface le <body>
=========================================================*/
document.body.innerHTML = '';
Développement premier jet (pas du tout abouti) form-builder.js
2016-09-16 14:52:41 +00:00
"use strict";
Gestion du remplacement avec passage de scope fonctionnel pour l'instant, reste à lier les définitions de this.defs_object
2016-09-17 08:02:22 +00:00
var default_definition = {
Gestion de la création d'un 'repeat' ou 'browse' dans un 'node_link', possibilité d'imbrication de 'repeat'/'browse'
2016-09-20 17:15:33 +00:00
'input': { node_type: 'input' },
'/^h([1-6])$/': { node_type: 'h{$1}' },
'br': { node_type: 'br' },
'option': { node_type: 'option' },
'select': { node_type: 'select' },
'span': { node_type: 'span' },
'/^br([0-9]+)$/': { node: 'br', repeat: { n: '{$1}', id: 'brs' } }
Gestion du remplacement avec passage de scope fonctionnel pour l'instant, reste à lier les définitions de this.defs_object
2016-09-17 08:02:22 +00:00
};
var custom_definition = {
Correction du scope (mais erreur persistante) v2
2016-09-17 16:58:18 +00:00
'/^input\.([a-z]+)$/': {
Gestion du remplacement avec passage de scope fonctionnel pour l'instant, reste à lier les définitions de this.defs_object
2016-09-17 08:02:22 +00:00
node: 'input',
attributes: {
'type': '{$1}',
'data-name': '{name}',
'value': '{value}',
'placeholder': '{placeholder}'
},
Correction [partielle] du cas ou une valeur de 'next' ou 'prev' dans la méthode 'buildElements', pour ajouter récursivement, car si on lie en cascade, 'next' peut contenir un objet built, donc récursion (idem pour 'prev')
2016-09-20 13:28:16 +00:00
listeners: { 'click': '{xx()}' }
Gestion du remplacement avec passage de scope fonctionnel pour l'instant, reste à lier les définitions de this.defs_object
2016-09-17 08:02:22 +00:00
},
'custom-select': {
node: 'span',
attributes: { 'class': 'select-container nobold' },
children: [
{
node: 'select',
attributes: { 'data-name': '{name}' },
children: [
{
node: 'option',
Correction [partielle] du cas ou une valeur de 'next' ou 'prev' dans la méthode 'buildElements', pour ajouter récursivement, car si on lie en cascade, 'next' peut contenir un objet built, donc récursion (idem pour 'prev')
2016-09-20 13:28:16 +00:00
attributes: { value: '{options:i}' },
text: '{options.value}',
Gestion de la création de +ieurs éléments simultanés
2016-09-20 08:41:56 +00:00
browse: {
array: '{options[]}',
Correction [partielle] du cas ou une valeur de 'next' ou 'prev' dans la méthode 'buildElements', pour ajouter récursivement, car si on lie en cascade, 'next' peut contenir un objet built, donc récursion (idem pour 'prev')
2016-09-20 13:28:16 +00:00
funcs: { 'options.value': '{getoptval()}' }
Gestion de la création de +ieurs éléments simultanés
2016-09-20 08:41:56 +00:00
}
Gestion du remplacement avec passage de scope fonctionnel pour l'instant, reste à lier les définitions de this.defs_object
2016-09-17 08:02:22 +00:00
}
Correction [partielle] du cas ou une valeur de 'next' ou 'prev' dans la méthode 'buildElements', pour ajouter récursivement, car si on lie en cascade, 'next' peut contenir un objet built, donc récursion (idem pour 'prev')
2016-09-20 13:28:16 +00:00
],
listeners: { 'change': '{listener()}' }
Gestion du remplacement avec passage de scope fonctionnel pour l'instant, reste à lier les définitions de this.defs_object
2016-09-17 08:02:22 +00:00
}
Prise en compte du css avec l'attribut 'css' dans le 'form-builder'
2016-09-20 18:16:00 +00:00
]
Gestion du remplacement avec passage de scope fonctionnel pour l'instant, reste à lier les définitions de this.defs_object
2016-09-17 08:02:22 +00:00
}
};
Développement premier jet (pas du tout abouti) form-builder.js
2016-09-16 14:52:41 +00:00
var form = {
node: 'h4',
attributes: { 'data-icon': 'o', 'class': 'new-contact color2' },
children: [
Remplacement de 'repeater.i' et 'repeater.n' en 'repeater:i' et 'repeater:n'
2016-09-20 12:18:38 +00:00
{ node: 'input.hidden', $name: 'uid', $value: '{uid}' },
{ node: 'input.hidden', $name: 'call', $value: '{call}' },
{ node: 'input.hidden', $name: 'sms', $value: '{sms}' },
{ node: 'input.hidden', $name: 'countcall', $value: '{countcall}' },
{ node: 'input.hidden', $name: 'countsms', $value: '{countsms}' },
{ node: 'input.text', $name: 'total', $value: 'xx{countcall} calls + {countsms} sms to {number}xx' },
{ node: 'input.text', $name: 'count{rep:i}', $value: '{rep:i} sur {rep:n}', repeat: {n: 10, id: "rep"} },
{ node: 'input.text', $name: 'number', $value: '{number}', $xx: '{clicklistener}' },
{ node: 'custom-select', $name: 'existing', $options: '{options[]}' }
Développement premier jet (pas du tout abouti) form-builder.js
2016-09-16 14:52:41 +00:00
]
};
Gestion du remplacement avec passage de scope fonctionnel pour l'instant, reste à lier les définitions de this.defs_object
2016-09-17 08:02:22 +00:00
Correction [partielle] du cas ou une valeur de 'next' ou 'prev' dans la méthode 'buildElements', pour ajouter récursivement, car si on lie en cascade, 'next' peut contenir un objet built, donc récursion (idem pour 'prev')
2016-09-20 13:28:16 +00:00
var contactForm = {
node: 'h4',
attributes: { 'data-icon': 'o', class: 'new-contact colo2' },
children: [
{ node: 'input.hidden', $name: 'uid', $value: '{uid}' },
{ node: 'input.hidden', $name: 'call', $value: '{call}' },
{ node: 'input.hidden', $name: 'sms', $value: '{sms}' },
{ node: 'input.hidden', $name: 'countcall', $value: '{countcall}' },
{ node: 'input.hidden', $name: 'countsms', $value: '{countsms}' },
{ node: 'input.text', $name: 'number', $value: '{number}' },
{ node: 'custom-select', $name: 'existing', $options: '{existing[]}', $listener: '{existingsel()}' },
{ node: 'input.text', $name: 'username', $placeholder: '{usernameph}', $value: '{username}'},
{ node: 'input.submit', $value: 'Enregistrer', attributes: { class: 'primary sub-number'} }
],
Prise en compte du css avec l'attribut 'css' dans le 'form-builder'
2016-09-20 18:16:00 +00:00
next_nodes: [ { node: 'br' } ]
Correction [partielle] du cas ou une valeur de 'next' ou 'prev' dans la méthode 'buildElements', pour ajouter récursivement, car si on lie en cascade, 'next' peut contenir un objet built, donc récursion (idem pour 'prev')
2016-09-20 13:28:16 +00:00
};
var a = ("<h4 data-icon='o' class='new-contact color2'> \n"+
"\t<input type='hidden' data-name='uid' value='@uid'>\n"+
"\t<input type='hidden' data-name='call' value='@call'>\n"+
"\t<input type='hidden' data-name='sms' value='@sms'>\n"+
"\t<input type='hidden' data-name='countcall' value='@countcall'>\n"+
"\t<input type='hidden' data-name='countsms' value='@countsms'>\n"+
"\t<input type='text' data-name='number' placeholder='Numéro de téléphone' value='@number' > \n"+
"\t<span class='select-container nobold'><select data-name='existing'>\n"+
"\t\t<option value='.'>Utiliser pseudo</option>\n"+
"@contacts"+
"\t</select></span>\n"+
"\t&nbsp;&nbsp;&nbsp;&nbsp;ou&nbsp;&nbsp;&nbsp;&nbsp;\n"+
"\t<input type='text' data-name='username' placeholder='Pseudo' value='@username' > \n"+
"\t<input type='submit' class='primary sub-number' value='Enregistrer'>\n"+
Gestion du remplacement avec passage de scope fonctionnel pour l'instant, reste à lier les définitions de this.defs_object
2016-09-17 08:02:22 +00:00
Correction [partielle] du cas ou une valeur de 'next' ou 'prev' dans la méthode 'buildElements', pour ajouter récursivement, car si on lie en cascade, 'next' peut contenir un objet built, donc récursion (idem pour 'prev')
2016-09-20 13:28:16 +00:00
"</h4>\n\n");
Gestion du remplacement avec passage de scope fonctionnel pour l'instant, reste à lier les définitions de this.defs_object
2016-09-17 08:02:22 +00:00
Correction [partielle] du cas ou une valeur de 'next' ou 'prev' dans la méthode 'buildElements', pour ajouter récursivement, car si on lie en cascade, 'next' peut contenir un objet built, donc récursion (idem pour 'prev')
2016-09-20 13:28:16 +00:00
var fb = new FormBuilder(contactForm);
Gestion du remplacement avec passage de scope fonctionnel pour l'instant, reste à lier les définitions de this.defs_object
2016-09-17 08:02:22 +00:00
fb.add_definition(default_definition);
fb.add_definition(custom_definition);
Gestion de 'node_link' récursivement (pas uniquement au premier niveau)
2016-09-18 09:29:46 +00:00
fb.build({
uid: 1,
call: 2,
sms: 3,
countcall: 4,
countsms: 5,
number: '01 02 03 04 05',
Correction [partielle] du cas ou une valeur de 'next' ou 'prev' dans la méthode 'buildElements', pour ajouter récursivement, car si on lie en cascade, 'next' peut contenir un objet built, donc récursion (idem pour 'prev')
2016-09-20 13:28:16 +00:00
existing: ['Jean', 'Archibald', 'Daniel', 'Maurice'],
username: 'moi-meme',
usernameph: 'Pseudo',
Prise en compte du css avec l'attribut 'css' dans le 'form-builder'
2016-09-20 18:16:00 +00:00
clicklistener: function(e){ console.log('clicked', e); },
existingsel: function(e){ console.log('selected', e); },
getoptval: function(opt){ return opt; }
Gestion de 'node_link' récursivement (pas uniquement au premier niveau)
2016-09-18 09:29:46 +00:00
});
Remplacement avec référence fonctionne pour les PRIMARY variables, à tester pour le reste, méthodes à part pour 'replaceArray' et 'replacePrimary', à faire pour 'replaceRegex' et 'replaceArrayVal'
2016-09-19 06:37:35 +00:00
Création d'élément fonctionnelle [FCT] reste à gérer le repeat
2016-09-19 10:07:04 +00:00
fb.attach(document.body);