From 3b44e38e1402ac14206edbbf92934dfcb1ab9651 Mon Sep 17 00:00:00 2001 From: rolux Date: Sun, 10 Feb 2013 17:22:31 +0530 Subject: [PATCH] support new themes, plus patch for legacy themes --- static/js/pandora.js | 24 +++++++++++++++--------- static/js/pandora/mainMenu.js | 7 +++---- 2 files changed, 18 insertions(+), 13 deletions(-) diff --git a/static/js/pandora.js b/static/js/pandora.js index 660aa3d2..6a47aae5 100644 --- a/static/js/pandora.js +++ b/static/js/pandora.js @@ -34,8 +34,11 @@ appPanel enableDebugMode = localStorage && localStorage['pandora.enableDebugMode'], enableEventLogging = localStorage && localStorage['pandora.enableEventLogging'], isMSIE = /MSIE/.test(navigator.userAgent), + legacyThemes = {classic: 'oxlight', modern: 'oxdark'}, theme = localStorage && localStorage['Ox.theme'] - && JSON.parse(localStorage['Ox.theme']) || 'modern'; + && JSON.parse(localStorage['Ox.theme']) || 'oxmedium'; + + theme = legacyThemes[theme] || theme; loadImages(function(images) { loadScreen(images); @@ -107,15 +110,16 @@ appPanel gradient.style.width = '322px'; gradient.style.height = '162px'; gradient.style.margin = 'auto'; - gradient.style.background = theme == 'classic' - ? '-moz-linear-gradient(top, rgba(224, 224, 224, 0.75), rgba(224, 224, 224, 1), rgba(224, 224, 224, 1))' + gradient.style.background = theme == 'oxlight' ? '-moz-linear-gradient(top, rgba(224, 224, 224, 0.75), rgba(224, 224, 224, 1), rgba(224, 224, 224, 1))' + : theme == 'oxmedium' ? '-moz-linear-gradient(top, rgba(144, 144, 144, 0.75), rgba(144, 144, 144, 1), rgba(144, 144, 144, 1))' : '-moz-linear-gradient(top, rgba(32, 32, 32, 0.75), rgba(32, 32, 32, 1), rgba(32, 32, 32, 1))'; - gradient.style.background = theme == 'classic' - ? '-o-linear-gradient(top, rgba(224, 224, 224, 0.75), rgba(224, 224, 224, 1), rgba(224, 224, 224, 1))' + gradient.style.background = theme == 'oxlight' ? '-o-linear-gradient(top, rgba(224, 224, 224, 0.75), rgba(224, 224, 224, 1), rgba(224, 224, 224, 1))' + : theme == 'oxmedium' ? '-o-linear-gradient(top, rgba(144, 144, 144, 0.75), rgba(144, 144, 144, 1), rgba(144, 144, 144, 1))' : '-o-linear-gradient(top, rgba(32, 32, 32, 0.75), rgba(32, 32, 32, 1), rgba(32, 32, 32, 1))'; - gradient.style.background = theme == 'classic' - ? '-webkit-linear-gradient(top, rgba(224, 224, 224, 0.75), rgba(224, 224, 224, 1), rgba(224, 224, 224, 1))' + gradient.style.background = theme == 'oxlight' ? '-webkit-linear-gradient(top, rgba(224, 224, 224, 0.75), rgba(224, 224, 224, 1), rgba(224, 224, 224, 1))' + : theme == 'oxmedium' ? '-webkit-linear-gradient(top, rgba(144, 144, 144, 0.75), rgba(144, 144, 144, 1), rgba(144, 144, 144, 1))' : '-webkit-linear-gradient(top, rgba(32, 32, 32, 0.75), rgba(32, 32, 32, 1), rgba(32, 32, 32, 1))'; + } var loadingScreen = document.createElement('div'); loadingScreen.setAttribute('id', 'loadingScreen'); @@ -123,8 +127,8 @@ appPanel loadingScreen.style.position = 'absolute'; loadingScreen.style.width = '100%'; loadingScreen.style.height = '100%'; - loadingScreen.style.backgroundColor = theme == 'classic' - ? 'rgb(224, 224, 224)' : 'rgb(32, 32, 32)'; + loadingScreen.style.backgroundColor = theme == 'oxlight' ? 'rgb(224, 224, 224)' + : theme == 'oxmedium' ? 'rgb(144, 144, 144)' : 'rgb(32, 32, 32)'; loadingScreen.style.zIndex = '1002'; loadingScreen.appendChild(images.logo); images.reflection && loadingScreen.appendChild(images.reflection); @@ -234,6 +238,8 @@ appPanel delete pandora.user.ui[key]; } }); + // patch theme ... this can be removed at a later point + pandora.user.ui.theme = legacyThemes[pandora.user.ui.theme] || pandora.user.ui.theme; // patch itemView ... this can be removed at a later point if (pandora.user.ui.itemView == 'video') { pandora.user.ui.itemView = 'player'; diff --git a/static/js/pandora/mainMenu.js b/static/js/pandora/mainMenu.js index d5286e4f..9d419b30 100644 --- a/static/js/pandora/mainMenu.js +++ b/static/js/pandora/mainMenu.js @@ -119,10 +119,9 @@ pandora.ui.mainMenu = function() { { id: 'entervideofullscreen', title: 'Enter Video Fullscreen', disabled: !ui.item || ui.itemView != 'player' }, {}, { id: 'theme', title: 'Theme', items: [ - { group: 'settheme', min: 1, max: 1, items: [ - { id: 'classic', title: 'Light', checked: ui.theme == 'classic'}, - { id: 'modern', title: 'Dark', checked: ui.theme == 'modern' } - ]} + { group: 'settheme', min: 1, max: 1, items: pandora.site.themes.map(function(theme) { + return {id: theme, title: Ox.Theme.getThemeData(theme).themeName, checked: ui.theme == theme} + }) } ] } ]}, getSortMenu(),