From 02a97d4aa6e3ecc69afd09be68d77afef7e349a0 Mon Sep 17 00:00:00 2001 From: Bruno Alves de Faria Date: Fri, 3 Mar 2017 11:05:53 -0300 Subject: [PATCH] PWV-15: Removing themeSelectorModal from DOM --- LesionTracker/client/components/app/app.html | 1 - .../components/bootstrap/dialog/form.html | 5 ++- .../ohif-core/client/ui/dialog/display.js | 2 +- .../styles/imports/theme-icons.styl | 2 +- .../themeSelectorModal.html | 41 +++++++------------ .../themeSelectorModal/themeSelectorModal.js | 39 +++++++++++------- .../userAccountMenu/userAccountMenu.js | 15 ++++--- 7 files changed, 56 insertions(+), 49 deletions(-) diff --git a/LesionTracker/client/components/app/app.html b/LesionTracker/client/components/app/app.html index 0c6b0ef86..ec011ed1c 100644 --- a/LesionTracker/client/components/app/app.html +++ b/LesionTracker/client/components/app/app.html @@ -33,5 +33,4 @@ {{>lastLoginModal}} {{>progressDialog}} {{>viewSeriesDetailsModal}} - {{>themeSelectorModal}} diff --git a/Packages/ohif-core/client/components/bootstrap/dialog/form.html b/Packages/ohif-core/client/components/bootstrap/dialog/form.html index 483d56297..04067c96e 100644 --- a/Packages/ohif-core/client/components/bootstrap/dialog/form.html +++ b/Packages/ohif-core/client/components/bootstrap/dialog/form.html @@ -10,7 +10,10 @@ data-dismiss='modal' aria-label='Close' ) }}{{/button}} -

{{this.title}}

+

+ {{#if this.titleIcon}}{{/if}} + {{this.title}} +

{{>UI.contentBlock}} diff --git a/Packages/ohif-core/client/ui/dialog/display.js b/Packages/ohif-core/client/ui/dialog/display.js index 2396a05eb..81eb52ad8 100644 --- a/Packages/ohif-core/client/ui/dialog/display.js +++ b/Packages/ohif-core/client/ui/dialog/display.js @@ -4,7 +4,7 @@ import { _ } from 'meteor/underscore'; import { $ } from 'meteor/jquery'; import { OHIF } from 'meteor/ohif:core'; -OHIF.ui.showDialog = (templateName, dialogData) => { +OHIF.ui.showDialog = (templateName, dialogData={}) => { // Check if the given template exists const template = Template[templateName]; if (!template) { diff --git a/Packages/ohif-design/styles/imports/theme-icons.styl b/Packages/ohif-design/styles/imports/theme-icons.styl index 853638f52..b04418982 100644 --- a/Packages/ohif-design/styles/imports/theme-icons.styl +++ b/Packages/ohif-design/styles/imports/theme-icons.styl @@ -6,7 +6,7 @@ .theme-icon-mint .theme-icon-honeycomb display: inline-block - background: url('/packages/design/assets/theme-icons.png') no-repeat + background: url('/packages/ohif_design/assets/theme-icons.png') no-repeat overflow: hidden text-indent: -9999px text-align: left diff --git a/Packages/ohif-study-list/client/components/themeSelector/themeSelectorModal/themeSelectorModal.html b/Packages/ohif-study-list/client/components/themeSelector/themeSelectorModal/themeSelectorModal.html index 3d3886e66..d3aafde80 100644 --- a/Packages/ohif-study-list/client/components/themeSelector/themeSelectorModal/themeSelectorModal.html +++ b/Packages/ohif-study-list/client/components/themeSelector/themeSelectorModal/themeSelectorModal.html @@ -1,28 +1,17 @@ diff --git a/Packages/ohif-study-list/client/components/themeSelector/themeSelectorModal/themeSelectorModal.js b/Packages/ohif-study-list/client/components/themeSelector/themeSelectorModal/themeSelectorModal.js index 928d7ed7d..69986ff82 100644 --- a/Packages/ohif-study-list/client/components/themeSelector/themeSelectorModal/themeSelectorModal.js +++ b/Packages/ohif-study-list/client/components/themeSelector/themeSelectorModal/themeSelectorModal.js @@ -1,6 +1,9 @@ +import { Template } from 'meteor/templating'; +import { ReactiveDict } from 'meteor/reactive-dict'; + const DEFAULT_THEME = 'tide'; -const getActualTheme = () => sessionStorage.getItem('theme'); +const getCurrentTheme = () => sessionStorage.getItem('theme'); const setActualTheme = theme => sessionStorage.setItem('theme', theme); @@ -10,7 +13,7 @@ const removeThemesFromBody = () => { const classList = document.body.classList; for (let i = classList.length - 1; i >= 0; i--) { - if(classList[i].search('theme-') !== -1) { + if (classList[i].search('theme-') !== -1) { document.body.classList.remove(classList[i]); } } @@ -18,29 +21,32 @@ const removeThemesFromBody = () => { Template.themeSelectorModal.onCreated(() => { const instance = Template.instance(); - let actualTheme = getActualTheme(); - if(!actualTheme) { - actualTheme = DEFAULT_THEME; - setActualTheme(actualTheme); + let currentTheme = getCurrentTheme(); + if (!currentTheme) { + currentTheme = DEFAULT_THEME; + setActualTheme(currentTheme); } instance.state = new ReactiveDict(); - instance.state.set('selectedTheme', actualTheme); + instance.state.set('selectedTheme', currentTheme); - addThemeToBody(actualTheme); + addThemeToBody(currentTheme); instance.container = { - actualTheme, + currentTheme, + previewTheme(theme, state) { state.set('selectedTheme', theme); removeThemesFromBody(); addThemeToBody(theme); }, + applyTheme(state) { setActualTheme(state.get('selectedTheme')); }, + resetState(state) { - const theme = getActualTheme(); + const theme = getCurrentTheme(); state.set('selectedTheme', theme); removeThemesFromBody(); @@ -48,14 +54,19 @@ Template.themeSelectorModal.onCreated(() => { } }; + const { promise } = instance.data; + promise.then(() => instance.container.applyTheme(instance.state)); + promise.catch(() => instance.container.resetState(instance.state)); }); Template.themeSelectorModal.helpers({ themes: [ 'crickets', 'honeycomb', 'mint', 'overcast', 'quartz', 'tide', 'tigerlily' ], + ucFirst(text) { return text.charAt(0).toUpperCase() + text.slice(1); }, - addClassIfSelected(theme) { + + printClassIfSelected(theme) { const instance = Template.instance(); return theme === instance.state.get('selectedTheme') ? 'selected' : ''; @@ -63,7 +74,7 @@ Template.themeSelectorModal.helpers({ }); Template.themeSelectorModal.events({ - 'click .js-cancel, click .close': (event, instance) => instance.container.resetState(instance.state), - 'click .js-apply': (event, instance) => instance.container.applyTheme(instance.state), - 'click .preview-theme': (event, instance) => instance.container.previewTheme(event.currentTarget.dataset.theme, instance.state) + 'click .preview-theme'(event, instance) { + instance.container.previewTheme(event.currentTarget.dataset.theme, instance.state); + } }); diff --git a/Packages/ohif-user-management/client/components/userAccountMenu/userAccountMenu.js b/Packages/ohif-user-management/client/components/userAccountMenu/userAccountMenu.js index aea987bbd..2aaeb7c25 100644 --- a/Packages/ohif-user-management/client/components/userAccountMenu/userAccountMenu.js +++ b/Packages/ohif-user-management/client/components/userAccountMenu/userAccountMenu.js @@ -1,6 +1,9 @@ +import { Meteor } from 'meteor/meteor'; import { Template } from 'meteor/templating'; import { ReactiveVar } from 'meteor/reactive-var'; import { Session } from 'meteor/session'; +import { Router } from 'meteor/iron:router'; +import { OHIF } from 'meteor/ohif:core'; // Display the last login modal as default Session.setDefault('displayLastLoginModal', true); @@ -32,13 +35,15 @@ Template.userAccountMenu.helpers({ }); Template.userAccountMenu.events({ - 'click #serverInformation': function() { + 'click #serverInformation'() { $('#serverInformationModal').modal('show'); }, - 'click #themeSelector': function() { - $('#themeSelectorModal').modal('show'); + + 'click #themeSelector'() { + OHIF.ui.showDialog('themeSelectorModal'); }, - 'click #logoutButton': function() { + + 'click #logoutButton'() { Meteor.logout(function() { Router.go('/entrySignIn'); }); @@ -122,4 +127,4 @@ Template.userAccountMenu.onCreated(function userAccountMenuCreated() { }); }); -}); \ No newline at end of file +});