OLD | NEW |
1 'use strict'; | 1 'use strict'; |
2 | 2 |
3 | 3 |
4 /** | 4 /** |
5 * Provide the Charm Small widget. | 5 * Provides the Charm Token widget, for display a small unit of charm |
| 6 * information. |
6 * | 7 * |
| 8 * @namespace juju |
7 * @module widgets | 9 * @module widgets |
8 * @submodule juju.widgets.browser.charm-small | 10 * @submodule browser |
9 */ | 11 */ |
10 YUI.add('browser-charm-small', function(Y) { | 12 YUI.add('browser-charm-token', function(Y) { |
11 | 13 |
12 var ns = Y.namespace('juju.widgets.browser'); | 14 var ns = Y.namespace('juju.widgets.browser'); |
13 ns.EVENT_CHARM_ADD = 'charm-small-add'; | 15 ns.EVENT_CHARM_ADD = 'charm-token-add'; |
14 ns.CharmSmall = Y.Base.create('CharmSmall', Y.Widget, [Y.WidgetChild], { | 16 ns.CharmToken = Y.Base.create('CharmToken', Y.Widget, [Y.WidgetChild], { |
15 | 17 |
16 _events: [], | 18 _events: [], |
17 TEMPLATE: Y.namespace('juju.views').Templates['charm-small-widget'], | 19 TEMPLATE: Y.namespace('juju.views').Templates['charm-token'], |
18 | 20 |
19 /** | 21 /** |
20 * Set up and bind DOM events. | 22 * Set up and bind DOM events. |
21 * | 23 * |
22 * @method _bind_events | 24 * @method _bindEvents |
23 * @private | |
24 * @return {undefined} Mutates only. | |
25 */ | 25 */ |
26 _bind_ui: function() { | 26 _bindEvents: function() { |
27 var addButton = this.get('contentBox').one('button'), | 27 var addButton = this.get('contentBox').one('button'), |
28 addClick = addButton.on('click', function() { | 28 addClick = addButton.on('click', function() { |
29 this.fire(ns.EVENT_CHARM_ADD); | 29 this.fire(ns.EVENT_CHARM_ADD); |
30 }); | 30 }); |
31 this._events.push(addClick); | 31 this._events.push(addClick); |
32 }, | 32 }, |
33 | 33 |
34 /** | 34 /** |
| 35 * Gets all the attributes for the template. Providers need to be altered |
| 36 * to work with handlebars. |
| 37 * |
| 38 * @method _getTemplateAttrs |
| 39 */ |
| 40 _getTemplateAttrs: function() { |
| 41 var data = this.getAttrs(), |
| 42 providers = []; |
| 43 Y.Array.each(data.tested_providers, function(provider) { |
| 44 providers.push({'name': provider}); |
| 45 }); |
| 46 data.tested_providers = providers; |
| 47 return data; |
| 48 }, |
| 49 |
| 50 /** |
35 * Detach listeners for DOM events. | 51 * Detach listeners for DOM events. |
36 * | 52 * |
37 * @method _unbind_events | 53 * @method _unbindEvents |
38 * @private | |
39 * @return {undefined} Mutates only. | |
40 */ | 54 */ |
41 _unbind_ui: function() { | 55 _unbindEvents: function() { |
42 Y.Array.each(this._events, function(item) { | 56 Y.Array.each(this._events, function(item) { |
43 item.detach(); | 57 item.detach(); |
44 }); | 58 }); |
45 }, | 59 }, |
46 | 60 |
47 /** | 61 /** |
48 * Attach event listeners which bind the UI to the widget state. | 62 * Attach event listeners which bind the UI to the widget state. |
49 * Clicking add fires the add signal. | 63 * Clicking add fires the add signal. |
50 * | 64 * |
51 * @method bindUI | 65 * @method bindUI |
52 * @return {undefined} Mutates only. | |
53 */ | 66 */ |
54 bindUI: function() { | 67 bindUI: function() { |
55 this._unbind_ui(); | 68 this._unbindEvents(); |
56 this._bind_ui(); | 69 this._bindEvents(); |
57 }, | 70 }, |
58 | 71 |
59 /** | 72 /** |
60 * Destructor | 73 * Destructor |
61 * | 74 * |
62 * @method destructor | 75 * @method destructor |
63 * @return {undefined} Mutates only. | |
64 */ | 76 */ |
65 destructor: function(cfg) { | 77 destructor: function() { |
66 this._unbind_ui(); | 78 this._unbindEvents(); |
67 }, | 79 }, |
68 | 80 |
69 /** | 81 /** |
70 * Create the nodes required by this widget and attach them to the DOM. | 82 * Create the nodes required by this widget and attach them to the DOM. |
71 * | 83 * |
72 * @method renderUI | 84 * @method renderUI |
73 * @return {undefined} Mutates only. | |
74 */ | 85 */ |
75 renderUI: function() { | 86 renderUI: function() { |
76 var content = this.TEMPLATE(this.getAttrs()); | 87 var content = this.TEMPLATE(this._getTemplateAttrs()); |
77 this.get('contentBox').setHTML(content); | 88 this.get('contentBox').setHTML(content); |
78 } | 89 } |
79 | 90 |
80 }, { | 91 }, { |
81 ATTRS: { | 92 ATTRS: { |
82 name: {value: ''}, | 93 /** |
83 description: {value: ''}, | 94 * @attribute description |
84 rating: {value: 0}, | 95 * @default '' |
85 iconfile: {value: ''} | 96 * @type {String} |
| 97 */ |
| 98 description: { |
| 99 value: '' |
| 100 }, |
| 101 |
| 102 /** |
| 103 * @attribute recent_commits |
| 104 * @default undefined |
| 105 * @type {Number} |
| 106 */ |
| 107 recent_commits: {}, |
| 108 |
| 109 /** |
| 110 * @attribute recent_downloads |
| 111 * @default undefined |
| 112 * @type {Number} |
| 113 */ |
| 114 recent_downloads: {}, |
| 115 |
| 116 /** |
| 117 * @attribute icon |
| 118 * @default '' |
| 119 * @type {String} |
| 120 */ |
| 121 icon: { |
| 122 value: '' |
| 123 }, |
| 124 |
| 125 /** |
| 126 * @attribute name |
| 127 * @default '' |
| 128 * @type {String} |
| 129 */ |
| 130 name: { |
| 131 value: '' |
| 132 }, |
| 133 |
| 134 /** |
| 135 * @attribute tested_providers |
| 136 * @default [] |
| 137 * @type {Array} |
| 138 */ |
| 139 tested_providers: { |
| 140 value: [] |
| 141 } |
86 } | 142 } |
87 }); | 143 }); |
88 | 144 |
89 }, '0.1.0', { | 145 }, '0.1.0', { |
90 requires: [ | 146 requires: [ |
91 'base', | 147 'base', |
92 'handlebars', | 148 'handlebars', |
93 'juju-templates', | 149 'juju-templates', |
94 'widget', | 150 'widget', |
95 'widget-child' | 151 'widget-child' |
96 ] | 152 ] |
97 }); | 153 }); |
OLD | NEW |