|
|
|---|
| 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'), 200); |
| 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 |
if (appsDisplayed.length) { |
| 195 |
var gridMarginBox = domGeom.getMarginBox(this.grid.domNode); |
| 196 |
var gridWidth = gridMarginBox.w; |
| 197 |
var appDomNode = appsDisplayed[0]; |
| 198 |
var appMarginBox = domGeom.getMarginBox(appDomNode); |
| 199 |
var appWidth = appMarginBox.w; |
| 200 |
var leftPadding = (gridWidth % appWidth) / 2; |
| 201 |
domStyle.set(this.grid.domNode, "padding-left", leftPadding + "px"); |
| 202 |
} |
| 203 |
domClass.toggle(this.domNode, 'dijitHidden', !appsDisplayed.length); |
| 204 |
}, |
| 205 |
|
| 189 |
onShowApp: function(app) { |
206 |
onShowApp: function(app) { |
| 190 |
} |
207 |
} |
| 191 |
}); |
208 |
}); |