Utilisateur:CreatixEA/Aide à la saisie/Script

Une page de Wikipédia, l'encyclopédie libre.

/* 

<templates>
	<template id="test1" name="Test" label="Boite test 1">
		<field id="f1" nature="text" label="Test 1" />
		<field id="f2" nature="text" label="Test 2" />
		<field id="f3" nature="checkbox" label="Test 3" checked="Oui" unchecked="Non" />
		<field id="f4" nature="hidden" />
		<field id="f5" nature="fixed" label="Figé" />
		<field id="f6" nature="select" label="Multichoix" values="Multichoix 1, Multichoix 2, Multichoix 3" />
		<field id="f7" nature="textarea" label="Textarea" />
	</template>
	<template id="test1" name="Test" label="Boite test 2">
		<field id="f1" nature="text" label="Test 1" />
		<field id="f2" nature="text" label="Test 2" />
		<field id="f3" nature="checkbox" label="Test 3" checked="Oui" unchecked="Non" />
		<field id="f4" nature="hidden" />
		<field id="f5" nature="fixed" label="Figé" />
		<field id="f6" nature="select" label="Multichoix" values="Multichoix 1, Multichoix 2, Multichoix 3" />
		<field id="f7" nature="textarea" label="Textarea" />
	</template>
</templates>

{{Test|Val test 1|Val test2|Non|Caché|Figé|Multichoix 1|Test}}
{{Test|Val test 12|Val test22|Oui|Caché2|Figé2|Multichoix 1|Test}}
*/



/* FormParser
 * This object parses the content of the textarea looking for templates declaration
 */
 
var myFormParser = new FormParser();
myMonobook.addEvent(window, 'load', executeFormParser);

function executeFormParser()
{
	myFormParser.execute();
}

function validateFormParser()
{
	myFormParser.validate();
}

function FormParser()
{	
	this.templates = new Array();
	
	this.execute = function()
	{

		this.init()
		do
		{
			from = this.text.indexOf('<' + 'templates');
			to = this.text.indexOf('<' + '/templates>');
			
			if (from != -1 && to != -1)
			{
				this.parser(from, to + 12);
				this.text = this.text.replace(new RegExp(this.text.substring(from, to + 12), 'gi'), '');
			}
			
		} while (from != -1 && to != -1);
		
		myMonobook.addEvent(document.getElementById('wpSave'), 'click', validateFormParser);
		myMonobook.addEvent(document.getElementById('wpPreview'), 'click', validateFormParser);
		
		this.appendTo(this.form);
		this.setValues();
	}
	
	this.init = function()
	{
		this.form = document.getElementById('editform');
		this.Textarea = document.getElementById('wpTextbox1');
		
		this.text = this.Textarea.innerHTML;
		this.text = this.text.replace(/</gi, '<');
		this.text = this.text.replace(/>/gi, '>');
	}
	
	this.parser = function(from, to)
	{
		tobeparsed = this.text.substring(from, to);
		var xmlDoc = null;
		
		if (typeof DOMParser != "undefined") /* For firefox ... */
		{
			xmlParser = new DOMParser();
			xmlDoc = xmlParser.parseFromString(tobeparsed, 'text/xml');
		}
		else /* For Internet Explorer */
		{
			// TODO
		}
		
		xmlTemplates = xmlDoc.childNodes[0];
		
		for (var i = 0; i < xmlTemplates.childNodes.length; i++)
		{
			var node = xmlTemplates.childNodes.item(i);
			
			if (node.nodeType == Node.TEXT_NODE) { continue; }
			
			if (node.tagName == 'template');
			{
				var template = new FormTemplate();
				template.parse(node);
				this.templates.push(template);
			}
		}
	}
	
	this.appendTo = function (control)
	{
		for (var i = 0; i < this.templates.length; i++)
		{
			this.templates[i].appendTo(control);
		}
	}
	
	this.setValues = function ()
	{
		this.text = this.Textarea.innerHTML;
		
		for (var i = 0; i < this.templates.length; i++)
		{
			this.templates[i].setValues();
		}
	}
	
	this.validate = function()
	{
		for (var i = 0; i < this.templates.length; i++)
		{
			this.templates[i].validate();
		}
		
		this.Textarea.innerHTML = this.Textarea.innerHTML.replace(new RegExp('§§' + 'DONE§§', 'gi'), '');
	}
}

/* FormTemplate
 * This object regroups all fields declared for one template
 */
function FormTemplate ()
{
	this.init = function(id, name, label) {
		this.fields = new Array();
		this.id = id;
		this.name = name;
		this.regex = null;
		this.div = document.createElement('div');
		this.div.id = 'fe_template_' + id;
		this.div.className = 'tplTemplate';
		
		labelDiv = document.createElement('div');
		labelDiv.innerHTML = label;
		this.div.appendChild(labelDiv);
	}
	
	this.parse = function (xmlTemplate)
	{
		this.init(xmlTemplate.getAttribute('id'), xmlTemplate.getAttribute('name'), xmlTemplate.getAttribute('label'));
		this.regex = '\\{\\{' + xmlTemplate.getAttribute('name');
		
		for (var i = 0; i < xmlTemplate.childNodes.length; i++)
		{
			var node = xmlTemplate.childNodes[i];
			var field;
			
			if (node.nodeType == Node.TEXT_NODE) { continue; }
			
			
			if (node.getAttribute('nature') == 'textarea')
			{
				field = new FormElementTextArea();
			}
			else if (node.getAttribute('nature') == 'text')
			{
				field = new FormElement();
			}
			else if (node.getAttribute('nature') == 'fixed')
			{
				field = new FormElementFixed();
			}
			else if (node.getAttribute('nature') == 'hidden')
			{
				field = new FormElementHidden();
			}
			else if (node.getAttribute('nature') == 'checkbox')
			{
				field = new FormElementCheckBox(node.getAttribute('checked'), node.getAttribute('unchecked'));
			}
			else if (node.getAttribute('nature') == 'select')
			{
				field = new FormElementSelect(node.getAttribute('values'));
			}
			
			field.init(node.getAttribute('id'), node.getAttribute('label'));
			this.fields.push(field);
			this.regex += '\\|([^\\|]*)';
		}
		
		this.regex += '\\}\\}';
	}
	
	this.appendTo = function(control)
	{
		control.appendChild(this.div);
		
		for (var i = 0; i < this.fields.length; i++)
		{
			this.fields[i].appendTo(control);
		}
	}
	
	this.setValues = function ()
	{
		var reg = new RegExp(this.regex, 'i');
		var values = reg.exec(myFormParser.text);
		myFormParser.text = myFormParser.text.replace(reg, '');
		
		if (!values) { return; }
		
		for (var i = 0; i < this.fields.length; i++)
		{
			var field = this.fields[i];
			
			field.setValue(values[i+1]);
		}
	}
	
	this.validate = function()
	{
		var reg = new RegExp(this.regex + '(?!§§' + 'DONE§§)', 'i');
		myFormParser.Textarea.innerHTML = myFormParser.Textarea.innerHTML.replace(reg, this.getCompiledForm() + '§§' + 'DONE§§');
	}
	
	this.getCompiledForm = function()
	{
		var html = '{{' + this.name;
		
		for (var i = 0; i < this.fields.length; i++)
		{
			html += '|' + this.fields[i].getValue();
		}
		
		html += '}}';
		
		return html;
	}
}

/* FormElement
 * This object is a basic form element. If not extended it represents a text box.
 */
 
function FormElement()
{
	/* This function inits the HTML components */
	this.init = function (id, label)
	{
		this.div = document.createElement('div');
		this.div.id = 'fe_div_' + id;
		this.div.className = 'tplElement';
		
		this.label = document.createElement('span');
		this.label.id = 'fe_label_' + id;
		
		if (label != null)
		{
			this.label.innerHTML = label + ': ';
		}
		
		this.Input = this.buildInput(id);
	}
	
	/* This function should be extended: it constructs the input HTML component. */
	this.buildInput = function (id)
	{
		var Input = document.createElement('input');
		Input.id = 'fe_field_' + id;
		Input.name = 'fe_field_' + id;
		Input.type = 'text';
		Input.size = 100;
		
		return Input;
	}
	
	/* This function appends the final HTML components to the given control */
	this.appendTo = function (control)
	{
		this.div.appendChild(this.label);
		this.div.appendChild(this.Input);
		
		control.appendChild(this.div);
	}
	
	/* This function sets the value to the input. Must be extended if not text box type */
	this.setValue = function (value)
	{
		this.Input.value = value;
	}
	
	/* This function returns the textbox value. Must be extended if not text box type */
	this.getValue = function ()
	{
		return this.Input.value;
	}
}

/* FormElementTextArea
 * This object extends FormElement implementing the TextArea input type
 */

FormElementTextArea = function () { this.parent = FormElement; }
FormElementTextArea.prototype = new FormElement();
FormElementTextArea.prototype.buildInput = function (id)
{
	this.Input = document.createElement('textarea');
	this.Input.name = 'fe_field_' + id;
	this.Input.id = 'fe_field_' + id;
	this.Input.rows = 20;
	
	return this.Input;
}
FormElementTextArea.prototype.getValue = function () { return this.Input.value; }
FormElementTextArea.prototype.setValue = function (value) { this.Input.innerHTML = value; }

/* FormElementFixed
 * This object extends FormElement implementing a field fixed, uneditable. Usefull when a template should have only a few params editable !
 */
FormElementFixed = function() { this.parent = FormElement; }
FormElementFixed.prototype = new FormElement();
FormElementFixed.prototype.buildInput = function (id)
{
	var div = document.createElement('span');
	
	this.labelValue = document.createElement('span');
	
	this.hiddenInput = document.createElement('input');
	this.hiddenInput.name = 'fe_field_' + id;
	this.hiddenInput.id = 'fe_field_' + id;
	this.hiddenInput.type = 'hidden';
	
	div.appendChild(this.hiddenInput);
	div.appendChild(this.labelValue);
	
	return div;
}
FormElementFixed.prototype.getValue = function () { return this.hiddenInput.value; }
FormElementFixed.prototype.setValue = function (value) { this.hiddenInput.value = value; this.labelValue.innerHTML = value; }

/* FormElementHidden
 * This object extends FormElement implementing a field not shown. Usefull when a template should have only a few params editable !
 */
FormElementHidden = function() { this.parent = FormElement; }
FormElementHidden.prototype = new FormElement();
FormElementHidden.prototype.buildInput = function (id)
{
	var div = document.createElement('span');
	
	this.labelValue = document.createElement('span');
	
	this.hiddenInput = document.createElement('input');
	this.hiddenInput.name = 'fe_field_' + id;
	this.hiddenInput.id = 'fe_field_' + id;
	this.hiddenInput.type = 'hidden';
	
	div.appendChild(this.hiddenInput);
	div.appendChild(this.labelValue);
	
	return div;
}
FormElementHidden.prototype.getValue = function () { return this.hiddenInput.value; }
FormElementHidden.prototype.setValue = function (value) { this.hiddenInput.value = value; this.labelValue.innerHTML = ''; }

/* FormElementCheckBox
 * This object extends FormElement implementing a field not shown. Usefull when a template should have only a few params editable !
 */
FormElementCheckBox = function(checked, unchecked) { this.checked = checked; this.unchecked = unchecked; this.parent = FormElement; }
FormElementCheckBox.prototype = new FormElement();
FormElementCheckBox.prototype.buildInput = function (id)
{
	this.Input = document.createElement('input');
	this.Input.type = 'checkbox';
	this.id = id;
	this.name = name;
	
	return this.Input;
}
FormElementCheckBox.prototype.getValue = function () { if (this.Input.checked == true) return this.checked; return this.unchecked;}
FormElementCheckBox.prototype.setValue = function (value) { if (value == this.checked) this.Input.checked = true; else this.Input.checked = false; }
	
/* FormElementSelect
 * This object extends FormElement implementing a field not shown. Usefull when a template should have only a few params editable !
 */
FormElementSelect = function(values)
{
	this.values = values.split(/[,]+/g);
	this.options = new Array();
	this.parent = FormElement;
}
FormElementSelect.prototype = new FormElement();
FormElementSelect.prototype.buildInput = function (id)
{
	this.Input = document.createElement('select');
	this.id = id;
	this.name = name;
	
	for (var i = 0; i < this.values.length; i++)
	{
		Option = document.createElement('option');
		Option.value = this.values[i];
		Option.innerHTML = this.values[i];
		this.Input.appendChild(Option);
		this.options.push(Option);
	}
	
	return this.Input;
}
FormElementSelect.prototype.getValue = function () { return this.Input.value; }
FormElementSelect.prototype.setValue = function (value)
{
	for (var i = 0; i < this.options.length; i++)
	{
		if (this.options[i].value == value)
		{
			this.options[i].selected = true;
			return;
		}
	}
}

/*

*/

Ce document provient de « https://fr.wikipedia.org/w/index.php?title=Utilisateur:CreatixEA/Aide_à_la_saisie/Script&oldid=11777840 ».