Commit b7abc4a9 authored by Ghislain Loas's avatar Ghislain Loas
Browse files

hotline #75198 fix treeSelect js compatibilty with jquery 3

parent 4b5b5fd1
- ticket #75198 : Administration : correction du composant de sélection de domaines ou de paniers dans les écrans de configurations.
\ No newline at end of file
......@@ -243,15 +243,8 @@ class Admin_CatalogueController extends ZendAfi_Controller_Action {
public function domainesPaniersJsonAction() {
$this->_helper->viewRenderer->setNoRender();
$data = [];
$data[] = $this->_user->getPaniersJson();
$data[] = (new Class_Catalogue())->getDomainesJson();
$data[] = (new Class_PanierNotice())->getPaniersAdminsNotInCatalogueJson();
$JSON = json_encode($data);
$this->getResponse()->setHeader('Content-Type', 'application/json; charset=utf-8');
$this->getResponse()->setBody($JSON);
$this->_helper->json([$this->_user->getPaniersJson(),
(new Class_Catalogue())->getDomainesJson(),
(new Class_PanierNotice())->getPaniersAdminsNotInCatalogueJson()]);
}
}
\ No newline at end of file
......@@ -24,7 +24,7 @@ class ZendAfi_Form_Element_DomainePanier extends ZendAfi_Form_Element_TreeSelect
public function __construct($spec, $options = null) {
$options = array_merge(['UrlDataSource' => Class_Url::assemble(['module' => 'admin',
'controller' => 'catalogue',
'action' => 'domaines-paniers']).'.json',
'action' => 'domaines-paniers-json']),
'MultipleSelection' => false,
'InputIdCategoriesName' => 'id_catalogue',
'InputIdItemsName' => 'id_panier',
......
......@@ -9,12 +9,18 @@
vertical-align: top;
}
.ui-treeselect-items-tree,
.ui-treeselect-items-tree {
overflow-y: scroll;
}
.ui-treeselect-selected-items {
max-height: 300px;
overflow-y: auto;
}
.ui-treeselect-items-tree ,
.ui-treeselect-selected-items {
max-height: 400px;
}
.ui-treeselect-items-tree {
width: 65%;
......
......@@ -17,26 +17,26 @@
this.multiple_selection = true;
this.element.addClass('ui-widget ui-helper-reset');
this.container = $("<div class='ui-treeselect ui-widget-content ui-corner-all'></div>").
appendTo(this.element);
appendTo(this.element);
this.searchInput =
$("<div class='ui-treeselect-search'>"+
"<span>Rechercher: </span><input type='textfield' size='50'></input>"+
"</div>").
appendTo(this.container).
find('input').keyup(function(event){
self._onSearchInputChange($(this).val());
}).end();
$("<div class='ui-treeselect-search'>"+
"<span>Rechercher: </span><input type='textfield' size='50'></input>"+
"</div>").
appendTo(this.container).
find('input').keyup(function(event){
self._onSearchInputChange($(this).val());
}).end();
this.itemsTree = ($("<div class='ui-treeselect-items-tree' />")).
appendTo(this.container);
appendTo(this.container);
this.selectedItems =
$("<div class='ui-treeselect-selected-items'>"+
"<div class='ui-treeselect-selected-items-inner ui-widget-content ui-corner-all'>"+
"<ul></ul></div></div>").
appendTo(this.container).
find("ul");
$("<div class='ui-treeselect-selected-items'>"+
"<div class='ui-treeselect-selected-items-inner ui-widget-content ui-corner-all'>"+
"<ul></ul></div></div>").
appendTo(this.container).
find("ul");
this._createDataTree();
this._initialize();
......@@ -71,8 +71,8 @@
var self = this;
$.each(items, function(index, item) {
var item_li=self.mkli(item, parent, 'item').
children('a');
var item_li=self.mkli(item, parent, 'item').
children('a');
});
},
......@@ -80,23 +80,23 @@
mkli: function(catOrItem, parent, type){
var self = this;
return $("<li class='ui-treeselect-"+type+"'>"+
this._addCheckbox(catOrItem)+
"<a class='ui-state-default' href='#' title='" + catOrItem.label.replace("'", "&apos;") + "'>" +
this._addIco(catOrItem)+
catOrItem.label+
"</a>" +
"</li>").
data("label", catOrItem.label).
data("type", type).
data("elid", catOrItem.id).
appendTo(parent).
children('a').hover(
function (event) {
self._onMouseEntersLI($(event.target).parent());
},
function (event) {
self._onMouseExitsLI($(event.target).parent());
}).end();
this._addCheckbox(catOrItem)+
"<a class='ui-state-default' href='#' title='" + catOrItem.label.replace("'", "&apos;") + "'>" +
this._addIco(catOrItem)+
catOrItem.label+
"</a>" +
"</li>").
data("label", catOrItem.label).
data("type", type).
data("elid", catOrItem.id).
appendTo(parent).
children('a').hover(
function (event) {
self._onMouseEntersLI($(event.target).parent());
},
function (event) {
self._onMouseExitsLI($(event.target).parent());
}).end();
},
......@@ -107,22 +107,22 @@
var self = this;
$.each(categories, function(index, cat) {
var cat_li = self.mkli(cat, parent, 'category');
var cat_li = self.mkli(cat, parent, 'category');
if ((cat.categories.length + cat.items.length) == 0) {
cat_li.addClass('ui-treeselect-empty-category');
return;
}
if ((cat.categories.length + cat.items.length) == 0) {
cat_li.addClass('ui-treeselect-empty-category');
return;
}
var cat_ul = $("<ul></ul>").appendTo(cat_li);
self._addCategoriesTo(cat.categories, cat_ul);
var cat_ul = $("<ul></ul>").appendTo(cat_li);
self._addCategoriesTo(cat.categories, cat_ul);
$.each(cat.items, function(index, item){
self.mkli(item, cat_ul, 'item').
children('a');
});
$.each(cat.items, function(index, item){
self.mkli(item, cat_ul, 'item').
children('a');
});
});
},
......@@ -131,32 +131,32 @@
var anchor = li.children('a');
if(anchor.length)
anchor.data('on_mouse_enter_classes', anchor[0].className);
anchor.data('on_mouse_enter_classes', anchor[0].className);
anchor.
addClass("ui-state-hover").
removeClass("ui-state-default").
removeClass("ui-state-highlight").
removeClass("ui-state-active");
addClass("ui-state-hover").
removeClass("ui-state-default").
removeClass("ui-state-highlight").
removeClass("ui-state-active");
if (li.parents('.ui-treeselect-selected-items').length == 0) return;
var hint =
$('<div class="hint ui-widget ui-corner-all ui-state-active" style="display:none"/>').
hide().
appendTo(li);
$('<div class="hint ui-widget ui-corner-all ui-state-active" style="display:none"/>').
hide().
appendTo(li);
hint.delay(1000).fadeIn('fast');
var sourceLI = this._findConnectedIn(li, this.itemsTree);
this._getAnchorTreeFor(sourceLI).
slice(0, -1).
each(function(index, element){
hint = $("<li>"+$(element).text()+"</li>").
appendTo($("<ul></ul>")).
appendTo(hint);
});
slice(0, -1).
each(function(index, element){
hint = $("<li>"+$(element).text()+"</li>").
appendTo($("<ul></ul>")).
appendTo(hint);
});
},
......@@ -164,9 +164,9 @@
var anchor = li.children('a');
anchor.
addClass(anchor.data('on_mouse_enter_classes')).
removeData('on_mouse_enter_classes').
removeClass("ui-state-hover");
addClass(anchor.data('on_mouse_enter_classes')).
removeData('on_mouse_enter_classes').
removeClass("ui-state-hover");
this.selectedItems.find('.hint').remove();
......@@ -176,18 +176,18 @@
_createDataTree: function(){
var self = this;
$.each(this.options.datas, function(index, cat) {
cat = self._initDataOptions(cat);
cat = self._initDataOptions(cat);
$("<h4><a href='#'>"+cat.label+"</a></h4>").
appendTo(self.itemsTree);
$("<h4><a href='#'>"+cat.label+"</a></h4>").
appendTo(self.itemsTree);
var ul = $("<div style='padding:0px' class='cat_"+cat.id+"'></div>").
appendTo(self.itemsTree).
append('<ul></ul>').
children()[0];
var ul = $("<div style='padding:0px' class='cat_"+cat.id+"'></div>").
appendTo(self.itemsTree).
append('<ul></ul>').
children()[0];
self._addCategoriesTo(cat.categories, ul);
self._addItemsTo(cat.items,ul);
self._addCategoriesTo(cat.categories, ul);
self._addItemsTo(cat.items,ul);
});
},
......@@ -196,15 +196,15 @@
_initDataOptions: function(categorieOrItem){
var self = this;
if(undefined==categorieOrItem.options)
categorieOrItem.options = [];
categorieOrItem.options = [];
$.each(categorieOrItem.categories, function(index,cat){
self._initDataOptions(cat);
self._initDataOptions(cat);
});
$.each(categorieOrItem.items, function(index,item){
if(undefined==item.options)
item.options = [];
if(undefined==item.options)
item.options = [];
});
return categorieOrItem;
......@@ -213,50 +213,50 @@
_initAccordion: function(){
this.itemsTree.accordion({collapsible: true,
beforeActivate: function(event, ui) {
if (ui.newHeader[0]) {
var currHeader= ui.newHeader;
var currContent = currHeader.next('.ui-accordion-content');
} else {
var currHeader= ui.oldHeader;
var currContent = currHeader.next('.ui-accordion-content');
}
var isPanelSelected = currHeader.attr('aria-selected') == 'true';
var isPanelHighlight = currHeader.hasClass('ui-state-highlight');
currHeader
.toggleClass('ui-corner-all', isPanelSelected)
.toggleClass('accordion-header-active ui-state-active ui-corner-top', !isPanelSelected)
.attr('aria-selected', ((!isPanelSelected).toString()));
currContent.toggleClass('accordion-content-active', !isPanelSelected)
if(isPanelSelected && isPanelHighlight) {
self._hideAll();
return false;
}
if (isPanelSelected) {
currContent.slideUp();
return false;
}
currContent.slideDown();
return false;
}}
);
beforeActivate: function(event, ui) {
if (ui.newHeader[0]) {
var currHeader= ui.newHeader;
var currContent = currHeader.next('.ui-accordion-content');
} else {
var currHeader= ui.oldHeader;
var currContent = currHeader.next('.ui-accordion-content');
}
var isPanelSelected = currHeader.attr('aria-selected') == 'true';
var isPanelHighlight = currHeader.hasClass('ui-state-highlight');
currHeader
.toggleClass('ui-corner-all', isPanelSelected)
.toggleClass('accordion-header-active ui-state-active ui-corner-top', !isPanelSelected)
.attr('aria-selected', ((!isPanelSelected).toString()));
currContent.toggleClass('accordion-content-active', !isPanelSelected)
if(isPanelSelected && isPanelHighlight) {
self._hideAll();
return false;
}
if (isPanelSelected) {
currContent.slideUp();
return false;
}
currContent.slideDown();
return false;
}}
);
},
_initSortable: function(){
var self=this;
this.selectedItems.
addClass("sortable").
sortable({
cursor:'crosshair',
opacity: 0.8,
start: function(event, ui) {$(this).find('.hint').remove();},
addClass("sortable").
sortable({
cursor:'crosshair',
opacity: 0.8,
start: function(event, ui) {$(this).find('.hint').remove();},
stop: function(event, ui) {$(this).closest('form').find('input').first().change();}
});
});
},
......@@ -264,44 +264,47 @@
var self=this;
this.itemsTree.find('li').each(
function(index, li){
$(li).data('sid', index);});
function(index, li){
$(li).data('sid', index);});
this.itemsTree.change(
function(event){
self._onSelectionChange($(event.target).parent());
event.stopPropagation();});
function(event){
self._onSelectionChange($(event.target).parent());
event.stopPropagation();});
this.itemsTree.find('li>ul').css("display","none");
this.itemsTree.click(
function(event){
var $target = $(event.target);
if ($target.is("a>*")) $target = $target.parent();
if ($target.is("a")) {
event.stopPropagation();
event.preventDefault();
$target.closest('li').find('li').show();
$target.siblings('ul').find('ul').hide();
$target.siblings('ul').toggle('fast');
}})
function(event){
var $target = $(event.target);
if ($target.is("a>*")) $target = $target.parent();
if ($target.is("a")) {
event.stopPropagation();
event.preventDefault();
$target.closest('li').find('li').show();
$target.siblings('ul').find('ul').hide();
$target.siblings('ul').toggle('fast');
}})
},
_findConnectedIn: function(li, items) {
var sid = li.data('sid');
return items.find('li').filter(function(index) {
return $(this).data('sid') == sid;
return $(this).data('sid') == sid;
});
},
_deselect: function(li) {
this._findConnectedIn(li, this.selectedItems).
hide('fast', function(){
$(this).remove()});
li.children('input').removeAttr('checked');
li.find("li input").removeAttr('disabled');
this.
_findConnectedIn(li, this.selectedItems).
hide('fast', function()
{
$(this).remove();
});
li.closest('ul').find('li input').prop('checked', false);
li.children('input').prop('checked', false);
li.find("li input").prop('disabled', false);
li.children('a').removeClass('ui-state-active');
},
......@@ -313,7 +316,7 @@
if (parent.length == 0) return;
if (parent.find('li>input:checked').length==0) {
this._setInactive(parent);
this._setInactive(parent);
}
},
......@@ -321,10 +324,10 @@
_deselectAll: function() {
var self = this;
this.itemsTree.find('li.ui-treeselect-category').each( function() {
self._deselect($(this));
self._deselect($(this));
});
this.itemsTree.find('li.ui-treeselect-item').each( function() {
self._deselect($(this));
self._deselect($(this));
});
},
......@@ -333,48 +336,48 @@
var self = this;
if (!this.multiple_selection)
this._deselectAll();
this._deselectAll();
li.children('input').attr('checked', 'checked');
li.children('input').prop('checked', true);
var selectedLI = $("<li>"+
"<a href='#'>"+
li.find('a').html()+
"</a></li>").
appendTo(self.selectedItems).
data(li.data()).
children('a').
addClass('ui-state-default').
addClass(li[0].className).
hover(
function (event) {
self._onMouseEntersLI($(event.target).parent());
},
function (event) {
self._onMouseExitsLI($(event.target).parent());
}
).end().
click(
function(event){
event.preventDefault();
if ($(event.target).is('a.ui-state-highlight')) {
$(event.target).removeClass("ui-state-highlight");
$(event.target).removeClass("ui-state-active");
$(event.target).addClass("ui-state-default");
return self._hideAll();
}
if ($(event.target).is('a'))
self._highlightSelected($(event.target).parent());
});
"<a href='#'>"+
li.find('a').html()+
"</a></li>").
appendTo(self.selectedItems).
data(li.data()).
children('a').
addClass('ui-state-default').
addClass(li[0].className).
hover(
function (event) {
self._onMouseEntersLI($(event.target).parent());
},
function (event) {
self._onMouseExitsLI($(event.target).parent());
}
).end().
click(
function(event){
event.preventDefault();
if ($(event.target).is('a.ui-state-highlight')) {
$(event.target).removeClass("ui-state-highlight");
$(event.target).removeClass("ui-state-active");
$(event.target).addClass("ui-state-default");
return self._hideAll();
}
if ($(event.target).is('a'))
self._highlightSelected($(event.target).parent());
});
$("<div class='remove_button'/>").
appendTo(selectedLI).
click(function(event){
self._deselect(
self._findConnectedIn($(event.target).parent(),
self.itemsTree));
self.itemsTree.closest('form').find('input').first().change();
});
appendTo(selectedLI).
click(function(event){
self._deselect(
self._findConnectedIn($(event.target).parent(),
self.itemsTree));
self.itemsTree.closest('form').find('input').first().change();
});
li.parents('li').addBack().children('a').addClass('ui-state-active');
......@@ -386,14 +389,14 @@
var self = this;
if(!this.multiple_selection)
return false;
return false;
li.find("li>input").each(
function(index, checkbox) {
self._deselect($(checkbox).parent());
$(checkbox).
attr('disabled', true).
removeAttr('checked'); });
li.find(" ul li > input").each(
function(index, checkbox) {
self._deselect($(checkbox).parent());
$(checkbox).
prop('disabled', true).
prop('checked', false); });
},
......@@ -401,10 +404,10 @@
this.itemsTree.closest('form').find('input').first().change();
this._turnHighlightOff();
if (li.children('input').is(':checked')) {
this._select(li);
this._select(li);
} else {
this._deselect(li);
this._setInactive(li);
this._deselect(li);
this._setInactive(li);
}
this.selectedItems.sortable('refresh');
......@@ -412,9 +415,9 @@