RetailCRM-Mirror/select2
1
0
Fork 0
mirror of synced 2024-11-22 21:16:10 +03:00
Code Issues Projects Releases Wiki Activity

Add proof-of-concept decorator for clearing

Browse Source
This commit is contained in:
Kevin Brown 2014-08-28 21:20:36 -04:00
parent a25883c659
commit 1197960a4e
9 changed files with 315 additions and 118 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
dist/js/select2.amd.full.js vendored
View File

@ -46,13 +46,13 @@ define('select2/utils',[], function () {
function DecoratedClass () { function DecoratedClass () {
var unshift = Array.prototype.unshift; var unshift = Array.prototype.unshift;
unshift.call(arguments, SuperClass.prototype.constructor);
var argCount = DecoratorClass.prototype.constructor.length; var argCount = DecoratorClass.prototype.constructor.length;
var calledConstructor = SuperClass.prototype.constructor; var calledConstructor = SuperClass.prototype.constructor;
if (argCount > 0) { if (argCount > 0) {
unshift.call(arguments, SuperClass.prototype.constructor);
calledConstructor = DecoratorClass.prototype.constructor; calledConstructor = DecoratorClass.prototype.constructor;
} }
@ -74,6 +74,8 @@ define('select2/utils',[], function () {
for (var m = 0; m < decoratedMethods.length; m++) { for (var m = 0; m < decoratedMethods.length; m++) {
var methodName = decoratedMethods[m]; var methodName = decoratedMethods[m];
function calledMethod (methodName) {
// Stub out the original method if it's not decorating an actual method
var originalMethod = function () {}; var originalMethod = function () {};
if (methodName in DecoratedClass.prototype) { if (methodName in DecoratedClass.prototype) {
@ -82,15 +84,16 @@ define('select2/utils',[], function () {
var decoratedMethod = DecoratorClass.prototype[methodName]; var decoratedMethod = DecoratorClass.prototype[methodName];
function calledMethod () { return function () {
var unshift = Array.prototype.unshift; var unshift = Array.prototype.unshift;
unshift.call(arguments, originalMethod); unshift.call(arguments, originalMethod);
return decoratedMethod.apply(this, arguments); return decoratedMethod.apply(this, arguments);
} }
}
DecoratedClass.prototype[methodName] = calledMethod; DecoratedClass.prototype[methodName] = calledMethod(methodName);
} }
return DecoratedClass; return DecoratedClass;
@ -275,8 +278,6 @@ define('select2/results',[
var $options = self.$results.find(".option"); var $options = self.$results.find(".option");
console.log($options);
$options.each(function () { $options.each(function () {
var $option = $(this); var $option = $(this);
var item = $option.data("data"); var item = $option.data("data");
@ -430,7 +431,7 @@ define('select2/options',[
this.dataAdapter = SelectData; this.dataAdapter = SelectData;
this.resultsAdapter = ResultsList; this.resultsAdapter = ResultsList;
this.dropdownAdapter = Dropdown; this.dropdownAdapter = Dropdown;
this.selectionAdapter = Selection; this.selectionAdapter = options.selectionAdapter || Selection;
} }
return Options; return Options;

15
dist/js/select2.amd.js vendored
View File

@ -46,13 +46,13 @@ define('select2/utils',[], function () {
function DecoratedClass () { function DecoratedClass () {
var unshift = Array.prototype.unshift; var unshift = Array.prototype.unshift;
unshift.call(arguments, SuperClass.prototype.constructor);
var argCount = DecoratorClass.prototype.constructor.length; var argCount = DecoratorClass.prototype.constructor.length;
var calledConstructor = SuperClass.prototype.constructor; var calledConstructor = SuperClass.prototype.constructor;
if (argCount > 0) { if (argCount > 0) {
unshift.call(arguments, SuperClass.prototype.constructor);
calledConstructor = DecoratorClass.prototype.constructor; calledConstructor = DecoratorClass.prototype.constructor;
} }
@ -74,6 +74,8 @@ define('select2/utils',[], function () {
for (var m = 0; m < decoratedMethods.length; m++) { for (var m = 0; m < decoratedMethods.length; m++) {
var methodName = decoratedMethods[m]; var methodName = decoratedMethods[m];
function calledMethod (methodName) {
// Stub out the original method if it's not decorating an actual method
var originalMethod = function () {}; var originalMethod = function () {};
if (methodName in DecoratedClass.prototype) { if (methodName in DecoratedClass.prototype) {
@ -82,15 +84,16 @@ define('select2/utils',[], function () {
var decoratedMethod = DecoratorClass.prototype[methodName]; var decoratedMethod = DecoratorClass.prototype[methodName];
function calledMethod () { return function () {
var unshift = Array.prototype.unshift; var unshift = Array.prototype.unshift;
unshift.call(arguments, originalMethod); unshift.call(arguments, originalMethod);
return decoratedMethod.apply(this, arguments); return decoratedMethod.apply(this, arguments);
} }
}
DecoratedClass.prototype[methodName] = calledMethod; DecoratedClass.prototype[methodName] = calledMethod(methodName);
} }
return DecoratedClass; return DecoratedClass;
@ -275,8 +278,6 @@ define('select2/results',[
var $options = self.$results.find(".option"); var $options = self.$results.find(".option");
console.log($options);
$options.each(function () { $options.each(function () {
var $option = $(this); var $option = $(this);
var item = $option.data("data"); var item = $option.data("data");
@ -430,7 +431,7 @@ define('select2/options',[
this.dataAdapter = SelectData; this.dataAdapter = SelectData;
this.resultsAdapter = ResultsList; this.resultsAdapter = ResultsList;
this.dropdownAdapter = Dropdown; this.dropdownAdapter = Dropdown;
this.selectionAdapter = Selection; this.selectionAdapter = options.selectionAdapter || Selection;
} }
return Options; return Options;

15
dist/js/select2.full.js vendored
View File

@ -9583,13 +9583,13 @@ define('select2/utils',[], function () {
function DecoratedClass () { function DecoratedClass () {
var unshift = Array.prototype.unshift; var unshift = Array.prototype.unshift;
unshift.call(arguments, SuperClass.prototype.constructor);
var argCount = DecoratorClass.prototype.constructor.length; var argCount = DecoratorClass.prototype.constructor.length;
var calledConstructor = SuperClass.prototype.constructor; var calledConstructor = SuperClass.prototype.constructor;
if (argCount > 0) { if (argCount > 0) {
unshift.call(arguments, SuperClass.prototype.constructor);
calledConstructor = DecoratorClass.prototype.constructor; calledConstructor = DecoratorClass.prototype.constructor;
} }
@ -9611,6 +9611,8 @@ define('select2/utils',[], function () {
for (var m = 0; m < decoratedMethods.length; m++) { for (var m = 0; m < decoratedMethods.length; m++) {
var methodName = decoratedMethods[m]; var methodName = decoratedMethods[m];
function calledMethod (methodName) {
// Stub out the original method if it's not decorating an actual method
var originalMethod = function () {}; var originalMethod = function () {};
if (methodName in DecoratedClass.prototype) { if (methodName in DecoratedClass.prototype) {
@ -9619,15 +9621,16 @@ define('select2/utils',[], function () {
var decoratedMethod = DecoratorClass.prototype[methodName]; var decoratedMethod = DecoratorClass.prototype[methodName];
function calledMethod () { return function () {
var unshift = Array.prototype.unshift; var unshift = Array.prototype.unshift;
unshift.call(arguments, originalMethod); unshift.call(arguments, originalMethod);
return decoratedMethod.apply(this, arguments); return decoratedMethod.apply(this, arguments);
} }
}
DecoratedClass.prototype[methodName] = calledMethod; DecoratedClass.prototype[methodName] = calledMethod(methodName);
} }
return DecoratedClass; return DecoratedClass;
@ -9812,8 +9815,6 @@ define('select2/results',[
var $options = self.$results.find(".option"); var $options = self.$results.find(".option");
console.log($options);
$options.each(function () { $options.each(function () {
var $option = $(this); var $option = $(this);
var item = $option.data("data"); var item = $option.data("data");
@ -9967,7 +9968,7 @@ define('select2/options',[
this.dataAdapter = SelectData; this.dataAdapter = SelectData;
this.resultsAdapter = ResultsList; this.resultsAdapter = ResultsList;
this.dropdownAdapter = Dropdown; this.dropdownAdapter = Dropdown;
this.selectionAdapter = Selection; this.selectionAdapter = options.selectionAdapter || Selection;
} }
return Options; return Options;

15
dist/js/select2.js vendored
View File

@ -474,13 +474,13 @@ define('select2/utils',[], function () {
function DecoratedClass () { function DecoratedClass () {
var unshift = Array.prototype.unshift; var unshift = Array.prototype.unshift;
unshift.call(arguments, SuperClass.prototype.constructor);
var argCount = DecoratorClass.prototype.constructor.length; var argCount = DecoratorClass.prototype.constructor.length;
var calledConstructor = SuperClass.prototype.constructor; var calledConstructor = SuperClass.prototype.constructor;
if (argCount > 0) { if (argCount > 0) {
unshift.call(arguments, SuperClass.prototype.constructor);
calledConstructor = DecoratorClass.prototype.constructor; calledConstructor = DecoratorClass.prototype.constructor;
} }
@ -502,6 +502,8 @@ define('select2/utils',[], function () {
for (var m = 0; m < decoratedMethods.length; m++) { for (var m = 0; m < decoratedMethods.length; m++) {
var methodName = decoratedMethods[m]; var methodName = decoratedMethods[m];
function calledMethod (methodName) {
// Stub out the original method if it's not decorating an actual method
var originalMethod = function () {}; var originalMethod = function () {};
if (methodName in DecoratedClass.prototype) { if (methodName in DecoratedClass.prototype) {
@ -510,15 +512,16 @@ define('select2/utils',[], function () {
var decoratedMethod = DecoratorClass.prototype[methodName]; var decoratedMethod = DecoratorClass.prototype[methodName];
function calledMethod () { return function () {
var unshift = Array.prototype.unshift; var unshift = Array.prototype.unshift;
unshift.call(arguments, originalMethod); unshift.call(arguments, originalMethod);
return decoratedMethod.apply(this, arguments); return decoratedMethod.apply(this, arguments);
} }
}
DecoratedClass.prototype[methodName] = calledMethod; DecoratedClass.prototype[methodName] = calledMethod(methodName);
} }
return DecoratedClass; return DecoratedClass;
@ -703,8 +706,6 @@ define('select2/results',[
var $options = self.$results.find(".option"); var $options = self.$results.find(".option");
console.log($options);
$options.each(function () { $options.each(function () {
var $option = $(this); var $option = $(this);
var item = $option.data("data"); var item = $option.data("data");
@ -858,7 +859,7 @@ define('select2/options',[
this.dataAdapter = SelectData; this.dataAdapter = SelectData;
this.resultsAdapter = ResultsList; this.resultsAdapter = ResultsList;
this.dropdownAdapter = Dropdown; this.dropdownAdapter = Dropdown;
this.selectionAdapter = Selection; this.selectionAdapter = options.selectionAdapter || Selection;
} }
return Options; return Options;

23
playground/basic/basic.html
View File

@ -120,29 +120,6 @@
<option value="WV">West Virginia</option> <option value="WV">West Virginia</option>
</select> </select>
<div style="width: 300px; height: 300px; border: 1px solid black" tabindex="10" id="outer">
<div style="width:100px; height: 100px; border: 1px solid blue" id="inner"></div>
</div>
</div>
<div style="position: absolute; left:0; top:0; background: white; border: 1px solid red;" id="focus-spy">hello there
</div>
<script>
$(function () {
var el = $("#focus-spy");
$(window).bind("scroll", function () {
el.css({top: $(window).scrollTop()});
});
window.setInterval(function () {
var a = document.activeElement;
var b = $(a);
el.html("tag: " + a.tagName + " id:" + a.id + " class:" + b.attr("class") + " val:" + b.val());
}, 100);
});
</script>
<script> <script>
require(["select2/core"], function (Select2) { require(["select2/core"], function (Select2) {
var s2 = new Select2($("#source")); var s2 = new Select2($("#source"));

215
playground/basic/decorators.html Normal file
View File

@ -0,0 +1,215 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>QUnit Example</title>
<link href="../../dist/css/select2.css" rel="stylesheet"/>
<script src="../../vendor/almond-0.2.9.js" type="text/javascript"></script>
<script src="../../vendor/jquery-2.1.0.js" type="text/javascript"></script>
<script src="../../dist/js/select2.js"></script>
</head>
<body>
<input type="text" style="width:300px" autofocus/><br/>
<select style="width:300px" id="source">
<option value="AK">Alaska</option>
<option value="HI">Hawaii</option>
<option value="CA">California</option>
<option value="NV">Nevada</option>
<option value="OR">Oregon</option>
<option value="WA">Washington</option>
<option value="AZ">Arizona</option>
<option value="CO">Colorado</option>
<option value="ID">Idaho</option>
<option value="MT">Montana</option>
<option value="NE">Nebraska</option>
<option value="NM">New Mexico</option>
<option value="ND">North Dakota</option>
<option value="UT">Utah</option>
<option value="WY">Wyoming</option>
<option value="AL">Alabama</option>
<option value="AR">Arkansas</option>
<option value="IL">Illinois</option>
<option value="IA">Iowa</option>
<option value="KS">Kansas</option>
<option value="KY">Kentucky</option>
<option value="LA">Louisiana</option>
<option value="MN">Minnesota</option>
<option value="MS">Mississippi</option>
<option value="MO">Missouri</option>
<option value="OK">Oklahoma</option>
<option value="SD">South Dakota</option>
<option value="TX">Texas</option>
<option value="TN">Tennessee</option>
<option value="WI">Wisconsin</option>
<option value="CT">Connecticut</option>
<option value="DE">Delaware</option>
<option value="FL">Florida</option>
<option value="GA">Georgia</option>
<option value="IN">Indiana</option>
<option value="ME">Maine</option>
<option value="MD">Maryland</option>
<option value="MA">Massachusetts</option>
<option value="MI">Michigan</option>
<option value="NH">New Hampshire</option>
<option value="NJ">New Jersey</option>
<option value="NY">New York</option>
<option value="NC">North Carolina</option>
<option value="OH">Ohio</option>
<option value="PA">Pennsylvania</option>
<option value="RI">Rhode Island</option>
<option value="SC">South Carolina</option>
<option value="VT">Vermont</option>
<option value="VA">Virginia</option>
<option value="WV">West Virginia</option>
</select><br/>
<input type="text" style="width:300px" /><br/>
<select style="width:300px">
<option value="AK">Alaska</option>
<option value="HI">Hawaii</option>
<option value="CA">California</option>
<option value="NV">Nevada</option>
<option value="OR">Oregon</option>
<option value="WA">Washington</option>
<option value="AZ">Arizona</option>
<option value="CO">Colorado</option>
<option value="ID">Idaho</option>
<option value="MT">Montana</option>
<option value="NE">Nebraska</option>
<option value="NM">New Mexico</option>
<option value="ND">North Dakota</option>
<option value="UT">Utah</option>
<option value="WY">Wyoming</option>
<option value="AL">Alabama</option>
<option value="AR">Arkansas</option>
<option value="IL">Illinois</option>
<option value="IA">Iowa</option>
<option value="KS">Kansas</option>
<option value="KY">Kentucky</option>
<option value="LA">Louisiana</option>
<option value="MN">Minnesota</option>
<option value="MS">Mississippi</option>
<option value="MO">Missouri</option>
<option value="OK">Oklahoma</option>
<option value="SD">South Dakota</option>
<option value="TX">Texas</option>
<option value="TN">Tennessee</option>
<option value="WI">Wisconsin</option>
<option value="CT">Connecticut</option>
<option value="DE">Delaware</option>
<option value="FL">Florida</option>
<option value="GA">Georgia</option>
<option value="IN">Indiana</option>
<option value="ME">Maine</option>
<option value="MD">Maryland</option>
<option value="MA">Massachusetts</option>
<option value="MI">Michigan</option>
<option value="NH">New Hampshire</option>
<option value="NJ">New Jersey</option>
<option value="NY">New York</option>
<option value="NC">North Carolina</option>
<option value="OH">Ohio</option>
<option value="PA">Pennsylvania</option>
<option value="RI">Rhode Island</option>
<option value="SC">South Carolina</option>
<option value="VT">Vermont</option>
<option value="VA">Virginia</option>
<option value="WV">West Virginia</option>
</select>
<style>
.clear {
background-color: transparent;
border: none;
box-sizing: border-box;
color: #666;
cursor: pointer;
display: none;
font-size: 15px;
font-weight: bold;
height: 26px;
outline: 0;
position: absolute;
top: 1px;
right: 4px;
width: 26px;
}
.clear:hover {
color: #000;
}
.clearable {
padding-right: 31px;
}
.clearable .clear {
display: inline;
}
</style>
<script>
require(["select2/core", "select2/utils", "select2/selection"], function (Select2, Utils, Selection) {
function ClearSelection () { }
ClearSelection.prototype.render = function (decorated) {
var $selection = decorated.call(this);
var $clear = $(
'<button class="clear">&times;</button>'
)
$selection.append($clear);
$selection.addClass("clearable");
this.$clear = $clear;
return $selection;
};
ClearSelection.prototype.bind = function (decorated, $container) {
var self = this;
decorated.call(this, $container);
this.$container = $container;
this.$clear.on("click", function (evt) {
evt.stopPropagation();
var $first = $container.find("li").first();
$first.click();
});
};
ClearSelection.prototype.update = function (decorated, data) {
decorated.call(this, data);
if (data.length == 0 || this.$container.find("li").length == 0) {
this.$selection.removeClass("clearable");
return;
}
var firstOption = this.$container.find("li").first().data("data");
var firstData = data[0];
if (firstOption.id == firstData.id) {
this.$selection.removeClass("clearable");
} else {
this.$selection.addClass("clearable");
}
};
var CustomSelection = Utils.Decorate(Selection, ClearSelection);
var s2 = new Select2($("#source"), {
selectionAdapter: CustomSelection
});
});
</script>
</body>
</html>

2
src/js/select2/options.js vendored
View File

@ -10,7 +10,7 @@ define([
this.dataAdapter = SelectData; this.dataAdapter = SelectData;
this.resultsAdapter = ResultsList; this.resultsAdapter = ResultsList;
this.dropdownAdapter = Dropdown; this.dropdownAdapter = Dropdown;
this.selectionAdapter = Selection; this.selectionAdapter = options.selectionAdapter || Selection;
} }
return Options; return Options;

2
src/js/select2/results.js vendored
View File

@ -48,8 +48,6 @@ define([
var $options = self.$results.find(".option"); var $options = self.$results.find(".option");
console.log($options);
$options.each(function () { $options.each(function () {
var $option = $(this); var $option = $(this);
var item = $option.data("data"); var item = $option.data("data");

11
src/js/select2/utils.js vendored
View File

@ -46,13 +46,13 @@ define([], function () {
function DecoratedClass () { function DecoratedClass () {
var unshift = Array.prototype.unshift; var unshift = Array.prototype.unshift;
unshift.call(arguments, SuperClass.prototype.constructor);
var argCount = DecoratorClass.prototype.constructor.length; var argCount = DecoratorClass.prototype.constructor.length;
var calledConstructor = SuperClass.prototype.constructor; var calledConstructor = SuperClass.prototype.constructor;
if (argCount > 0) { if (argCount > 0) {
unshift.call(arguments, SuperClass.prototype.constructor);
calledConstructor = DecoratorClass.prototype.constructor; calledConstructor = DecoratorClass.prototype.constructor;
} }
@ -74,6 +74,8 @@ define([], function () {
for (var m = 0; m < decoratedMethods.length; m++) { for (var m = 0; m < decoratedMethods.length; m++) {
var methodName = decoratedMethods[m]; var methodName = decoratedMethods[m];
function calledMethod (methodName) {
// Stub out the original method if it's not decorating an actual method
var originalMethod = function () {}; var originalMethod = function () {};
if (methodName in DecoratedClass.prototype) { if (methodName in DecoratedClass.prototype) {
@ -82,15 +84,16 @@ define([], function () {
var decoratedMethod = DecoratorClass.prototype[methodName]; var decoratedMethod = DecoratorClass.prototype[methodName];
function calledMethod () { return function () {
var unshift = Array.prototype.unshift; var unshift = Array.prototype.unshift;
unshift.call(arguments, originalMethod); unshift.call(arguments, originalMethod);
return decoratedMethod.apply(this, arguments); return decoratedMethod.apply(this, arguments);
} }
}
DecoratedClass.prototype[methodName] = calledMethod; DecoratedClass.prototype[methodName] = calledMethod(methodName);
} }
return DecoratedClass; return DecoratedClass;