mirror of
https://github.com/scratchfoundation/scratch-www.git
synced 2024-11-22 23:27:54 -05:00
refactor cookieMixinFactory
isolate cookie business logic from react mixin logic so that they are more modular. And use the cookie business logic to set translation objects on the window
This commit is contained in:
parent
be5d8cd3eb
commit
b8972d545c
5 changed files with 117 additions and 43 deletions
|
@ -25,8 +25,8 @@
|
|||
<!-- Shim/Sham ES5 polyfill for older browsers -->
|
||||
<script src="/js/lib/polyfill.min.js"></script>
|
||||
|
||||
<!-- Session provider -->
|
||||
<script src="/js/session.bundle.js"></script>
|
||||
<!-- Initialize (Locale & Session) -->
|
||||
<script src="/js/init.bundle.js"></script>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
|
78
src/init.js
Normal file
78
src/init.js
Normal file
|
@ -0,0 +1,78 @@
|
|||
var api = require('./mixins/api.jsx').api;
|
||||
var jar = require('./lib/jar');
|
||||
// var locales = require('../languages.json');
|
||||
// var translations = {
|
||||
// en: require('../en.json')
|
||||
// };
|
||||
// for (var id in locales) {
|
||||
// try {
|
||||
// translations[id] = require('../locales/' + id + '.json');
|
||||
// } catch
|
||||
// }
|
||||
var translations = require('../locales/translations.json');
|
||||
|
||||
require('custom-event-polyfill');
|
||||
|
||||
// Session
|
||||
(function () {
|
||||
window._session = {};
|
||||
|
||||
/**
|
||||
* Binds the object to private session variable and dispatches a global
|
||||
* "session" event.
|
||||
*
|
||||
* @param {object} Session object
|
||||
*
|
||||
* @return {void}
|
||||
*/
|
||||
window.updateSession = function (session) {
|
||||
window._session = session;
|
||||
var sessionEvent = new CustomEvent('session', session);
|
||||
window.dispatchEvent(sessionEvent);
|
||||
};
|
||||
|
||||
/**
|
||||
* Gets a session object from the local proxy method. Calls "updateSession"
|
||||
* once session has been returned from the proxy.
|
||||
*
|
||||
* @return {void}
|
||||
*/
|
||||
window.refreshSession = function () {
|
||||
api({
|
||||
host: '',
|
||||
uri: '/session/'
|
||||
}, function (err, body) {
|
||||
window.updateSession(body);
|
||||
});
|
||||
};
|
||||
|
||||
// Fetch session
|
||||
window.refreshSession();
|
||||
})();
|
||||
|
||||
// L10N
|
||||
(function () {
|
||||
/**
|
||||
* Bind locale code from cookie if available. Uses navigator language API as a fallback.
|
||||
*
|
||||
* @return {string}
|
||||
*/
|
||||
function updateLocale () {
|
||||
var obj = jar.get('scratchlanguage');
|
||||
if (typeof obj === 'undefined') {
|
||||
obj = window.navigator.userLanguage || window.navigator.language;
|
||||
}
|
||||
if (typeof translations[obj] === 'undefined') {
|
||||
// Fall back on the split
|
||||
obj = obj.split('-')[0];
|
||||
}
|
||||
if (typeof translations[obj] === 'undefined') {
|
||||
// Language appears to not be supported – return `null`
|
||||
obj = null;
|
||||
}
|
||||
return obj;
|
||||
}
|
||||
|
||||
window._locale = updateLocale() || 'en';
|
||||
window._translations = translations;
|
||||
})();
|
32
src/lib/jar.js
Normal file
32
src/lib/jar.js
Normal file
|
@ -0,0 +1,32 @@
|
|||
var cookie = require('cookie');
|
||||
var xhr = require('xhr');
|
||||
|
||||
var module = module.exports = {};
|
||||
|
||||
module.get = function (name, callback) {
|
||||
// Get cookie by name
|
||||
var obj = cookie.parse(document.cookie) || {};
|
||||
|
||||
// Handle optional callback
|
||||
if (typeof callback === 'function') {
|
||||
if (typeof obj === 'undefined') return callback('Cookie not found.');
|
||||
return callback(null, obj[name]);
|
||||
}
|
||||
|
||||
return obj[name];
|
||||
};
|
||||
|
||||
module.use = function (name, uri, callback) {
|
||||
// Attempt to get cookie
|
||||
module.get(name, function (err, obj) {
|
||||
if (typeof obj !== 'undefined') return callback(null, obj);
|
||||
|
||||
// Make XHR request to cookie setter uri
|
||||
xhr({
|
||||
uri: uri
|
||||
}, function (err) {
|
||||
if (err) return callback(err);
|
||||
module.get(name, callback);
|
||||
});
|
||||
});
|
||||
};
|
|
@ -1,31 +1,16 @@
|
|||
var cookie = require('cookie');
|
||||
var xhr = require('xhr');
|
||||
|
||||
var jar = require('../lib/jar');
|
||||
|
||||
var cookieMixinFactory = function (cookieName, cookieSetter) {
|
||||
var capitalizedCookieName = cookieName.charAt(0).toUpperCase() + cookieName.slice(1);
|
||||
var getterName = "get" + capitalizedCookieName;
|
||||
var userName = "use" + capitalizedCookieName;
|
||||
var mixin = {}
|
||||
var mixin = {};
|
||||
mixin[getterName] = function (callback) {
|
||||
var obj = cookie.parse(document.cookie) || {};
|
||||
if (typeof obj[cookieName] === 'undefined') return callback('Cookie not found.');
|
||||
callback(null, obj[cookieName]);
|
||||
jar.get(cookieName, callback);
|
||||
};
|
||||
mixin[userName] = function (callback) {
|
||||
this[getterName](function (err, cookieValue) {
|
||||
if (cookieValue) return callback(null, cookieValue);
|
||||
xhr({
|
||||
'uri': cookieSetter
|
||||
}, function (err) {
|
||||
if (err) return callback(err);
|
||||
this[getterName](function (err, cookieValue) {
|
||||
if (err) return callback(err);
|
||||
callback(err, cookieValue);
|
||||
});
|
||||
}.bind(this));
|
||||
}.bind(this));
|
||||
}
|
||||
jar.use(cookieName, cookieSetter, callback);
|
||||
};
|
||||
return mixin;
|
||||
};
|
||||
|
||||
|
|
|
@ -1,21 +0,0 @@
|
|||
var api = require('./mixins/api.jsx').api;
|
||||
require('custom-event-polyfill');
|
||||
|
||||
window._session = {};
|
||||
|
||||
window.updateSession = function (session) {
|
||||
window._session = session;
|
||||
var sessionEvent = new CustomEvent('session', session);
|
||||
window.dispatchEvent(sessionEvent);
|
||||
};
|
||||
|
||||
window.refreshSession = function () {
|
||||
api({
|
||||
host: '',
|
||||
uri: '/session/'
|
||||
}, function (err, body) {
|
||||
window.updateSession(body);
|
||||
});
|
||||
};
|
||||
|
||||
window.refreshSession();
|
Loading…
Reference in a new issue