forked from extern/egroupware
Change taglist toggle to tri-state where toggle button replaces dropdown trigger, instead of having a separate button
This commit is contained in:
parent
65a81bbaaa
commit
d1b0c25ae4
@ -196,7 +196,7 @@ var et2_taglist = (function(){ "use strict"; return et2_selectbox.extend([et2_IR
|
||||
}
|
||||
|
||||
// MagicSuggest would replaces our div, so add a wrapper instead
|
||||
this.taglist = $j('<div/>').prependTo(this.div);
|
||||
this.taglist = $j('<div/>').appendTo(this.div);
|
||||
|
||||
this.taglist_options = jQuery.extend( {
|
||||
// magisuggest can NOT work setting an empty autocomplete url, it will then call page url!
|
||||
@ -280,6 +280,7 @@ var et2_taglist = (function(){ "use strict"; return et2_selectbox.extend([et2_IR
|
||||
// Position absolute to break out of containers
|
||||
.on('expand', jQuery.proxy(function(c) {
|
||||
var taglist = this.taglist;
|
||||
this.div.addClass('expanded');
|
||||
var background = this.taglist.combobox.css('background');
|
||||
var wrapper = jQuery(document.createElement('div'))
|
||||
// Keep any additional classes
|
||||
@ -313,6 +314,7 @@ var et2_taglist = (function(){ "use strict"; return et2_selectbox.extend([et2_IR
|
||||
);
|
||||
this.$taglist.one('collapse', function() {
|
||||
wrapper.remove();
|
||||
widget.div.removeClass('expanded');
|
||||
})
|
||||
},this));
|
||||
|
||||
@ -512,6 +514,12 @@ var et2_taglist = (function(){ "use strict"; return et2_selectbox.extend([et2_IR
|
||||
disabled ? this.taglist.disable() : this.taglist.enable();
|
||||
},
|
||||
|
||||
set_width: function(_width)
|
||||
{
|
||||
this.div.width(_width);
|
||||
this.options.width = _width;
|
||||
},
|
||||
|
||||
/**
|
||||
* Normally the widget will display 1 row (multiple off) or expand as needed
|
||||
* based on selected entries. Setting row will limit the max height.
|
||||
@ -706,6 +714,9 @@ var et2_taglist = (function(){ "use strict"; return et2_selectbox.extend([et2_IR
|
||||
|
||||
if(this.taglist == null) return;
|
||||
|
||||
// Switch to multiple if allowed and more than 1 value
|
||||
this._set_multiple(this.options.multiple ? values.length > 1 : false);
|
||||
|
||||
this.taglist.setSelection(values);
|
||||
},
|
||||
|
||||
|
@ -1004,7 +1004,7 @@ ul.et2_link_string {
|
||||
font-weight: bold;
|
||||
}
|
||||
/* min-height to fix calculations done while hidden */
|
||||
.et2_taglist, .et2_taglist > div:first-child {
|
||||
.et2_taglist, .et2_taglist > div.ms-ctn {
|
||||
min-height: 23px;
|
||||
}
|
||||
/* Toggle single / multiple */
|
||||
@ -1012,8 +1012,12 @@ ul.et2_link_string {
|
||||
}
|
||||
.et2_taglist_toggle > div.ms-ctn {
|
||||
display: inline-block;
|
||||
width: calc(100% - 40px);
|
||||
padding-right: 2px
|
||||
width: calc(100% - 16px);
|
||||
padding-right: 2px;
|
||||
}
|
||||
.et2_taglist_toggle.ui-state-hover,
|
||||
.et2_taglist_toggle.ui-state-active {
|
||||
z-index: 1;
|
||||
}
|
||||
.et2_taglist_toggle:not(.et2_taglist_single) .ms-ctn {
|
||||
/* height: 100%;*/
|
||||
@ -1025,17 +1029,25 @@ ul.et2_link_string {
|
||||
margin-left: -1px;
|
||||
float: right;
|
||||
|
||||
width: 23px;
|
||||
width: 25px;
|
||||
height: 23px;
|
||||
position: relative;
|
||||
|
||||
z-index: 5;
|
||||
|
||||
border: 1px solid #BBB;
|
||||
background-color: white;
|
||||
background-repeat: no-repeat;
|
||||
background-position: center center;
|
||||
background-image: url("../../../phpgwapi/templates/default/images/foldertree_nolines_minus.gif");
|
||||
}
|
||||
.et2_taglist_toggle.et2_taglist_single > div.toggle {
|
||||
|
||||
.et2_taglist_toggle.et2_taglist_single:not(.expanded) > div.toggle {
|
||||
display: none;
|
||||
}
|
||||
.et2_taglist_toggle.et2_taglist_single.expanded > div.toggle {
|
||||
background-image: url("../../../phpgwapi/templates/default/images/foldertree_nolines_plus.gif");
|
||||
display: block;
|
||||
}
|
||||
.et2_taglist_toggle:not(.et2_taglist_single) .ms-trigger {
|
||||
display: none;
|
||||
@ -1064,6 +1076,7 @@ div .et2_taglist_single:not(.et2_taglist_small) div.ms-sel-ctn div.ms-sel-item {
|
||||
}
|
||||
.et2_taglist_single div.ms-sel-item > span:first-child {
|
||||
max-width: 100%;
|
||||
width: 100%;
|
||||
display: inline-block;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
@ -1074,7 +1087,7 @@ div .et2_taglist_single:not(.et2_taglist_small) div.ms-sel-ctn div.ms-sel-item {
|
||||
.et2_taglist_single div.ms-sel-ctn .ms-close-btn {
|
||||
position: relative;
|
||||
top: 0px;
|
||||
right: 5px;
|
||||
right: 10px;
|
||||
float: none;
|
||||
display: inline-block;
|
||||
}
|
||||
@ -1093,7 +1106,7 @@ div .et2_taglist_single:not(.et2_taglist_small) div.ms-sel-ctn div.ms-sel-item {
|
||||
content: attr(data-content) '';
|
||||
text-align: right;
|
||||
position: absolute;
|
||||
z-index: 1;
|
||||
z-index: 10;
|
||||
top: 1px;
|
||||
bottom: 0px;
|
||||
right: 0;
|
||||
@ -1105,16 +1118,18 @@ div .et2_taglist_single:not(.et2_taglist_small) div.ms-sel-ctn div.ms-sel-item {
|
||||
min-width: 25%;
|
||||
background: linear-gradient(to right, rgba(255, 255, 255, 0), rgba(255, 255, 255, 1) 25%);
|
||||
}
|
||||
.et2_taglist_small:not(.et2_taglist_single) {
|
||||
border-bottom: 1px solid silver;
|
||||
}
|
||||
div .et2_taglist_small.et2_taglist_single div.ms-sel-ctn div.ms-sel-item {
|
||||
max-width: calc(100% - 43px);
|
||||
width: 100%;
|
||||
}
|
||||
.et2_taglist_toggle.et2_taglist_small::before {
|
||||
right: 25px;
|
||||
}
|
||||
.et2_taglist_small.ui-state-hover,
|
||||
.et2_taglist_small.ui-state-active {
|
||||
max-height: none;
|
||||
max-width: 25em;
|
||||
min-width: 15em;
|
||||
background: white;
|
||||
z-index: 5;
|
||||
|
@ -1000,7 +1000,7 @@
|
||||
background-image: url("../images/minus.svg");
|
||||
background-size: 50%;
|
||||
}
|
||||
.et2_taglist_toggle.et2_taglist_single > div.toggle {
|
||||
.et2_taglist_toggle.et2_taglist_single.expanded > div.toggle {
|
||||
background-image: url("../images/plus.svg");
|
||||
background-size: 50%;
|
||||
}
|
||||
|
@ -939,7 +939,7 @@
|
||||
background-image: url("../images/minus.svg");
|
||||
background-size: 50%;
|
||||
}
|
||||
.et2_taglist_toggle.et2_taglist_single > div.toggle {
|
||||
.et2_taglist_toggle.et2_taglist_single.expanded > div.toggle {
|
||||
background-image: url("../images/plus.svg");
|
||||
background-size: 50%;
|
||||
}
|
||||
|
@ -910,7 +910,7 @@ textarea.description {
|
||||
background-image: url("../images/minus.svg");
|
||||
background-size: 50%;
|
||||
}
|
||||
.et2_taglist_toggle.et2_taglist_single > div.toggle {
|
||||
.et2_taglist_toggle.et2_taglist_single.expanded > div.toggle {
|
||||
background-image: url("../images/plus.svg");
|
||||
background-size: 50%;
|
||||
}
|
||||
|
@ -1011,7 +1011,7 @@
|
||||
background-image: url("../images/minus.svg");
|
||||
background-size: 50%;
|
||||
}
|
||||
.et2_taglist_toggle.et2_taglist_single > div.toggle {
|
||||
.et2_taglist_toggle.et2_taglist_single.expanded > div.toggle {
|
||||
background-image: url("../images/plus.svg");
|
||||
background-size: 50%;
|
||||
}
|
||||
|
Loading…
Reference in New Issue
Block a user