Skip to content

Commit 2185c24

Browse files
dpaloudpalou
committed
MOBILE-1531 remotecss: Preload all sites and enable/disable them
1 parent 243718b commit 2185c24

File tree

4 files changed

+168
-27
lines changed

4 files changed

+168
-27
lines changed

‎www/addons/remotestyles/main.js‎

Lines changed: 24 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -16,18 +16,35 @@ angular.module('mm.addons.remotestyles', [])
1616

1717
.constant('mmaRemoteStylesComponent', 'mmaRemoteStyles')
1818

19+
.config(function($mmInitDelegateProvider, mmInitDelegateMaxAddonPriority) {
20+
// Addons shouldn't use a priority higher than mmInitDelegateMaxAddonPriority, but this is a special case
21+
// because it needs to be done before the mmLogin process.
22+
$mmInitDelegateProvider.registerProcess('mmaRemoteStylesCurrent',
23+
'$mmaRemoteStyles._preloadCurrentSite', mmInitDelegateMaxAddonPriority + 250, true);
24+
$mmInitDelegateProvider.registerProcess('mmaRemoteStylesPreload', '$mmaRemoteStyles._preloadSites');
25+
})
26+
1927
.run(function($mmEvents, mmCoreEventLogin, mmCoreEventLogout, mmCoreEventSiteAdded, mmCoreEventSiteUpdated, $mmaRemoteStyles,
20-
$mmSite) {
28+
$mmSite, mmCoreEventSiteDeleted) {
2129

22-
$mmEvents.on(mmCoreEventSiteAdded, $mmaRemoteStyles.load);
23-
$mmEvents.on(mmCoreEventSiteUpdated, function(siteid) {
30+
$mmEvents.on(mmCoreEventSiteAdded, function(siteId) {
31+
$mmaRemoteStyles.addSite(siteId);
32+
});
33+
$mmEvents.on(mmCoreEventSiteUpdated, function(siteId) {
2434
// Load only if current site was updated.
25-
if (siteid === $mmSite.getId()) {
26-
$mmaRemoteStyles.load();
35+
if (siteId === $mmSite.getId()) {
36+
$mmaRemoteStyles.load(siteId);
2737
}
2838
});
29-
$mmEvents.on(mmCoreEventLogin, $mmaRemoteStyles.load);
3039

31-
// Remove added styles on logout.
40+
// Enable styles of current site on login.
41+
$mmEvents.on(mmCoreEventLogin, $mmaRemoteStyles.enable);
42+
43+
// Disable added styles on logout.
3244
$mmEvents.on(mmCoreEventLogout, $mmaRemoteStyles.clear);
45+
46+
// Remove site styles on logout.
47+
$mmEvents.on(mmCoreEventSiteDeleted, function(site) {
48+
$mmaRemoteStyles.removeSite(site.id);
49+
});
3350
});

‎www/addons/remotestyles/services/remotestyles.js‎

Lines changed: 128 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -27,7 +27,28 @@ angular.module('mm.addons.remotestyles')
2727
$log = $log.getInstance('$mmaRemoteStyles');
2828

2929
var self = {},
30-
remoteStylesEl = angular.element(document.querySelector('#mobilecssurl'));
30+
remoteStylesEls = {};
31+
32+
/**
33+
* Add a style element for a site and load the styles for that element. The style will be disabled.
34+
*
35+
* @module mm.addons.remotestyles
36+
* @ngdoc method
37+
* @name $mmaRemoteStyles#addSite
38+
* @param {String} siteId Site ID.
39+
* @return {Promise} Promise resolved when added and loaded.
40+
*/
41+
self.addSite = function(siteId) {
42+
if (!siteId || remoteStylesEls[siteId]) {
43+
return $q.when();
44+
}
45+
46+
var el = angular.element('<style id="mobilecssurl-' + siteId + '" disabled="disabled"></style>');
47+
angular.element(document.head).append(el);
48+
remoteStylesEls[siteId] = el;
49+
50+
return self.load(siteId, true);
51+
};
3152

3253
/**
3354
* Clear remote styles added to the DOM.
@@ -37,7 +58,8 @@ angular.module('mm.addons.remotestyles')
3758
* @name $mmaRemoteStyles#clear
3859
*/
3960
self.clear = function() {
40-
remoteStylesEl.html('');
61+
// Disable all the styles.
62+
angular.element(document.querySelectorAll('style[id*=mobilecssurl]')).attr('disabled', true);
4163
};
4264

4365
/**
@@ -62,6 +84,23 @@ angular.module('mm.addons.remotestyles')
6284
});
6385
}
6486

87+
/**
88+
* Enable the styles of a certain site.
89+
*
90+
* @module mm.addons.remotestyles
91+
* @ngdoc method
92+
* @name $mmaRemoteStyles#addSite
93+
* @param {String} [siteId] Site ID. If not defined, current site.
94+
* @return {Void}
95+
*/
96+
self.enable = function(siteId) {
97+
siteId = siteId || $mmSite.getId();
98+
99+
if (remoteStylesEls[siteId]) {
100+
remoteStylesEls[siteId].attr('disabled', false);
101+
}
102+
};
103+
65104
/**
66105
* Get remote styles of a certain site.
67106
*
@@ -111,23 +150,91 @@ angular.module('mm.addons.remotestyles')
111150
};
112151

113152
/**
114-
* Load styles for current site.
153+
* Load styles for a certain site.
115154
*
116155
* @module mm.addons.remotestyles
117156
* @ngdoc method
118157
* @name $mmaRemoteStyles#load
158+
* @param {String} [siteId] Site ID. If not defined, current site.
159+
* @param {Boolean} disabled True if loaded styles should be disabled, false if they should be enabled.
160+
* @return {Promise} Promise resolved when styles are loaded.
119161
*/
120-
self.load = function() {
121-
var siteId = $mmSite.getId();
122-
if (siteId) {
123-
self.get(siteId).then(function(data) {
124-
if (siteId === $mmSite.getId()) { // Make sure it hasn't logout while retrieving styles.
125-
remoteStylesEl.html(data.styles);
162+
self.load = function(siteId, disabled) {
163+
siteId = siteId || $mmSite.getId();
164+
disabled = !!disabled;
165+
166+
$log.debug('Load site: ', siteId, disabled);
167+
if (siteId && remoteStylesEls[siteId]) {
168+
// Enable or disable the styles.
169+
remoteStylesEls[siteId].attr('disabled', disabled);
170+
171+
return self.get(siteId).then(function(data) {
172+
// Update the styles only if they have changed.
173+
if (data.styles !== remoteStylesEls[siteId].html()) {
174+
remoteStylesEls[siteId].html(data.styles);
175+
176+
// New styles will be applied even if the style is disabled. We'll disable it again if needed.
177+
if (disabled && remoteStylesEls[siteId].attr('disabled') == 'disabled') {
178+
remoteStylesEls[siteId].attr('disabled', true);
179+
}
126180
}
181+
127182
// Styles have been loaded, now treat the CSS.
128183
treatCSSCode(siteId, data.file, data.styles);
129184
});
130185
}
186+
187+
return $q.reject();
188+
};
189+
190+
/**
191+
* Preload the styles of the current site (stored in DB). Please do not use.
192+
*
193+
* @module mm.addons.remotestyles
194+
* @ngdoc method
195+
* @name $mmaRemoteStyles#_preloadCurrentSite
196+
* @return {Promise} Promise resolved when loaded.
197+
* @protected
198+
*/
199+
self._preloadCurrentSite = function() {
200+
return $mmSitesManager.getStoredCurrentSiteId().then(function(siteId) {
201+
return self.addSite(siteId);
202+
});
203+
};
204+
205+
/**
206+
* Preload the styles of all the stored sites. Please do not use.
207+
*
208+
* @module mm.addons.remotestyles
209+
* @ngdoc method
210+
* @name $mmaRemoteStyles#_preloadSites
211+
* @return {Promise} Promise resolved when loaded.
212+
* @protected
213+
*/
214+
self._preloadSites = function() {
215+
return $mmSitesManager.getSitesIds().then(function(ids) {
216+
var promises = [];
217+
angular.forEach(ids, function(siteId) {
218+
promises.push(self.addSite(siteId));
219+
});
220+
return $q.all(promises);
221+
});
222+
};
223+
224+
/**
225+
* Remove the styles of a certain site.
226+
*
227+
* @module mm.addons.remotestyles
228+
* @ngdoc method
229+
* @name $mmaRemoteStyles#removeSite
230+
* @param {String} siteId Site ID.
231+
* @return {Void}
232+
*/
233+
self.removeSite = function(siteId) {
234+
if (siteId && remoteStylesEls[siteId]) {
235+
remoteStylesEls[siteId].remove();
236+
delete remoteStylesEls[siteId];
237+
}
131238
};
132239

133240
/**
@@ -155,15 +262,18 @@ angular.module('mm.addons.remotestyles')
155262
}));
156263

157264
angular.forEach(urls, function(url) {
158-
promises.push($mmFilepool.getUrlByUrl(siteId, url, mmaRemoteStylesComponent, 2).then(function(fileUrl) {
159-
if (fileUrl != url) {
160-
cssCode = cssCode.replace(new RegExp(url, 'g'), fileUrl);
161-
updated = true;
162-
}
163-
}).catch(function(error) {
164-
// It shouldn't happen. Ignore errors.
165-
$log.warn('Error treating file ', url, error);
166-
}));
265+
// Download the file only if it's an online URL.
266+
if (url.indexOf('http') == 0) {
267+
promises.push($mmFilepool.downloadUrl(siteId, url, false, mmaRemoteStylesComponent, 2).then(function(fileUrl) {
268+
if (fileUrl != url) {
269+
cssCode = cssCode.replace(new RegExp(url, 'g'), fileUrl);
270+
updated = true;
271+
}
272+
}).catch(function(error) {
273+
// It shouldn't happen. Ignore errors.
274+
$log.warn('MMRMSTYLES Error treating file ', url, error);
275+
}));
276+
}
167277
});
168278

169279
return $q.all(promises).then(function() {

‎www/core/lib/sitesmanager.js‎

Lines changed: 15 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -222,7 +222,7 @@ angular.module('mm.core')
222222
currentSite = candidateSite;
223223
// Store session.
224224
self.login(siteid);
225-
$mmEvents.trigger(mmCoreEventSiteAdded);
225+
$mmEvents.trigger(mmCoreEventSiteAdded, siteid);
226226
} else {
227227
return $translate(validation.error, validation.params).then(function(error) {
228228
return $q.reject(error);
@@ -723,6 +723,20 @@ angular.module('mm.core')
723723
});
724724
};
725725

726+
/**
727+
* Get the site ID stored in DB ad current site.
728+
*
729+
* @module mm.core
730+
* @ngdoc method
731+
* @name $mmSitesManager#getStoredCurrentSiteId
732+
* @return {Promise} Promise resolved with the site ID.
733+
*/
734+
self.getStoredCurrentSiteId = function() {
735+
return $mmApp.getDB().get(mmCoreCurrentSiteStore, 1).then(function(current_site) {
736+
return current_site.siteid;
737+
});
738+
};
739+
726740
return self;
727741

728742
});

‎www/index.html‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -17,7 +17,7 @@
1717
<script src="lib/moment/min/moment-with-locales.js"></script>
1818
<script src="lib/jszip/dist/jszip.js"></script>
1919
<script src="build/mm.bundle.js"></script>
20-
<style id="mobilecssurl"></style>
20+
<style></style> <!-- Empty style to make easier to test styles using Inspector. -->
2121
</head>
2222
<body ng-app="mm">
2323
<ion-nav-view></ion-nav-view>

0 commit comments

Comments
 (0)