diff --git a/src/index.html b/src/index.html index 33acbfc..e2e04c1 100644 --- a/src/index.html +++ b/src/index.html @@ -33,6 +33,8 @@ + + diff --git a/src/js/app.js b/src/js/app.js index b53aa72..13b2226 100644 --- a/src/js/app.js +++ b/src/js/app.js @@ -6,7 +6,8 @@ var app = new core.AppShell(di); app.set('cmdConfig', core.ObservableObject.create({ - emphasizeBytes: true + emphasizeBytes: true, + theme: 'dark' })); app.debugMode = false; diff --git a/src/js/app/cmd/commands.js b/src/js/app/cmd/commands.js index 00a30da..6454792 100644 --- a/src/js/app/cmd/commands.js +++ b/src/js/app/cmd/commands.js @@ -4,7 +4,6 @@ app.run(function() { var cmd = app.get('cmd'); var cmdConfig = app.get('cmdConfig'); var rootView = app.get('rootView'); - var shell = app.get('shell'); cmd.commands({ 'help': function() { @@ -22,10 +21,10 @@ app.run(function() { cmdConfig.emphasizeBytes = !cmdConfig.emphasizeBytes; }, 'dark': function() { - shell.setDarkTheme(); + cmdConfig.theme = 'dark'; }, light: function () { - shell.setLightTheme(); + cmdConfig.theme = 'light'; }, about: function() { var aboutResult = document.querySelector('.result .aboutTpl'); diff --git a/src/js/app/run.js b/src/js/app/run.js new file mode 100644 index 0000000..9b70cad --- /dev/null +++ b/src/js/app/run.js @@ -0,0 +1,43 @@ +// Theme change +app.run(function(){ + var rootView = app.get('rootView'); + var cmdConfig = app.get('cmdConfig'); + + cmdConfig.observe('theme', function (theme) { + console.log('changed theme'); + var theOther = theme == 'dark' ? 'light' : 'dark'; + + if(rootView.classList.contains(theme)) { + return; + } + + rootView.classList.remove(theOther); + rootView.classList.add(theme); + }); +}); + +// Save config in local store +app.run(function() { + var cfg = app.get('cmdConfig'); + var storeKey = 'cmdConfig'; + + load(); + + cfg.observe(function(property, value){ + save(); + }); + + function save() { + localStorage.setItem(storeKey, JSON.stringify(cfg.store())); + } + + function load() { + var json = localStorage.getItem(storeKey), stored; + if(core.is.string(json)) { + stored = JSON.parse(json); + for(var key in stored) { + cfg[key] = stored[key]; + } + } + } +}); diff --git a/src/js/app/services.js b/src/js/app/services.js index eaea2ce..5c97465 100644 --- a/src/js/app/services.js +++ b/src/js/app/services.js @@ -6,46 +6,6 @@ app.set('should', core.should); app.set('bindr', core.bindr); - // Save config in local store - app.run(function() { - var cfg = app.get('cmdConfig'); - var storeKey = 'cmdConfig'; - - load(); - - cfg.observe(function(property, value){ - save(); - }); - - function save() { - localStorage.setItem(storeKey, JSON.stringify(cfg.store())); - } - - function load() { - var json = localStorage.getItem(storeKey), stored; - if(core.is.string(json)) { - stored = JSON.parse(json); - for(var key in stored) { - cfg[key] = stored[key]; - } - } - } - }); - - app.set('shell', function(){ - var rootView = app.get('rootView'); - - return { - setDarkTheme: function() { - rootView.classList.remove('light'); - rootView.classList.add('dark'); - }, - setLightTheme: function() { - rootView.classList.remove('dark'); - rootView.classList.add('light'); - } - } - }); /* var template = { compile: function (template) { diff --git a/src/js/core/observable.js b/src/js/core/observable.js index 1bf1bec..cfd4ae1 100644 --- a/src/js/core/observable.js +++ b/src/js/core/observable.js @@ -47,7 +47,7 @@ else if(is.string(property) && is.aFunction(handler)) { func = function (p, v) { if(p === property) { - handler(p, v) + handler(v) } } }