diff --git a/client/homebrew/editor/snippetbar/snippetbar.jsx b/client/homebrew/editor/snippetbar/snippetbar.jsx index 714adc001..cfe28991c 100644 --- a/client/homebrew/editor/snippetbar/snippetbar.jsx +++ b/client/homebrew/editor/snippetbar/snippetbar.jsx @@ -5,6 +5,8 @@ const createClass = require('create-react-class'); const _ = require('lodash'); const cx = require('classnames'); +import { getHistoryItems, historyExists } from '../../utils/versionHistory.js'; + //Import all themes const ThemeSnippets = {}; ThemeSnippets['Legacy_5ePHB'] = require('themes/Legacy/5ePHB/snippets.js'); @@ -46,7 +48,9 @@ const Snippetbar = createClass({ return { renderer : this.props.renderer, themeSelector : false, - snippets : [] + snippets : [], + historyExists : false, + showHistory : false }; }, @@ -58,14 +62,21 @@ const Snippetbar = createClass({ }, componentDidUpdate : async function(prevProps) { - if(prevProps.renderer != this.props.renderer || prevProps.theme != this.props.theme || prevProps.snippetBundle != this.props.snippetBundle) { - const snippets = this.compileSnippets(); - this.setState({ - snippets : snippets - }); - } - }, + const update = {}; + let newData = false; + if(prevProps.renderer != this.props.renderer || prevProps.theme != this.props.theme || prevProps.snippetBundle != this.props.snippetBundle) { + update.snippets = this.compileSnippets(); + newData = true; + }; + + if(historyExists(this.props.brew) != this.state.historyExists){ + update.historyExists = !this.state.historyExists; + newData = true; + } + + newData && this.setState(update); + }, mergeCustomizer : function(oldValue, newValue, key) { if(key == 'snippets') { @@ -139,7 +150,24 @@ const Snippetbar = createClass({ }, showHistory : function () { - console.log('show history'); + if(!this.state.historyExists) return; + + this.setState({ + showHistory : !this.state.showHistory + }); + }, + + renderHistoryItems : function() { + const historyItems = getHistoryItems(this.props.brew); + + return
+ {_.map(historyItems, (item, index)=>{ + return
+ + {item.title} +
; + })} +
; }, renderEditorButtons : function(){ @@ -162,9 +190,10 @@ const Snippetbar = createClass({ } return
-
+ {this.state.showHistory && this.renderHistoryItems() }
diff --git a/client/homebrew/editor/snippetbar/snippetbar.less b/client/homebrew/editor/snippetbar/snippetbar.less index cfda8cd74..0b38b6afd 100644 --- a/client/homebrew/editor/snippetbar/snippetbar.less +++ b/client/homebrew/editor/snippetbar/snippetbar.less @@ -57,7 +57,12 @@ .tooltipLeft('History'); font-size : 0.75em; color : grey; - &.active { color : inherit; } + &.active { + color : inherit; + &>.dropdown { visibility: visible; } + } + &:hover>.dropdown { visibility: visible; } + } &.editorTheme { .tooltipLeft('Editor Themes'); diff --git a/client/homebrew/utils/versionHistory.js b/client/homebrew/utils/versionHistory.js index 4b4f5873c..28be09234 100644 --- a/client/homebrew/utils/versionHistory.js +++ b/client/homebrew/utils/versionHistory.js @@ -1,4 +1,5 @@ export const HISTORY_PREFIX = 'HOMEBREWERY-HISTORY'; +export const HISTORY_SLOTS = 5; // const HISTORY_SAVE_DELAYS = { // 0: 0, // 0 minutes (if not specified) // 1: 2, // 2 minutes @@ -68,16 +69,29 @@ function updateStoredBrew(brew, slot=0){ return; }; -export function updateHistory(brew) { +export function historyExists(brew){ + return Object.keys(localStorage) + .some((key)=>{ + return key.startsWith(`${HISTORY_PREFIX}-${brew.shareId}`); + }); +} + +export function loadHistory(brew){ const history = {}; // Load data from local storage to History object - for (let i = 1; i<=5; i++){ + for (let i = 1; i <= HISTORY_SLOTS; i++){ history[i] = getVersionBySlot(brew, i); }; + return history; +} + +export function updateHistory(brew) { + const history = loadHistory(brew); + // Walk each version position - for (let slot = 5; slot>0; slot--){ + for (let slot = HISTORY_SLOTS; slot > 0; slot--){ const storedVersion = history[slot]; // If slot has expired, update all lower slots and break @@ -96,6 +110,16 @@ export function updateHistory(brew) { }; }; +export function getHistoryItems(brew){ + const historyArray = []; + + for (let i = 1; i <= HISTORY_SLOTS; i++){ + historyArray.push(getVersionBySlot(brew, i)); + } + + return historyArray; +}; + export function versionHistoryGarbageCollection(){ Object.keys(localStorage) .filter((key)=>{