Last active
December 31, 2017 10:46
-
-
Save chappy84/2164155 to your computer and use it in GitHub Desktop.
HTML5 Storage without the restrictions on storing objects
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
if (typeof HTML5 == 'undefined') { | |
var HTML5 = {}; | |
} | |
/** | |
* Wrapper class to deal with easily storing values in local storage | |
* without having to constantly use JSON.parse and JSON.stringify everywhere | |
* you want to save an object. | |
* | |
* @param {String} index the base index to use in the localStorage global object | |
* @author Tom Chapman | |
*/ | |
HTML5.localStorage = function(index) | |
{ | |
/** | |
* @type {Mixed} | |
* @private | |
*/ | |
var localValues; | |
/** | |
* @type {String} | |
* @private | |
*/ | |
var localIndex; | |
/** | |
* Class level constructor | |
* | |
* @constructor | |
* @param {String} index | |
* @private | |
*/ | |
var __init = function(index) { | |
if (typeof index != 'string' || index === null) { | |
throw new Error('A string index must be provided to HTML5.localStorage'); | |
} | |
localIndex = index; | |
var currentLocalValue = localStorage.getItem(index); | |
if (typeof currentLocalValue != 'undefined' && currentLocalValue !== null) { | |
try { | |
localValues = JSON.parse(currentLocalValue); | |
} catch (err) { | |
localValues = currentLocalValue; | |
} | |
} else { | |
localValues = {}; | |
} | |
}(index); | |
return { | |
/** | |
* Returns all vars or index from the localValues | |
* | |
* @param {String} [index] the index inside the object in use | |
* @return {Mixed} | |
*/ | |
get: function(index) { | |
return (typeof index == 'undefined') | |
? localValues | |
: ((typeof localValues[index] != 'undefined') | |
? localValues[index] | |
: null); | |
}, | |
/** | |
* Set localValues or an index in localValues | |
* | |
* @param {Mixed} value the value to assign to the object, or if index provided the index inside the object | |
* @param {String} [index] the index inside the object in use | |
* @return {Mixed} | |
*/ | |
set: function(value, index) { | |
if (typeof index == 'undefined' || index === null) { | |
localValues = value; | |
} else { | |
if (typeof localValues != 'object') { | |
throw new Error(); | |
} | |
localValues[index] = value; | |
} | |
localStorage.setItem(localIndex, (typeof localValues != 'string' && typeof localValues != 'number') | |
? JSON.stringify(localValues) | |
: localValues); | |
}, | |
/** | |
* Removes either the whole object from the localStorage or the index provided | |
* | |
* @param {String} [index] the index inside the object in use | |
*/ | |
remove: function(index) { | |
if (typeof index == 'undefined') { | |
localStorage.removeItem(localIndex); | |
} else if (typeof localValues[index] != 'undefined') { | |
delete localValues[index]; | |
localStorage.setItem(localIndex, (typeof localValues != 'string' && typeof localValues != 'number') | |
? JSON.stringify(localValues) | |
: localValues); | |
} | |
} | |
}; | |
}; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
if (typeof HTML5 == 'undefined') { | |
var HTML5 = {}; | |
} | |
/** | |
* Wrapper class to deal with easily storing values in session storage | |
* without having to constantly use JSON.parse and JSON.stringify everywhere | |
* you want to save an object. | |
* | |
* @param {String} index the base index to use in the localStorage global object | |
* @author Tom Chapman | |
*/ | |
HTML5.sessionStorage = function(index) | |
{ | |
/** | |
* @type {Mixed} | |
* @private | |
*/ | |
var sessionValues; | |
/** | |
* @type {String} | |
* @private | |
*/ | |
var sessionIndex; | |
/** | |
* Class level constructor | |
* | |
* @constructor | |
* @param {String} index | |
* @private | |
*/ | |
var __init = function(index) { | |
if (typeof index != 'string' || index === null) { | |
throw new Error('A string index must be provided to HTML5.sessionStorage'); | |
} | |
sessionIndex = index; | |
var currentLocalValue = sessionStorage.getItem(index); | |
if (typeof currentLocalValue != 'undefined' && currentLocalValue !== null) { | |
try { | |
sessionValues = JSON.parse(currentLocalValue); | |
} catch (err) { | |
sessionValues = currentLocalValue; | |
} | |
} else { | |
sessionValues = {}; | |
} | |
}(index); | |
return { | |
/** | |
* Returns all vars or index from the sessionValues | |
* | |
* @param {String} [index] the index inside the object in use | |
* @return {Mixed} | |
*/ | |
get: function(index) { | |
return (typeof index == 'undefined') | |
? sessionValues | |
: ((typeof sessionValues[index] != 'undefined') | |
? sessionValues[index] | |
: null); | |
}, | |
/** | |
* Set sessionValues or an index in sessionValues | |
* | |
* @param {Mixed} value the value to assign to the object, or if index provided the index inside the object | |
* @param {String} [index] the index inside the object in use | |
* @return {Mixed} | |
*/ | |
set: function(value, index) { | |
if (typeof index == 'undefined' || index === null) { | |
sessionValues = value; | |
} else { | |
if (typeof sessionValues != 'object') { | |
throw new Error(); | |
} | |
sessionValues[index] = value; | |
} | |
sessionStorage.setItem(sessionIndex, (typeof sessionValues != 'string' && typeof sessionValues != 'number') | |
? JSON.stringify(sessionValues) | |
: sessionValues); | |
}, | |
/** | |
* Removes either the whole object from the sessionStorage or the index provided | |
* | |
* @param {String} [index] the index inside the object in use | |
*/ | |
remove: function(index) { | |
if (typeof index == 'undefined') { | |
sessionStorage.removeItem(sessionIndex); | |
} else if (typeof sessionValues[index] != 'undefined') { | |
delete sessionValues[index]; | |
sessionStorage.setItem(sessionIndex, (typeof sessionValues != 'string' && typeof sessionValues != 'number') | |
? JSON.stringify(sessionValues) | |
: sessionValues); | |
} | |
} | |
}; | |
}; |
Apologies for the very delayed response @zilveer, it appears I missed your comments, as github doesn't send notifications for gists. I have now signed up to this service to try and avoid missing others in the future: https://github.com/tightenco/giscus
Anyway, although this is very old JS now, and could probably be easily replaced with more efficient ES6+ JS, both of these classes can be used in the same manner
For using as a non object value (string, bool, number, etc.) you can use the following:
var usernameSession = HTML5.sessionStorage('username'); // Prepares for using the "username" entry in session storage
usernameSession.set('my name'); // Set's "username" entry in the session storage to "my name"
var username = usernameSession.get(); // Retrieves the value "my name" from session storage entry "username"
usernameSession.remove(); // Removes the entry "username" from session storage
For using as an object value you can use the following:
var userSession = HTML5.sessionStorage('user'); // Prepares for using the "user" entry in session storage
userSession.set('my name', 'name'); // Set's "user" entry in the session storage to the JSON '{"name":"my name"}'
userSession.set({name: "my name"}); // Set's "user" entry in the session storage to the JSON '{"name":"my name"}'
var username = userSession.get('name'); // Retrieves the value "my name" from "name" property of the "user" object entry in session storage, i.e. user.name
var user = userSession.get(); // Retrieves the user object from the "user" entry in session storage, i.e. {name:"myname"}
userSession.remove('name'); // Removes the entry "name" from the "user" object in session storage
userSession.remove(); // Removes the entry "user" from session storage
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Can you lend me a hand here?
EDIT: Ok I think I got it:
HTML5.sessionStorage('username').set('my name'); //Set a "my name" in "username" variable
HTML5.sessionStorage('username').get(); //Get "username" variable
HTML5.sessionStorage('username').remove(); //Remove "username" variable
regards