From d863defd3be2516f700dd676da11d0d3bb4d0ca8 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?R=C3=A9gis=20Hanol?= Date: Tue, 13 Oct 2015 10:52:42 +0200 Subject: [PATCH] convert emoji toolbar to use safe local storage --- .../discourse/lib/emoji/emoji-toolbar.js.es6 | 29 ++++++++++--------- .../discourse/lib/key-value-store.js.es6 | 6 +++- 2 files changed, 20 insertions(+), 15 deletions(-) diff --git a/app/assets/javascripts/discourse/lib/emoji/emoji-toolbar.js.es6 b/app/assets/javascripts/discourse/lib/emoji/emoji-toolbar.js.es6 index 5e0b50219ff..baf51822b02 100644 --- a/app/assets/javascripts/discourse/lib/emoji/emoji-toolbar.js.es6 +++ b/app/assets/javascripts/discourse/lib/emoji/emoji-toolbar.js.es6 @@ -1,3 +1,8 @@ +import KeyValueStore from "discourse/lib/key-value-store"; + +const keyValueStore = new KeyValueStore("discourse_emojis_"); +const EMOJI_USAGE = "emojiUsage"; + // note that these categories are copied from Slack // be careful, there are ~20 differences in synonyms, e.g. :boom: vs. :collision: // a few Emoji are actually missing from the Slack categories as well (?), and were added @@ -85,21 +90,17 @@ var initializeUngroupedIcons = function(){ } }; -try { - if (localStorage && !localStorage.emojiUsage) { localStorage.emojiUsage = "{}"; } -} catch (e) { -/* localStorage can be disabled, or cookies disabled, do not crash script here - * TODO introduce a global wrapper for dealing with local storage - * */ +if (!keyValueStore.getObject(EMOJI_USAGE)) { + keyValueStore.setObject({key: EMOJI_USAGE, value: {}}); } -var trackEmojiUsage = function(title){ - var recent = JSON.parse(localStorage.emojiUsage); +var trackEmojiUsage = function(title) { + var recent = keyValueStore.getObject(EMOJI_USAGE); if (!recent[title]) { recent[title] = { title: title, usage: 0 }; } recent[title]["usage"]++; - localStorage.emojiUsage = JSON.stringify(recent); + keyValueStore.setObject({key: EMOJI_USAGE, value: recent}); // clear the cache recentlyUsedIcons = null; @@ -108,7 +109,7 @@ var trackEmojiUsage = function(title){ var initializeRecentlyUsedIcons = function(){ recentlyUsedIcons = []; - var usage = _.map(JSON.parse(localStorage.emojiUsage)); + var usage = _.map(keyValueStore.getObject(EMOJI_USAGE)); usage.sort(function(a,b){ if(a.usage > b.usage){ return -1; @@ -195,8 +196,8 @@ var bindEvents = function(page, offset, options) { }; var render = function(page, offset, options) { - localStorage.emojiPage = page; - localStorage.emojiOffset = offset; + keyValueStore.set({key: "emojiPage", value: page}); + keyValueStore.set({key: "emojiOffset", value: offset}); var toolbarItems = toolbar(page); var rows = [], row = []; @@ -238,8 +239,8 @@ var showSelector = function(options) { if (Discourse.Mobile.mobileView) PER_ROW = 9; - var page = parseInt(localStorage.emojiPage) || 0; - var offset = parseInt(localStorage.emojiOffset) || 0; + var page = keyValueStore.getInt("emojiPage", 0); + var offset = keyValueStore.getInt("emojiOffset", 0); render(page, offset, options); $('body, textarea').on('keydown.emoji', function(e){ diff --git a/app/assets/javascripts/discourse/lib/key-value-store.js.es6 b/app/assets/javascripts/discourse/lib/key-value-store.js.es6 index ba1414efc83..66edda6cc1e 100644 --- a/app/assets/javascripts/discourse/lib/key-value-store.js.es6 +++ b/app/assets/javascripts/discourse/lib/key-value-store.js.es6 @@ -43,6 +43,10 @@ KeyValueStore.prototype = { safeLocalStorage[this.context + opts.key] = opts.value; }, + setObject(opts) { + this.set({ key: opts.key, value: JSON.stringify(opts.value) }); + }, + get(key) { if (!safeLocalStorage) { return null; } return safeLocalStorage[this.context + key]; @@ -59,7 +63,7 @@ KeyValueStore.prototype = { getObject(key) { if (!safeLocalStorage) { return null; } try { return JSON.parse(safeLocalStorage[this.context + key]); } - catch (e) {} + catch (e) { } } };