mirror of
https://gitlab.easter-eggs.com/ee/ldapsaisie.git
synced 2024-12-18 22:43:47 +01:00
LSformElement :: supannLabeledValue.php : Improve edition to permit value selection in SUPANN table
This commit is contained in:
Benjamin Renard
parent
c9bd4b7c65
commit
c241d9c0b6
7 changed files with 339 additions and 43 deletions
24
public_html/css/default/LSformElement_supannLabeledValue.css
Normal file
24
public_html/css/default/LSformElement_supannLabeledValue.css
Normal file
|
|
@ -0,0 +1,24 @@
|
|||
input.LSformElement_supannLabeledValue_search {
|
||||
border: 1px solid #CCC;
|
||||
width: 200px;
|
||||
background: url('../../images/default/find.png') no-repeat scroll 0% 0% #FFF !important;
|
||||
padding-left: 18px;
|
||||
}
|
||||
|
||||
div.supannLabeledValue_possibleValues ul {
|
||||
list-style-type: none;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
border: 1px solid #CCC;
|
||||
border-collapse: collapse;
|
||||
}
|
||||
|
||||
div.supannLabeledValue_possibleValues li {
|
||||
border-bottom: 1px solid #CCC;
|
||||
margin-bottom: 2px;
|
||||
}
|
||||
|
||||
div.supannLabeledValue_possibleValues li:hover {
|
||||
background-color: #CCC;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
|
@ -54,6 +54,21 @@ class LSformElement_supannLabeledValue extends LSformElement {
|
|||
$parseValues[]=$this -> parseValue($val);
|
||||
}
|
||||
$return['html'] = $this -> fetchTemplate(NULL,array('parseValues' => $parseValues));
|
||||
LSsession :: addCssFile('LSformElement_supannLabeledValue.css');
|
||||
if (!$this -> isFreeze()) {
|
||||
LSsession :: addJSconfigParam(
|
||||
$this -> name,
|
||||
array(
|
||||
'searchBtn' => _('Modify'),
|
||||
'noValueLabel' => _('No set value'),
|
||||
'noResultLabel' => _('No result'),
|
||||
'components' => $this->components
|
||||
)
|
||||
);
|
||||
LSsession :: addJSscript('LSformElement_supannLabeledValue_field_value.js');
|
||||
LSsession :: addJSscript('LSformElement_supannLabeledValue_field.js');
|
||||
LSsession :: addJSscript('LSformElement_supannLabeledValue.js');
|
||||
}
|
||||
return $return;
|
||||
}
|
||||
|
||||
|
|
@ -80,6 +95,43 @@ class LSformElement_supannLabeledValue extends LSformElement {
|
|||
return $retval;
|
||||
}
|
||||
|
||||
|
||||
/**
|
||||
* This ajax method is used by the searchPossibleValues function of the form element.
|
||||
*
|
||||
* @param[in] $data The address to the array of data witch will be return by the ajax request
|
||||
*
|
||||
* @retval void
|
||||
**/
|
||||
public static function ajax_searchPossibleValues(&$data) {
|
||||
if ((isset($_REQUEST['attribute'])) && (isset($_REQUEST['objecttype'])) && (isset($_REQUEST['pattern'])) && (isset($_REQUEST['idform'])) ) {
|
||||
if (LSsession ::loadLSobject($_REQUEST['objecttype'])) {
|
||||
$object = new $_REQUEST['objecttype']();
|
||||
$form = $object -> getForm($_REQUEST['idform']);
|
||||
$field=$form -> getElement($_REQUEST['attribute']);
|
||||
$data['possibleValues'] = $field -> searchPossibleValues($_REQUEST['pattern']);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
private function searchPossibleValues($pattern) {
|
||||
$pattern=strtolower($pattern);
|
||||
$retval=array();
|
||||
$table=supannGetNomenclatureTable($this -> supannNomenclatureTable);
|
||||
foreach($table as $label => $values) {
|
||||
foreach($values as $v => $txt) {
|
||||
if (strpos(strtolower($txt),$pattern)!==false) {
|
||||
$retval[]=array(
|
||||
'label' => $label,
|
||||
'value' => "{".$label."}".$v,
|
||||
'translated' => $txt
|
||||
);
|
||||
}
|
||||
}
|
||||
}
|
||||
return $retval;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
?>
|
||||
|
|
|
|||
18
public_html/includes/js/LSformElement_supannLabeledValue.js
Normal file
18
public_html/includes/js/LSformElement_supannLabeledValue.js
Normal file
|
|
@ -0,0 +1,18 @@
|
|||
var LSformElement_supannLabeledValue = new Class({
|
||||
initialize: function(){
|
||||
this.fields = [];
|
||||
this.initialiseLSformElement_supannLabeledValue();
|
||||
},
|
||||
|
||||
initialiseLSformElement_supannLabeledValue: function(el) {
|
||||
if (!$type(el)) {
|
||||
el = document;
|
||||
}
|
||||
el.getElements('ul.LSformElement_supannLabeledValue').each(function(ul) {
|
||||
this.fields[ul.id] = new LSformElement_supannLabeledValue_field(ul);
|
||||
}, this);
|
||||
}
|
||||
});
|
||||
window.addEvent(window.ie ? 'load' : 'domready', function() {
|
||||
varLSformElement_supannLabeledValue = new LSformElement_supannLabeledValue();
|
||||
});
|
||||
|
|
@ -0,0 +1,38 @@
|
|||
var LSformElement_supannLabeledValue_field = new Class({
|
||||
initialize: function(ul){
|
||||
this.ul=ul;
|
||||
this.dd=ul.getParent();
|
||||
this.name = ul.id;
|
||||
this.values = [];
|
||||
this.field_type = ul.get('data-fieldType');
|
||||
this.initializeLSformElement_supannLabeledValue_field();
|
||||
varLSform.addField(this.name,this);
|
||||
console.log(this.field_type);
|
||||
varLSform.addModule(this.field_type,this);
|
||||
},
|
||||
|
||||
initializeLSformElement_supannLabeledValue_field: function(el) {
|
||||
if (!$type(el)) {
|
||||
el = this.ul;
|
||||
}
|
||||
el.getElements('li').each(function(li) {
|
||||
this.values.push(new LSformElement_supannLabeledValue_field_value(li,this.name,this.field_type));
|
||||
}, this);
|
||||
},
|
||||
|
||||
clearValue: function() {
|
||||
if (this.values.length>1) {
|
||||
for(var i=1; i<=this.values.length; i++) {
|
||||
$(this.values[i].li).dispose();
|
||||
}
|
||||
this.values[0].clear();
|
||||
}
|
||||
else if (this.values.length==1) {
|
||||
this.values[0].clear();
|
||||
}
|
||||
},
|
||||
|
||||
reinitialize: function(li) {
|
||||
this.values.push(new LSformElement_supannLabeledValue_field_value(li,this.name,this.field_type));
|
||||
}
|
||||
});
|
||||
|
|
@ -0,0 +1,173 @@
|
|||
var LSformElement_supannLabeledValue_field_value = new Class({
|
||||
initialize: function(li,name,field_type){
|
||||
this.li=li;
|
||||
this.name = name;
|
||||
this.field_type = field_type;
|
||||
this.params = varLSdefault.LSjsConfig[this.name];
|
||||
|
||||
this.input = this.li.getElement('input');
|
||||
this.img = this.li.getElement('img.LSformElement_supannLabeledValue_label');
|
||||
this.span = this.li.getElement('span');
|
||||
|
||||
this.inputSearch=new Element(
|
||||
'input',
|
||||
{
|
||||
'class': 'LSformElement_supannLabeledValue_search',
|
||||
'styles': {
|
||||
'display': 'none'
|
||||
}
|
||||
}
|
||||
);
|
||||
this.inputSearch.addEvent('keydown',this.onKeyUpInputSearch.bindWithEvent(this));
|
||||
this.inputSearch.injectInside(this.li);
|
||||
|
||||
this.searchBtn=new Element(
|
||||
'img',
|
||||
{
|
||||
'src': varLSdefault.imagePath('modify'),
|
||||
'alt': this.params.searchBtn,
|
||||
'title': this.params.searchBtn,
|
||||
}
|
||||
);
|
||||
this.searchBtn.addEvent('click',this.toogleInputSearch.bind(this));
|
||||
this.searchBtn.injectAfter(this.span);
|
||||
|
||||
this._lastSearch=null;
|
||||
this._possibleValues=null;
|
||||
},
|
||||
|
||||
toogleInputSearch: function() {
|
||||
if (this.inputSearch.getStyle('display')=='none') {
|
||||
this.inputSearch.setStyle('display','block');
|
||||
this.inputSearch.focus();
|
||||
}
|
||||
else {
|
||||
this.hidePossibleValues();
|
||||
this.inputSearch.setStyle('display','none');
|
||||
this.inputSearch.set('value','');
|
||||
}
|
||||
},
|
||||
|
||||
onKeyUpInputSearch: function(event) {
|
||||
event = new Event(event);
|
||||
|
||||
if ((event.key=='enter')||(event.key=='tab')) {
|
||||
event.stop();
|
||||
if (this.inputSearch.value!="") {
|
||||
this.launchSearch();
|
||||
}
|
||||
}
|
||||
|
||||
if (event.key=='esc') {
|
||||
this.toogleInputSearch();
|
||||
}
|
||||
},
|
||||
|
||||
launchSearch: function() {
|
||||
this.hidePossibleValues();
|
||||
this._lastSearch=this.inputSearch.value;
|
||||
var data = {
|
||||
template: 'LSformElement_supannLabeledValue',
|
||||
action: 'searchPossibleValues',
|
||||
attribute: this.name,
|
||||
objecttype: varLSform.objecttype,
|
||||
idform: varLSform.idform,
|
||||
pattern: this.inputSearch.value
|
||||
};
|
||||
data.imgload=varLSdefault.loadingImgDisplay(this.inputSearch);
|
||||
new Request({url: 'index_ajax.php', data: data, onSuccess: this.onSearchComplete.bind(this)}).send();
|
||||
},
|
||||
|
||||
onSearchComplete: function(responseText, responseXML) {
|
||||
var data = JSON.decode(responseText);
|
||||
if ( varLSdefault.checkAjaxReturn(data) ) {
|
||||
this.displayPossibleValues(data.possibleValues);
|
||||
}
|
||||
},
|
||||
|
||||
displayPossibleValues: function(possibleValues) {
|
||||
if (this._possibleValues==null) {
|
||||
this._possibleValues=new Element(
|
||||
'div',
|
||||
{
|
||||
'class': 'supannLabeledValue_possibleValues',
|
||||
}
|
||||
);
|
||||
this._possibleValues.injectInside(this.li);
|
||||
}
|
||||
|
||||
|
||||
var ul=new Element('ul');
|
||||
possibleValues.each(function(v) {
|
||||
var li=new Element(
|
||||
'li',
|
||||
{
|
||||
'data-value': v.value,
|
||||
'data-label': v.label,
|
||||
'data-translated': v.translated,
|
||||
}
|
||||
);
|
||||
if (v.label!='no') {
|
||||
li.set('html',"<img src='"+varLSdefault.imagePath('supann_label_'+v.label)+"' alt='["+v.label+"]'/> "+v.translated);
|
||||
}
|
||||
else {
|
||||
li.set('html',v.translated);
|
||||
}
|
||||
li.injectInside(this);
|
||||
}, ul);
|
||||
if (ul.getElements('li').length==0) {
|
||||
new Element(
|
||||
'li',
|
||||
{
|
||||
'html': this.params.noResultLabel
|
||||
}
|
||||
).injectInside(ul);
|
||||
}
|
||||
else {
|
||||
ul.getElements('li').each(function(li) {
|
||||
li.addEvent('click',this.onClickPossibleValue.bindWithEvent(this));
|
||||
}, this);
|
||||
}
|
||||
ul.injectInside(this._possibleValues);
|
||||
this._possibleValues.setStyle('display', 'block');
|
||||
},
|
||||
|
||||
hidePossibleValues: function() {
|
||||
if (this._possibleValues!=null) {
|
||||
this._possibleValues.setStyle('display', 'none');
|
||||
this._possibleValues.empty();
|
||||
}
|
||||
},
|
||||
|
||||
onClickPossibleValue: function(event) {
|
||||
this.hidePossibleValues();
|
||||
event = new Event(event);
|
||||
var li=$(event.target);
|
||||
if (event.target.tagName=='IMG') {
|
||||
li=li.getParent();
|
||||
}
|
||||
this.input.set('value',li.get('data-value'));
|
||||
if (li.get('data-label')!='no') {
|
||||
if (this.img==null) {
|
||||
this.img=new Element('img',{'class': 'LSformElement_supannLabeledValue_label'});
|
||||
this.img.injectBefore(this.span);
|
||||
}
|
||||
this.img.set('src',varLSdefault.imagePath('supann_label_'+li.get('data-label')));
|
||||
}
|
||||
this.span.set('html',li.get('data-translated'));
|
||||
this.span.set('title',li.get('data-value'));
|
||||
this.toogleInputSearch();
|
||||
},
|
||||
|
||||
clear: function() {
|
||||
if (this.img) {
|
||||
this.img.dispose();
|
||||
this.img=null;
|
||||
}
|
||||
this.input.set('value','');
|
||||
if (this.span) {
|
||||
this.span.set('html',this.params.noValueLabel);
|
||||
}
|
||||
},
|
||||
|
||||
});
|
||||
|
|
@ -1,21 +1,7 @@
|
|||
<ul class='LSform{if $multiple && !$freeze} LSformElement_multiple'{/if}' id='{$attr_name}'>
|
||||
{if $parseValues}
|
||||
<ul class='LSform {if $multiple && !$freeze} LSformElement_multiple{/if} LSformElement_supannLabeledValue' id='{$attr_name}' data-fieldType="{$fieldType}">
|
||||
{foreach from=$parseValues item=parseValue}
|
||||
{if $parseValue.translated}{assign var=value value=$parseValue.translated}{else}{assign var=value value=$parseValue.value}{/if}
|
||||
{if $parseValue.label!="no"}{assign var=label value=$parseValue.label}{else}{assign var=label value=""}{/if}
|
||||
<li>{include file="ls:$fieldTemplate"}</li>
|
||||
{foreachelse}
|
||||
{assign var=value value=""}
|
||||
{assign var=parseValue value=""}
|
||||
<li>{include file="ls:$fieldTemplate"}</li>
|
||||
<li {if $freeze}class='noValue'{/if}>{include file="ls:$fieldTemplate"}</li>
|
||||
{/foreach}
|
||||
{else}
|
||||
{foreach from=$values item=value}
|
||||
<li>{include file="ls:$fieldTemplate"}</li>
|
||||
{foreachelse}
|
||||
{assign var=value value=""}
|
||||
{assign var=parseValue value=""}
|
||||
<li>{include file="ls:$fieldTemplate"}</li>
|
||||
{/foreach}
|
||||
{/if}
|
||||
</ul>
|
||||
|
|
|
|||
|
|
@ -1,17 +1,22 @@
|
|||
{if $freeze}
|
||||
{if $value or $parseValue}
|
||||
{if $parseValue}
|
||||
<span class='LSformElement_supannLabeledValue'>{if $label}<img src='{img name="supann_label_$label"}' alt='[{$label}]' title='{$label}' /> {/if}<span title='{$parseValue.value}'>{$value}</span></span>
|
||||
{else}
|
||||
<span class='LSformElement_supannLabeledValue_unparsed'>{$value}</span>
|
||||
{if isset($parseValue)}
|
||||
{if !empty($parseValue.label) and $parseValue.label!='no'}
|
||||
{assign var=clabel value=$parseValue.label}
|
||||
<img src='{img name="supann_label_$clabel"}' alt='[{$clabel}]' title='{$clabel}'/>
|
||||
{/if}
|
||||
<span title="{$parseValue.value}">{$parseValue.translated}</span>
|
||||
{else}
|
||||
{$noValueTxt}
|
||||
{/if}
|
||||
{else}
|
||||
<input type='hidden' name='{$attr_name}[]' value="{if $parseValue}{$parseValue.value}{/if}"/>
|
||||
{if $parseValue and !empty($parseValue.label) and $parseValue.label!='no'}
|
||||
{assign var=clabel value=$parseValue.label}
|
||||
<img class='LSformElement_supannLabeledValue_label' src='{img name="supann_label_$clabel"}' alt='[{$clabel}]' title='{$clabel}'/>
|
||||
{/if}
|
||||
{if $parseValue}
|
||||
<input type='text' name='{$attr_name}[]' class='LSformElement_text' value="{$parseValue.value}" autocomplete="off"/>
|
||||
<span title="{$parseValue.value}">{$parseValue.translated}</span>
|
||||
{else}
|
||||
<input type='text' name='{$attr_name}[]' class='LSformElement_text' value="{$value}" autocomplete="off"/>
|
||||
<span>{$noValueTxt}</span>
|
||||
{/if}
|
||||
{/if}
|
||||
|
|
|
|||
Loading…
Reference in a new issue