From 8f78cb1377009dabde95f4a81d5090b79b9de0da Mon Sep 17 00:00:00 2001 From: Valerio Virgillito Date: Tue, 17 Jul 2012 23:34:57 -0700 Subject: menu design update and bug fixes - Moved Preview to the document bar - Redesigned the menu and improved DOM structure. - Removed un-used entires - Fixed layout and snap entries - Moved the preview button to the document bar. - Fixes for bugs: #1750, #1867, #1876, #1895 Signed-off-by: Valerio Virgillito --- css/ninja.css | 2 +- .../layout/document-bar.reel/document-bar.css | 13 +- .../layout/document-bar.reel/document-bar.html | 23 + .../layout/document-bar.reel/document-bar.js | 6 + .../layout/stage-mode.reel/stage-mode.css | 49 -- .../layout/stage-mode.reel/stage-mode.html | 55 -- js/components/layout/stage-mode.reel/stage-mode.js | 77 --- js/components/menu/menu-entry.reel/menu-entry.css | 89 --- js/components/menu/menu-entry.reel/menu-entry.html | 97 ---- js/components/menu/menu-entry.reel/menu-entry.js | 140 ----- js/components/menu/menu-item.reel/menu-item.css | 99 ---- js/components/menu/menu-item.reel/menu-item.html | 97 ---- js/components/menu/menu-item.reel/menu-item.js | 198 ------- js/components/menu/menu.reel/menu.css | 39 -- js/components/menu/menu.reel/menu.html | 97 ---- js/components/menu/menu.reel/menu.js | 143 ----- js/data/menu-data.js | 582 ------------------- js/models/app-model.js | 156 ----- js/ninja.reel/ninja.html | 19 +- js/ninja.reel/ninja.js | 5 +- js/ui/menu/menu-controller.js | 636 +++++++++++++++++++++ js/ui/menu/menu-entry.reel/menu-entry.css | 80 +++ js/ui/menu/menu-entry.reel/menu-entry.html | 102 ++++ js/ui/menu/menu-entry.reel/menu-entry.js | 110 ++++ js/ui/menu/menu-item.reel/menu-item.css | 149 +++++ js/ui/menu/menu-item.reel/menu-item.html | 120 ++++ js/ui/menu/menu-item.reel/menu-item.js | 208 +++++++ js/ui/menu/menu.reel/menu.css | 39 ++ js/ui/menu/menu.reel/menu.html | 94 +++ js/ui/menu/menu.reel/menu.js | 183 ++++++ scss/imports/scss/_MainWindow.scss | 2 +- 31 files changed, 1769 insertions(+), 1940 deletions(-) delete mode 100755 js/components/layout/stage-mode.reel/stage-mode.css delete mode 100755 js/components/layout/stage-mode.reel/stage-mode.html delete mode 100755 js/components/layout/stage-mode.reel/stage-mode.js delete mode 100755 js/components/menu/menu-entry.reel/menu-entry.css delete mode 100755 js/components/menu/menu-entry.reel/menu-entry.html delete mode 100755 js/components/menu/menu-entry.reel/menu-entry.js delete mode 100755 js/components/menu/menu-item.reel/menu-item.css delete mode 100755 js/components/menu/menu-item.reel/menu-item.html delete mode 100755 js/components/menu/menu-item.reel/menu-item.js delete mode 100755 js/components/menu/menu.reel/menu.css delete mode 100755 js/components/menu/menu.reel/menu.html delete mode 100755 js/components/menu/menu.reel/menu.js delete mode 100755 js/data/menu-data.js create mode 100644 js/ui/menu/menu-controller.js create mode 100755 js/ui/menu/menu-entry.reel/menu-entry.css create mode 100755 js/ui/menu/menu-entry.reel/menu-entry.html create mode 100755 js/ui/menu/menu-entry.reel/menu-entry.js create mode 100755 js/ui/menu/menu-item.reel/menu-item.css create mode 100755 js/ui/menu/menu-item.reel/menu-item.html create mode 100755 js/ui/menu/menu-item.reel/menu-item.js create mode 100755 js/ui/menu/menu.reel/menu.css create mode 100755 js/ui/menu/menu.reel/menu.html create mode 100755 js/ui/menu/menu.reel/menu.js diff --git a/css/ninja.css b/css/ninja.css index 288156b6..bc82f50d 100755 --- a/css/ninja.css +++ b/css/ninja.css @@ -98,7 +98,7 @@ body { position: absolute; margin: 0px; width: 100%; height: 100%; background-co #appWorkspace { display: -webkit-box; -webkit-box-orient: horizontal; -webkit-box-pack: center; -webkit-box-align: center; -webkit-box-sizing: stretch; position: relative; padding: 2px 0px; border: 1px solid #333; overflow: hidden; } -#topMenu { background-color: #474747; position: absolute; height: 28px; width: 100%; top: 0px; left: 0px; z-index: 6995; } +#topMenu { background-color: #474747; position: absolute; height: 26px; width: 100%; top: 0px; left: 0px; z-index: 6995; } #topPanelContainer, #leftPanelContainer, #rightPanelContainer, .timelinePanel { background-color: #282828; } diff --git a/js/components/layout/document-bar.reel/document-bar.css b/js/components/layout/document-bar.reel/document-bar.css index b86855b7..5eba72e8 100755 --- a/js/components/layout/document-bar.reel/document-bar.css +++ b/js/components/layout/document-bar.reel/document-bar.css @@ -75,7 +75,7 @@ POSSIBILITY OF SUCH DAMAGE. padding: 0; border: none; color: #FFF; - width: 44px; + width: 46px; text-transform: uppercase; text-align: left; float: left; @@ -83,6 +83,10 @@ POSSIBILITY OF SUCH DAMAGE. font-size: 11px; } +.preview:focus { + -webkit-box-shadow: none; +} + .documentBar .viewicon { background-repeat: no-repeat; background-position: center center; @@ -98,10 +102,15 @@ POSSIBILITY OF SUCH DAMAGE. } .documentBar .viewdesign { - background-image: url('../../../../js/panels/Color/colorpanelpopup.reel/img/icon_bitmap.png'); + background-image: url('../../../../js/panels/color/colorpanelpopup.reel/img/icon_bitmap.png'); background-size: 90%; } +.documentBar .viewPreview { + background-image: url('../../../../images/optionsbar/edit_mode.png'); + background-size: 100%; +} + .documentBar section.inactive .viewicon{ opacity: .5; } diff --git a/js/components/layout/document-bar.reel/document-bar.html b/js/components/layout/document-bar.reel/document-bar.html index 69f8107f..9e5e4eb2 100755 --- a/js/components/layout/document-bar.reel/document-bar.html +++ b/js/components/layout/document-bar.reel/document-bar.html @@ -68,6 +68,21 @@ POSSIBILITY OF SUCH DAMAGE. "condition": {"<-": "@owner.disabled"} } }, + + "menuItemButton": { + "prototype": "montage/ui/native/button.reel", + "properties": { + "element": {"#": "previewButton"}, + "identifier": "preview", + "label": "Preview" + }, + "listeners": [ + { + "type": "action", + "listener": {"@": "owner"} + } + ] + }, "owner": { "prototype": "js/components/layout/document-bar.reel", @@ -108,6 +123,14 @@ POSSIBILITY OF SUCH DAMAGE. + +
+ +
+ + + +
diff --git a/js/components/layout/document-bar.reel/document-bar.js b/js/components/layout/document-bar.reel/document-bar.js index 248bc8c4..fa0c8788 100755 --- a/js/components/layout/document-bar.reel/document-bar.js +++ b/js/components/layout/document-bar.reel/document-bar.js @@ -203,5 +203,11 @@ exports.DocumentBar = Montage.create(Component, { this.currentView = event._event.target.id; this.application.ninja.documentController.stage.stageView.switchDesignDocViews(event._event.target.id);//switch between design view } + }, + + handlePreviewAction: { + value: function(event) { + NJevent("executePreview"); + } } }); diff --git a/js/components/layout/stage-mode.reel/stage-mode.css b/js/components/layout/stage-mode.reel/stage-mode.css deleted file mode 100755 index c50679e8..00000000 --- a/js/components/layout/stage-mode.reel/stage-mode.css +++ /dev/null @@ -1,49 +0,0 @@ -/* -Copyright (c) 2012, Motorola Mobility LLC. -All Rights Reserved. - -Redistribution and use in source and binary forms, with or without -modification, are permitted provided that the following conditions are met: - -* Redistributions of source code must retain the above copyright notice, - this list of conditions and the following disclaimer. - -* Redistributions in binary form must reproduce the above copyright notice, - this list of conditions and the following disclaimer in the documentation - and/or other materials provided with the distribution. - -* Neither the name of Motorola Mobility LLC nor the names of its - contributors may be used to endorse or promote products derived from this - software without specific prior written permission. - -THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS" -AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE -IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE -ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT HOLDER OR CONTRIBUTORS BE -LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR -CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF -SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS -INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN -CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE) -ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF THE -POSSIBILITY OF SUCH DAMAGE. - */ - -.stageMode { - width:26px; - height:23px; - position:absolute; - top:5px; - right:60px; - - opacity: 0.7; - background-repeat:no-repeat; -} - -.editMode { - background-image: url('../../../../images/optionsbar/edit_mode.png'); -} - -.liveMode { - background-image: url('../../../../images/optionsbar/live_mode.png'); -} diff --git a/js/components/layout/stage-mode.reel/stage-mode.html b/js/components/layout/stage-mode.reel/stage-mode.html deleted file mode 100755 index fb6a26b0..00000000 --- a/js/components/layout/stage-mode.reel/stage-mode.html +++ /dev/null @@ -1,55 +0,0 @@ - - - - - - - - - - - - - -
- - - diff --git a/js/components/layout/stage-mode.reel/stage-mode.js b/js/components/layout/stage-mode.reel/stage-mode.js deleted file mode 100755 index bb8c4594..00000000 --- a/js/components/layout/stage-mode.reel/stage-mode.js +++ /dev/null @@ -1,77 +0,0 @@ -/* -Copyright (c) 2012, Motorola Mobility LLC. -All Rights Reserved. - -Redistribution and use in source and binary forms, with or without -modification, are permitted provided that the following conditions are met: - -* Redistributions of source code must retain the above copyright notice, - this list of conditions and the following disclaimer. - -* Redistributions in binary form must reproduce the above copyright notice, - this list of conditions and the following disclaimer in the documentation - and/or other materials provided with the distribution. - -* Neither the name of Motorola Mobility LLC nor the names of its - contributors may be used to endorse or promote products derived from this - software without specific prior written permission. - -THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS" -AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE -IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE -ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT HOLDER OR CONTRIBUTORS BE -LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR -CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF -SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS -INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN -CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE) -ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF THE -POSSIBILITY OF SUCH DAMAGE. - */ - -var Montage = require("montage/core/core").Montage, - Component = require("montage/ui/component").Component; - -exports.StageMode = Montage.create(Component, { - - _chromePreview: { - value: null - }, - - chromePreview: { - get: function() { - return this._chromePreview; - }, - set: function(value) { - if(value !== this._chromePreview) { - this._chromePreview = value; - this.needsDraw = true; - } - } - }, - - prepareForDraw: { - value: function() { - this.element.addEventListener("click", this, false); - } - }, - - draw: { - value: function() { - if(this._livePreview) { - this.element.classList.remove("editMode"); - this.element.classList.add("liveMode"); - - } else { - this.element.classList.remove("liveMode"); - this.element.classList.add("editMode"); - } - } - }, - - handleClick: { - value: function(event) { - this.chromePreview = !this.chromePreview; - } - } -}); diff --git a/js/components/menu/menu-entry.reel/menu-entry.css b/js/components/menu/menu-entry.reel/menu-entry.css deleted file mode 100755 index 6f05d09c..00000000 --- a/js/components/menu/menu-entry.reel/menu-entry.css +++ /dev/null @@ -1,89 +0,0 @@ -/* -Copyright (c) 2012, Motorola Mobility LLC. -All Rights Reserved. - -Redistribution and use in source and binary forms, with or without -modification, are permitted provided that the following conditions are met: - -* Redistributions of source code must retain the above copyright notice, - this list of conditions and the following disclaimer. - -* Redistributions in binary form must reproduce the above copyright notice, - this list of conditions and the following disclaimer in the documentation - and/or other materials provided with the distribution. - -* Neither the name of Motorola Mobility LLC nor the names of its - contributors may be used to endorse or promote products derived from this - software without specific prior written permission. - -THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS" -AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE -IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE -ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT HOLDER OR CONTRIBUTORS BE -LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR -CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF -SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS -INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN -CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE) -ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF THE -POSSIBILITY OF SUCH DAMAGE. - */ - -.topMenuItem { - float: left; - display: inline; -} - -.topMenuItem .menubg{ - color: #f7f7f7; -} - -.topMenuItem .menuName { - font-family: 'Droid Sans', sans-serif; - font-size: 10pt; - padding: 3px 12px 3px 8px; - text-shadow : 1px 1px 1px #000000; -} - -.menubg{ - display: inline; -} - -.menubg.checked .check { - opacity: 1; -} - -.selected { - background-color: #7F7F7F; -} - -.menu-label { - font-family: 'Droid Sans', sans-serif; - font-size: 10pt; - padding: 3px 12px 3px 8px; - text-shadow: 1px 1px 1px black; -} - -.subEntries{ - position: absolute; - z-index: 100000; - float:left; - font-family: 'Droid Sans', sans-serif !important; - color: #ffffff; - background: #494949; - border: 1px solid #292929; - border-radius: 8px; - padding: 8px 0px 8px 0px; - box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.8); - white-space:nowrap; -} - -.menuItem { - font-size: 9pt; - padding: 4px 8px; - display: block; - float: none; - position: relative; - background: #474747; - color: white; -} diff --git a/js/components/menu/menu-entry.reel/menu-entry.html b/js/components/menu/menu-entry.reel/menu-entry.html deleted file mode 100755 index ddac73ab..00000000 --- a/js/components/menu/menu-entry.reel/menu-entry.html +++ /dev/null @@ -1,97 +0,0 @@ - - - - - - - - - - - - -
  • -
    - -
    - - - -
    • - - - diff --git a/js/components/menu/menu-entry.reel/menu-entry.js b/js/components/menu/menu-entry.reel/menu-entry.js deleted file mode 100755 index 10b49417..00000000 --- a/js/components/menu/menu-entry.reel/menu-entry.js +++ /dev/null @@ -1,140 +0,0 @@ -/* -Copyright (c) 2012, Motorola Mobility LLC. -All Rights Reserved. - -Redistribution and use in source and binary forms, with or without -modification, are permitted provided that the following conditions are met: - -* Redistributions of source code must retain the above copyright notice, - this list of conditions and the following disclaimer. - -* Redistributions in binary form must reproduce the above copyright notice, - this list of conditions and the following disclaimer in the documentation - and/or other materials provided with the distribution. - -* Neither the name of Motorola Mobility LLC nor the names of its - contributors may be used to endorse or promote products derived from this - software without specific prior written permission. - -THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS" -AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE -IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE -ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT HOLDER OR CONTRIBUTORS BE -LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR -CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF -SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS -INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN -CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE) -ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF THE -POSSIBILITY OF SUCH DAMAGE. - */ - -var Montage = require("montage/core/core").Montage; -var Component = require("montage/ui/component").Component; - -exports.MenuEntry = Montage.create(Component, { - topHeader: { - value: null - }, - - topHeaderText: { - value: null - }, - - subEntries: { - value: null - }, - - // Reference to the parent Menu component - _menu: { - value: null - }, - - menu: { - get: function() { - return this._menu; - }, - set: function(value) { - if(value !== this._menu) { - this._menu = value; - } - } - }, - - _data: { - value: null - }, - - data: { - get: function() { - return this._data; - }, - set: function(value) { - if(this._data !== value) { - this._data = value; - } - } - }, - - select: { - value: function() { - this.element.classList.add("selected"); - this.subEntries.style.display = "block"; - } - }, - - deselect: { - value: function() { - this.element.classList.remove("selected"); - this.subEntries.style.display = "none"; - } - }, - - _menuIsActive: { - value: false - }, - - menuIsActive: { - get: function() { - return this._menuIsActive; - }, - set: function(value) { - if(value) this.element.addEventListener("mouseover", this, false); - } - }, - - toggleOnMenuItemAction: { - value: function() { - // TODO: Hack! Rework this! - //for non menu headers only - this.parentComponent.ownerComponent.toggleActivation(this); - } - }, - - captureMousedown: { - value: function(event) { - // TODO: Hack! Rework this! - //for menu headers only - if(event.target.getAttribute("data-montage-id") === "topHeaderText"){ - this.parentComponent.ownerComponent.toggleActivation(this); - } - } - }, - - handleMouseover: { - value: function(event) { - this.parentComponent.ownerComponent.activeEntry = this; - } - }, - - prepareForDraw: { - value: function() { - - this.subEntries.style.display = "none"; - - this.topHeaderText.innerHTML = this.data.header; - - this.element.addEventListener("mousedown", this, true); - } - } -}); diff --git a/js/components/menu/menu-item.reel/menu-item.css b/js/components/menu/menu-item.reel/menu-item.css deleted file mode 100755 index 95fd673c..00000000 --- a/js/components/menu/menu-item.reel/menu-item.css +++ /dev/null @@ -1,99 +0,0 @@ -/* -Copyright (c) 2012, Motorola Mobility LLC. -All Rights Reserved. - -Redistribution and use in source and binary forms, with or without -modification, are permitted provided that the following conditions are met: - -* Redistributions of source code must retain the above copyright notice, - this list of conditions and the following disclaimer. - -* Redistributions in binary form must reproduce the above copyright notice, - this list of conditions and the following disclaimer in the documentation - and/or other materials provided with the distribution. - -* Neither the name of Motorola Mobility LLC nor the names of its - contributors may be used to endorse or promote products derived from this - software without specific prior written permission. - -THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS" -AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE -IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE -ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT HOLDER OR CONTRIBUTORS BE -LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR -CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF -SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS -INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN -CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE) -ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF THE -POSSIBILITY OF SUCH DAMAGE. - */ - -.menuItem .menuName { - font-family: 'Droid Sans', sans-serif; - font-size: 10pt; - padding: 3px 12px 3px 8px; - text-shadow : 1px 1px 1px #000000; - cursor:pointer; -} - -.menuItem:hover { - background-color: #7f7f7f; - cursor:pointer; -} - -.menubg .subEntries { - top: 0%; - left: 100%; - width: auto; - white-space:nowrap; -} - -.itemSeparator:hover { - background-color: #474747; -} - -.separator{ - width:100%; - height:2px; - position: relative; - border: 1px groove #474747 ; - border-radius: 2px; - background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#474747), to(#cccccc)); - opacity: 0.5; -} - -.disabled { - opacity: 0.5; -} - -.disabled:hover { - background-color: #474747; -} - -.menubg .check { - float:left; - background-image: url(../../../../images/menu/checkmark.png); - background-repeat: no-repeat; - background-position: center; - width: 10px; - height: 15px; - opacity: 0; -} - -.menubg.submenu .rightArrow { - float: right; - background-image:url('../../../../images/menu/arrow.png'); - background-repeat: no-repeat; - background-position: center; - width: 10px; - height: 15px; - position: absolute; - right:4px; - top: 5px; - margin-left: 8px; -} - -.subEntries.subMenu .rightArrow { - opacity: 0; -} diff --git a/js/components/menu/menu-item.reel/menu-item.html b/js/components/menu/menu-item.reel/menu-item.html deleted file mode 100755 index 364a0997..00000000 --- a/js/components/menu/menu-item.reel/menu-item.html +++ /dev/null @@ -1,97 +0,0 @@ - - - - - - - - - - - - -
  • -
    - - - - - - -
    -
    • - - - diff --git a/js/components/menu/menu-item.reel/menu-item.js b/js/components/menu/menu-item.reel/menu-item.js deleted file mode 100755 index 63cc79b7..00000000 --- a/js/components/menu/menu-item.reel/menu-item.js +++ /dev/null @@ -1,198 +0,0 @@ -/* -Copyright (c) 2012, Motorola Mobility LLC. -All Rights Reserved. - -Redistribution and use in source and binary forms, with or without -modification, are permitted provided that the following conditions are met: - -* Redistributions of source code must retain the above copyright notice, - this list of conditions and the following disclaimer. - -* Redistributions in binary form must reproduce the above copyright notice, - this list of conditions and the following disclaimer in the documentation - and/or other materials provided with the distribution. - -* Neither the name of Motorola Mobility LLC nor the names of its - contributors may be used to endorse or promote products derived from this - software without specific prior written permission. - -THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS" -AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE -IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE -ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT HOLDER OR CONTRIBUTORS BE -LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR -CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF -SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS -INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN -CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE) -ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF THE -POSSIBILITY OF SUCH DAMAGE. - */ - -var Montage = require("montage/core/core").Montage; -var Component = require("montage/ui/component").Component; - -exports.MenuItem = Montage.create(Component, { - - itemBackground: { - value: null - }, - - itemText: { - value: null - }, - - subMenu: { - value: null - }, - - data: { - value: null - }, - - _enabled: { - value: false - }, - - enabled: { - get: function() { - return this._enabled; - }, - set: function(value) { - if(value !== this._enabled) { - this._enabled = value; - this.needsDraw = true; - } - } - }, - - _checked: { - value: null - }, - - checked: { - get: function() { - return this._checked; - }, - set: function(value) { - /* - if( Object.prototype.toString.call( value ) === '[object Array]' ) { - value = value.indexOf(this.data.displayText + "Panel") >= 0; - } - */ - - if(this._checked !== value) { - this._checked = value; - this.needsDraw = true; - } - } - }, - - submenu: { - value: false - }, - - subentries: { - value: [] - }, - - prepareForDraw: { - value: function() { - - if(!this.data) return; - - if(this.data.separator) { - this.element.classList.add("itemSeparator"); - this.itemBackground.classList.remove("menubg"); - this.itemBackground.classList.add("separator"); - - return; - - } - - // Binding the checked to the assigned bound property - if(this.data.checked) { - Object.defineBinding(this, "checked", { - boundObject: this.application.ninja.appModel, - boundObjectPropertyPath: this.data.checked.boundProperty - }); - - } - - if(this.data.submenu) { - this.submenu = true; - this.subentries = this.data.entries; - this.subMenu.classList.add("subMenu"); - } - - this.element.addEventListener("mouseover", this, false); - this.element.addEventListener("mouseout", this, false); - - this.itemText.innerHTML = this.data.displayText; - this.element.addEventListener("mouseup", this, true); - } - }, - - draw: { - value: function() { - - if(this.enabled) { - this.element.classList.remove("disabled"); - } else { - this.element.classList.add("disabled"); - } - - if(this.checked) { - this.itemBackground.classList.add("checked"); - } else { - this.itemBackground.classList.remove("checked"); - } - - if(this.submenu) { - this.itemBackground.classList.add("submenu"); - } - } - }, - - captureMouseup: { - value: function(event) { - - if(this.data.radio && this.checked){ - this.parentComponent.ownerComponent.toggleOnMenuItemAction(); - return; - } - - if( ( this.enabled === true || this.enabled > 0 ) && (this.submenu === false) ) { - if(this.data.action) { - NJevent ( this.data.action ); - } else if(this.checked !== null) { - this.checked = !this.checked; - } - this.parentComponent.ownerComponent.toggleOnMenuItemAction(); - } - - } - }, - - handleMouseover: { - value: function() { - if(this.enabled){ - this.element.style.backgroundColor = "#7f7f7f"; - this.element.style.cursor = "pointer"; - if(this.data.submenu) { - this.subMenu.style.display = "block"; - } - } - } - }, - - handleMouseout: { - value: function() { - this.element.style.backgroundColor = "#474747"; - if(this.data.submenu) { - this.subMenu.style.display = "none"; - } - } - } - -}); diff --git a/js/components/menu/menu.reel/menu.css b/js/components/menu/menu.reel/menu.css deleted file mode 100755 index 903832ed..00000000 --- a/js/components/menu/menu.reel/menu.css +++ /dev/null @@ -1,39 +0,0 @@ -/* -Copyright (c) 2012, Motorola Mobility LLC. -All Rights Reserved. - -Redistribution and use in source and binary forms, with or without -modification, are permitted provided that the following conditions are met: - -* Redistributions of source code must retain the above copyright notice, - this list of conditions and the following disclaimer. - -* Redistributions in binary form must reproduce the above copyright notice, - this list of conditions and the following disclaimer in the documentation - and/or other materials provided with the distribution. - -* Neither the name of Motorola Mobility LLC nor the names of its - contributors may be used to endorse or promote products derived from this - software without specific prior written permission. - -THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS" -AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE -IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE -ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT HOLDER OR CONTRIBUTORS BE -LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR -CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF -SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS -INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN -CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE) -ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF THE -POSSIBILITY OF SUCH DAMAGE. - */ - -.horizontal-menu { - list-style: none; - margin: 0px; - padding: 5px; - float: left; - cursor: default; - display: block; -} diff --git a/js/components/menu/menu.reel/menu.html b/js/components/menu/menu.reel/menu.html deleted file mode 100755 index edbb8522..00000000 --- a/js/components/menu/menu.reel/menu.html +++ /dev/null @@ -1,97 +0,0 @@ - - - - - - - - - - - - - - - - - diff --git a/js/components/menu/menu.reel/menu.js b/js/components/menu/menu.reel/menu.js deleted file mode 100755 index bf554b37..00000000 --- a/js/components/menu/menu.reel/menu.js +++ /dev/null @@ -1,143 +0,0 @@ -/* -Copyright (c) 2012, Motorola Mobility LLC. -All Rights Reserved. - -Redistribution and use in source and binary forms, with or without -modification, are permitted provided that the following conditions are met: - -* Redistributions of source code must retain the above copyright notice, - this list of conditions and the following disclaimer. - -* Redistributions in binary form must reproduce the above copyright notice, - this list of conditions and the following disclaimer in the documentation - and/or other materials provided with the distribution. - -* Neither the name of Motorola Mobility LLC nor the names of its - contributors may be used to endorse or promote products derived from this - software without specific prior written permission. - -THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS" -AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE -IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE -ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT HOLDER OR CONTRIBUTORS BE -LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR -CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF -SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS -INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN -CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE) -ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF THE -POSSIBILITY OF SUCH DAMAGE. - */ - -var Montage = require("montage/core/core").Montage, - Component = require("montage/ui/component").Component; - -exports.Menu = Montage.create(Component, { - - _currentDocument: { - value : null - }, - - currentDocument : { - get : function() { - return this._currentDocument; - }, - set : function(value) { - if (value === this._currentDocument) { - return; - } - - this._currentDocument = value; - } - }, - - _active: { - value: false - }, - - active: { - get: function() { - return this._active; - }, - set: function(value) { - this._active = value; - } - }, - - _activeEntry: { - value: null - }, - - activeEntry: { - get: function() { - return this._activeEntry; - }, - set: function(value) { - if(this.active) { - - if(this._activeEntry) this._activeEntry.deselect(); - - this._activeEntry = value; - - this._activeEntry.select(); - - } - } - }, - - toggleActivation: { - value: function(item) { - if(this.active) { - this._activeEntry.deselect(); - this._activeEntry = null; - this.active = false; - this.element.ownerDocument.removeEventListener('mousedown', this, false); - } else { - this.active = true; - this.activeEntry = item; - this.element.ownerDocument.addEventListener('mousedown', this, false); - } - } - }, - - prepareForDraw: { - value: function() { - - } - }, - - handleMousedown: { - value: function(evt) { - if(this.active && (this.getZIndex(evt.target) < 9000 || evt.target.id === "topMenu")) { - this._activeEntry.deselect(); - this._activeEntry = null; - this.active = false; - this.element.ownerDocument.removeEventListener('mousedown', this, false); - } - } - }, - - getZIndex: { - value: function(elem) { - - var position, value, zIndex; - while (elem && elem !== document) { -// position = elem.style.position; - position = document.defaultView.getComputedStyle(elem, "").getPropertyValue("position"); - - if (position === "absolute" || position === "relative" || position === "fixed") { - // webkit returns a string for zindex value and "" if zindex is not available -// zIndex = elem.style['z-index']; - zIndex = document.defaultView.getComputedStyle(elem, "").getPropertyValue("z-index"); - value = parseInt(zIndex, 10); - if (!isNaN(value) && value !== 0) { - return value; - } - } - elem = elem.parentNode; - } - return 0; - } - } - -}); diff --git a/js/data/menu-data.js b/js/data/menu-data.js deleted file mode 100755 index f942f953..00000000 --- a/js/data/menu-data.js +++ /dev/null @@ -1,582 +0,0 @@ -/* -Copyright (c) 2012, Motorola Mobility LLC. -All Rights Reserved. - -Redistribution and use in source and binary forms, with or without -modification, are permitted provided that the following conditions are met: - -* Redistributions of source code must retain the above copyright notice, - this list of conditions and the following disclaimer. - -* Redistributions in binary form must reproduce the above copyright notice, - this list of conditions and the following disclaimer in the documentation - and/or other materials provided with the distribution. - -* Neither the name of Motorola Mobility LLC nor the names of its - contributors may be used to endorse or promote products derived from this - software without specific prior written permission. - -THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS" -AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE -IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE -ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT HOLDER OR CONTRIBUTORS BE -LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR -CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF -SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS -INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN -CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE) -ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF THE -POSSIBILITY OF SUCH DAMAGE. - */ - -var Montage = require("montage/core/core").Montage, - Component = require("montage/ui/component").Component; - -exports.MenuData = Montage.create(Component, { - - _currentDocument: { - value : null - }, - - currentDocument : { - get : function() { - return this._currentDocument; - }, - set : function(value) { - if (value === this._currentDocument) { - return; - } - - this._currentDocument = value; - - if(!this._currentDocument) { - this.documentEnabledIndices.forEach(function(index) { - index.enabled = false; - }); - } else { - this.documentEnabledIndices.forEach(function(index) { - index.enabled = true; - }); - } - - } - }, - - didCreate: { - value: function() { - var self = this; - - this.topLevelMenu.forEach(function(item) { - item.entries.forEach(function(entry) { - if(entry.depend && entry.depend === "document") { - self.documentEnabledIndices.push(entry); - } - }); - }); - } - }, - - documentEnabledIndices: { - value: [] - }, - - topLevelMenu: { - value: [ - { - "header": "File", - "entries": [ - { - "displayText" : "New Project", - "hasSubMenu" : false, - "enabled": false, - "action": "executeNewProject" - }, - { - "displayText" : "New File", - "hasSubMenu" : false, - "enabled": true, - "action": "executeNewFile" - }, - { - "displayText" : "Open File", - "hasSubMenu" : false, - "enabled": true, - "action": "executeFileOpen" - }, - { - "displayText" : "Close File", - "hasSubMenu" : false, - "enabled": false, - "depend": "document", - "action": "executeFileClose" - }, - { - "displayText" : "Close All", - "hasSubMenu" : false, - "enabled": false, - "depend": "document", - "action": "executeFileCloseAll" - }, - { - "displayText" : "", - "separator": true, - "enabled": true - }, - { - "displayText" : "Save", - "hasSubMenu" : false, - "enabled": false, - "depend": "document", - "action": "executeSave" - }, - { - "displayText" : "Save As", - "hasSubMenu" : false, - "enabled": false, - "depend": "document", - "action":"executeSaveAs" - }, - { - "displayText" : "Save All", - "hasSubMenu" : false, - "enabled": false, - "depend": "document", - "action": "executeSaveAll" - }, - { - "displayText" : "", - "separator": true, - "enabled": true - }, - { - "displayText" : "Open Project", - "hasSubMenu" : false, - "enabled": false - }, - { - "displayText" : "Open Recent", - "hasSubMenu" : false, - "enabled": false - }, - { - "displayText" : "Close Project", - "hasSubMenu" : false, - "enabled": false - } - ] - }, - { - "header": "Edit", - "entries": [ - { - "displayText" : "Undo", - "hasSubMenu" : false, - "enabled": false, - "newenabled": { - "value": false, - "boundObj": "undocontroller", - "boundProperty": "canUndo", - "oneway": true - }, - "action": "executeUndo" - }, - { - "displayText" : "Redo", - "hasSubMenu" : false, - "enabled": false, - "newenabled": { - "value": false, - "boundObj": "undocontroller", - "boundProperty": "canRedo", - "oneway": true - }, - "action": "executeRedo" - }, - { - "displayText" : "Cut", - "hasSubMenu" : false, - "enabled": true, - "action": "executeCut" - }, - { - "displayText" : "Copy", - "hasSubMenu" : false, - "enabled": true, - "action": "executeCopy" - }, - { - "displayText" : "Paste", - "hasSubMenu" : false, - "enabled": true, - "action": "executePaste" - } - ] - }, - { - "header": "View", - "entries": [ - { - "displayText" : "Live Preview", - "hasSubMenu" : false, - "enabled": false, - "depend": "document", - "newenabled": { - "value": false, - "boundObj": "documentController", - "boundProperty": "activeDocument", - "oneway": true, - "boundValueMutator": function(activeDocument){ - return (activeDocument !== null) && (activeDocument.currentView === "design"); - } - }, - "checked": { - "value": false, - "boundProperty": "livePreview" - } - }, - { - "displayText" : "Chrome Preview", - "hasSubMenu" : false, - "enabled": false, - "depend": "document", - "newenabled": { - "value": false, - "boundObj": "documentController", - "boundProperty": "activeDocument", - "oneway": true, - "boundValueMutator": function(activeDocument){ - return (activeDocument !== null) && (activeDocument.currentView === "design"); - } - }, - "checked": { - "value": false, - "boundProperty": "chromePreview" - } - }, - { - "displayText" : "Layout View", - "hasSubMenu" : false, - "enabled": false, - "depend": "document", - "newenabled": { - "value": false, - "boundObj": "documentController", - "boundProperty": "activeDocument", - "oneway": true, - "boundValueMutator": function(activeDocument){ - return (activeDocument !== null) && (activeDocument.currentView === "design"); - } - }, - "submenu": true, - "entries": [ - { - "displayText" : "View All", - "hasSubMenu" : false, - "radio": true, - "enabled": true, - "checked": { - "value": true, - "boundProperty": "layoutAll" - } - }, - { - "displayText" : "View Items Only", - "hasSubMenu" : false, - "radio": true, - "enabled": true, - "checked": { - "value": false, - "boundProperty": "layoutItems" - } - }, - { - "displayText" : "Off", - "hasSubMenu" : false, - "radio": true, - "enabled": true, - "checked": { - "value": false, - "boundProperty": "layoutOff" - } - } - ] - }, - { - "displayText" : "Snap", - "hasSubMenu" : false, - "enabled": false, - "depend": "document", - "newenabled": { - "value": false, - "boundObj": "documentController", - "boundProperty": "activeDocument", - "oneway": true, - "boundValueMutator": function(activeDocument){ - return (activeDocument !== null) && (activeDocument.currentView === "design"); - } - }, - "