1 /** 2 * @author Gillis Haasnoot <gillis.haasnoot@gmail.com> 3 * @package Banana.Controls 4 * @summary Custom list control 5 */ 6 7 goog.provide('Banana.Controls.DataControls.ListControls.CustomListControl'); 8 9 goog.require('Banana.Controls.DataControls.ListControls.ListControl'); 10 11 /** @namespace Banana.Controls.CustomListControl */ 12 namespace('Banana.Controls').CustomListControl = Banana.Controls.ListControl.extend( 13 /** @lends Banana.Controls.CustomListControl.prototype */ 14 { 15 /** 16 * Creates a base custom list control. Use this class as a wrapper arround your custom 17 * list controls which are using datasource and or data. 18 * if setDatasource of setData is called we call createControls method in which 19 * the creation of controls should be defined 20 * 21 * basicly this control rerenders the whole control + child collection when calling either data or datasource 22 * It handles all the clearing and re-rendering. 23 * 24 * Example: 25 * 26 27 //define the class 28 var myList = Banana.Controls.CustomListControl.extend({ 29 30 createControls : function() 31 { 32 var i,len; 33 for (var i=0,len=this.datasource.length;i<len;i++) 34 { 35 var label = new Banana.Controls.Label(); 36 label.setData(this.datasource[i]); 37 this.addControl(label); 38 39 //if this datasource item is in our data make background red 40 if (this.data.indexOf(this.datasource[i] != -1)) 41 { 42 label.setStyle("background-color:red"); 43 } 44 } 45 } 46 47 }); 48 49 //populate the list with datasource 50 myList.setDataSource(['first','second','third'); 51 myList.setData(["third"]); 52 * 53 * @constructs 54 * @extends Banana.Controls.ListControl 55 */ 56 init : function() 57 { 58 this._super(); 59 } 60 }); 61 62 63 /** 64 * @override to make sure this function is doing nothing, since we do it in our custom way (createControls) 65 * 66 */ 67 Banana.Controls.CustomListControl.prototype.setDomData = function(){}; 68 69 /** 70 * 71 * this function is called when set data or set datasource is called 72 * overwrite this function to create your own logic 73 * 74 * @abstract 75 */ 76 Banana.Controls.CustomListControl.prototype.createControls = function(){}; 77 78 /** 79 * sets data on control. 80 * when this function is called we also clear the control and invalidate 81 * the display to rerender the control 82 * 83 * @param {mixed} data for control 84 * @param {bool} ignoreEvent when true we dont trigger 85 * @param {bool} ignoreDom when true we dont update dom 86 * @return {this} 87 */ 88 Banana.Controls.CustomListControl.prototype.setData = function(data, ignoreEvent, ignoreDom) 89 { 90 if (typeof(data) != 'string') 91 { 92 if (data) 93 { 94 //banana.util.clone doesnt work well with cloning arrays. remove index from cloned array doesnt work. index is still there. weird bug! 95 //we break the reference 96 this.data = newObject = JSON.parse(JSON._stringify(data)); 97 } 98 else 99 { 100 this.data = data; 101 } 102 } 103 else 104 { 105 this.data = data; 106 } 107 108 if (!ignoreDom) 109 { 110 this.clear(); 111 this.createControls(); 112 this.invalidateDisplay(); 113 } 114 115 return this; 116 }; 117 118 /** 119 * Sets datasource on control. 120 * when this function is called we also clear the control and invalidate 121 * the display to rerender the control 122 * 123 * @param {mixed} ds datasource for the control 124 * @return {this} 125 */ 126 Banana.Controls.CustomListControl.prototype.setDataSource = function(ds) 127 { 128 this.datasource = ds; //we dont need to clone this, cause do we change and save the datasource? 129 this.clear(); 130 this.createControls(); 131 this.invalidateDisplay(); 132 this.triggerEvent('onSetDataSource'); 133 return this; 134 }; 135