mirror of
https://github.com/owncloudarchive/contacts.git
synced 2025-01-18 07:52:21 +01:00
Merge pull request #729 from owncloud/use_correct_combobox
Use correct combobox
This commit is contained in:
jbtbnl
commit
ec065cc8ab
@ -1,3 +0,0 @@
|
||||
.combo-button { background:url('../../../core/img/actions/triangle-s.svg') no-repeat center; margin-left: -1px; float: left; border: none; }
|
||||
.ui-button-icon-only .ui-button-text { padding: 0.35em; }
|
||||
.ui-autocomplete-input { margin: 0; padding: 0.48em 0 0.47em 0.45em; }
|
||||
@ -20,18 +20,17 @@ script('contacts', array(
|
||||
|
||||
style('contacts', array(
|
||||
'multi-select',
|
||||
'jquery.combobox',
|
||||
'jquery.ocaddnew',
|
||||
'contacts',
|
||||
'jquery.Jcrop.min',
|
||||
));
|
||||
|
||||
vendor_script('contacts', array(
|
||||
'jquery-combobox/combobox',
|
||||
'ui-multiselect/src/jquery.multiselect',
|
||||
'blueimp-md5/js/md5.min',
|
||||
'jcrop/js/jquery.Jcrop.min',
|
||||
'blueimp-file-upload/js/jquery.fileupload',
|
||||
'combobox'
|
||||
));
|
||||
|
||||
vendor_style('contacts', array(
|
||||
|
||||
182
vendor/combobox.js
vendored
Normal file
182
vendor/combobox.js
vendored
Normal file
@ -0,0 +1,182 @@
|
||||
/**
|
||||
* Inspired by http://jqueryui.com/demos/autocomplete/#combobox
|
||||
*/
|
||||
|
||||
(function( $ ) {
|
||||
$.widget('oc.combobox', {
|
||||
options: {
|
||||
id: null,
|
||||
showButton: false,
|
||||
editable: true,
|
||||
singleclick: false,
|
||||
},
|
||||
_create: function() {
|
||||
var self = this,
|
||||
select = this.element.hide(),
|
||||
selected = select.children(':selected'),
|
||||
value = selected.val() ? selected.text() : '';
|
||||
var name = this.element.attr('name');
|
||||
//this.element.attr('name', 'old_' + name)
|
||||
var input = this.input = $('<input type="text" />')
|
||||
.insertAfter( select )
|
||||
.val( value )
|
||||
//.attr('name', name)
|
||||
.autocomplete({
|
||||
delay: 0,
|
||||
minLength: 0,
|
||||
source: function( request, response ) {
|
||||
var matcher = new RegExp( $.ui.autocomplete.escapeRegex(request.term), "i" );
|
||||
response( select.children('option').map(function() {
|
||||
var text = $( this ).text();
|
||||
if ( this.value && ( !request.term || matcher.test(text) ) )
|
||||
return {
|
||||
label: text.replace(
|
||||
new RegExp(
|
||||
'(?![^&;]+;)(?!<[^<>]*)(' +
|
||||
$.ui.autocomplete.escapeRegex(request.term) +
|
||||
')(?![^<>]*>)(?![^&;]+;)', 'gi'
|
||||
), '<strong>$1</strong>'),
|
||||
value: text,
|
||||
option: this
|
||||
};
|
||||
}) );
|
||||
},
|
||||
select: function( event, ui ) {
|
||||
self.input.val($(ui.item.option).text());
|
||||
self.input.trigger('change');
|
||||
ui.item.option.selected = true;
|
||||
self._trigger('selected', event, {
|
||||
item: ui.item.option
|
||||
});
|
||||
select.children('option').each(function() {
|
||||
if ($(this).text().toLowerCase() === $(ui.item.option).text().toLowerCase()) {
|
||||
$(this).attr('selected', 'selected');
|
||||
} else {
|
||||
$(this).removeAttr('selected');
|
||||
}
|
||||
});
|
||||
select.trigger('change');
|
||||
},
|
||||
change: function( event, ui ) {
|
||||
if(!ui.item) {
|
||||
var matcher = new RegExp( '^' + $.ui.autocomplete.escapeRegex($(this).val()) + '$', 'i'),
|
||||
valid = false;
|
||||
self.input.val($(this).val());
|
||||
//self.input.trigger('change');
|
||||
select.children('option').each(function() {
|
||||
if ($(this).text().match(matcher)) {
|
||||
this.selected = valid = true;
|
||||
$(this).attr('selected', 'selected');
|
||||
select.trigger('change');
|
||||
//return false;
|
||||
} else {
|
||||
$(this).removeAttr('selected');
|
||||
}
|
||||
});
|
||||
if ( !self.options['editable'] && !valid ) {
|
||||
// remove invalid value, as it didn't match anything
|
||||
$( this ).val( "" );
|
||||
select.val( "" );
|
||||
input.data('autocomplete').term = '';
|
||||
return false;
|
||||
} else if(!valid) {
|
||||
select.append('<option selected="selected">' + $(this).val() + '</option>');
|
||||
select.trigger('change');
|
||||
}
|
||||
}
|
||||
}
|
||||
})
|
||||
.addClass('ui-widget ui-widget-content ui-corner-left');
|
||||
|
||||
input.data('uiAutocomplete')._renderItem = function( ul, item ) {
|
||||
return $('<li></li>')
|
||||
.data('item.autocomplete', item )
|
||||
.append('<a>' + item.label + '</a>')
|
||||
.appendTo( ul );
|
||||
};
|
||||
$.each(this.options, function(key, value) {
|
||||
self._setOption(key, value);
|
||||
});
|
||||
|
||||
var clickHandler = function(e) {
|
||||
var w = self.input.autocomplete('widget');
|
||||
if(w.is(':visible')) {
|
||||
self.input.autocomplete('close');
|
||||
} else {
|
||||
input.autocomplete('search', '');
|
||||
}
|
||||
}
|
||||
|
||||
if(this.options['singleclick'] === true) {
|
||||
input.click(clickHandler);
|
||||
} else {
|
||||
input.dblclick(clickHandler);
|
||||
}
|
||||
|
||||
if(this.options['showButton']) {
|
||||
this.button = $('<button type="button"> </button>')
|
||||
.attr('tabIndex', -1 )
|
||||
.attr('title', 'Show All Items')
|
||||
.insertAfter( input )
|
||||
.addClass('svg')
|
||||
.addClass('action')
|
||||
.addClass('combo-button')
|
||||
.click(function() {
|
||||
// close if already visible
|
||||
if ( input.autocomplete('widget').is(':visible') ) {
|
||||
input.autocomplete('close');
|
||||
return;
|
||||
}
|
||||
|
||||
// work around a bug (likely same cause as #5265)
|
||||
$( this ).blur();
|
||||
|
||||
// pass empty string as value to search for, displaying all results
|
||||
input.autocomplete('search', '');
|
||||
input.focus();
|
||||
});
|
||||
}
|
||||
},
|
||||
destroy: function() {
|
||||
this.input.remove();
|
||||
//this.button.remove();
|
||||
this.element.show();
|
||||
$.Widget.prototype.destroy.call( this );
|
||||
},
|
||||
value: function(val) {
|
||||
if(val != undefined) {
|
||||
this.input.val(val);
|
||||
} else {
|
||||
return this.input.val();
|
||||
}
|
||||
},
|
||||
_setOption: function( key, value ) {
|
||||
switch( key ) {
|
||||
case 'id':
|
||||
this.options['id'] = value;
|
||||
this.input.attr('id', value);
|
||||
break;
|
||||
case 'attributes':
|
||||
var input = this.input;
|
||||
$.each(this.options['attributes'], function(key, value) {
|
||||
input.attr(key, value);
|
||||
});
|
||||
break;
|
||||
case 'classes':
|
||||
var input = this.input;
|
||||
$.each(this.options['classes'], function(key, value) {
|
||||
input.addClass(value);
|
||||
});
|
||||
break;
|
||||
case 'editable':
|
||||
case 'showButton':
|
||||
this.options[key] = value;
|
||||
break;
|
||||
}
|
||||
// In jQuery UI 1.8, you have to manually invoke the _setOption method from the base widget
|
||||
$.Widget.prototype._setOption.apply( this, arguments );
|
||||
// In jQuery UI 1.9 and above, you use the _super method instead
|
||||
//this._super( "_setOption", key, value );
|
||||
}
|
||||
});
|
||||
})( jQuery );
|
||||
26
vendor/jquery-combobox/.bower.json
vendored
26
vendor/jquery-combobox/.bower.json
vendored
@ -1,26 +0,0 @@
|
||||
{
|
||||
"name": "jquery-combobox",
|
||||
"version": "1.1.2",
|
||||
"main": "combobox.js",
|
||||
"ignore": [
|
||||
"**/.*",
|
||||
"node_modules",
|
||||
"components",
|
||||
"config.rb",
|
||||
"post.php"
|
||||
],
|
||||
"dependencies": {
|
||||
"jquery": ">=1.8.0"
|
||||
},
|
||||
"homepage": "https://github.com/jslayer/jquery-combobox",
|
||||
"_release": "1.1.2",
|
||||
"_resolution": {
|
||||
"type": "version",
|
||||
"tag": "1.1.2",
|
||||
"commit": "47728ecba1145da597dab9cf871fa8ac60eac750"
|
||||
},
|
||||
"_source": "git://github.com/jslayer/jquery-combobox.git",
|
||||
"_target": "~1.1.2",
|
||||
"_originalSource": "jquery-combobox",
|
||||
"_direct": true
|
||||
}
|
||||
21
vendor/jquery-combobox/LICENSE.md
vendored
21
vendor/jquery-combobox/LICENSE.md
vendored
@ -1,21 +0,0 @@
|
||||
Copyright (C) 2013 Eugene Poltorakov
|
||||
|
||||
MIT Open Source License
|
||||
|
||||
Permission is hereby granted, free of charge, to any person obtaining a copy
|
||||
of this software and associated documentation files (the "Software"), to deal
|
||||
in the Software without restriction, including without limitation the rights
|
||||
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
||||
copies of the Software, and to permit persons to whom the Software is
|
||||
furnished to do so, subject to the following conditions:
|
||||
|
||||
The above copyright notice and this permission notice shall be included in
|
||||
all copies or substantial portions of the Software.
|
||||
|
||||
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
||||
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
||||
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
||||
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
||||
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
||||
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
|
||||
THE SOFTWARE.
|
||||
101
vendor/jquery-combobox/README.md
vendored
101
vendor/jquery-combobox/README.md
vendored
@ -1,101 +0,0 @@
|
||||
#jQuery Combobox plugin
|
||||
|
||||
Yet another combobox plugin. Were developed for my own purposes and successfully used in many projects.
|
||||
|
||||
##Features
|
||||
|
||||
* works with jQuery 1.8+
|
||||
|
||||
##Quick start
|
||||
|
||||
Three options are available:
|
||||
|
||||
* [Download the latest release][release]
|
||||
* Clone the repo: `git clone git@github.com:jslayer/jquery-combobox.git`
|
||||
* Install with [Bower][bower]: `bower install jquery-combobox`
|
||||
|
||||
##Usage
|
||||
|
||||
Basic usage:
|
||||
|
||||
$('select').combobox([{options}], [{classes}]);
|
||||
|
||||
##Parameters
|
||||
|
||||
###Options
|
||||
|
||||
####`width` and `height`
|
||||
|
||||
`int` Determines the `width`/`height` of the element. Defaults is `false` - `width`/`height` will depend on the `width`/`height` of the source element.
|
||||
|
||||
####`btnWidth`
|
||||
|
||||
`int` Determines the element's button width (in px). Defaults is 15.
|
||||
|
||||
####`showSpeed` and `hideSpeed`
|
||||
|
||||
`mixed` Speed of the show/hide animation effect. Defaults is `fast`.
|
||||
|
||||
####`hideSelected`
|
||||
|
||||
`bool` If is `true` the selected element will he hidden from the dropdown list. By default is `false`.
|
||||
|
||||
####`listMaxHeight`
|
||||
|
||||
`int` Maximum height of the dropdown list. Vertical scrollbar appears when list height is greater than this value. Defaults is `false` - no limit.
|
||||
|
||||
####`hoverEnabled`
|
||||
|
||||
`bool` Enables hover feature. For performance reasons by default is `false`
|
||||
|
||||
####`theme`
|
||||
|
||||
`string` Set the "theme" prefix - it will be used in CSS classes for generated elements. Defaults is `combo`
|
||||
|
||||
####`filter`
|
||||
|
||||
`function` You can setup your own content filter; This callback accept name of the filter and the initial value;
|
||||
Than you should return this or modified value;
|
||||
|
||||
Supported filters:
|
||||
* `selected` - The text of the selected box.
|
||||
|
||||
###Classes
|
||||
|
||||
List of default element's CSS classes suffixes and their default values.
|
||||
|
||||
* `wrapper` - `wrapper`
|
||||
* `focus` - `focus`
|
||||
* `disabled` - `disabled`
|
||||
* `multiple` - `multiple`
|
||||
* `button` - `button`
|
||||
* `group` - `group`
|
||||
* `groupLabel` - `group-label`
|
||||
* `list` - `list`
|
||||
* `selected` - `selected`
|
||||
* `itemHover` - `item-hover`
|
||||
* `itemActive` - `item-active`
|
||||
* `wrapHover` - `wrapper-hover`
|
||||
* `wrapActive` - `wrapper-active`
|
||||
* `listLong` - `list-long`
|
||||
|
||||
The applyed css classes will be prepared from `theme_name-suffix_name`
|
||||
|
||||
##Events
|
||||
|
||||
You can bind several event handlers to the source (select) element, to catch some usefull events.
|
||||
|
||||
###`before_show` and `before_hide`
|
||||
|
||||
Called before show/hide dropdown.
|
||||
|
||||
###`combo_init`
|
||||
|
||||
Combobox init event.
|
||||
|
||||
###`update_position`
|
||||
|
||||
Called just before update the position of the dropdown. This even receive offset object, so you can easily change the dropdown position.
|
||||
|
||||
[release]:https://github.com/jslayer/jquery-combobox/zipball/master
|
||||
[bower]:http://bower.io/
|
||||
15
vendor/jquery-combobox/bower.json
vendored
15
vendor/jquery-combobox/bower.json
vendored
@ -1,15 +0,0 @@
|
||||
{
|
||||
"name": "jquery-combobox",
|
||||
"version": "1.1.2",
|
||||
"main": "combobox.js",
|
||||
"ignore": [
|
||||
"**/.*",
|
||||
"node_modules",
|
||||
"components",
|
||||
"config.rb",
|
||||
"post.php"
|
||||
],
|
||||
"dependencies": {
|
||||
"jquery": ">=1.8.0"
|
||||
}
|
||||
}
|
||||
630
vendor/jquery-combobox/combobox.js
vendored
630
vendor/jquery-combobox/combobox.js
vendored
@ -1,630 +0,0 @@
|
||||
/*
|
||||
* jQuery Combobox Plugin 1.1.2
|
||||
* Copyright 2011 Eugene Poltorakov (http://poltorakov.com)
|
||||
* Licensed under the MIT License: http://www.opensource.org/licenses/mit-license.php
|
||||
*
|
||||
* There are several event which triggered from this plugin on select element.
|
||||
* - update_position - Trigger before update position of dropdown.
|
||||
* It gets calculated offset object as second argument which could be changed to affect position of dropdown;
|
||||
* - before_show - trigger before show dropdown;
|
||||
* - before_hide - trigger before hide dropdown;
|
||||
* - combo_init - trigger after init;
|
||||
*
|
||||
*
|
||||
* todo:
|
||||
* - somehow handle mobile devices
|
||||
* - add adjustWidth & basic theme support overview in readme
|
||||
* - make multiselect widget using checkboxes
|
||||
* - remake tab action
|
||||
* - use event namespace
|
||||
* - mobile version ?
|
||||
*/
|
||||
(function($, undefined ) {
|
||||
var Combobox = function(element, options) {
|
||||
var self = this,
|
||||
$element = $(element),
|
||||
_hover_inited = false;
|
||||
|
||||
if (element.combobox != undefined) {
|
||||
return false;
|
||||
}
|
||||
|
||||
element.combobox = self;
|
||||
|
||||
self.options = options;
|
||||
self.element = element;
|
||||
self.$element = $element;
|
||||
self.multiple = element.multiple;
|
||||
|
||||
//create new elements and make link to the object on it
|
||||
(self._list = (self.list = $('<ul class="' + self.options.classes.list + (self.multiple ? ' ' + self.options.classes.multiple : '') + '" />')).get(0)).combobox = self;
|
||||
|
||||
if (!self.multiple) {
|
||||
(self._wrapper = (self.wrapper = $('<div class="' + self.options.classes.wrapper + '" />')).get(0)).combobox = self;
|
||||
(self._selected = (self.selected = $('<div class="' + self.options.classes.selected + '" />')).get(0)).combobox = self;
|
||||
(self._button = (self.button = $('<div class="' + self.options.classes.button + '">+</div>')).get(0)).combobox = self;
|
||||
}
|
||||
|
||||
//bind select events
|
||||
self.$element.bind('change', function(e) {
|
||||
self.updateSelected();
|
||||
// also check if select was disabled or enabled
|
||||
self.updateDisabled();
|
||||
}).bind('focus', function(e) {
|
||||
self.focus();
|
||||
}).bind('blur', function(e) {
|
||||
self.blur();
|
||||
}).bind('keypress', function(e){
|
||||
switch(e.which) {
|
||||
case 38:
|
||||
case 40:
|
||||
self.updateSelected();
|
||||
break;
|
||||
}
|
||||
});
|
||||
|
||||
var _form = self.element.form;
|
||||
if (_form !== null && _form.combobox_reset_processed === undefined) {
|
||||
_form.combobox_reset_processed = true;
|
||||
$(_form).bind('reset', function(e) {
|
||||
setTimeout(function(){
|
||||
$.each(_form.elements, function() {
|
||||
if (this.tagName == 'SELECT' && typeof(this.combobox) != 'undefined') {
|
||||
this.combobox.updateSelected();
|
||||
}
|
||||
});
|
||||
}, 1);
|
||||
});
|
||||
}
|
||||
|
||||
if (!self.multiple) {
|
||||
self.wrapper.bind('click', function(e) {
|
||||
if (self.isDisabled()) {
|
||||
return false;
|
||||
}
|
||||
if (self.blocked) {
|
||||
return false;
|
||||
}
|
||||
if (self.state) {
|
||||
self.hide();
|
||||
}
|
||||
else {
|
||||
if (!_hover_inited) {
|
||||
_hover_inited = true;
|
||||
//hide droplist when cursor is going outside
|
||||
self.list.add(self.button).add(self.selected).hover(function(e) {
|
||||
clearTimeout(self.timer);
|
||||
}, function(e) {
|
||||
self.timer = setTimeout(function() {
|
||||
self.hide();
|
||||
}, 400);
|
||||
});
|
||||
}
|
||||
self.show();
|
||||
}
|
||||
self.focus();
|
||||
return false;
|
||||
}).bind('keydown', function(e){
|
||||
var $options = self.$element.find('option'),
|
||||
index = $options.index($options.filter(':selected'));
|
||||
switch(e.which) {
|
||||
case 38:
|
||||
if (index > 0) {
|
||||
$options.eq(index - 1).prop('selected', 'selected');
|
||||
self.$element.change();
|
||||
}
|
||||
break;
|
||||
case 40:
|
||||
if (index < $options.length) {
|
||||
$options.eq(index + 1).prop('selected', 'selected');
|
||||
self.$element.change();
|
||||
}
|
||||
break;
|
||||
}
|
||||
}).bind('focus', function(e){//TODO
|
||||
self.focus();
|
||||
}).bind('blur', function(e){
|
||||
self.blur();
|
||||
});
|
||||
}
|
||||
else {
|
||||
self.list.bind('keydown', function(e){
|
||||
var $options = self.$element.find('option'),
|
||||
ctrl = e.ctrlKey || e.metaKey,
|
||||
index;
|
||||
switch(e.which) {
|
||||
case 38:
|
||||
index = $options.index($options.filter(':selected').first());
|
||||
index = index == -1 ? 1 : index;
|
||||
index = (index > $options.length - 1) ? $options.length - 1 : index;
|
||||
if (!ctrl) {
|
||||
$options.prop('selected', null);
|
||||
}
|
||||
$options.eq(index - 1).prop('selected', 'selected');
|
||||
self.$element.change();
|
||||
break;
|
||||
case 40:
|
||||
index = $options.index($options.filter(':selected').last());
|
||||
index = index == -1 ? -1 : index;
|
||||
index = (index >= $options.length - 1) ? -1 : index;
|
||||
if (!ctrl) {
|
||||
$options.prop('selected', null);
|
||||
}
|
||||
$options.eq(index + 1).prop('selected', 'selected');
|
||||
self.$element.change();
|
||||
break;
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
if (self.options.hoverEnabled && !self.multiple) {
|
||||
self.wrapper.hover(function() {
|
||||
self.wrapper.addClass(self.options.classes.wrapHover);
|
||||
}, function() {
|
||||
//todo - check lines above - it could be problems here (class will not remove)
|
||||
if (!self.blocked && !self.state) {
|
||||
self.wrapper.removeClass(self.options.classes.wrapHover);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
//collect select styles
|
||||
self.width = (self.options.width ? self.options.width : self.$element.outerWidth());
|
||||
self.height = (self.options.height ? self.options.height : self.$element.outerHeight());
|
||||
self.btnWidth = (self.options.btnWidth);
|
||||
|
||||
if (self.options.adjustWidth && self.btnWidth > 20) {
|
||||
switch(typeof(self.options.adjustWidth)) {
|
||||
case 'boolean':
|
||||
self.width = self.width + self.options.btnWidth - 20;
|
||||
break;
|
||||
case 'number':
|
||||
self.width = self.width + self.options.adjustWidth;
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
if (!self.multiple) {
|
||||
self.wrapper.css({
|
||||
display: 'inline-block',
|
||||
width: self.width,
|
||||
height: self.height
|
||||
}).prop('tabindex', 0);
|
||||
self.button.css({
|
||||
width: self.btnWidth,
|
||||
height: self.height,
|
||||
display: 'inline-block'
|
||||
});
|
||||
self.selected.css({
|
||||
width: self.width - self.btnWidth,
|
||||
height: self.height,
|
||||
display: 'inline-block'
|
||||
});
|
||||
self.list.css({
|
||||
width: self.width,
|
||||
position: 'absolute'
|
||||
});
|
||||
}
|
||||
else {
|
||||
self._list.style.display = 'inline-block';
|
||||
self._list.style.width = self.width + 'px';
|
||||
self.list.prop('tabindex', 0);
|
||||
}
|
||||
|
||||
if (!self.multiple) {
|
||||
self.wrapper.append(self.button);
|
||||
self.wrapper.append(self.selected);
|
||||
self.wrapper.insertAfter(self.$element);
|
||||
}
|
||||
else {
|
||||
self.list.insertAfter(self.$element);
|
||||
}
|
||||
|
||||
//init
|
||||
self.updateDisabled();
|
||||
self.rebuild();
|
||||
self.updateSelected();
|
||||
|
||||
if (!self.multiple) {
|
||||
self._list.style.display = 'none';
|
||||
$('body').append(self.list);
|
||||
}
|
||||
self.$element.hide().trigger('combo_init');
|
||||
};
|
||||
|
||||
$.extend(Combobox.prototype, {
|
||||
state: false,
|
||||
blocked: false,
|
||||
timer: null,
|
||||
value: null,
|
||||
disabled: false,
|
||||
multiple: false,
|
||||
groups: false,
|
||||
filter: function(name, value) {
|
||||
return value;
|
||||
},
|
||||
default_options: {
|
||||
width: false,
|
||||
height: false,
|
||||
btnWidth: 15,
|
||||
showSpeed: 'fast',
|
||||
hideSpeed: 'fast',
|
||||
hideSelected: false,
|
||||
listMaxHeight: false,
|
||||
hoverEnabled: false,
|
||||
forceScroll: false,
|
||||
adjustWidth: true,
|
||||
theme: 'combo'
|
||||
},
|
||||
default_classes: {
|
||||
wrapper: 'wrapper',
|
||||
focus: 'focus',
|
||||
disabled: 'disabled',
|
||||
multiple: 'multiple',
|
||||
button: 'button',
|
||||
group: 'group',
|
||||
groupLabel: 'group-label',
|
||||
list: 'list',
|
||||
selected: 'selected',
|
||||
itemHover: 'item-hover',
|
||||
itemActive: 'item-active',
|
||||
wrapHover: 'wrapper-hover',
|
||||
wrapActive: 'wrapper-active',
|
||||
listLong : 'list-long'
|
||||
},
|
||||
rebuild: function() {
|
||||
var self = this,
|
||||
elements = new Object,
|
||||
_html = '';
|
||||
|
||||
self.groups = self.$element.find('optgroup:first').length == 0 ? false : true;
|
||||
|
||||
if (self.groups) {
|
||||
self.$element.children().each(function(){
|
||||
switch(this.tagName) {
|
||||
case 'OPTION':
|
||||
elements[this.index] = {
|
||||
text: this.text,
|
||||
value: this.value
|
||||
};
|
||||
|
||||
_html += '<li>'+ elements[this.index].text +'</li>';
|
||||
break;
|
||||
case 'OPTGROUP':
|
||||
var $optgroup = $(this),
|
||||
$options = $optgroup.children('option');
|
||||
|
||||
//if group have options
|
||||
if ($options.length > 0) {
|
||||
var label = $optgroup.prop('label');
|
||||
if (label != undefined) {
|
||||
_html += '<li class="'+ self.options.classes.groupLabel +'">' + label + '</li>';
|
||||
}
|
||||
_html += '<li class="'+ self.options.classes.group +'"><ul>';
|
||||
$options.each(function() {
|
||||
elements[this.index] = {
|
||||
text: this.text,
|
||||
value: this.value
|
||||
};
|
||||
|
||||
_html += '<li>'+ this.text +'</li>';
|
||||
});
|
||||
_html += '</ul></li>';
|
||||
}
|
||||
break;
|
||||
}
|
||||
});
|
||||
}
|
||||
else {
|
||||
self.$element.find('option').each(function() {
|
||||
elements[this.index] = {
|
||||
text: this.text,
|
||||
value: this.value
|
||||
};
|
||||
|
||||
_html += '<li>'+ this.text +'</li>';
|
||||
});
|
||||
}
|
||||
self.list.html(_html);
|
||||
|
||||
var $children = !self.groups ? self.list.find('li') : self.list.find('li').not('.' + self.options.classes.groupLabel).not('.' + self.options.classes.group);
|
||||
|
||||
$children.each(function(index) {
|
||||
this.combobox_index = index;
|
||||
this.combobox_value = elements[index].value;
|
||||
});
|
||||
|
||||
if (self.options.hoverEnabled) {
|
||||
self.list.mouseenter(function(e){
|
||||
if(this.mouseenter_inited === true) {
|
||||
return;
|
||||
}
|
||||
this.mouseenter_inited = true;
|
||||
|
||||
$children.mouseover(function() {
|
||||
$(this).addClass(self.options.classes.itemHover);
|
||||
}).mouseout(function(){
|
||||
$(this).removeClass(self.options.classes.itemHover);
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
self.list.click(function(e) {
|
||||
var isCtrl = e.ctrlKey || e.metaKey;
|
||||
|
||||
if (e.target.nodeName != 'LI') {
|
||||
return;
|
||||
}
|
||||
if (self.isDisabled()) {
|
||||
return false;
|
||||
}
|
||||
var children = self.$element.find('option');
|
||||
|
||||
if (self.multiple && isCtrl) {
|
||||
if (children.get(e.target.combobox_index).selected == true) {
|
||||
children.get(e.target.combobox_index).selected = false;
|
||||
}
|
||||
else {
|
||||
children.get(e.target.combobox_index).selected = true;
|
||||
}
|
||||
}
|
||||
else if (self.multiple && e.shiftKey) {
|
||||
var $selected = children.filter(':selected'),
|
||||
firstIndex = children.index($selected.first()),
|
||||
index = e.target.combobox_index;
|
||||
|
||||
firstIndex = firstIndex == -1 ? 0 : firstIndex;
|
||||
|
||||
if (firstIndex > index) {
|
||||
index = firstIndex;
|
||||
firstIndex = e.target.combobox_index;
|
||||
}
|
||||
children.prop('selected', null).slice(firstIndex, index + 1).prop('selected', 'selected');
|
||||
}
|
||||
else if (self.multiple){
|
||||
children.filter(':selected').prop('selected', null);
|
||||
children.eq(e.target.combobox_index).prop('selected', 'selected');
|
||||
}
|
||||
else {
|
||||
children.eq(e.target.combobox_index).prop('selected', 'selected');
|
||||
}
|
||||
|
||||
self.$element.change();
|
||||
self.updateSelected();
|
||||
if (!self.multiple) {
|
||||
self.hide();
|
||||
}
|
||||
self.removeSelection();
|
||||
});
|
||||
|
||||
return self;
|
||||
},
|
||||
updateSelected: function() {
|
||||
var self = this,
|
||||
$children = !self.groups ? self.list.find('li') : self.list.find('li').not('.' + self.options.classes.groupLabel).not('.' + self.options.classes.group),
|
||||
$selected = self.$element.find('option').filter(':selected'),
|
||||
selectedText;
|
||||
|
||||
//debugger;
|
||||
|
||||
if (!self.multiple) {
|
||||
selectedText = $selected.text();
|
||||
self.selected.text(typeof self.options.filter == 'function' ? self.options.filter('selected', selectedText) : selectedText);
|
||||
}
|
||||
|
||||
$children.filter('.' + self.options.classes.itemActive).removeClass(self.options.classes.itemActive);
|
||||
if ($selected.length == 0) {
|
||||
self.value = null;
|
||||
}
|
||||
else {
|
||||
var index = $selected.get(0).index;
|
||||
if (self.multiple) {
|
||||
self.value = [];
|
||||
$selected.each(function() {
|
||||
$children.eq(this.index).addClass(self.options.classes.itemActive);
|
||||
self.value[self.value.length] = this.value
|
||||
});
|
||||
}
|
||||
else {
|
||||
self.value = $selected.prop('value');
|
||||
$children.eq($selected.get(0).index).addClass(self.options.classes.itemActive);
|
||||
}
|
||||
}
|
||||
return self;
|
||||
},
|
||||
updatePosition: function() {
|
||||
var self = this;
|
||||
|
||||
if (self.multiple) {
|
||||
return false;
|
||||
}
|
||||
|
||||
var offset = self.wrapper.offset();
|
||||
|
||||
offset = {
|
||||
top: offset.top + self.height,
|
||||
left: offset.left
|
||||
};
|
||||
|
||||
self.$element.trigger('update_position', offset);
|
||||
|
||||
self.list.css(offset);
|
||||
|
||||
return self;
|
||||
},
|
||||
show: function() {
|
||||
var self = this;
|
||||
|
||||
if (self.blocked) {
|
||||
return;
|
||||
}
|
||||
|
||||
self.$element.trigger('before_show');
|
||||
|
||||
if (self.options.hideSelected && !self.multiple) {
|
||||
$children = !self.groups ? self.list.find('li') : self.list.find('li').not('.' + self.options.classes.groupLabel).not('.' + self.options.classes.group),
|
||||
|
||||
$children.show();
|
||||
|
||||
for(i=0; i<$children.length; i++) {
|
||||
if ($children.get(i).combobox_value == self.value) {
|
||||
$children.eq(i).hide();
|
||||
break;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
self.blocked = true;
|
||||
self.wrapper.addClass(self.options.classes.wrapActive);
|
||||
|
||||
var shouldScrollTo = false;
|
||||
|
||||
if (self.options.listMaxHeight) {
|
||||
self.list.css({
|
||||
top: '-9999px',
|
||||
left: '-9999px'
|
||||
});
|
||||
|
||||
if (self.list.height() >= self.options.listMaxHeight) {
|
||||
self.list.addClass(this.options.classes.listLong);
|
||||
if (self.options.forceScroll) {
|
||||
self.list.css({
|
||||
height: self.options.listMaxHeight,
|
||||
overflow: 'auto'
|
||||
});
|
||||
}
|
||||
shouldScrollTo = true;
|
||||
}
|
||||
else {
|
||||
self.list.removeClass(self.options.classes.listLong);
|
||||
}
|
||||
|
||||
self.list.hide();
|
||||
self.updatePosition();
|
||||
self.list.show();
|
||||
}
|
||||
else {
|
||||
this.updatePosition();
|
||||
}
|
||||
|
||||
self.list.slideDown(self.options.showSpeed, function() {
|
||||
self.state = true;
|
||||
self.blocked = false;
|
||||
|
||||
if (shouldScrollTo) {
|
||||
//scroll to the selected element
|
||||
var $item_active = self.list.find('.' + self.options.classes.itemActive);
|
||||
|
||||
if ($item_active.length == 1) {
|
||||
if (self.options.hideSelected) {
|
||||
//try to find nearest element
|
||||
var $near = $item_active.prev();
|
||||
|
||||
if ($near.length == 0) {
|
||||
$near = $item_active.next();
|
||||
}
|
||||
if ($near.length == 1) {
|
||||
self.list.scrollTop($near.get(0).offsetTop);
|
||||
}
|
||||
}
|
||||
else {
|
||||
self.list.scrollTop($item_active.get(0).offsetTop);
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
return self;
|
||||
},
|
||||
hide: function() {
|
||||
var self = this;
|
||||
|
||||
if (self.blocked || !self.state) {
|
||||
return false;
|
||||
}
|
||||
|
||||
self.$element.trigger('before_hide');
|
||||
|
||||
self.blocked = true;
|
||||
self.wrapper.removeClass(self.options.classes.wrapActive);
|
||||
|
||||
if (self.options.hoverEnabled) {
|
||||
//todo - this class probably shouldn't remove here
|
||||
self.wrapper.removeClass(self.options.classes.wrapHover);
|
||||
}
|
||||
|
||||
if (self.options.hideSpeed == 0) {
|
||||
self.list.hide();
|
||||
self.state = false;
|
||||
self.blocked = false;
|
||||
}
|
||||
else {
|
||||
self.list.slideUp(self.options.hideSpeed, function() {
|
||||
self.state = false;
|
||||
self.blocked = false;
|
||||
});
|
||||
}
|
||||
|
||||
return self;
|
||||
},
|
||||
isDisabled: function() {
|
||||
var dValue = this.$element.prop('disabled');
|
||||
var roValue = this.$element.attr('readonly');
|
||||
return !!((dValue === 'disabled' || dValue == true) || (roValue === 'readonly' || roValue == true));
|
||||
},
|
||||
updateDisabled: function() {
|
||||
var self = this;
|
||||
|
||||
self.disabled = self.isDisabled();
|
||||
|
||||
var target = self.multiple ? self.list : self.wrapper;
|
||||
|
||||
if (self.disabled) {
|
||||
target.addClass(self.options.classes.disabled);
|
||||
}
|
||||
else {
|
||||
target.removeClass(self.options.classes.disabled);
|
||||
}
|
||||
|
||||
return self.disabled;
|
||||
},
|
||||
removeSelection: function() {
|
||||
if (window.getSelection) {
|
||||
window.getSelection().removeAllRanges();
|
||||
}
|
||||
else if (document.selection && document.selection.type != 'None') {
|
||||
//todo - error could appear here (on ie8+)
|
||||
try {document.selection.empty();} catch(e) {}
|
||||
}
|
||||
},
|
||||
focus: function() {
|
||||
if (this.wrapper !== undefined) {
|
||||
this.wrapper.addClass(this.options.classes.focus);
|
||||
}
|
||||
else {
|
||||
this.list.addClass(this.options.classes.focus);
|
||||
}
|
||||
},
|
||||
blur: function() {
|
||||
if (this.wrapper !== undefined) {
|
||||
this.wrapper.removeClass(this.options.classes.focus);
|
||||
}
|
||||
else {
|
||||
this.list.removeClass(this.options.classes.focus);
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
$.fn.combobox = function(options, classes) {
|
||||
options = $.extend({}, Combobox.prototype.default_options, options);
|
||||
options.classes = $.extend({}, Combobox.prototype.default_classes, classes);
|
||||
//prepare classes
|
||||
$.each(options.classes, function(i,v) {
|
||||
options.classes[i] = options.theme + '-' + v;
|
||||
});
|
||||
|
||||
return this.each(function() {
|
||||
var c = new Combobox(this, options);
|
||||
});
|
||||
};
|
||||
})(jQuery);
|
||||
98
vendor/jquery-combobox/css/combobox.css
vendored
98
vendor/jquery-combobox/css/combobox.css
vendored
@ -1,98 +0,0 @@
|
||||
.combo-wrapper {
|
||||
border: 1px solid #cccccc;
|
||||
color: black;
|
||||
font-family: Arial, Helvetica, sans-serif;
|
||||
font-size: 12px;
|
||||
line-height: 21px;
|
||||
cursor: pointer;
|
||||
zoom: 1;
|
||||
}
|
||||
|
||||
.combo-wrapper-hover {
|
||||
border-color: #4444aa;
|
||||
}
|
||||
|
||||
.combo-wrapper-active {
|
||||
border-color: #a0a0a0;
|
||||
}
|
||||
|
||||
.combo-disabled {
|
||||
background: #eeeeee;
|
||||
}
|
||||
|
||||
.combo-selected {
|
||||
padding: 0 0 0 8px;
|
||||
margin: 0 -8px 0 0;
|
||||
float: left;
|
||||
}
|
||||
|
||||
.combo-button {
|
||||
font-size: 16px;
|
||||
font-weight: bold;
|
||||
line-height: 22px;
|
||||
color: #cccccc;
|
||||
float: right;
|
||||
}
|
||||
|
||||
.combo-list {
|
||||
list-style: none;
|
||||
background: #ffffff;
|
||||
padding: 0;
|
||||
margin: 1px 0 0;
|
||||
font-family: Arial, Helvetica, sans-serif;
|
||||
font-size: 12px;
|
||||
border: 1px solid #efefef;
|
||||
z-index: 9999;
|
||||
}
|
||||
.combo-list li {
|
||||
padding: 3px 4px;
|
||||
margin: 0;
|
||||
cursor: pointer;
|
||||
}
|
||||
.combo-list .combo-group-label {
|
||||
font-style: italic;
|
||||
font-weight: bold;
|
||||
cursor: default;
|
||||
}
|
||||
.combo-list .combo-group {
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
}
|
||||
.combo-list .combo-group li {
|
||||
width: auto;
|
||||
float: none;
|
||||
padding-left: 10px;
|
||||
}
|
||||
.combo-list ul {
|
||||
list-style: none;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
clear: both;
|
||||
overflow: hidden;
|
||||
font-size: 10px;
|
||||
}
|
||||
|
||||
.combo-multiple {
|
||||
margin: 0;
|
||||
zoom: 1;
|
||||
clear: both;
|
||||
overflow: hidden;
|
||||
border: 1px solid green;
|
||||
}
|
||||
.combo-multiple li {
|
||||
float: left;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.combo-item-hover {
|
||||
background: #aaaaaa;
|
||||
}
|
||||
|
||||
.combo-item-active {
|
||||
background: #4444aa;
|
||||
color: #ffffff;
|
||||
}
|
||||
|
||||
.combo-focus {
|
||||
border-color: yellow;
|
||||
}
|
||||
227
vendor/jquery-combobox/demo.html
vendored
227
vendor/jquery-combobox/demo.html
vendored
@ -1,227 +0,0 @@
|
||||
<!DOCTYPE HTML>
|
||||
<html lang="en-US">
|
||||
<head>
|
||||
<!-- TODO: Prepare better demo page -->
|
||||
<meta charset="UTF-8">
|
||||
<title>jQuery Combobox Plugin: Demo page</title>
|
||||
<link href="css/combobox.css" rel="stylesheet" type="text/css">
|
||||
<script src="components/jquery/jquery.min.js"></script>
|
||||
<script src="combobox.js"></script>
|
||||
<script>
|
||||
$(function() {
|
||||
$('.themed').combobox();
|
||||
|
||||
$('#select1').combobox();
|
||||
$('#select2').combobox({
|
||||
listMaxHeight: 180,
|
||||
forceScroll: true,
|
||||
filter: function(name, value) {
|
||||
switch (name) {
|
||||
case 'selected':
|
||||
value = '-- ' + value;
|
||||
break;
|
||||
}
|
||||
return value;
|
||||
}/*,
|
||||
hideSelected: true*/
|
||||
});
|
||||
$('#select3').combobox({});
|
||||
$('#select4').combobox({});
|
||||
|
||||
$('#select5').combobox({}).bind('update_position', function(e, offset) {
|
||||
offset.left += 5;
|
||||
});
|
||||
|
||||
$('#select6').combobox({
|
||||
btnWidth: 20,
|
||||
hoverEnabled: true,
|
||||
listMaxHeight: 134,
|
||||
forceScroll: true
|
||||
});
|
||||
|
||||
$('#select-dynamic').combobox({
|
||||
width: 250
|
||||
});
|
||||
|
||||
$('#dynamic-select-update').click(function() {
|
||||
var $select = $('#select-dynamic');
|
||||
option = '<option value="' + $select.children().length + '">' + $select.children().length + '</option>';
|
||||
|
||||
$select.html($select.html() + option);
|
||||
|
||||
$select.get(0).combobox.rebuild();
|
||||
});
|
||||
$('#edit-submitted-prefix').combobox().change(function() {});
|
||||
});
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<form action="post.php" method="post">
|
||||
<input type="text" value="Lorem ipsum" />
|
||||
|
||||
<select id="edit-submitted-prefix" name="prefix" class="form-select"><option value="Mr">Mr</option><option value="Mme">Mme</option><option value="Mlle">Mlle</option></select>
|
||||
|
||||
<select name="select-1" id="select1" disabled="disabled">
|
||||
<option value='123'>Lorem</option>
|
||||
<option>Ipsum</option>
|
||||
<option>Dolor</option>
|
||||
<option>Dolor sit amet</option>
|
||||
</select>
|
||||
|
||||
text
|
||||
|
||||
<select name="select-2" id="select2">
|
||||
<option value='123'>Lorem</option>
|
||||
<option>Ipsum</option>
|
||||
<option>Dolor</option>
|
||||
<option>Dolor sit amet</option>
|
||||
<option>Ipsum</option>
|
||||
<option>Dolor</option>
|
||||
<option>Dolor sit amet</option>
|
||||
<option>Ipsum</option>
|
||||
<option>Dolor</option>
|
||||
<option>Dolor sit amet</option>
|
||||
<option>Ipsum</option>
|
||||
<option>Dolor</option>
|
||||
<option>Dolor sit amet</option>
|
||||
<option>Ipsum</option>
|
||||
<option>Dolor</option>
|
||||
<option>Dolor sit amet</option>
|
||||
|
||||
<option>Ipsum</option>
|
||||
<option>Dolor</option>
|
||||
<option>Dolor sit amet</option>
|
||||
<option>Ipsum</option>
|
||||
<option>Dolor</option>
|
||||
<option>Dolor sit amet</option>
|
||||
<option>Ipsum</option>
|
||||
<option>Dolor</option>
|
||||
<option>Dolor sit amet</option>
|
||||
<option>Ipsum</option>
|
||||
<option>Dolor</option>
|
||||
<option>Dolor sit amet</option>
|
||||
<option>Ipsum</option>
|
||||
<option>Dolor</option>
|
||||
<option>Dolor sit amet</option>
|
||||
<option>Ipsum</option>
|
||||
<option>Dolor</option>
|
||||
<option>Dolor sit amet</option>
|
||||
<option>Ipsum</option>
|
||||
<option>Dolor</option>
|
||||
<option>Dolor sit amet</option>
|
||||
<option>Ipsum</option>
|
||||
<option>Dolor</option>
|
||||
<option>Dolor sit amet</option>
|
||||
<option>Ipsum</option>
|
||||
<option>Dolor</option>
|
||||
<option>Dolor sit amet</option>
|
||||
<option>Ipsum</option>
|
||||
<option>Dolor</option>
|
||||
<option>Dolor sit amet</option>
|
||||
</select>
|
||||
|
||||
<select name="select-3[]" id="select3" multiple="multiple">
|
||||
<option value='123'>Lorem</option>
|
||||
<option value="b">Ipsum</option>
|
||||
<option>Dolor</option>
|
||||
<option>Dolor sit amet</option>
|
||||
</select>
|
||||
|
||||
<select name="select-4[]" id="select4" multiple="multiple">
|
||||
<optgroup label="group1">
|
||||
<option selected="selected">group1 option1</option>
|
||||
<option selected="selected">group1 option2</option>
|
||||
<option>group1 option3</option>
|
||||
</optgroup>
|
||||
<optgroup label="group2">
|
||||
<option>group2 option1</option>
|
||||
<option>group2 option2</option>
|
||||
<option>group2 option3</option>
|
||||
</optgroup>
|
||||
<option>simple option1</option>
|
||||
<option selected="selected">simple option2</option>
|
||||
<option selected="selected">simple option3</option>
|
||||
</select>
|
||||
|
||||
<select name="select-5" id="select5">
|
||||
<optgroup label="group1">
|
||||
<option>group1 option1</option>
|
||||
<option>group1 option2</option>
|
||||
<option>group1 option3</option>
|
||||
</optgroup>
|
||||
<optgroup label="group2">
|
||||
<option>group2 option1</option>
|
||||
<option>group2 option2</option>
|
||||
<option>group2 option3</option>
|
||||
</optgroup>
|
||||
<option>simple option1</option>
|
||||
<option>simple option2</option>
|
||||
<option>simple option3</option>
|
||||
</select>
|
||||
|
||||
<select name="select-6" id="select6">
|
||||
<option value="1900">1900</option><option value="1901">1901</option><option value="1902">1902</option><option value="1903">1903</option><option value="1904">1904</option><option value="1905">1905</option><option value="1906">1906</option><option value="1907">1907</option><option value="1908">1908</option><option value="1909">1909</option><option value="1910">1910</option><option value="1911">1911</option><option value="1912">1912</option><option value="1913">1913</option><option value="1914">1914</option><option value="1915">1915</option><option value="1916">1916</option><option value="1917">1917</option><option value="1918">1918</option><option value="1919">1919</option><option value="1920">1920</option><option value="1921">1921</option><option value="1922">1922</option><option value="1923">1923</option><option value="1924">1924</option><option value="1925">1925</option><option value="1926">1926</option><option value="1927">1927</option><option value="1928">1928</option><option value="1929">1929</option><option value="1930">1930</option><option value="1931">1931</option><option value="1932">1932</option><option value="1933">1933</option><option value="1934">1934</option><option value="1935">1935</option><option value="1936">1936</option><option value="1937">1937</option><option value="1938">1938</option><option value="1939">1939</option><option value="1940">1940</option><option value="1941">1941</option><option value="1942">1942</option><option value="1943">1943</option><option value="1944">1944</option><option value="1945">1945</option><option value="1946">1946</option><option value="1947">1947</option><option value="1948">1948</option><option value="1949">1949</option><option value="1950">1950</option><option value="1951">1951</option><option value="1952">1952</option><option value="1953">1953</option><option value="1954">1954</option><option value="1955">1955</option><option value="1956">1956</option><option value="1957">1957</option><option value="1958">1958</option><option value="1959">1959</option><option value="1960">1960</option><option value="1961">1961</option><option value="1962">1962</option><option value="1963">1963</option><option value="1964">1964</option><option value="1965">1965</option><option value="1966">1966</option><option value="1967">1967</option><option value="1968">1968</option><option value="1969">1969</option><option value="1970">1970</option><option value="1971">1971</option><option value="1972">1972</option><option value="1973">1973</option><option value="1974">1974</option><option value="1975">1975</option><option value="1976">1976</option><option value="1977">1977</option><option value="1978">1978</option><option value="1979">1979</option><option value="1980">1980</option><option value="1981">1981</option><option value="1982">1982</option><option value="1983">1983</option><option value="1984">1984</option><option value="1985">1985</option><option value="1986">1986</option><option value="1987">1987</option><option value="1988">1988</option><option value="1989">1989</option><option value="1990">1990</option><option value="1991">1991</option><option value="1992">1992</option><option value="1993">1993</option><option value="1994">1994</option><option value="1995">1995</option><option value="1996">1996</option><option value="1997">1997</option><option value="1998">1998</option><option value="1999">1999</option><option value="2000">2000</option><option value="2001">2001</option><option value="2002">2002</option><option value="2003">2003</option><option value="2004">2004</option><option value="2005">2005</option><option value="2006">2006</option><option value="2007">2007</option><option value="2008">2008</option><option value="2009">2009</option><option value="2010">2010</option><option selected="selected" value="2011">2011</option>
|
||||
</select>
|
||||
|
||||
<input type="submit" />
|
||||
<input type="reset" />
|
||||
|
||||
|
||||
<select name="dynamic" id="select-dynamic"></select>
|
||||
<input id="dynamic-select-update" type="button" value="Add">
|
||||
<!-- ////////////////////////////////// -->
|
||||
<div class="theme-green block-1">
|
||||
<div class="theme-blue block-2">
|
||||
<select name="" class="themed">
|
||||
<option value="1">TEST</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
<div class="theme-pink block-3">
|
||||
<select name="" class="themed">
|
||||
<option value="1">TEST</option>
|
||||
</select>
|
||||
|
||||
<div class="theme-red theme-blue block-4">
|
||||
<select name="" class="themed">
|
||||
<option value="1">TEST</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
<script type="text/javascript">
|
||||
$(function(){
|
||||
$('select').each(function() {
|
||||
var list, $parents, themeStack = [ ];
|
||||
|
||||
if (!this.combobox) {
|
||||
return;
|
||||
}
|
||||
|
||||
$parents = $(this).parents();
|
||||
|
||||
$parents.each(function() {
|
||||
var matches = this.className.match(/theme\-\w+/g);
|
||||
|
||||
if (matches) {
|
||||
$.each(matches.reverse(), function(i, c) {
|
||||
themeStack.unshift(c);
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
if (themeStack.length == 0) {
|
||||
return;
|
||||
}
|
||||
|
||||
list = this.combobox.list;
|
||||
|
||||
$.each(themeStack, function(i, className) {
|
||||
list.addClass(className);
|
||||
});
|
||||
});
|
||||
});
|
||||
</script>
|
||||
|
||||
</form>
|
||||
</body>
|
||||
</html>
|
||||
93
vendor/jquery-combobox/scss/combobox.scss
vendored
93
vendor/jquery-combobox/scss/combobox.scss
vendored
@ -1,93 +0,0 @@
|
||||
.combo-wrapper {
|
||||
border: 1px solid #cccccc;
|
||||
color: black;
|
||||
font-family: Arial, Helvetica, sans-serif;
|
||||
font-size: 12px;
|
||||
line-height: 21px;
|
||||
cursor: pointer;
|
||||
zoom: 1;
|
||||
}
|
||||
.combo-wrapper-hover {
|
||||
border-color: #4444aa;
|
||||
}
|
||||
.combo-wrapper-active {
|
||||
border-color: #a0a0a0;
|
||||
}
|
||||
.combo-disabled {
|
||||
background: #eeeeee;
|
||||
}
|
||||
.combo-selected {
|
||||
padding: 0 0 0 8px;
|
||||
margin: 0 -8px 0 0;
|
||||
float: left;
|
||||
}
|
||||
.combo-button {
|
||||
font-size: 16px;
|
||||
font-weight: bold;
|
||||
line-height: 22px;
|
||||
color: #cccccc;
|
||||
float: right;
|
||||
}
|
||||
.combo-list {
|
||||
list-style: none;
|
||||
background: #ffffff;
|
||||
padding: 0;
|
||||
margin: 1px 0 0;
|
||||
font-family: Arial, Helvetica, sans-serif;
|
||||
font-size: 12px;
|
||||
border: 1px solid #efefef;
|
||||
z-index: 9999;
|
||||
|
||||
li {
|
||||
padding: 3px 4px;
|
||||
margin: 0;
|
||||
cursor: pointer;
|
||||
}
|
||||
.combo-group-label {
|
||||
font-style: italic;
|
||||
font-weight: bold;
|
||||
cursor: default;
|
||||
}
|
||||
.combo-group {
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
|
||||
li {
|
||||
width: auto;
|
||||
float: none;
|
||||
padding-left: 10px;
|
||||
}
|
||||
}
|
||||
ul {
|
||||
list-style: none;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
clear: both;
|
||||
overflow: hidden;
|
||||
font-size: 10px;
|
||||
}
|
||||
}
|
||||
.combo-multiple {
|
||||
margin: 0;
|
||||
zoom: 1;
|
||||
clear: both;
|
||||
overflow: hidden;
|
||||
border: 1px solid green;
|
||||
|
||||
li {
|
||||
float: left;
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
.combo-item-hover {
|
||||
background: #aaaaaa;
|
||||
}
|
||||
.combo-item-active {
|
||||
background: #4444aa;
|
||||
color: #ffffff;
|
||||
}
|
||||
.combo-list-long {}
|
||||
|
||||
.combo-focus {
|
||||
border-color:yellow;
|
||||
}
|
||||
Loading…
x
Reference in New Issue
Block a user