Working on rendering everything
This commit is contained in:
parent
06e195b025
commit
297a06f8d4
6
.editorconfig
Normal file
6
.editorconfig
Normal file
@ -0,0 +1,6 @@
|
|||||||
|
[*]
|
||||||
|
indent_style = space
|
||||||
|
end_of_line = lf
|
||||||
|
|
||||||
|
[*.js]
|
||||||
|
indent_size = 2
|
203
dist/js/select2.amd.full.js
vendored
203
dist/js/select2.amd.full.js
vendored
@ -54,44 +54,221 @@ define('select2/utils',[], function () {
|
|||||||
return Utils;
|
return Utils;
|
||||||
});
|
});
|
||||||
|
|
||||||
define('select2/adapters/select',[
|
define('select2/data/select',[
|
||||||
"../utils"
|
'../utils'
|
||||||
], function (Utils) {
|
], function (Utils) {
|
||||||
function SelectAdapter (element, options) {
|
function SelectAdapter ($element, options) {
|
||||||
this.element = element;
|
this.$element = $element;
|
||||||
}
|
}
|
||||||
|
|
||||||
Utils.Extend(SelectAdapter, Utils.Observable);
|
Utils.Extend(SelectAdapter, Utils.Observable);
|
||||||
|
|
||||||
|
SelectAdapter.prototype.current = function () {
|
||||||
|
var data = [];
|
||||||
|
var self = this;
|
||||||
|
|
||||||
|
this.$element.find(":selected").each(function () {
|
||||||
|
var $option = $(this);
|
||||||
|
|
||||||
|
var option = self.item($option);
|
||||||
|
|
||||||
|
data.push(option);
|
||||||
|
});
|
||||||
|
|
||||||
|
return data;
|
||||||
|
};
|
||||||
|
|
||||||
|
SelectAdapter.prototype.item = function ($option) {
|
||||||
|
var data = {
|
||||||
|
id: $option.val(),
|
||||||
|
text: $option.html()
|
||||||
|
};
|
||||||
|
|
||||||
|
return data;
|
||||||
|
};
|
||||||
|
|
||||||
return SelectAdapter;
|
return SelectAdapter;
|
||||||
});
|
});
|
||||||
|
|
||||||
|
define('select2/results',[
|
||||||
|
'./utils'
|
||||||
|
], function (Utils) {
|
||||||
|
function Results ($element, dataAdapter) {
|
||||||
|
this.$element = $element;
|
||||||
|
this.dataAdapter = dataAdapter;
|
||||||
|
}
|
||||||
|
|
||||||
|
Utils.Extend(Results, Utils.Observable);
|
||||||
|
|
||||||
|
Results.prototype.render = function () {
|
||||||
|
var $results = $(
|
||||||
|
'<ul class="options"></ul>'
|
||||||
|
);
|
||||||
|
|
||||||
|
return $results;
|
||||||
|
}
|
||||||
|
|
||||||
|
return Results;
|
||||||
|
})
|
||||||
|
;
|
||||||
|
define('select2/dropdown',[
|
||||||
|
'./utils'
|
||||||
|
], function (Utils) {
|
||||||
|
function Dropdown ($element, options) {
|
||||||
|
this.$element = $element;
|
||||||
|
}
|
||||||
|
|
||||||
|
Utils.Extend(Dropdown, Utils.Observable);
|
||||||
|
|
||||||
|
Dropdown.prototype.render = function () {
|
||||||
|
var $dropdown = $(
|
||||||
|
'<div class="select2 select2-dropdown">' +
|
||||||
|
'<div class="results"></div>' +
|
||||||
|
'</div>'
|
||||||
|
);
|
||||||
|
|
||||||
|
return $dropdown;
|
||||||
|
}
|
||||||
|
|
||||||
|
return Dropdown;
|
||||||
|
})
|
||||||
|
;
|
||||||
|
define('select2/selection',[
|
||||||
|
'./utils'
|
||||||
|
], function (Utils) {
|
||||||
|
function Selection ($element, options) {
|
||||||
|
this.$element = $element;
|
||||||
|
this.options = options;
|
||||||
|
}
|
||||||
|
|
||||||
|
Utils.Extend(Selection, Utils.Observable);
|
||||||
|
|
||||||
|
Selection.prototype.render = function () {
|
||||||
|
var $selection = $(
|
||||||
|
'<div class="single-select">' +
|
||||||
|
'<div class="rendered-selection"></div>' +
|
||||||
|
'</div>'
|
||||||
|
);
|
||||||
|
|
||||||
|
this.$selection = $selection;
|
||||||
|
|
||||||
|
return $selection;
|
||||||
|
}
|
||||||
|
|
||||||
|
Selection.prototype.bind = function ($container) {
|
||||||
|
var self = this;
|
||||||
|
|
||||||
|
$container.on('click', function (evt) {
|
||||||
|
self.trigger("toggle", {
|
||||||
|
originalEvent: evt
|
||||||
|
});
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
Selection.prototype.clear = function () {
|
||||||
|
this.$selection.find(".rendered-selection").text("");
|
||||||
|
}
|
||||||
|
|
||||||
|
Selection.prototype.display = function (data) {
|
||||||
|
return data.text;
|
||||||
|
}
|
||||||
|
|
||||||
|
Selection.prototype.update = function (data) {
|
||||||
|
if (data.length == 0) {
|
||||||
|
this.clear();
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
var selection = data[0];
|
||||||
|
|
||||||
|
var formatted = this.display(selection);
|
||||||
|
|
||||||
|
this.$selection.find(".rendered-selection").html(formatted);
|
||||||
|
}
|
||||||
|
|
||||||
|
return Selection;
|
||||||
|
});
|
||||||
|
|
||||||
define('select2/options',[
|
define('select2/options',[
|
||||||
"./adapters/select"
|
'./data/select',
|
||||||
], function (SelectAdapter) {
|
'./results',
|
||||||
|
'./dropdown',
|
||||||
|
'./selection'
|
||||||
|
], function (SelectData, ResultsList, Dropdown, Selection) {
|
||||||
function Options (options) {
|
function Options (options) {
|
||||||
this.options = options;
|
this.options = options;
|
||||||
|
|
||||||
this.DataAdapter = SelectAdapter;
|
this.dataAdapter = SelectData;
|
||||||
|
this.resultsAdapter = ResultsList;
|
||||||
|
this.dropdownAdapter = Dropdown;
|
||||||
|
this.selectionAdapter = Selection;
|
||||||
}
|
}
|
||||||
|
|
||||||
return Options;
|
return Options;
|
||||||
})
|
})
|
||||||
;
|
;
|
||||||
define('select2/core',[
|
define('select2/core',[
|
||||||
"jquery",
|
'jquery',
|
||||||
"./options",
|
'./options',
|
||||||
"./utils"
|
'./utils'
|
||||||
], function ($, Options, Utils) {
|
], function ($, Options, Utils) {
|
||||||
var Select2 = function (element, options) {
|
var Select2 = function ($element, options) {
|
||||||
this.element = element;
|
this.$element = $element;
|
||||||
this.options = new Options(options);
|
this.options = new Options(options);
|
||||||
|
|
||||||
this.adapter = new this.options.DataAdapter(element, options);
|
// Set up containers and adapters
|
||||||
|
|
||||||
|
this.data = new this.options.dataAdapter($element, options);
|
||||||
|
|
||||||
|
var $container = this.render();
|
||||||
|
|
||||||
|
$container.insertAfter(this.$element);
|
||||||
|
|
||||||
|
this.selection = new this.options.selectionAdapter($element, options);
|
||||||
|
|
||||||
|
var $selectionContainer = $container.find(".selection");
|
||||||
|
var $selection = this.selection.render();
|
||||||
|
|
||||||
|
$selectionContainer.append($selection);
|
||||||
|
|
||||||
|
this.dropdown = new this.options.dropdownAdapter($element, options);
|
||||||
|
|
||||||
|
var $dropdown = this.dropdown.render();
|
||||||
|
|
||||||
|
$dropdown.insertAfter($container);
|
||||||
|
|
||||||
|
this.results = new this.options.resultsAdapter($element, options);
|
||||||
|
|
||||||
|
var $resultsContainer = $dropdown.find(".results");
|
||||||
|
var $results = this.results.render();
|
||||||
|
|
||||||
|
$resultsContainer.append($results);
|
||||||
|
|
||||||
|
// Set the initial state
|
||||||
|
|
||||||
|
var initialData = this.data.current();
|
||||||
|
|
||||||
|
this.selection.update(initialData);
|
||||||
|
|
||||||
|
var self = this;
|
||||||
|
|
||||||
|
this.$element.on("change", function () {
|
||||||
|
self.selection.update(self.data.current());
|
||||||
|
})
|
||||||
};
|
};
|
||||||
|
|
||||||
Utils.Extend(Select2, Utils.Observable);
|
Utils.Extend(Select2, Utils.Observable);
|
||||||
|
|
||||||
|
Select2.prototype.render = function () {
|
||||||
|
var $container = $(
|
||||||
|
'<div class="select2 select2-container">' +
|
||||||
|
'<div class="selection"></div>' +
|
||||||
|
'</div>'
|
||||||
|
);
|
||||||
|
|
||||||
|
return $container;
|
||||||
|
};
|
||||||
|
|
||||||
return Select2;
|
return Select2;
|
||||||
});
|
});
|
||||||
|
|
||||||
|
203
dist/js/select2.amd.js
vendored
203
dist/js/select2.amd.js
vendored
@ -54,44 +54,221 @@ define('select2/utils',[], function () {
|
|||||||
return Utils;
|
return Utils;
|
||||||
});
|
});
|
||||||
|
|
||||||
define('select2/adapters/select',[
|
define('select2/data/select',[
|
||||||
"../utils"
|
'../utils'
|
||||||
], function (Utils) {
|
], function (Utils) {
|
||||||
function SelectAdapter (element, options) {
|
function SelectAdapter ($element, options) {
|
||||||
this.element = element;
|
this.$element = $element;
|
||||||
}
|
}
|
||||||
|
|
||||||
Utils.Extend(SelectAdapter, Utils.Observable);
|
Utils.Extend(SelectAdapter, Utils.Observable);
|
||||||
|
|
||||||
|
SelectAdapter.prototype.current = function () {
|
||||||
|
var data = [];
|
||||||
|
var self = this;
|
||||||
|
|
||||||
|
this.$element.find(":selected").each(function () {
|
||||||
|
var $option = $(this);
|
||||||
|
|
||||||
|
var option = self.item($option);
|
||||||
|
|
||||||
|
data.push(option);
|
||||||
|
});
|
||||||
|
|
||||||
|
return data;
|
||||||
|
};
|
||||||
|
|
||||||
|
SelectAdapter.prototype.item = function ($option) {
|
||||||
|
var data = {
|
||||||
|
id: $option.val(),
|
||||||
|
text: $option.html()
|
||||||
|
};
|
||||||
|
|
||||||
|
return data;
|
||||||
|
};
|
||||||
|
|
||||||
return SelectAdapter;
|
return SelectAdapter;
|
||||||
});
|
});
|
||||||
|
|
||||||
|
define('select2/results',[
|
||||||
|
'./utils'
|
||||||
|
], function (Utils) {
|
||||||
|
function Results ($element, dataAdapter) {
|
||||||
|
this.$element = $element;
|
||||||
|
this.dataAdapter = dataAdapter;
|
||||||
|
}
|
||||||
|
|
||||||
|
Utils.Extend(Results, Utils.Observable);
|
||||||
|
|
||||||
|
Results.prototype.render = function () {
|
||||||
|
var $results = $(
|
||||||
|
'<ul class="options"></ul>'
|
||||||
|
);
|
||||||
|
|
||||||
|
return $results;
|
||||||
|
}
|
||||||
|
|
||||||
|
return Results;
|
||||||
|
})
|
||||||
|
;
|
||||||
|
define('select2/dropdown',[
|
||||||
|
'./utils'
|
||||||
|
], function (Utils) {
|
||||||
|
function Dropdown ($element, options) {
|
||||||
|
this.$element = $element;
|
||||||
|
}
|
||||||
|
|
||||||
|
Utils.Extend(Dropdown, Utils.Observable);
|
||||||
|
|
||||||
|
Dropdown.prototype.render = function () {
|
||||||
|
var $dropdown = $(
|
||||||
|
'<div class="select2 select2-dropdown">' +
|
||||||
|
'<div class="results"></div>' +
|
||||||
|
'</div>'
|
||||||
|
);
|
||||||
|
|
||||||
|
return $dropdown;
|
||||||
|
}
|
||||||
|
|
||||||
|
return Dropdown;
|
||||||
|
})
|
||||||
|
;
|
||||||
|
define('select2/selection',[
|
||||||
|
'./utils'
|
||||||
|
], function (Utils) {
|
||||||
|
function Selection ($element, options) {
|
||||||
|
this.$element = $element;
|
||||||
|
this.options = options;
|
||||||
|
}
|
||||||
|
|
||||||
|
Utils.Extend(Selection, Utils.Observable);
|
||||||
|
|
||||||
|
Selection.prototype.render = function () {
|
||||||
|
var $selection = $(
|
||||||
|
'<div class="single-select">' +
|
||||||
|
'<div class="rendered-selection"></div>' +
|
||||||
|
'</div>'
|
||||||
|
);
|
||||||
|
|
||||||
|
this.$selection = $selection;
|
||||||
|
|
||||||
|
return $selection;
|
||||||
|
}
|
||||||
|
|
||||||
|
Selection.prototype.bind = function ($container) {
|
||||||
|
var self = this;
|
||||||
|
|
||||||
|
$container.on('click', function (evt) {
|
||||||
|
self.trigger("toggle", {
|
||||||
|
originalEvent: evt
|
||||||
|
});
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
Selection.prototype.clear = function () {
|
||||||
|
this.$selection.find(".rendered-selection").text("");
|
||||||
|
}
|
||||||
|
|
||||||
|
Selection.prototype.display = function (data) {
|
||||||
|
return data.text;
|
||||||
|
}
|
||||||
|
|
||||||
|
Selection.prototype.update = function (data) {
|
||||||
|
if (data.length == 0) {
|
||||||
|
this.clear();
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
var selection = data[0];
|
||||||
|
|
||||||
|
var formatted = this.display(selection);
|
||||||
|
|
||||||
|
this.$selection.find(".rendered-selection").html(formatted);
|
||||||
|
}
|
||||||
|
|
||||||
|
return Selection;
|
||||||
|
});
|
||||||
|
|
||||||
define('select2/options',[
|
define('select2/options',[
|
||||||
"./adapters/select"
|
'./data/select',
|
||||||
], function (SelectAdapter) {
|
'./results',
|
||||||
|
'./dropdown',
|
||||||
|
'./selection'
|
||||||
|
], function (SelectData, ResultsList, Dropdown, Selection) {
|
||||||
function Options (options) {
|
function Options (options) {
|
||||||
this.options = options;
|
this.options = options;
|
||||||
|
|
||||||
this.DataAdapter = SelectAdapter;
|
this.dataAdapter = SelectData;
|
||||||
|
this.resultsAdapter = ResultsList;
|
||||||
|
this.dropdownAdapter = Dropdown;
|
||||||
|
this.selectionAdapter = Selection;
|
||||||
}
|
}
|
||||||
|
|
||||||
return Options;
|
return Options;
|
||||||
})
|
})
|
||||||
;
|
;
|
||||||
define('select2/core',[
|
define('select2/core',[
|
||||||
"jquery",
|
'jquery',
|
||||||
"./options",
|
'./options',
|
||||||
"./utils"
|
'./utils'
|
||||||
], function ($, Options, Utils) {
|
], function ($, Options, Utils) {
|
||||||
var Select2 = function (element, options) {
|
var Select2 = function ($element, options) {
|
||||||
this.element = element;
|
this.$element = $element;
|
||||||
this.options = new Options(options);
|
this.options = new Options(options);
|
||||||
|
|
||||||
this.adapter = new this.options.DataAdapter(element, options);
|
// Set up containers and adapters
|
||||||
|
|
||||||
|
this.data = new this.options.dataAdapter($element, options);
|
||||||
|
|
||||||
|
var $container = this.render();
|
||||||
|
|
||||||
|
$container.insertAfter(this.$element);
|
||||||
|
|
||||||
|
this.selection = new this.options.selectionAdapter($element, options);
|
||||||
|
|
||||||
|
var $selectionContainer = $container.find(".selection");
|
||||||
|
var $selection = this.selection.render();
|
||||||
|
|
||||||
|
$selectionContainer.append($selection);
|
||||||
|
|
||||||
|
this.dropdown = new this.options.dropdownAdapter($element, options);
|
||||||
|
|
||||||
|
var $dropdown = this.dropdown.render();
|
||||||
|
|
||||||
|
$dropdown.insertAfter($container);
|
||||||
|
|
||||||
|
this.results = new this.options.resultsAdapter($element, options);
|
||||||
|
|
||||||
|
var $resultsContainer = $dropdown.find(".results");
|
||||||
|
var $results = this.results.render();
|
||||||
|
|
||||||
|
$resultsContainer.append($results);
|
||||||
|
|
||||||
|
// Set the initial state
|
||||||
|
|
||||||
|
var initialData = this.data.current();
|
||||||
|
|
||||||
|
this.selection.update(initialData);
|
||||||
|
|
||||||
|
var self = this;
|
||||||
|
|
||||||
|
this.$element.on("change", function () {
|
||||||
|
self.selection.update(self.data.current());
|
||||||
|
})
|
||||||
};
|
};
|
||||||
|
|
||||||
Utils.Extend(Select2, Utils.Observable);
|
Utils.Extend(Select2, Utils.Observable);
|
||||||
|
|
||||||
|
Select2.prototype.render = function () {
|
||||||
|
var $container = $(
|
||||||
|
'<div class="select2 select2-container">' +
|
||||||
|
'<div class="selection"></div>' +
|
||||||
|
'</div>'
|
||||||
|
);
|
||||||
|
|
||||||
|
return $container;
|
||||||
|
};
|
||||||
|
|
||||||
return Select2;
|
return Select2;
|
||||||
});
|
});
|
||||||
|
|
||||||
|
203
dist/js/select2.full.js
vendored
203
dist/js/select2.full.js
vendored
@ -9591,44 +9591,221 @@ define('select2/utils',[], function () {
|
|||||||
return Utils;
|
return Utils;
|
||||||
});
|
});
|
||||||
|
|
||||||
define('select2/adapters/select',[
|
define('select2/data/select',[
|
||||||
"../utils"
|
'../utils'
|
||||||
], function (Utils) {
|
], function (Utils) {
|
||||||
function SelectAdapter (element, options) {
|
function SelectAdapter ($element, options) {
|
||||||
this.element = element;
|
this.$element = $element;
|
||||||
}
|
}
|
||||||
|
|
||||||
Utils.Extend(SelectAdapter, Utils.Observable);
|
Utils.Extend(SelectAdapter, Utils.Observable);
|
||||||
|
|
||||||
|
SelectAdapter.prototype.current = function () {
|
||||||
|
var data = [];
|
||||||
|
var self = this;
|
||||||
|
|
||||||
|
this.$element.find(":selected").each(function () {
|
||||||
|
var $option = $(this);
|
||||||
|
|
||||||
|
var option = self.item($option);
|
||||||
|
|
||||||
|
data.push(option);
|
||||||
|
});
|
||||||
|
|
||||||
|
return data;
|
||||||
|
};
|
||||||
|
|
||||||
|
SelectAdapter.prototype.item = function ($option) {
|
||||||
|
var data = {
|
||||||
|
id: $option.val(),
|
||||||
|
text: $option.html()
|
||||||
|
};
|
||||||
|
|
||||||
|
return data;
|
||||||
|
};
|
||||||
|
|
||||||
return SelectAdapter;
|
return SelectAdapter;
|
||||||
});
|
});
|
||||||
|
|
||||||
|
define('select2/results',[
|
||||||
|
'./utils'
|
||||||
|
], function (Utils) {
|
||||||
|
function Results ($element, dataAdapter) {
|
||||||
|
this.$element = $element;
|
||||||
|
this.dataAdapter = dataAdapter;
|
||||||
|
}
|
||||||
|
|
||||||
|
Utils.Extend(Results, Utils.Observable);
|
||||||
|
|
||||||
|
Results.prototype.render = function () {
|
||||||
|
var $results = $(
|
||||||
|
'<ul class="options"></ul>'
|
||||||
|
);
|
||||||
|
|
||||||
|
return $results;
|
||||||
|
}
|
||||||
|
|
||||||
|
return Results;
|
||||||
|
})
|
||||||
|
;
|
||||||
|
define('select2/dropdown',[
|
||||||
|
'./utils'
|
||||||
|
], function (Utils) {
|
||||||
|
function Dropdown ($element, options) {
|
||||||
|
this.$element = $element;
|
||||||
|
}
|
||||||
|
|
||||||
|
Utils.Extend(Dropdown, Utils.Observable);
|
||||||
|
|
||||||
|
Dropdown.prototype.render = function () {
|
||||||
|
var $dropdown = $(
|
||||||
|
'<div class="select2 select2-dropdown">' +
|
||||||
|
'<div class="results"></div>' +
|
||||||
|
'</div>'
|
||||||
|
);
|
||||||
|
|
||||||
|
return $dropdown;
|
||||||
|
}
|
||||||
|
|
||||||
|
return Dropdown;
|
||||||
|
})
|
||||||
|
;
|
||||||
|
define('select2/selection',[
|
||||||
|
'./utils'
|
||||||
|
], function (Utils) {
|
||||||
|
function Selection ($element, options) {
|
||||||
|
this.$element = $element;
|
||||||
|
this.options = options;
|
||||||
|
}
|
||||||
|
|
||||||
|
Utils.Extend(Selection, Utils.Observable);
|
||||||
|
|
||||||
|
Selection.prototype.render = function () {
|
||||||
|
var $selection = $(
|
||||||
|
'<div class="single-select">' +
|
||||||
|
'<div class="rendered-selection"></div>' +
|
||||||
|
'</div>'
|
||||||
|
);
|
||||||
|
|
||||||
|
this.$selection = $selection;
|
||||||
|
|
||||||
|
return $selection;
|
||||||
|
}
|
||||||
|
|
||||||
|
Selection.prototype.bind = function ($container) {
|
||||||
|
var self = this;
|
||||||
|
|
||||||
|
$container.on('click', function (evt) {
|
||||||
|
self.trigger("toggle", {
|
||||||
|
originalEvent: evt
|
||||||
|
});
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
Selection.prototype.clear = function () {
|
||||||
|
this.$selection.find(".rendered-selection").text("");
|
||||||
|
}
|
||||||
|
|
||||||
|
Selection.prototype.display = function (data) {
|
||||||
|
return data.text;
|
||||||
|
}
|
||||||
|
|
||||||
|
Selection.prototype.update = function (data) {
|
||||||
|
if (data.length == 0) {
|
||||||
|
this.clear();
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
var selection = data[0];
|
||||||
|
|
||||||
|
var formatted = this.display(selection);
|
||||||
|
|
||||||
|
this.$selection.find(".rendered-selection").html(formatted);
|
||||||
|
}
|
||||||
|
|
||||||
|
return Selection;
|
||||||
|
});
|
||||||
|
|
||||||
define('select2/options',[
|
define('select2/options',[
|
||||||
"./adapters/select"
|
'./data/select',
|
||||||
], function (SelectAdapter) {
|
'./results',
|
||||||
|
'./dropdown',
|
||||||
|
'./selection'
|
||||||
|
], function (SelectData, ResultsList, Dropdown, Selection) {
|
||||||
function Options (options) {
|
function Options (options) {
|
||||||
this.options = options;
|
this.options = options;
|
||||||
|
|
||||||
this.DataAdapter = SelectAdapter;
|
this.dataAdapter = SelectData;
|
||||||
|
this.resultsAdapter = ResultsList;
|
||||||
|
this.dropdownAdapter = Dropdown;
|
||||||
|
this.selectionAdapter = Selection;
|
||||||
}
|
}
|
||||||
|
|
||||||
return Options;
|
return Options;
|
||||||
})
|
})
|
||||||
;
|
;
|
||||||
define('select2/core',[
|
define('select2/core',[
|
||||||
"jquery",
|
'jquery',
|
||||||
"./options",
|
'./options',
|
||||||
"./utils"
|
'./utils'
|
||||||
], function ($, Options, Utils) {
|
], function ($, Options, Utils) {
|
||||||
var Select2 = function (element, options) {
|
var Select2 = function ($element, options) {
|
||||||
this.element = element;
|
this.$element = $element;
|
||||||
this.options = new Options(options);
|
this.options = new Options(options);
|
||||||
|
|
||||||
this.adapter = new this.options.DataAdapter(element, options);
|
// Set up containers and adapters
|
||||||
|
|
||||||
|
this.data = new this.options.dataAdapter($element, options);
|
||||||
|
|
||||||
|
var $container = this.render();
|
||||||
|
|
||||||
|
$container.insertAfter(this.$element);
|
||||||
|
|
||||||
|
this.selection = new this.options.selectionAdapter($element, options);
|
||||||
|
|
||||||
|
var $selectionContainer = $container.find(".selection");
|
||||||
|
var $selection = this.selection.render();
|
||||||
|
|
||||||
|
$selectionContainer.append($selection);
|
||||||
|
|
||||||
|
this.dropdown = new this.options.dropdownAdapter($element, options);
|
||||||
|
|
||||||
|
var $dropdown = this.dropdown.render();
|
||||||
|
|
||||||
|
$dropdown.insertAfter($container);
|
||||||
|
|
||||||
|
this.results = new this.options.resultsAdapter($element, options);
|
||||||
|
|
||||||
|
var $resultsContainer = $dropdown.find(".results");
|
||||||
|
var $results = this.results.render();
|
||||||
|
|
||||||
|
$resultsContainer.append($results);
|
||||||
|
|
||||||
|
// Set the initial state
|
||||||
|
|
||||||
|
var initialData = this.data.current();
|
||||||
|
|
||||||
|
this.selection.update(initialData);
|
||||||
|
|
||||||
|
var self = this;
|
||||||
|
|
||||||
|
this.$element.on("change", function () {
|
||||||
|
self.selection.update(self.data.current());
|
||||||
|
})
|
||||||
};
|
};
|
||||||
|
|
||||||
Utils.Extend(Select2, Utils.Observable);
|
Utils.Extend(Select2, Utils.Observable);
|
||||||
|
|
||||||
|
Select2.prototype.render = function () {
|
||||||
|
var $container = $(
|
||||||
|
'<div class="select2 select2-container">' +
|
||||||
|
'<div class="selection"></div>' +
|
||||||
|
'</div>'
|
||||||
|
);
|
||||||
|
|
||||||
|
return $container;
|
||||||
|
};
|
||||||
|
|
||||||
return Select2;
|
return Select2;
|
||||||
});
|
});
|
||||||
|
|
||||||
|
203
dist/js/select2.js
vendored
203
dist/js/select2.js
vendored
@ -482,44 +482,221 @@ define('select2/utils',[], function () {
|
|||||||
return Utils;
|
return Utils;
|
||||||
});
|
});
|
||||||
|
|
||||||
define('select2/adapters/select',[
|
define('select2/data/select',[
|
||||||
"../utils"
|
'../utils'
|
||||||
], function (Utils) {
|
], function (Utils) {
|
||||||
function SelectAdapter (element, options) {
|
function SelectAdapter ($element, options) {
|
||||||
this.element = element;
|
this.$element = $element;
|
||||||
}
|
}
|
||||||
|
|
||||||
Utils.Extend(SelectAdapter, Utils.Observable);
|
Utils.Extend(SelectAdapter, Utils.Observable);
|
||||||
|
|
||||||
|
SelectAdapter.prototype.current = function () {
|
||||||
|
var data = [];
|
||||||
|
var self = this;
|
||||||
|
|
||||||
|
this.$element.find(":selected").each(function () {
|
||||||
|
var $option = $(this);
|
||||||
|
|
||||||
|
var option = self.item($option);
|
||||||
|
|
||||||
|
data.push(option);
|
||||||
|
});
|
||||||
|
|
||||||
|
return data;
|
||||||
|
};
|
||||||
|
|
||||||
|
SelectAdapter.prototype.item = function ($option) {
|
||||||
|
var data = {
|
||||||
|
id: $option.val(),
|
||||||
|
text: $option.html()
|
||||||
|
};
|
||||||
|
|
||||||
|
return data;
|
||||||
|
};
|
||||||
|
|
||||||
return SelectAdapter;
|
return SelectAdapter;
|
||||||
});
|
});
|
||||||
|
|
||||||
|
define('select2/results',[
|
||||||
|
'./utils'
|
||||||
|
], function (Utils) {
|
||||||
|
function Results ($element, dataAdapter) {
|
||||||
|
this.$element = $element;
|
||||||
|
this.dataAdapter = dataAdapter;
|
||||||
|
}
|
||||||
|
|
||||||
|
Utils.Extend(Results, Utils.Observable);
|
||||||
|
|
||||||
|
Results.prototype.render = function () {
|
||||||
|
var $results = $(
|
||||||
|
'<ul class="options"></ul>'
|
||||||
|
);
|
||||||
|
|
||||||
|
return $results;
|
||||||
|
}
|
||||||
|
|
||||||
|
return Results;
|
||||||
|
})
|
||||||
|
;
|
||||||
|
define('select2/dropdown',[
|
||||||
|
'./utils'
|
||||||
|
], function (Utils) {
|
||||||
|
function Dropdown ($element, options) {
|
||||||
|
this.$element = $element;
|
||||||
|
}
|
||||||
|
|
||||||
|
Utils.Extend(Dropdown, Utils.Observable);
|
||||||
|
|
||||||
|
Dropdown.prototype.render = function () {
|
||||||
|
var $dropdown = $(
|
||||||
|
'<div class="select2 select2-dropdown">' +
|
||||||
|
'<div class="results"></div>' +
|
||||||
|
'</div>'
|
||||||
|
);
|
||||||
|
|
||||||
|
return $dropdown;
|
||||||
|
}
|
||||||
|
|
||||||
|
return Dropdown;
|
||||||
|
})
|
||||||
|
;
|
||||||
|
define('select2/selection',[
|
||||||
|
'./utils'
|
||||||
|
], function (Utils) {
|
||||||
|
function Selection ($element, options) {
|
||||||
|
this.$element = $element;
|
||||||
|
this.options = options;
|
||||||
|
}
|
||||||
|
|
||||||
|
Utils.Extend(Selection, Utils.Observable);
|
||||||
|
|
||||||
|
Selection.prototype.render = function () {
|
||||||
|
var $selection = $(
|
||||||
|
'<div class="single-select">' +
|
||||||
|
'<div class="rendered-selection"></div>' +
|
||||||
|
'</div>'
|
||||||
|
);
|
||||||
|
|
||||||
|
this.$selection = $selection;
|
||||||
|
|
||||||
|
return $selection;
|
||||||
|
}
|
||||||
|
|
||||||
|
Selection.prototype.bind = function ($container) {
|
||||||
|
var self = this;
|
||||||
|
|
||||||
|
$container.on('click', function (evt) {
|
||||||
|
self.trigger("toggle", {
|
||||||
|
originalEvent: evt
|
||||||
|
});
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
Selection.prototype.clear = function () {
|
||||||
|
this.$selection.find(".rendered-selection").text("");
|
||||||
|
}
|
||||||
|
|
||||||
|
Selection.prototype.display = function (data) {
|
||||||
|
return data.text;
|
||||||
|
}
|
||||||
|
|
||||||
|
Selection.prototype.update = function (data) {
|
||||||
|
if (data.length == 0) {
|
||||||
|
this.clear();
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
var selection = data[0];
|
||||||
|
|
||||||
|
var formatted = this.display(selection);
|
||||||
|
|
||||||
|
this.$selection.find(".rendered-selection").html(formatted);
|
||||||
|
}
|
||||||
|
|
||||||
|
return Selection;
|
||||||
|
});
|
||||||
|
|
||||||
define('select2/options',[
|
define('select2/options',[
|
||||||
"./adapters/select"
|
'./data/select',
|
||||||
], function (SelectAdapter) {
|
'./results',
|
||||||
|
'./dropdown',
|
||||||
|
'./selection'
|
||||||
|
], function (SelectData, ResultsList, Dropdown, Selection) {
|
||||||
function Options (options) {
|
function Options (options) {
|
||||||
this.options = options;
|
this.options = options;
|
||||||
|
|
||||||
this.DataAdapter = SelectAdapter;
|
this.dataAdapter = SelectData;
|
||||||
|
this.resultsAdapter = ResultsList;
|
||||||
|
this.dropdownAdapter = Dropdown;
|
||||||
|
this.selectionAdapter = Selection;
|
||||||
}
|
}
|
||||||
|
|
||||||
return Options;
|
return Options;
|
||||||
})
|
})
|
||||||
;
|
;
|
||||||
define('select2/core',[
|
define('select2/core',[
|
||||||
"jquery",
|
'jquery',
|
||||||
"./options",
|
'./options',
|
||||||
"./utils"
|
'./utils'
|
||||||
], function ($, Options, Utils) {
|
], function ($, Options, Utils) {
|
||||||
var Select2 = function (element, options) {
|
var Select2 = function ($element, options) {
|
||||||
this.element = element;
|
this.$element = $element;
|
||||||
this.options = new Options(options);
|
this.options = new Options(options);
|
||||||
|
|
||||||
this.adapter = new this.options.DataAdapter(element, options);
|
// Set up containers and adapters
|
||||||
|
|
||||||
|
this.data = new this.options.dataAdapter($element, options);
|
||||||
|
|
||||||
|
var $container = this.render();
|
||||||
|
|
||||||
|
$container.insertAfter(this.$element);
|
||||||
|
|
||||||
|
this.selection = new this.options.selectionAdapter($element, options);
|
||||||
|
|
||||||
|
var $selectionContainer = $container.find(".selection");
|
||||||
|
var $selection = this.selection.render();
|
||||||
|
|
||||||
|
$selectionContainer.append($selection);
|
||||||
|
|
||||||
|
this.dropdown = new this.options.dropdownAdapter($element, options);
|
||||||
|
|
||||||
|
var $dropdown = this.dropdown.render();
|
||||||
|
|
||||||
|
$dropdown.insertAfter($container);
|
||||||
|
|
||||||
|
this.results = new this.options.resultsAdapter($element, options);
|
||||||
|
|
||||||
|
var $resultsContainer = $dropdown.find(".results");
|
||||||
|
var $results = this.results.render();
|
||||||
|
|
||||||
|
$resultsContainer.append($results);
|
||||||
|
|
||||||
|
// Set the initial state
|
||||||
|
|
||||||
|
var initialData = this.data.current();
|
||||||
|
|
||||||
|
this.selection.update(initialData);
|
||||||
|
|
||||||
|
var self = this;
|
||||||
|
|
||||||
|
this.$element.on("change", function () {
|
||||||
|
self.selection.update(self.data.current());
|
||||||
|
})
|
||||||
};
|
};
|
||||||
|
|
||||||
Utils.Extend(Select2, Utils.Observable);
|
Utils.Extend(Select2, Utils.Observable);
|
||||||
|
|
||||||
|
Select2.prototype.render = function () {
|
||||||
|
var $container = $(
|
||||||
|
'<div class="select2 select2-container">' +
|
||||||
|
'<div class="selection"></div>' +
|
||||||
|
'</div>'
|
||||||
|
);
|
||||||
|
|
||||||
|
return $container;
|
||||||
|
};
|
||||||
|
|
||||||
return Select2;
|
return Select2;
|
||||||
});
|
});
|
||||||
|
|
||||||
|
11
src/js/select2/adapters/select.js
vendored
11
src/js/select2/adapters/select.js
vendored
@ -1,11 +0,0 @@
|
|||||||
define([
|
|
||||||
"../utils"
|
|
||||||
], function (Utils) {
|
|
||||||
function SelectAdapter (element, options) {
|
|
||||||
this.element = element;
|
|
||||||
}
|
|
||||||
|
|
||||||
Utils.Extend(SelectAdapter, Utils.Observable);
|
|
||||||
|
|
||||||
return SelectAdapter;
|
|
||||||
});
|
|
60
src/js/select2/core.js
vendored
60
src/js/select2/core.js
vendored
@ -1,16 +1,64 @@
|
|||||||
define([
|
define([
|
||||||
"jquery",
|
'jquery',
|
||||||
"./options",
|
'./options',
|
||||||
"./utils"
|
'./utils'
|
||||||
], function ($, Options, Utils) {
|
], function ($, Options, Utils) {
|
||||||
var Select2 = function (element, options) {
|
var Select2 = function ($element, options) {
|
||||||
this.element = element;
|
this.$element = $element;
|
||||||
this.options = new Options(options);
|
this.options = new Options(options);
|
||||||
|
|
||||||
this.adapter = new this.options.DataAdapter(element, options);
|
// Set up containers and adapters
|
||||||
|
|
||||||
|
this.data = new this.options.dataAdapter($element, options);
|
||||||
|
|
||||||
|
var $container = this.render();
|
||||||
|
|
||||||
|
$container.insertAfter(this.$element);
|
||||||
|
|
||||||
|
this.selection = new this.options.selectionAdapter($element, options);
|
||||||
|
|
||||||
|
var $selectionContainer = $container.find(".selection");
|
||||||
|
var $selection = this.selection.render();
|
||||||
|
|
||||||
|
$selectionContainer.append($selection);
|
||||||
|
|
||||||
|
this.dropdown = new this.options.dropdownAdapter($element, options);
|
||||||
|
|
||||||
|
var $dropdown = this.dropdown.render();
|
||||||
|
|
||||||
|
$dropdown.insertAfter($container);
|
||||||
|
|
||||||
|
this.results = new this.options.resultsAdapter($element, options);
|
||||||
|
|
||||||
|
var $resultsContainer = $dropdown.find(".results");
|
||||||
|
var $results = this.results.render();
|
||||||
|
|
||||||
|
$resultsContainer.append($results);
|
||||||
|
|
||||||
|
// Set the initial state
|
||||||
|
|
||||||
|
var initialData = this.data.current();
|
||||||
|
|
||||||
|
this.selection.update(initialData);
|
||||||
|
|
||||||
|
var self = this;
|
||||||
|
|
||||||
|
this.$element.on("change", function () {
|
||||||
|
self.selection.update(self.data.current());
|
||||||
|
})
|
||||||
};
|
};
|
||||||
|
|
||||||
Utils.Extend(Select2, Utils.Observable);
|
Utils.Extend(Select2, Utils.Observable);
|
||||||
|
|
||||||
|
Select2.prototype.render = function () {
|
||||||
|
var $container = $(
|
||||||
|
'<div class="select2 select2-container">' +
|
||||||
|
'<div class="selection"></div>' +
|
||||||
|
'</div>'
|
||||||
|
);
|
||||||
|
|
||||||
|
return $container;
|
||||||
|
};
|
||||||
|
|
||||||
return Select2;
|
return Select2;
|
||||||
});
|
});
|
||||||
|
35
src/js/select2/data/select.js
vendored
Normal file
35
src/js/select2/data/select.js
vendored
Normal file
@ -0,0 +1,35 @@
|
|||||||
|
define([
|
||||||
|
'../utils'
|
||||||
|
], function (Utils) {
|
||||||
|
function SelectAdapter ($element, options) {
|
||||||
|
this.$element = $element;
|
||||||
|
}
|
||||||
|
|
||||||
|
Utils.Extend(SelectAdapter, Utils.Observable);
|
||||||
|
|
||||||
|
SelectAdapter.prototype.current = function () {
|
||||||
|
var data = [];
|
||||||
|
var self = this;
|
||||||
|
|
||||||
|
this.$element.find(":selected").each(function () {
|
||||||
|
var $option = $(this);
|
||||||
|
|
||||||
|
var option = self.item($option);
|
||||||
|
|
||||||
|
data.push(option);
|
||||||
|
});
|
||||||
|
|
||||||
|
return data;
|
||||||
|
};
|
||||||
|
|
||||||
|
SelectAdapter.prototype.item = function ($option) {
|
||||||
|
var data = {
|
||||||
|
id: $option.val(),
|
||||||
|
text: $option.html()
|
||||||
|
};
|
||||||
|
|
||||||
|
return data;
|
||||||
|
};
|
||||||
|
|
||||||
|
return SelectAdapter;
|
||||||
|
});
|
21
src/js/select2/dropdown.js
vendored
Normal file
21
src/js/select2/dropdown.js
vendored
Normal file
@ -0,0 +1,21 @@
|
|||||||
|
define([
|
||||||
|
'./utils'
|
||||||
|
], function (Utils) {
|
||||||
|
function Dropdown ($element, options) {
|
||||||
|
this.$element = $element;
|
||||||
|
}
|
||||||
|
|
||||||
|
Utils.Extend(Dropdown, Utils.Observable);
|
||||||
|
|
||||||
|
Dropdown.prototype.render = function () {
|
||||||
|
var $dropdown = $(
|
||||||
|
'<div class="select2 select2-dropdown">' +
|
||||||
|
'<div class="results"></div>' +
|
||||||
|
'</div>'
|
||||||
|
);
|
||||||
|
|
||||||
|
return $dropdown;
|
||||||
|
}
|
||||||
|
|
||||||
|
return Dropdown;
|
||||||
|
})
|
12
src/js/select2/options.js
vendored
12
src/js/select2/options.js
vendored
@ -1,10 +1,16 @@
|
|||||||
define([
|
define([
|
||||||
"./adapters/select"
|
'./data/select',
|
||||||
], function (SelectAdapter) {
|
'./results',
|
||||||
|
'./dropdown',
|
||||||
|
'./selection'
|
||||||
|
], function (SelectData, ResultsList, Dropdown, Selection) {
|
||||||
function Options (options) {
|
function Options (options) {
|
||||||
this.options = options;
|
this.options = options;
|
||||||
|
|
||||||
this.DataAdapter = SelectAdapter;
|
this.dataAdapter = SelectData;
|
||||||
|
this.resultsAdapter = ResultsList;
|
||||||
|
this.dropdownAdapter = Dropdown;
|
||||||
|
this.selectionAdapter = Selection;
|
||||||
}
|
}
|
||||||
|
|
||||||
return Options;
|
return Options;
|
||||||
|
20
src/js/select2/results.js
vendored
Normal file
20
src/js/select2/results.js
vendored
Normal file
@ -0,0 +1,20 @@
|
|||||||
|
define([
|
||||||
|
'./utils'
|
||||||
|
], function (Utils) {
|
||||||
|
function Results ($element, dataAdapter) {
|
||||||
|
this.$element = $element;
|
||||||
|
this.dataAdapter = dataAdapter;
|
||||||
|
}
|
||||||
|
|
||||||
|
Utils.Extend(Results, Utils.Observable);
|
||||||
|
|
||||||
|
Results.prototype.render = function () {
|
||||||
|
var $results = $(
|
||||||
|
'<ul class="options"></ul>'
|
||||||
|
);
|
||||||
|
|
||||||
|
return $results;
|
||||||
|
}
|
||||||
|
|
||||||
|
return Results;
|
||||||
|
})
|
55
src/js/select2/selection.js
vendored
Normal file
55
src/js/select2/selection.js
vendored
Normal file
@ -0,0 +1,55 @@
|
|||||||
|
define([
|
||||||
|
'./utils'
|
||||||
|
], function (Utils) {
|
||||||
|
function Selection ($element, options) {
|
||||||
|
this.$element = $element;
|
||||||
|
this.options = options;
|
||||||
|
}
|
||||||
|
|
||||||
|
Utils.Extend(Selection, Utils.Observable);
|
||||||
|
|
||||||
|
Selection.prototype.render = function () {
|
||||||
|
var $selection = $(
|
||||||
|
'<div class="single-select">' +
|
||||||
|
'<div class="rendered-selection"></div>' +
|
||||||
|
'</div>'
|
||||||
|
);
|
||||||
|
|
||||||
|
this.$selection = $selection;
|
||||||
|
|
||||||
|
return $selection;
|
||||||
|
}
|
||||||
|
|
||||||
|
Selection.prototype.bind = function ($container) {
|
||||||
|
var self = this;
|
||||||
|
|
||||||
|
$container.on('click', function (evt) {
|
||||||
|
self.trigger("toggle", {
|
||||||
|
originalEvent: evt
|
||||||
|
});
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
Selection.prototype.clear = function () {
|
||||||
|
this.$selection.find(".rendered-selection").text("");
|
||||||
|
}
|
||||||
|
|
||||||
|
Selection.prototype.display = function (data) {
|
||||||
|
return data.text;
|
||||||
|
}
|
||||||
|
|
||||||
|
Selection.prototype.update = function (data) {
|
||||||
|
if (data.length == 0) {
|
||||||
|
this.clear();
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
var selection = data[0];
|
||||||
|
|
||||||
|
var formatted = this.display(selection);
|
||||||
|
|
||||||
|
this.$selection.find(".rendered-selection").html(formatted);
|
||||||
|
}
|
||||||
|
|
||||||
|
return Selection;
|
||||||
|
});
|
Loading…
Reference in New Issue
Block a user