--- /dev/null
+<html>\r
+<head>\r
+ <title>The source code</title>\r
+ <link href="../resources/prettify/prettify.css" type="text/css" rel="stylesheet" />\r
+ <script type="text/javascript" src="../resources/prettify/prettify.js"></script>\r
+</head>\r
+<body onload="prettyPrint();">\r
+ <pre class="prettyprint lang-js">
+Ext.ns('Ext.ux.MultiCombo');
+<div id="method-Ext.ux.TaskBar.TaskButton-MultiCombo.Checkable"></div>/**
+ * Checkable
+ * @plugin
+ */
+Ext.ux.MultiCombo.Checkable = function(cfg) {
+ Ext.apply(this, cfg);
+};
+Ext.ux.MultiCombo.Checkable.prototype = {
+ <div id="cfg-Ext.ux.TaskBar.TaskButton-checkSelector"></div>/**
+ * @cfg {String} checkSelector DomQuery config for locating checkbox
+ */
+ checkSelector: 'input[type=checkbox]',
+ <div id="cfg-Ext.ux.TaskBar.TaskButton-itemSelector"></div>/**
+ * @cfg {String} itemSelector The itemSelector used with Combo's internal DataView [x-combo-list]
+ */
+ itemSelector : 'x-combo-list',
+ <div id="cfg-Ext.ux.TaskBar.TaskButton-cls"></div>/**
+ * @cfg {String} cls
+ */
+ cls: 'combo-checkable',
+ <div id="cfg-Ext.ux.TaskBar.TaskButton-selectAllText"></div>/**
+ * @cfg {String} selectAllText The "SELECT ALL" phrase [Select All]
+ */
+ selectAllText: 'Select All',
+ <div id="cfg-Ext.ux.TaskBar.TaskButton-clearAllText"></div>/**
+ * @cfg {String} clearAllText the text to display for "clear all" link
+ */
+ clearAllText : 'clear all',
+
+ <div id="cfg-Ext.ux.TaskBar.TaskButton-separatorHtml"></div>/**
+ * @cfg {String} separatorHtml arbitrary html rendered after Checkable controls. Can be used to add an
+ * html separator markup.
+ */
+ separatorHtml : '',
+
+ // private {Boolean} checked
+ checked : null,
+
+ init : function(combo) {
+ this.combo = combo;
+ var checkable = this;
+ var id = Ext.id();
+ var cls = combo.itemSelector || this.itemSelector;
+
+ if (!combo.tpl) {
+ combo.tpl =['<tpl for=".">','<div class="'+cls+'-item">{'+combo.displayField+'}</div>','</tpl>'] . join('');
+ }
+ combo.tpl = [
+ '<div class="plugin ' + this.cls + '">',
+ '<span class="' + this.cls + '-select-all">',
+ '<input id="'+id+'" type="checkbox" /> <label>'+this.selectAllText+'</label>',
+ '</span>',
+ ' <span class="'+this.cls+'-clear-all">(<a href="#">' + this.clearAllText + '</a>)</span>',
+ '</div>',
+ this.separatorHtml
+ ].join('') + combo.tpl.replace(new RegExp('({'+combo.displayField+'})'), "<input type=\"checkbox\" <tpl if=\"values._checked\">checked</tpl> /> <label>$1</label>");
+
+ combo.on('initview', function(c, dv) {
+ dv.on('containerclick', this.onContainerClick.createDelegate(this));
+ dv.on('selectionchange', this.onSelectionChange.createDelegate(this));
+ dv.el.on('mouseover', this.onViewOver, this);
+ },this);
+ combo.on('select', this.onSelect.createDelegate(this));
+ },
+
+ onViewOver : function(ev, node){
+ var target = ev.getTarget('.' + this.cls, 5);
+ if (target) {
+ this.combo.clearHighlight();
+ Ext.fly(target).addClass(this.combo.highlightClass);
+ }
+ if(this.inKeyMode){ // prevent key nav and mouse over conflicts
+ return;
+ }
+ return;
+ },
+
+ onSelect : function(rec, index) {
+ // anything?
+ },
+
+ <div id="method-Ext.ux.TaskBar.TaskButton-getCheckbox"></div>/**
+ * getCheckbox
+ * @return {DomNode}
+ */
+ getCheckbox : function() {
+ return this.combo.view.el.child('.'+this.cls+' '+this.checkSelector, true);
+ },
+
+ <div id="method-Ext.ux.TaskBar.TaskButton-onSelectionChange"></div>/**
+ * onSelectChange Fired by MultiCombo
+ * @param {Object} dv
+ * @param {Object} rs
+ */
+ onSelectionChange : function(dv, rs) {
+ this.checked = (rs.length > 0 && rs.length == this.combo.store.getCount()) ? true : false;
+ this.getCheckbox().checked = this.checked;
+
+ var selector = this.checkSelector;
+ setTimeout(function() {
+ dv.el.select(dv.itemSelector + ' ' + selector).each(function(f) {
+ f.dom.checked = false;
+ });
+ dv.el.select('.' + dv.selectedClass + ' ' + selector).each(function(f) {
+ f.dom.checked = true;
+ });
+ },1);
+ },
+
+ <div id="method-Ext.ux.TaskBar.TaskButton-selectNext"></div>/**
+ * selectNext Called by MultiCombo. use this to apply hover-class to this row.
+ * @param {Object} sender
+ */
+ selectNext: function(sender) {
+ sender.view.el.child('.' + this.cls).addClass(sender.highlightClass);
+ },
+
+ <div id="method-Ext.ux.TaskBar.TaskButton-selectPrev"></div>/**
+ * selectPrev Called by MultiCombo, use this to apply hover class to row.
+ * @param {Object} sender
+ */
+ selectPrev : function(sender) {
+ sender.view.el.child('.' + this.cls).addClass(sender.highlightClass);
+ },
+
+ <div id="method-Ext.ux.TaskBar.TaskButton-onEnter"></div>/**
+ * onEnter Called by MultiCombo
+ * @param {Object} sender
+ */
+ onEnter : function(sender) {
+ this.setChecked(!this.checked);
+ },
+
+ <div id="method-Ext.ux.TaskBar.TaskButton-onContainerClick"></div>/**
+ * onContainerClick Fired by MultiCombo
+ * @param {Object} dv
+ * @param {Object} ev
+ */
+ onContainerClick : function(dv, ev) {
+ var btnClearAll = ev.getTarget('.'+this.cls+'-clear-all');
+ if (btnClearAll) {
+ this.clearAll();
+ }
+ else {
+ this.setChecked(!this.checked);
+ }
+ return false;
+ },
+
+ // private selectAll
+ selectAll : function() {
+ var value = [];
+ this.combo.store.each(function(r) { value.push(r.data[this.combo.valueField]); },this);
+ this.combo.setValue(value);
+ this.combo.selectByValue(this.combo.getValue());
+ this.combo.focus();
+ },
+
+ // private clearAll
+ clearAll : function() {
+ this.combo.updateValue([]);
+ this.combo.selectByValue([]);
+ this.combo.view.clearSelections();
+ this.combo.focus();
+ this.combo.fireEvent('clearall', this.combo);
+ },
+
+ <div id="method-Ext.ux.TaskBar.TaskButton-setChecked"></div>/**
+ * setChecked
+ * @param {Object} v
+ */
+ setChecked : function(v) {
+ if (v == this.checked) {
+ return;
+ }
+ this.checked = v;
+ this.getCheckbox().checked = this.checked;
+ if (this.checked == true) {
+ this.selectAll();
+ }
+ else {
+ this.clearAll();
+ }
+ }
+}</pre> \r
+</body>\r
+</html>
\ No newline at end of file
git.ithinksw.org / extjs.git / blobdiff