|
38 |
"dojo/query", |
38 |
"dojo/query", |
39 |
"dojo/dom", |
39 |
"dojo/dom", |
40 |
"dojo/dom-class", |
40 |
"dojo/dom-class", |
|
|
41 |
"dojo/dom-style", |
41 |
"dojo/dom-geometry", |
42 |
"dojo/dom-geometry", |
42 |
"dojo/store/Memory", |
43 |
"dojo/store/Memory", |
43 |
"dojo/store/Observable", |
44 |
"dojo/store/Observable", |
|
47 |
"umc/modules/appcenter/AppCenterGallery", |
48 |
"umc/modules/appcenter/AppCenterGallery", |
48 |
"umc/widgets/ContainerWidget", |
49 |
"umc/widgets/ContainerWidget", |
49 |
"umc/i18n!" |
50 |
"umc/i18n!" |
50 |
], function(declare, lang, array, win, on, has, domQuery, dom, domClass, domGeom, Memory, Observable, tools, Text, Button, AppCenterGallery, Container, _) { |
51 |
], function(declare, lang, array, win, on, has, domQuery, dom, domClass, domStyle, domGeom, Memory, Observable, tools, Text, Button, AppCenterGallery, Container, _) { |
51 |
return declare("umc.modules.appcenter.AppCenterMetaCategory", [Container], { |
52 |
return declare("umc.modules.appcenter.AppCenterMetaCategory", [Container], { |
52 |
// summary: |
53 |
// summary: |
53 |
// Offers a container which contains a label, More/Less button and a grid to |
54 |
// Offers a container which contains a label, More/Less button and a grid to |
|
131 |
this.own(this.grid); |
132 |
this.own(this.grid); |
132 |
|
133 |
|
133 |
this.own(on(win.global, 'resize', lang.hitch(this, function() { |
134 |
this.own(on(win.global, 'resize', lang.hitch(this, function() { |
134 |
this._handleButtonVisibility(); |
135 |
this._handleResize(); |
135 |
}))); |
136 |
}))); |
136 |
}, |
137 |
}, |
137 |
|
138 |
|
|
153 |
data: filteredApps |
154 |
data: filteredApps |
154 |
}))); |
155 |
}))); |
155 |
this._set('store', applications); |
156 |
this._set('store', applications); |
156 |
this._handleButtonVisibility(); |
157 |
this._centerApps(); |
157 |
}, |
158 |
}, |
158 |
|
159 |
|
159 |
_setFilterQueryAttr: function(query) { |
160 |
_setFilterQueryAttr: function(query) { |
160 |
this.grid.set('query', query); |
161 |
this.grid.set('query', query); |
161 |
this._set('filterQuery', query); |
162 |
this._set('filterQuery', query); |
162 |
this._handleButtonVisibility(); |
|
|
163 |
}, |
163 |
}, |
164 |
|
164 |
|
165 |
_handleButtonVisibility: function() { |
165 |
_handleResize: function() { |
166 |
if (!this._visibilityDeferred || this._visibilityDeferred.isFulfilled()) { |
166 |
if (!this._visibilityDeferred || this._visibilityDeferred.isFulfilled()) { |
167 |
this._visibilityDeferred = tools.defer(lang.hitch(this, '_updateButtonVisibility'), 200); |
167 |
this._visibilityDeferred = tools.defer(lang.hitch(this, '_centerApps'), 100); |
168 |
} |
168 |
} |
169 |
}, |
169 |
}, |
170 |
|
170 |
|
|
180 |
var appWidth = appMarginBox.w; |
180 |
var appWidth = appMarginBox.w; |
181 |
var neededWidthToDisplayApps = appsDisplayed.length * appWidth; |
181 |
var neededWidthToDisplayApps = appsDisplayed.length * appWidth; |
182 |
|
182 |
|
|
|
183 |
|
183 |
var hideButton = neededWidthToDisplayApps < gridWidth; |
184 |
var hideButton = neededWidthToDisplayApps < gridWidth; |
184 |
domClass.toggle(this.button.domNode, 'hiddenButton', hideButton); |
185 |
domClass.toggle(this.button.domNode, 'hiddenButton', hideButton); |
185 |
} |
186 |
} |
186 |
domClass.toggle(this.domNode, 'dijitHidden', !appsDisplayed.length); |
187 |
domClass.toggle(this.domNode, 'dijitHidden', !appsDisplayed.length); |
187 |
}, |
188 |
}, |
188 |
|
189 |
|
|
|
190 |
_centerApps: function() { |
191 |
//make sure the domNode is not hidden |
192 |
domClass.remove(this.domNode, 'dijitHidden'); |
193 |
var appsDisplayed = domQuery('div[class*="dgrid-row"]', this.id); |
194 |
var gridContentNodes = domQuery('div[class="dgrid-content ui-widget-content"]', this.id); |
195 |
if (appsDisplayed.length && gridContentNodes.length) { |
196 |
var gridContentNode = gridContentNodes[0]; |
197 |
var gridContentWidth = domGeom.getMarginBox(gridContentNode).w; |
198 |
var appDomNode = appsDisplayed[0]; |
199 |
var appWidth = domGeom.getMarginBox(appDomNode).w; |
200 |
var leftMargin = (gridContentWidth % appWidth) / 2; |
201 |
domStyle.set(gridContentNode, "margin-left", leftMargin + "px"); |
202 |
} |
203 |
domClass.toggle(this.domNode, 'dijitHidden', !appsDisplayed.length); |
204 |
}, |
205 |
|
189 |
onShowApp: function(app) { |
206 |
onShowApp: function(app) { |
190 |
} |
207 |
} |
191 |
}); |
208 |
}); |