diff --git a/ui/dashboard/widgets/widget-wrapper.reel/_widget-wrapper.css b/ui/dashboard/widgets/widget-wrapper.reel/_widget-wrapper.css index 8f7779ec4b..5f8fb55975 100644 --- a/ui/dashboard/widgets/widget-wrapper.reel/_widget-wrapper.css +++ b/ui/dashboard/widgets/widget-wrapper.reel/_widget-wrapper.css @@ -6,30 +6,41 @@ cursor: grab; } - @nest .Sideboard & { - margin-left: 0; - margin-right: 0; - margin-top: 0; - width: 100%; - max-width: 100%; - } &.isDragging { opacity: .75; } - @media (min-width: 65em) { - width: calc(50% - 1em); - max-width: 100%; + &.Widget--small { + @media (min-width: 65em) { + width: calc(50% - 1em); + max-width: 100%; + } + + @media (min-width: 90em) { + width: calc(33.333% - 1em); + max-width: calc(50% - 1em); + } } - @media (min-width: 90em) { - width: calc(33% - .825em); - max-width: calc(50% - 1em); + &.Widget--medium { + @media (min-width: 65em) { + width: calc(100% - 1em); + } + + @media (min-width: 90em) { + width: calc(66.666% - 1em); + max-width: calc(100% - 1em); + } } - &.Widget-size-2 { width: 50%; } - &.Widget-size-3 { width: 100%; max-width: 100%;} + @nest .Sideboard & { + margin-left: 0; + margin-right: 0; + margin-top: 0; + width: 100%; + max-width: 100%; + } } .WidgetWrapper-removeButton { @@ -56,3 +67,20 @@ transform: scale(1); } } + +/* Widget Size Selector */ + +.Widget-sizeSelector { + position: absolute; + display: none; + bottom: .5rem; + left: .5rem; + font-size: .75em; + box-shadow: 0 0 4px 0px rgba(0,0,0,1); + z-index: 1; + + @nest .Main.drawer-is-open .Dashboard & { + display: block; + } + +} diff --git a/ui/dashboard/widgets/widget-wrapper.reel/widget-wrapper.css b/ui/dashboard/widgets/widget-wrapper.reel/widget-wrapper.css index 82caab5832..0a57d34055 100644 --- a/ui/dashboard/widgets/widget-wrapper.reel/widget-wrapper.css +++ b/ui/dashboard/widgets/widget-wrapper.reel/widget-wrapper.css @@ -1 +1 @@ -.WidgetWrapper{position:relative;width:100%}.Main.drawer-is-open .WidgetWrapper{cursor:-webkit-grab;cursor:grab}.Sideboard .WidgetWrapper{margin-left:0;margin-right:0;margin-top:0;width:100%;max-width:100%}.WidgetWrapper.isDragging{opacity:.75}@media (min-width:65em){.WidgetWrapper{width:calc(50% - 1em);max-width:100%}}@media (min-width:90em){.WidgetWrapper{width:calc(33% - .825em);max-width:calc(50% - 1em)}}.WidgetWrapper.Widget-size-2{width:50%}.WidgetWrapper.Widget-size-3{width:100%;max-width:100%}.WidgetWrapper-removeButton{right:-8px;right:-.5rem;top:-8px;top:-.5rem;position:absolute;width:32px;width:2rem;height:32px;height:2rem;background:#e0003a;border-radius:50%;padding:8px;padding:.5rem;color:#fff;box-shadow:0 2px 2px 1px rgba(0,0,0,.3);visibility:hidden;-webkit-transform:scale(0);transform:scale(0);-webkit-transition:visibility .25s ease-in-out,-webkit-transform .25s ease-in-out;transition:visibility .25s ease-in-out,-webkit-transform .25s ease-in-out;transition:transform .25s ease-in-out,visibility .25s ease-in-out;transition:transform .25s ease-in-out,visibility .25s ease-in-out,-webkit-transform .25s ease-in-out}.WidgetWrapper-removeButton:hover{background:#cc0036}.Main.drawer-is-open .WidgetWrapper-removeButton{visibility:visible;-webkit-transform:scale(1);transform:scale(1)} \ No newline at end of file +.WidgetWrapper{position:relative;width:100%}.Main.drawer-is-open .WidgetWrapper{cursor:-webkit-grab;cursor:grab}.WidgetWrapper.isDragging{opacity:.75}@media (min-width:65em){.WidgetWrapper.Widget--small{width:calc(50% - 1em);max-width:100%}}@media (min-width:90em){.WidgetWrapper.Widget--small{width:calc(33.333% - 1em);max-width:calc(50% - 1em)}}@media (min-width:65em){.WidgetWrapper.Widget--medium{width:calc(100% - 1em)}}@media (min-width:90em){.WidgetWrapper.Widget--medium{width:calc(66.666% - 1em);max-width:calc(100% - 1em)}}.Sideboard .WidgetWrapper{margin-left:0;margin-right:0;margin-top:0;width:100%;max-width:100%}.WidgetWrapper-removeButton{right:-8px;right:-.5rem;top:-8px;top:-.5rem;position:absolute;width:32px;width:2rem;height:32px;height:2rem;background:#e0003a;border-radius:50%;padding:8px;padding:.5rem;color:#fff;box-shadow:0 2px 2px 1px rgba(0,0,0,.3);visibility:hidden;-webkit-transform:scale(0);transform:scale(0);-webkit-transition:visibility .25s ease-in-out,-webkit-transform .25s ease-in-out;transition:visibility .25s ease-in-out,-webkit-transform .25s ease-in-out;transition:transform .25s ease-in-out,visibility .25s ease-in-out;transition:transform .25s ease-in-out,visibility .25s ease-in-out,-webkit-transform .25s ease-in-out}.WidgetWrapper-removeButton:hover{background:#cc0036}.Main.drawer-is-open .WidgetWrapper-removeButton{visibility:visible;-webkit-transform:scale(1);transform:scale(1)}.Widget-sizeSelector{position:absolute;display:none;bottom:8px;bottom:.5rem;left:8px;left:.5rem;font-size:.75em;box-shadow:0 0 4px 0 #000;z-index:1}.Main.drawer-is-open .Dashboard .Widget-sizeSelector{display:block} \ No newline at end of file diff --git a/ui/dashboard/widgets/widget-wrapper.reel/widget-wrapper.html b/ui/dashboard/widgets/widget-wrapper.reel/widget-wrapper.html index e0d371ce32..7cb2e1451f 100644 --- a/ui/dashboard/widgets/widget-wrapper.reel/widget-wrapper.html +++ b/ui/dashboard/widgets/widget-wrapper.reel/widget-wrapper.html @@ -6,7 +6,12 @@ { "owner": { "properties": { - "element": {"#": "owner"} + "element": {"#": "owner"}, + "sizeOptions": [ + {"value": "small", "label": "small"}, + {"value": "medium", "label": "medium"}, + {"value": "large", "label": "large"} + ] } }, @@ -20,12 +25,21 @@ "object": {"<-": "@owner.object"} } }, - "removeWidgetButton": { "prototype": "montage/ui/button.reel", "properties": { "element": {"#": "removeButton"} } + }, + "sizeSelector": { + "prototype": "blue-shark/ui/tabs.reel", + "properties": { + "element": {"#": "sizeSelector"} + }, + "bindings": { + "options": {"<-": "@owner.sizeOptions"}, + "selection": {"<->": "@owner.size"} + } } } @@ -36,6 +50,7 @@ +
diff --git a/ui/dashboard/widgets/widget-wrapper.reel/widget-wrapper.js b/ui/dashboard/widgets/widget-wrapper.reel/widget-wrapper.js index 8a785fd574..0387947447 100644 --- a/ui/dashboard/widgets/widget-wrapper.reel/widget-wrapper.js +++ b/ui/dashboard/widgets/widget-wrapper.reel/widget-wrapper.js @@ -11,6 +11,31 @@ exports.WidgetWrapper = AbstractDraggableComponent.specialize(/** @lends WidgetW _placeHolderStrategy: { value: "remove" + }, + + _size: { + value: null + }, + + size: { + get: function () { + return this._size; + }, + set: function (option) { + if(this._size !== option) { + this.classList.remove("Widget--" + this._size); + this.classList.add("Widget--" + option); + this._size = option; + } + } + }, + + enterDocument: { + value: function (isFirstTime) { + if(isFirstTime) { + this.size = "small"; + } + } } }); diff --git a/ui/dashboard/widgets/widget.reel/_widget.css b/ui/dashboard/widgets/widget.reel/_widget.css index 12e93a2d95..41ce076fbc 100644 --- a/ui/dashboard/widgets/widget.reel/_widget.css +++ b/ui/dashboard/widgets/widget.reel/_widget.css @@ -61,12 +61,12 @@ right: 0; bottom: 0; border-radius: var(--widget-border-radius); - background: rgba(0,0,0,.75); + background: rgba(0,0,0,.5); transition: visibility .35s ease-in-out, opacity .35s ease-in-out; - z-index: 2; + z-index: 1; } - @nest .drawer-is-open .has-settings &:before { + @nest .drawer-is-open &:before { visibility: visible; opacity: 1; } @@ -141,19 +141,19 @@ } } +/* Button */ + .Widget-info { position: absolute; - z-index: 10; - left: 1em; - bottom: 1em; + right: .5em; + bottom: .5em; visibility: hidden; opacity: 0; transition: visibility .35s ease-in-out, opacity .35s ease-in-out; + z-index: 1; @nest .drawer-is-open .has-settings & { visibility: visible; opacity: 1; } } - - diff --git a/ui/dashboard/widgets/widget.reel/widget.css b/ui/dashboard/widgets/widget.reel/widget.css index 11fa6de2c4..b32bca1be7 100644 --- a/ui/dashboard/widgets/widget.reel/widget.css +++ b/ui/dashboard/widgets/widget.reel/widget.css @@ -1 +1 @@ -.Widget{display:-webkit-box;display:-ms-flexbox;display:flex;height:15em;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;background:#16171a;border-radius:4px;overflow:hidden;box-shadow:0 0 2px 2px rgba(43,156,216,0);-webkit-transition:box-shadow .25s ease-in-out;transition:box-shadow .25s ease-in-out}.Widget>*{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.drawer-is-open .Widget:hover{box-shadow:0 0 2px 2px #2b9cd8}.Widget-header{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;padding:8px;padding:.5rem;line-height:1em;height:2.5em;background-color:#404040;color:#e0e5e5}.Widget-header svg{width:1.4em;height:1.4em;margin-right:.5em;color:inherit}.flip .Widget-header{background-color:#0c5688}.Widget-content{-webkit-box-flex:1;-ms-flex:1;flex:1;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;position:relative;overflow:hidden;border-bottom-left-radius:4px;border-bottom-right-radius:4px}.Widget-content:before{content:'';position:absolute;visibility:hidden;opacity:0;top:0;left:0;right:0;bottom:0;border-radius:4px;background:rgba(0,0,0,.75);-webkit-transition:visibility .35s ease-in-out,opacity .35s ease-in-out;transition:visibility .35s ease-in-out,opacity .35s ease-in-out;z-index:2}.drawer-is-open .has-settings .Widget-content:before{visibility:visible;opacity:1}.drawer-is-open .flip .Widget-content:before{visibility:hidden;opacity:0}.Widget-content-front{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-flex:1;-ms-flex:1;flex:1;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}.Widget-content-front .Scrollview-transform{-webkit-box-flex:0;-ms-flex:none;flex:none;display:block}.Widget-footer{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:end;-ms-flex-align:end;align-items:flex-end;-webkit-box-pack:end;-ms-flex-pack:end;justify-content:flex-end}.Widget-back,.Widget-flipper,.Widget-front{-webkit-box-flex:1;-ms-flex:1;flex:1;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}.Widget-back,.Widget-flipper,.Widget-front,.Widget.flip .Widget-back,.Widget .Widget-front{display:-webkit-box;display:-ms-flexbox;display:flex}.Widget.flip .Widget-front,.Widget .Widget-back{display:none}.Widget-back{-webkit-box-flex:1;-ms-flex:1;flex:1;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.Widget-back .Widget-content{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;padding:1em;width:100%;max-width:25em}.Widget-back .Widget-settings{-webkit-box-flex:1;-ms-flex:1;flex:1}.Widget-back .Widget-header{width:100%}.Widget-back .Widget-footer *{margin-left:.5em}.Widget-info{position:absolute;z-index:10;left:1em;bottom:1em;visibility:hidden;opacity:0;-webkit-transition:visibility .35s ease-in-out,opacity .35s ease-in-out;transition:visibility .35s ease-in-out,opacity .35s ease-in-out}.drawer-is-open .has-settings .Widget-info{visibility:visible;opacity:1} \ No newline at end of file +.Widget{display:-webkit-box;display:-ms-flexbox;display:flex;height:15em;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;background:#16171a;border-radius:4px;overflow:hidden;box-shadow:0 0 2px 2px rgba(43,156,216,0);-webkit-transition:box-shadow .25s ease-in-out;transition:box-shadow .25s ease-in-out}.Widget>*{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.drawer-is-open .Widget:hover{box-shadow:0 0 2px 2px #2b9cd8}.Widget-header{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;padding:8px;padding:.5rem;line-height:1em;height:2.5em;background:#404040;color:#e0e5e5}.Widget-header svg{width:1.4em;height:1.4em;margin-right:.5em;color:inherit}.Widget-content{-webkit-box-flex:1;-ms-flex:1;flex:1;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;position:relative;overflow:hidden;border-bottom-left-radius:4px;border-bottom-right-radius:4px}.Widget-content:before{content:'';position:absolute;visibility:hidden;opacity:0;top:0;left:0;right:0;bottom:0;border-radius:4px;background:rgba(0,0,0,.5);-webkit-transition:visibility .35s ease-in-out,opacity .35s ease-in-out;transition:visibility .35s ease-in-out,opacity .35s ease-in-out;z-index:1}.drawer-is-open .Widget-content:before{visibility:visible;opacity:1}.drawer-is-open .flip .Widget-content:before{visibility:hidden;opacity:0}.Widget-content-front{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-flex:1;-ms-flex:1;flex:1;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}.Widget-content-front .Scrollview-transform{-webkit-box-flex:0;-ms-flex:none;flex:none;display:block}.Widget-footer{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:end;-ms-flex-align:end;align-items:flex-end;-webkit-box-pack:end;-ms-flex-pack:end;justify-content:flex-end}.Widget-back,.Widget-flipper,.Widget-front{-webkit-box-flex:1;-ms-flex:1;flex:1;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}.Widget-back,.Widget-flipper,.Widget-front,.Widget.flip .Widget-back,.Widget .Widget-front{display:-webkit-box;display:-ms-flexbox;display:flex}.Widget.flip .Widget-front,.Widget .Widget-back{display:none}.Widget-back{-webkit-box-flex:1;-ms-flex:1;flex:1;-webkit-box-align:center;-ms-flex-align:center;-ms-grid-row-align:center;align-items:center}.Widget-back .Widget-content{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;padding:1em;width:100%;max-width:25em}.Widget-back .Widget-settings{-webkit-box-flex:1;-ms-flex:1;flex:1}.Widget-back .Widget-header{width:100%}.Widget-back .Widget-footer *{margin-left:.5em}.Widget-info{position:absolute;right:.5em;bottom:.5em;visibility:hidden;opacity:0;-webkit-transition:visibility .35s ease-in-out,opacity .35s ease-in-out;transition:visibility .35s ease-in-out,opacity .35s ease-in-out;z-index:1}.drawer-is-open .has-settings .Widget-info{visibility:visible;opacity:1} \ No newline at end of file diff --git a/ui/drawer.reel/_drawer.css b/ui/drawer.reel/_drawer.css index 0a23ea8b81..05a3406495 100644 --- a/ui/drawer.reel/_drawer.css +++ b/ui/drawer.reel/_drawer.css @@ -122,3 +122,12 @@ margin-right: 1em; } } + +/* Drawer Layout Button */ + +.Drawer-layoutButton { + + @nest .layout-has-changed & { + display: inline-block; + } +} diff --git a/ui/drawer.reel/drawer.css b/ui/drawer.reel/drawer.css index d30125a4a4..94dcdcba2c 100644 --- a/ui/drawer.reel/drawer.css +++ b/ui/drawer.reel/drawer.css @@ -1 +1 @@ -.Drawer{background-color:#16171a;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;display:none;position:relative}.drawer-is-open .Drawer{display:block;bottom:0;left:0;right:0;top:0;height:14.5em;box-shadow:0 -4px 6px rgba(0,0,0,.3)}.DrawerContent{position:absolute;bottom:0;left:0;right:0;height:calc(100% - 3em)}.DrawerContent:after,.DrawerContent:before{position:absolute;content:'';width:1em;top:0;height:100%;background-image:-webkit-linear-gradient(left,#16171a,rgba(22,23,26,0));background-image:linear-gradient(90deg,#16171a,rgba(22,23,26,0))}.DrawerContent:after{right:0;background-image:-webkit-linear-gradient(left,rgba(22,23,26,0),#16171a);background-image:linear-gradient(90deg,rgba(22,23,26,0),#16171a)}.Drawer-overlay{visibility:hidden;opacity:0;position:absolute;content:'';top:0;right:0;left:0;bottom:0;background-image:-webkit-radial-gradient(rgba(224,0,58,.2),rgba(224,0,58,.8));background-image:radial-gradient(rgba(224,0,58,.2),rgba(224,0,58,.8));background-size:95vw 95vw;background-repeat:no-repeat;background-position:50%;z-index:1;-webkit-transition:opacity .35s ease-in-out,visibility .35s ease-in-out;transition:opacity .35s ease-in-out,visibility .35s ease-in-out}.acceptDrop .Drawer-overlay,.willAcceptDrop .Drawer-overlay{opacity:1;visibility:visible}.acceptDrop .Drawer-overlay,.Drawer-overlay svg{background:#e0003a}.Drawer-overlay svg{position:absolute;top:calc(50% - 2.5em);left:calc(50% - 2.5em);height:5em;width:5em;padding:1.25em;color:hsla(0,0%,100%,.9);border-radius:50%;box-shadow:0 0 3px 4px rgba(0,0,0,.2)}.Drawer>header{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;-webkit-box-align:center;-ms-flex-align:center;align-items:center;height:3em;padding:0 16px;padding:0 1rem;background:#242628}.Drawer-close{height:2.4em;width:2.4em}.Drawer-close.is-open{-webkit-transform:translateY(0);transform:translateY(0)}.Drawer-title{font-size:1em;margin:0;color:#e6e6e6;font-weight:200}.Drawer-items{padding:1em;margin:0;display:-webkit-box;display:-ms-flexbox;display:flex}.Drawer-item{display:inline-block}.Drawer-item:not(:last-child){margin-right:1em} \ No newline at end of file +.Drawer{background-color:#16171a;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;display:none;position:relative}.drawer-is-open .Drawer{display:block;bottom:0;left:0;right:0;top:0;height:14.5em;box-shadow:0 -4px 6px rgba(0,0,0,.3)}.DrawerContent{position:absolute;bottom:0;left:0;right:0;height:calc(100% - 3em)}.DrawerContent:after,.DrawerContent:before{position:absolute;content:'';width:1em;top:0;height:100%;background-image:-webkit-linear-gradient(left,#16171a,rgba(22,23,26,0));background-image:linear-gradient(90deg,#16171a,rgba(22,23,26,0))}.DrawerContent:after{right:0;background-image:-webkit-linear-gradient(left,rgba(22,23,26,0),#16171a);background-image:linear-gradient(90deg,rgba(22,23,26,0),#16171a)}.Drawer-overlay{visibility:hidden;opacity:0;position:absolute;content:'';top:0;right:0;left:0;bottom:0;background-image:-webkit-radial-gradient(rgba(224,0,58,.2),rgba(224,0,58,.8));background-image:radial-gradient(rgba(224,0,58,.2),rgba(224,0,58,.8));background-size:95vw 95vw;background-repeat:no-repeat;background-position:50%;z-index:1;-webkit-transition:opacity .35s ease-in-out,visibility .35s ease-in-out;transition:opacity .35s ease-in-out,visibility .35s ease-in-out}.acceptDrop .Drawer-overlay,.willAcceptDrop .Drawer-overlay{opacity:1;visibility:visible}.acceptDrop .Drawer-overlay,.Drawer-overlay svg{background:#e0003a}.Drawer-overlay svg{position:absolute;top:calc(50% - 2.5em);left:calc(50% - 2.5em);height:5em;width:5em;padding:1.25em;color:hsla(0,0%,100%,.9);border-radius:50%;box-shadow:0 0 3px 4px rgba(0,0,0,.2)}.Drawer>header{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;-webkit-box-align:center;-ms-flex-align:center;align-items:center;height:3em;padding:0 16px;padding:0 1rem;background:#242628}.Drawer-close{height:2.4em;width:2.4em}.Drawer-close.is-open{-webkit-transform:translateY(0);transform:translateY(0)}.Drawer-title{font-size:1em;margin:0;color:#e6e6e6;font-weight:200}.Drawer-items{padding:1em;margin:0;display:-webkit-box;display:-ms-flexbox;display:flex}.Drawer-item{display:inline-block}.Drawer-item:not(:last-child){margin-right:1em}.layout-has-changed .Drawer-layoutButton{display:inline-block} \ No newline at end of file diff --git a/ui/drawer.reel/drawer.html b/ui/drawer.reel/drawer.html index c9c84895e9..9d0706d3a7 100644 --- a/ui/drawer.reel/drawer.html +++ b/ui/drawer.reel/drawer.html @@ -11,7 +11,8 @@ }, "bindings": { "dashboardWidgets": {"<-": "@owner.currentUser.attributes.dashboardContext.widgets"}, - "sideBoardWidgets": {"<-": "@owner.currentUser.attributes.sideBoardContext.widgets"} + "sideBoardWidgets": {"<-": "@owner.currentUser.attributes.sideBoardContext.widgets"}, + "classList.has('layout-has-changed')": {"<-": "@owner.hasDashboardLayoutChanged"} } }, "horizontalScroll": { @@ -52,6 +53,20 @@ "element": {"#": "closeButton"}, "value": "Done Editing" } + }, + "restoreDefaultButton": { + "prototype": "blue-shark/ui/button.reel", + "properties": { + "element": {"#": "restoreDefaultButton"}, + "value": "Restore default layout" + } + }, + "saveAsDefaultButton": { + "prototype": "blue-shark/ui/button.reel", + "properties": { + "element": {"#": "saveAsDefaultButton"}, + "value": "Save as default layout" + } } } @@ -60,7 +75,11 @@

Drag to add widgets

- +
+ + + +
diff --git a/ui/drawer.reel/drawer.js b/ui/drawer.reel/drawer.js index 494fff54c0..75ebb2873b 100644 --- a/ui/drawer.reel/drawer.js +++ b/ui/drawer.reel/drawer.js @@ -158,6 +158,18 @@ exports.Drawer = AbstractDropZoneComponent.specialize(/** @lends Drawer# */ { this.sideBoardWidgets.splice(index, 1); } } + }, + + handleRestoreDefaultButton: { + value: function () { + console.log("restore default"); + } + }, + + handleSaveAsDefaultButton: { + value: function () { + console.log("save as default"); + } } });