Theme selector

pepyatka · May 13, 2015 · 67a2359 · 67a2359
1 parent f8ad85e
commit 67a2359
Show file tree

Hide file tree

Showing 5 changed files with 29 additions and 2 deletions.
diff --git a/public/index.html b/public/index.html
@@ -5,10 +5,13 @@
   <meta name="viewport" content="width=device-width,initial-scale=1" />
   <title>Pepyatka</title>
   <link rel="stylesheet" href="/css/common/common.css" />
-  <!--<link rel="stylesheet" href="/css/themes/fresh/app.css" />-->
-  <link rel="stylesheet" href="/css/themes/helvetica/app.css" />
+  <noscript><link rel="stylesheet" href="/css/themes/helvetica/app.css" /></noscript>
   <link rel="stylesheet" href="/css/font-awesome.min.css">
   <link rel="icon" href="/img/favicon.png" type="image/x-icon" />
+  <script type="text/javascript">
+    var theme = /(?:^| )theme=([a-z0-9]+)/.exec(document.cookie);
+    document.write('<link rel="stylesheet" id="theme-css" href="/css/themes/' + (theme && theme[1] || 'helvetica') + '/app.css" />');
+  </script>
 </head>
 <body>
   <script src="/js/libs/requirejs/2.1.15/require.min.js"></script>

diff --git a/public/js/app/controllers/SettingsGenericController.js b/public/js/app/controllers/SettingsGenericController.js
@@ -31,9 +31,16 @@ define(["config",
         })
     },
 
+    themes: ["helvetica", "fresh"],
+
     actions: {
       previewProfilePicture: function (newFile) {
         this.set('newProfilePicture', newFile)
+      },
+
+      themeSelect: function(theme) {
+        document.cookie = "theme=" + theme;
+        Ember.$('link#theme-css').attr("href", "/css/themes/" + theme + "/app.css");
       }
     }
   })

diff --git a/public/js/app/fields/ThemeSelectorView.js b/public/js/app/fields/ThemeSelectorView.js
@@ -0,0 +1,11 @@
+define(["app/app"], function(App) {
+  "use strict";
+
+  App.ThemeSelectorView = Ember.Select.extend({
+    classNames: ['form-control theme-selector'],
+
+    change: function(event) {
+      this.get('controller').send('themeSelect', event.target.value);
+    }
+  })
+})
diff --git a/public/js/app/main.js b/public/js/app/main.js
@@ -57,6 +57,7 @@ define([
   "fields/CreateCommentView",
   "fields/EditCommentView",
   "fields/UpdateProfilePictureView",
+  "fields/ThemeSelectorView",
 
   "routes/ForgotPasswordRoute",
   "routes/GroupsHomeRoute",

diff --git a/public/js/app/templates/settingsIndexTemplate.handlebars b/public/js/app/templates/settingsIndexTemplate.handlebars
@@ -83,3 +83,8 @@
         <span id="error-message">{{profilePicErrors}}</span>
     </div>
 {{/if}}
+
+<div class="form-group p-settings-themeselector">
+  <label for="theme-selector">Theme:</label>
+  {{view 'theme-selector' content=themes value=theme}}
+</div>