From c913f173e3750f4ed209fb4aca3d1f04b6772f20 Mon Sep 17 00:00:00 2001 From: Charles Hacskaylo Date: Fri, 30 Oct 2015 17:09:04 -0700 Subject: [PATCH] [Frontend] Safety merge of master; minor fixes open #90 IN-PROGRESS Merged in latest from github/master; Fixed margins when in edit mode; Fixed edit area not utilizing overflow: auto properly; TO-DO: verify mobile is Ok; --- docs/gendocs.js | 2 +- .../general/res/sass/helpers/_splitter.scss | 16 +- .../res/sass/user-environ/_layout.scss | 8 +- .../inspect/src/gestures/InfoGesture.js | 6 - .../espresso/res/css/theme-espresso.css | 207 ++++++++--------- .../themes/snow/res/css/theme-snow.css | 197 ++++++++-------- platform/representation/bundle.json | 10 +- platform/representation/src/MCTInclude.js | 36 +-- .../representation/src/MCTRepresentation.js | 30 ++- platform/representation/src/TemplateLinker.js | 153 +++++++++++++ .../representation/test/MCTIncludeSpec.js | 68 +++--- .../test/MCTRepresentationSpec.js | 92 ++++---- .../representation/test/TemplateLinkerSpec.js | 211 ++++++++++++++++++ platform/representation/test/suite.json | 5 +- 14 files changed, 704 insertions(+), 337 deletions(-) create mode 100644 platform/representation/src/TemplateLinker.js create mode 100644 platform/representation/test/TemplateLinkerSpec.js diff --git a/docs/gendocs.js b/docs/gendocs.js index cd61b9a9bf..30182e30e7 100644 --- a/docs/gendocs.js +++ b/docs/gendocs.js @@ -187,7 +187,7 @@ GLOBAL.window = GLOBAL.window || GLOBAL; // nomnoml expects window to be define destPath = path.dirname(destination), streamOptions = {}; if (file.match(/png$/)){ - streamOptions.encoding = 'binary'; + streamOptions.encoding = null; } else { streamOptions.encoding = 'utf8'; } diff --git a/platform/commonUI/general/res/sass/helpers/_splitter.scss b/platform/commonUI/general/res/sass/helpers/_splitter.scss index 4dc102006b..a98fc28af5 100644 --- a/platform/commonUI/general/res/sass/helpers/_splitter.scss +++ b/platform/commonUI/general/res/sass/helpers/_splitter.scss @@ -42,22 +42,20 @@ @include border-radius($splitterEndCr); } } - &:not(:active) { - &:after { - @include trans-prop-nice(background-color, 150ms); - } - } &:active { + //@include test(); &:after { background-color: $colorSplitterActive !important; } } @if $colorSplitterHover != 'none' { - &:hover { - &:after { - @include trans-prop-nice(background-color, 150ms); - background-color: $colorSplitterHover; + &:not(:active) { + &:hover { + &:after { + background-color: $colorSplitterHover !important; + @include trans-prop-nice(background-color, 150ms); + } } } } diff --git a/platform/commonUI/general/res/sass/user-environ/_layout.scss b/platform/commonUI/general/res/sass/user-environ/_layout.scss index a2f5fb128f..76e67cac9e 100644 --- a/platform/commonUI/general/res/sass/user-environ/_layout.scss +++ b/platform/commonUI/general/res/sass/user-environ/_layout.scss @@ -95,9 +95,7 @@ } .user-environ { - .browse-area, - .edit-area, .editor { top: 0; left: 0; right: 0; bottom: $ueFooterH; } @@ -113,13 +111,17 @@ .edit-area { $tbH: $btnToolbarH + $interiorMargin; top: $bodyMargin + $ueTopBarEditH + ($interiorMargin); + left: $bodyMargin; + right: $bodyMargin; + bottom: $bodyMargin + $ueFooterH; .tool-bar { bottom: auto; height: $tbH; line-height: $btnToolbarH; } - .work-area { + .object-holder.work-area { top: $tbH + $interiorMargin * 2; + overflow: auto; } } diff --git a/platform/commonUI/inspect/src/gestures/InfoGesture.js b/platform/commonUI/inspect/src/gestures/InfoGesture.js index 09740841e4..688a27cb6c 100644 --- a/platform/commonUI/inspect/src/gestures/InfoGesture.js +++ b/platform/commonUI/inspect/src/gestures/InfoGesture.js @@ -55,11 +55,6 @@ define( self.trackPosition(event); }; - // Also make sure we dismiss bubble if representation is destroyed - // before the mouse actually leaves it - this.scopeOff = - element.scope().$on('$destroy', this.hideBubbleCallback); - this.element = element; this.$timeout = $timeout; this.infoService = infoService; @@ -143,7 +138,6 @@ define( this.hideBubble(); // ...and detach listeners this.element.off('mouseenter', this.showBubbleCallback); - this.scopeOff(); }; return InfoGesture; diff --git a/platform/commonUI/themes/espresso/res/css/theme-espresso.css b/platform/commonUI/themes/espresso/res/css/theme-espresso.css index b0247e2faf..ef9ddc0fd9 100644 --- a/platform/commonUI/themes/espresso/res/css/theme-espresso.css +++ b/platform/commonUI/themes/espresso/res/css/theme-espresso.css @@ -958,8 +958,12 @@ tr[class*="s-limit"].s-limit-lwr td:first-child:before { height: auto; background: #404040; display: block; } - /* line 46, ../../../../general/res/sass/helpers/_splitter.scss */ - .splitter:not(:active):after { + /* line 47, ../../../../general/res/sass/helpers/_splitter.scss */ + .splitter:active:after { + background-color: #0099cc !important; } + /* line 55, ../../../../general/res/sass/helpers/_splitter.scss */ + .splitter:not(:active):hover:after { + background-color: #595959 !important; -moz-transition-property: background-color; -o-transition-property: background-color; -webkit-transition-property: background-color; @@ -976,84 +980,62 @@ tr[class*="s-limit"].s-limit-lwr td:first-child:before { -o-transition-delay: 0; -webkit-transition-delay: 0; transition-delay: 0; } - /* line 51, ../../../../general/res/sass/helpers/_splitter.scss */ - .splitter:active:after { - background-color: #0099cc !important; } - /* line 58, ../../../../general/res/sass/helpers/_splitter.scss */ - .splitter:hover:after { - -moz-transition-property: background-color; - -o-transition-property: background-color; - -webkit-transition-property: background-color; - transition-property: background-color; - -moz-transition-duration: 150ms; - -o-transition-duration: 150ms; - -webkit-transition-duration: 150ms; - transition-duration: 150ms; - -moz-transition-timing-function: ease-in-out; - -o-transition-timing-function: ease-in-out; - -webkit-transition-timing-function: ease-in-out; - transition-timing-function: ease-in-out; - -moz-transition-delay: 0; - -o-transition-delay: 0; - -webkit-transition-delay: 0; - transition-delay: 0; - background-color: #595959; } -/* line 68, ../../../../general/res/sass/helpers/_splitter.scss */ +/* line 66, ../../../../general/res/sass/helpers/_splitter.scss */ .split-layout.horizontal { overflow: hidden; } - /* line 71, ../../../../general/res/sass/helpers/_splitter.scss */ + /* line 69, ../../../../general/res/sass/helpers/_splitter.scss */ .split-layout.horizontal .pane { left: 0; right: 0; } - /* line 74, ../../../../general/res/sass/helpers/_splitter.scss */ + /* line 72, ../../../../general/res/sass/helpers/_splitter.scss */ .split-layout.horizontal .pane.top { bottom: auto; } - /* line 77, ../../../../general/res/sass/helpers/_splitter.scss */ + /* line 75, ../../../../general/res/sass/helpers/_splitter.scss */ .split-layout.horizontal .pane.bottom { top: auto; } - /* line 81, ../../../../general/res/sass/helpers/_splitter.scss */ + /* line 79, ../../../../general/res/sass/helpers/_splitter.scss */ .split-layout.horizontal > .splitter { cursor: row-resize; left: 0; right: 0; height: 25px; } - /* line 86, ../../../../general/res/sass/helpers/_splitter.scss */ + /* line 84, ../../../../general/res/sass/helpers/_splitter.scss */ .split-layout.horizontal > .splitter:after { top: 12px; bottom: 12px; } -/* line 94, ../../../../general/res/sass/helpers/_splitter.scss */ +/* line 92, ../../../../general/res/sass/helpers/_splitter.scss */ .split-layout.vertical .pane { top: 0; bottom: 0; } - /* line 97, ../../../../general/res/sass/helpers/_splitter.scss */ + /* line 95, ../../../../general/res/sass/helpers/_splitter.scss */ .split-layout.vertical .pane.left { right: auto; } - /* line 100, ../../../../general/res/sass/helpers/_splitter.scss */ + /* line 98, ../../../../general/res/sass/helpers/_splitter.scss */ .split-layout.vertical .pane.right { left: auto; } -/* line 104, ../../../../general/res/sass/helpers/_splitter.scss */ +/* line 102, ../../../../general/res/sass/helpers/_splitter.scss */ .split-layout.vertical > .splitter { cursor: col-resize; top: 0; bottom: 0; } - /* line 108, ../../../../general/res/sass/helpers/_splitter.scss */ + /* line 106, ../../../../general/res/sass/helpers/_splitter.scss */ .split-layout.vertical > .splitter:not(.flush-right) { width: 25px; } - /* line 110, ../../../../general/res/sass/helpers/_splitter.scss */ + /* line 108, ../../../../general/res/sass/helpers/_splitter.scss */ .split-layout.vertical > .splitter:not(.flush-right):after { left: 12px; right: 12px; } - /* line 114, ../../../../general/res/sass/helpers/_splitter.scss */ + /* line 112, ../../../../general/res/sass/helpers/_splitter.scss */ .split-layout.vertical > .splitter.flush-right { width: 13px; } - /* line 116, ../../../../general/res/sass/helpers/_splitter.scss */ + /* line 114, ../../../../general/res/sass/helpers/_splitter.scss */ .split-layout.vertical > .splitter.flush-right:after { background-color: transparent; left: auto; right: 0; width: 1px; } - /* line 120, ../../../../general/res/sass/helpers/_splitter.scss */ + /* line 118, ../../../../general/res/sass/helpers/_splitter.scss */ .split-layout.vertical > .splitter.flush-right.edge-shdw { background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuMCIgeTE9IjAuNSIgeDI9IjEuMCIgeTI9IjAuNSI+PHN0b3Agb2Zmc2V0PSI0MCUiIHN0b3AtY29sb3I9IiMwMDAwMDAiIHN0b3Atb3BhY2l0eT0iMC4wIi8+PHN0b3Agb2Zmc2V0PSI3MCUiIHN0b3AtY29sb3I9IiMwMDAwMDAiIHN0b3Atb3BhY2l0eT0iMC4wNSIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzAwMDAwMCIgc3RvcC1vcGFjaXR5PSIwLjIiLz48L2xpbmVhckdyYWRpZW50PjwvZGVmcz48cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMTAwJSIgaGVpZ2h0PSIxMDAlIiBmaWxsPSJ1cmwoI2dyYWQpIiAvPjwvc3ZnPiA='); background-size: 100%; @@ -3774,31 +3756,34 @@ span.req { .s-menu-btn span.bar.l-flex.l-click-area .right { width: auto; } -/* line 99, ../../../../general/res/sass/user-environ/_layout.scss */ +/* line 98, ../../../../general/res/sass/user-environ/_layout.scss */ .user-environ .browse-area, -.user-environ .edit-area, .user-environ .editor { top: 0; left: 0; right: 0; bottom: 25px; } -/* line 107, ../../../../general/res/sass/user-environ/_layout.scss */ +/* line 105, ../../../../general/res/sass/user-environ/_layout.scss */ .user-environ .browse-area > .contents, .user-environ .edit-area > .contents { left: 0; right: 0; } -/* line 113, ../../../../general/res/sass/user-environ/_layout.scss */ +/* line 111, ../../../../general/res/sass/user-environ/_layout.scss */ .user-environ .edit-area { - top: 45px; } - /* line 116, ../../../../general/res/sass/user-environ/_layout.scss */ + top: 45px; + left: 10px; + right: 10px; + bottom: 35px; } + /* line 117, ../../../../general/res/sass/user-environ/_layout.scss */ .user-environ .edit-area .tool-bar { bottom: auto; height: 30px; line-height: 25px; } - /* line 121, ../../../../general/res/sass/user-environ/_layout.scss */ - .user-environ .edit-area .work-area { - top: 40px; } -/* line 126, ../../../../general/res/sass/user-environ/_layout.scss */ + /* line 122, ../../../../general/res/sass/user-environ/_layout.scss */ + .user-environ .edit-area .object-holder.work-area { + top: 40px; + overflow: auto; } +/* line 128, ../../../../general/res/sass/user-environ/_layout.scss */ .user-environ .ue-bottom-bar { overflow: hidden; position: absolute; @@ -3810,20 +3795,20 @@ span.req { height: auto; top: auto; height: 25px; } - /* line 131, ../../../../general/res/sass/user-environ/_layout.scss */ + /* line 133, ../../../../general/res/sass/user-environ/_layout.scss */ .user-environ .ue-bottom-bar .status-holder { z-index: 1; } - /* line 135, ../../../../general/res/sass/user-environ/_layout.scss */ + /* line 137, ../../../../general/res/sass/user-environ/_layout.scss */ .user-environ .ue-bottom-bar .app-logo { left: auto; width: 105px; z-index: 2; } -/* line 143, ../../../../general/res/sass/user-environ/_layout.scss */ +/* line 145, ../../../../general/res/sass/user-environ/_layout.scss */ .cols { overflow: hidden; *zoom: 1; } - /* line 145, ../../../../general/res/sass/user-environ/_layout.scss */ + /* line 147, ../../../../general/res/sass/user-environ/_layout.scss */ .cols .col { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; @@ -3834,93 +3819,93 @@ span.req { margin-left: 1.5%; padding-left: 5px; position: relative; } - /* line 153, ../../../../general/res/sass/user-environ/_layout.scss */ + /* line 155, ../../../../general/res/sass/user-environ/_layout.scss */ .cols .col:first-child { margin-left: 0; padding-left: 0; } - /* line 160, ../../../../general/res/sass/user-environ/_layout.scss */ + /* line 162, ../../../../general/res/sass/user-environ/_layout.scss */ .cols.cols-2 .col-1 { min-width: 250px; width: 48.5%; } - /* line 166, ../../../../general/res/sass/user-environ/_layout.scss */ + /* line 168, ../../../../general/res/sass/user-environ/_layout.scss */ .cols.cols-2-ff .col-100px { width: 100px; } - /* line 173, ../../../../general/res/sass/user-environ/_layout.scss */ + /* line 175, ../../../../general/res/sass/user-environ/_layout.scss */ .cols.cols-6 .col-1 { min-width: 83.33333px; width: 15.16667%; } - /* line 179, ../../../../general/res/sass/user-environ/_layout.scss */ + /* line 181, ../../../../general/res/sass/user-environ/_layout.scss */ .cols.cols-16 .col-1 { min-width: 31.25px; width: 4.75%; } - /* line 182, ../../../../general/res/sass/user-environ/_layout.scss */ + /* line 184, ../../../../general/res/sass/user-environ/_layout.scss */ .cols.cols-16 .col-2 { min-width: 62.5px; width: 11%; } - /* line 185, ../../../../general/res/sass/user-environ/_layout.scss */ + /* line 187, ../../../../general/res/sass/user-environ/_layout.scss */ .cols.cols-16 .col-7 { min-width: 218.75px; width: 42.25%; } - /* line 191, ../../../../general/res/sass/user-environ/_layout.scss */ + /* line 193, ../../../../general/res/sass/user-environ/_layout.scss */ .cols.cols-32 .col-2 { min-width: 31.25px; width: 4.75%; } - /* line 194, ../../../../general/res/sass/user-environ/_layout.scss */ + /* line 196, ../../../../general/res/sass/user-environ/_layout.scss */ .cols.cols-32 .col-15 { min-width: 234.375px; width: 45.375%; } - /* line 198, ../../../../general/res/sass/user-environ/_layout.scss */ + /* line 200, ../../../../general/res/sass/user-environ/_layout.scss */ .cols .l-row { overflow: hidden; *zoom: 1; padding: 5px 0; } -/* line 208, ../../../../general/res/sass/user-environ/_layout.scss */ +/* line 210, ../../../../general/res/sass/user-environ/_layout.scss */ .browse-mode .split-layout .split-pane-component.pane.treeview.left { min-width: 150px; max-width: 800px; width: 25%; } -/* line 213, ../../../../general/res/sass/user-environ/_layout.scss */ +/* line 215, ../../../../general/res/sass/user-environ/_layout.scss */ .browse-mode .split-layout .split-pane-component.pane.t-inspect.right { min-width: 200px; max-width: 600px; width: 20%; } -/* line 225, ../../../../general/res/sass/user-environ/_layout.scss */ +/* line 227, ../../../../general/res/sass/user-environ/_layout.scss */ .edit-mode .split-layout .split-pane-component.pane.right { width: 15%; } - /* line 227, ../../../../general/res/sass/user-environ/_layout.scss */ + /* line 229, ../../../../general/res/sass/user-environ/_layout.scss */ .edit-mode .split-layout .split-pane-component.pane.right .pane.bottom { min-height: 50px; height: 30%; } -/* line 235, ../../../../general/res/sass/user-environ/_layout.scss */ +/* line 237, ../../../../general/res/sass/user-environ/_layout.scss */ .pane { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; position: absolute; } - /* line 239, ../../../../general/res/sass/user-environ/_layout.scss */ + /* line 241, ../../../../general/res/sass/user-environ/_layout.scss */ .pane .pane-header { text-transform: uppercase; height: 24px; line-height: 24px; margin-bottom: 5px; } - /* line 246, ../../../../general/res/sass/user-environ/_layout.scss */ + /* line 248, ../../../../general/res/sass/user-environ/_layout.scss */ .pane .primary-pane { z-index: 2; } - /* line 264, ../../../../general/res/sass/user-environ/_layout.scss */ + /* line 266, ../../../../general/res/sass/user-environ/_layout.scss */ .pane.treeview.left .search-holder { top: 34px; } - /* line 267, ../../../../general/res/sass/user-environ/_layout.scss */ + /* line 269, ../../../../general/res/sass/user-environ/_layout.scss */ .pane.treeview.left .tree-holder { overflow: auto; top: 64px; } - /* line 273, ../../../../general/res/sass/user-environ/_layout.scss */ + /* line 275, ../../../../general/res/sass/user-environ/_layout.scss */ .pane .mini-tab-icon.toggle-pane { z-index: 5; } @media screen and (min-device-width: 800px) and (min-device-height: 1025px), screen and (min-device-width: 1025px) and (min-device-height: 800px) { - /* line 273, ../../../../general/res/sass/user-environ/_layout.scss */ + /* line 275, ../../../../general/res/sass/user-environ/_layout.scss */ .pane .mini-tab-icon.toggle-pane { top: 10px; height: 24px; @@ -3930,33 +3915,33 @@ span.req { content:"M" } }*/ } - /* line 282, ../../../../general/res/sass/user-environ/_layout.scss */ + /* line 284, ../../../../general/res/sass/user-environ/_layout.scss */ .pane .mini-tab-icon.toggle-pane:after { opacity: 0; } - /* line 287, ../../../../general/res/sass/user-environ/_layout.scss */ + /* line 289, ../../../../general/res/sass/user-environ/_layout.scss */ .pane .mini-tab-icon.toggle-pane.collapsed:before { opacity: 0; } - /* line 290, ../../../../general/res/sass/user-environ/_layout.scss */ + /* line 292, ../../../../general/res/sass/user-environ/_layout.scss */ .pane .mini-tab-icon.toggle-pane.collapsed:after { opacity: 1; } - /* line 294, ../../../../general/res/sass/user-environ/_layout.scss */ + /* line 296, ../../../../general/res/sass/user-environ/_layout.scss */ .pane .mini-tab-icon.toggle-pane.toggle-tree.anchor-left { left: 0; -moz-transform: translateX(-34px); -ms-transform: translateX(-34px); -webkit-transform: translateX(-34px); transform: translateX(-34px); } - /* line 297, ../../../../general/res/sass/user-environ/_layout.scss */ + /* line 299, ../../../../general/res/sass/user-environ/_layout.scss */ .pane .mini-tab-icon.toggle-pane.toggle-tree.anchor-left:after { content: '\6d'; } - /* line 300, ../../../../general/res/sass/user-environ/_layout.scss */ + /* line 302, ../../../../general/res/sass/user-environ/_layout.scss */ .pane .mini-tab-icon.toggle-pane.toggle-tree.anchor-left.collapsed { left: 0; -moz-transform: translateX(-15px); -ms-transform: translateX(-15px); -webkit-transform: translateX(-15px); transform: translateX(-15px); } - /* line 304, ../../../../general/res/sass/user-environ/_layout.scss */ + /* line 306, ../../../../general/res/sass/user-environ/_layout.scss */ .pane .mini-tab-icon.toggle-pane.toggle-tree.anchor-left:not(.collapsed):before { -moz-transition-property: opacity; -o-transition-property: opacity; @@ -3974,16 +3959,16 @@ span.req { -o-transition-delay: 200ms; -webkit-transition-delay: 200ms; transition-delay: 200ms; } - /* line 308, ../../../../general/res/sass/user-environ/_layout.scss */ + /* line 310, ../../../../general/res/sass/user-environ/_layout.scss */ .pane .mini-tab-icon.toggle-pane.toggle-inspect.anchor-right { right: 10px; } - /* line 310, ../../../../general/res/sass/user-environ/_layout.scss */ + /* line 312, ../../../../general/res/sass/user-environ/_layout.scss */ .pane .mini-tab-icon.toggle-pane.toggle-inspect.anchor-right:after { content: '\e608'; } - /* line 313, ../../../../general/res/sass/user-environ/_layout.scss */ + /* line 315, ../../../../general/res/sass/user-environ/_layout.scss */ .pane .mini-tab-icon.toggle-pane.toggle-inspect.anchor-right.collapsed { right: 5px; } } - /* line 327, ../../../../general/res/sass/user-environ/_layout.scss */ + /* line 329, ../../../../general/res/sass/user-environ/_layout.scss */ .pane.items .object-browse-bar .left.abs, .pane.items .object-browse-bar .left.l-inspect, .pane.items .object-browse-bar .l-datetime-picker .l-month-year-pager .left.pager, .l-datetime-picker .l-month-year-pager .pane.items .object-browse-bar .left.pager, .pane.items .object-browse-bar .l-datetime-picker .l-month-year-pager .left.val, .l-datetime-picker .l-month-year-pager .pane.items .object-browse-bar .left.val, .pane.items .object-browse-bar .s-menu-btn span.left.l-click-area, .s-menu-btn .pane.items .object-browse-bar span.left.l-click-area, @@ -3997,7 +3982,7 @@ span.req { .s-menu-btn .pane.items .object-browse-bar span.right.l-click-area { top: auto; } -/* line 335, ../../../../general/res/sass/user-environ/_layout.scss */ +/* line 337, ../../../../general/res/sass/user-environ/_layout.scss */ .split-layout { /* &.vertical { // Slides left and right @@ -4012,40 +3997,40 @@ span.req { } } }*/ } - /* line 338, ../../../../general/res/sass/user-environ/_layout.scss */ + /* line 340, ../../../../general/res/sass/user-environ/_layout.scss */ .split-layout.horizontal > .pane { margin-top: 5px; } - /* line 341, ../../../../general/res/sass/user-environ/_layout.scss */ + /* line 343, ../../../../general/res/sass/user-environ/_layout.scss */ .split-layout.horizontal > .pane:first-child { margin-top: 0; } - /* line 361, ../../../../general/res/sass/user-environ/_layout.scss */ + /* line 363, ../../../../general/res/sass/user-environ/_layout.scss */ .split-layout .holder.holder-create-and-search { top: 10px; right: 0; bottom: 10px; left: 10px; } - /* line 368, ../../../../general/res/sass/user-environ/_layout.scss */ + /* line 370, ../../../../general/res/sass/user-environ/_layout.scss */ .split-layout .holder.holder-object-and-inspector { top: 0; right: 0; bottom: 0; left: 0; } - /* line 373, ../../../../general/res/sass/user-environ/_layout.scss */ + /* line 375, ../../../../general/res/sass/user-environ/_layout.scss */ .split-layout .holder.holder-object-and-inspector .holder-object { top: 10px; bottom: 10px; } - /* line 377, ../../../../general/res/sass/user-environ/_layout.scss */ + /* line 379, ../../../../general/res/sass/user-environ/_layout.scss */ .split-layout .holder.holder-object-and-inspector .holder-inspector-elements { top: 10px; bottom: 10px; left: 10px; right: 10px; } -/* line 387, ../../../../general/res/sass/user-environ/_layout.scss */ +/* line 389, ../../../../general/res/sass/user-environ/_layout.scss */ .object-holder { overflow: hidden; top: 34px; } - /* line 390, ../../../../general/res/sass/user-environ/_layout.scss */ + /* line 392, ../../../../general/res/sass/user-environ/_layout.scss */ .object-holder > ng-include { overflow: auto; position: absolute; @@ -4055,11 +4040,11 @@ span.req { left: 0; width: auto; height: auto; } - /* line 394, ../../../../general/res/sass/user-environ/_layout.scss */ + /* line 396, ../../../../general/res/sass/user-environ/_layout.scss */ .object-holder.l-controls-visible.l-time-controller-visible { bottom: 88px; } -/* line 400, ../../../../general/res/sass/user-environ/_layout.scss */ +/* line 402, ../../../../general/res/sass/user-environ/_layout.scss */ .object-browse-bar .s-btn, .object-browse-bar .s-menu-btn, .top-bar .buttons-main .s-btn, .top-bar .buttons-main .s-menu-btn, @@ -4071,12 +4056,12 @@ span.req { line-height: 25px; vertical-align: top; } -/* line 413, ../../../../general/res/sass/user-environ/_layout.scss */ +/* line 415, ../../../../general/res/sass/user-environ/_layout.scss */ .object-browse-bar .view-switcher, .top-bar .view-switcher { margin-right: 20px; } -/* line 418, ../../../../general/res/sass/user-environ/_layout.scss */ +/* line 420, ../../../../general/res/sass/user-environ/_layout.scss */ .object-browse-bar { overflow: visible; position: absolute; @@ -4092,28 +4077,28 @@ span.req { height: 24px; line-height: 24px; white-space: nowrap; } - /* line 426, ../../../../general/res/sass/user-environ/_layout.scss */ + /* line 428, ../../../../general/res/sass/user-environ/_layout.scss */ .object-browse-bar .left { padding-right: 20px; } - /* line 428, ../../../../general/res/sass/user-environ/_layout.scss */ + /* line 430, ../../../../general/res/sass/user-environ/_layout.scss */ .object-browse-bar .left .l-back { display: inline-block; float: left; margin-right: 10px; } -/* line 436, ../../../../general/res/sass/user-environ/_layout.scss */ +/* line 438, ../../../../general/res/sass/user-environ/_layout.scss */ .l-flex { display: flex; display: -webkit-flex; flex-flow: row nowrap; -webkit-flex-flow: row nowrap; } - /* line 439, ../../../../general/res/sass/user-environ/_layout.scss */ + /* line 441, ../../../../general/res/sass/user-environ/_layout.scss */ .l-flex .left { flex: 1 1 0; -webkit-flex: 1 1 0; padding-right: 10px; } -/* line 449, ../../../../general/res/sass/user-environ/_layout.scss */ +/* line 451, ../../../../general/res/sass/user-environ/_layout.scss */ .pane-tree-hidden { /*.holder-create-and-search { @include trans-prop-nice((top, left), 250ms); @@ -4134,13 +4119,13 @@ span.req { } } }*/ } - /* line 452, ../../../../general/res/sass/user-environ/_layout.scss */ + /* line 454, ../../../../general/res/sass/user-environ/_layout.scss */ .pane-tree-hidden .tree-holder, .pane-tree-hidden .splitter-treeview, .pane-tree-hidden .holder-create-and-search { opacity: 0; } -/* line 481, ../../../../general/res/sass/user-environ/_layout.scss */ +/* line 483, ../../../../general/res/sass/user-environ/_layout.scss */ .pane-tree-showing .tree-holder, .pane-tree-showing .splitter-treeview { -moz-transition-property: opacity; @@ -4160,7 +4145,7 @@ span.req { -webkit-transition-delay: 250ms; transition-delay: 250ms; opacity: 1; } -/* line 487, ../../../../general/res/sass/user-environ/_layout.scss */ +/* line 489, ../../../../general/res/sass/user-environ/_layout.scss */ .pane-tree-showing .holder-create-and-search { -moz-transition-property: opacity; -o-transition-property: opacity; @@ -4179,7 +4164,7 @@ span.req { -webkit-transition-delay: 200ms; transition-delay: 200ms; } -/* line 494, ../../../../general/res/sass/user-environ/_layout.scss */ +/* line 496, ../../../../general/res/sass/user-environ/_layout.scss */ .pane-inspect-showing .l-object-and-inspector .l-inspect, .pane-inspect-showing .l-object-and-inspector .splitter-inspect { -moz-transition-property: opacity; @@ -4200,21 +4185,21 @@ span.req { transition-delay: 250ms; opacity: 1; } -/* line 503, ../../../../general/res/sass/user-environ/_layout.scss */ +/* line 505, ../../../../general/res/sass/user-environ/_layout.scss */ .pane-inspect-hidden .l-object-and-inspector .l-inspect, .pane-inspect-hidden .l-object-and-inspector .splitter-inspect { opacity: 0; } @media screen and (min-device-width: 800px) and (min-device-height: 1025px), screen and (min-device-width: 1025px) and (min-device-height: 800px) { - /* line 512, ../../../../general/res/sass/user-environ/_layout.scss */ + /* line 514, ../../../../general/res/sass/user-environ/_layout.scss */ .pane-tree-hidden .pane.right.primary-pane { left: 20px !important; } - /* line 515, ../../../../general/res/sass/user-environ/_layout.scss */ + /* line 517, ../../../../general/res/sass/user-environ/_layout.scss */ .pane-inspect-hidden .l-object-and-inspector .pane.left { right: 20px !important; } - /* line 518, ../../../../general/res/sass/user-environ/_layout.scss */ + /* line 520, ../../../../general/res/sass/user-environ/_layout.scss */ .pane:not(.resizing) { -moz-transition-property: width, left, right; -o-transition-property: width, left, right; diff --git a/platform/commonUI/themes/snow/res/css/theme-snow.css b/platform/commonUI/themes/snow/res/css/theme-snow.css index ba919f9400..0f969b15a7 100644 --- a/platform/commonUI/themes/snow/res/css/theme-snow.css +++ b/platform/commonUI/themes/snow/res/css/theme-snow.css @@ -958,83 +958,65 @@ tr[class*="s-limit"].s-limit-lwr td:first-child:before { height: auto; background: #e3e3e3; display: block; } - /* line 46, ../../../../general/res/sass/helpers/_splitter.scss */ - .splitter:not(:active):after { - -moz-transition-property: background-color; - -o-transition-property: background-color; - -webkit-transition-property: background-color; - transition-property: background-color; - -moz-transition-duration: 150ms; - -o-transition-duration: 150ms; - -webkit-transition-duration: 150ms; - transition-duration: 150ms; - -moz-transition-timing-function: ease-in-out; - -o-transition-timing-function: ease-in-out; - -webkit-transition-timing-function: ease-in-out; - transition-timing-function: ease-in-out; - -moz-transition-delay: 0; - -o-transition-delay: 0; - -webkit-transition-delay: 0; - transition-delay: 0; } - /* line 51, ../../../../general/res/sass/helpers/_splitter.scss */ + /* line 47, ../../../../general/res/sass/helpers/_splitter.scss */ .splitter:active:after { background-color: #0099cc !important; } -/* line 68, ../../../../general/res/sass/helpers/_splitter.scss */ +/* line 66, ../../../../general/res/sass/helpers/_splitter.scss */ .split-layout.horizontal { overflow: hidden; } - /* line 71, ../../../../general/res/sass/helpers/_splitter.scss */ + /* line 69, ../../../../general/res/sass/helpers/_splitter.scss */ .split-layout.horizontal .pane { left: 0; right: 0; } - /* line 74, ../../../../general/res/sass/helpers/_splitter.scss */ + /* line 72, ../../../../general/res/sass/helpers/_splitter.scss */ .split-layout.horizontal .pane.top { bottom: auto; } - /* line 77, ../../../../general/res/sass/helpers/_splitter.scss */ + /* line 75, ../../../../general/res/sass/helpers/_splitter.scss */ .split-layout.horizontal .pane.bottom { top: auto; } - /* line 81, ../../../../general/res/sass/helpers/_splitter.scss */ + /* line 79, ../../../../general/res/sass/helpers/_splitter.scss */ .split-layout.horizontal > .splitter { cursor: row-resize; left: 0; right: 0; height: 24px; } - /* line 86, ../../../../general/res/sass/helpers/_splitter.scss */ + /* line 84, ../../../../general/res/sass/helpers/_splitter.scss */ .split-layout.horizontal > .splitter:after { top: 11px; bottom: 11px; } -/* line 94, ../../../../general/res/sass/helpers/_splitter.scss */ +/* line 92, ../../../../general/res/sass/helpers/_splitter.scss */ .split-layout.vertical .pane { top: 0; bottom: 0; } - /* line 97, ../../../../general/res/sass/helpers/_splitter.scss */ + /* line 95, ../../../../general/res/sass/helpers/_splitter.scss */ .split-layout.vertical .pane.left { right: auto; } - /* line 100, ../../../../general/res/sass/helpers/_splitter.scss */ + /* line 98, ../../../../general/res/sass/helpers/_splitter.scss */ .split-layout.vertical .pane.right { left: auto; } -/* line 104, ../../../../general/res/sass/helpers/_splitter.scss */ +/* line 102, ../../../../general/res/sass/helpers/_splitter.scss */ .split-layout.vertical > .splitter { cursor: col-resize; top: 0; bottom: 0; } - /* line 108, ../../../../general/res/sass/helpers/_splitter.scss */ + /* line 106, ../../../../general/res/sass/helpers/_splitter.scss */ .split-layout.vertical > .splitter:not(.flush-right) { width: 24px; } - /* line 110, ../../../../general/res/sass/helpers/_splitter.scss */ + /* line 108, ../../../../general/res/sass/helpers/_splitter.scss */ .split-layout.vertical > .splitter:not(.flush-right):after { left: 11px; right: 11px; } - /* line 114, ../../../../general/res/sass/helpers/_splitter.scss */ + /* line 112, ../../../../general/res/sass/helpers/_splitter.scss */ .split-layout.vertical > .splitter.flush-right { width: 12px; } - /* line 116, ../../../../general/res/sass/helpers/_splitter.scss */ + /* line 114, ../../../../general/res/sass/helpers/_splitter.scss */ .split-layout.vertical > .splitter.flush-right:after { background-color: transparent; left: auto; right: 0; width: 2px; } - /* line 120, ../../../../general/res/sass/helpers/_splitter.scss */ + /* line 118, ../../../../general/res/sass/helpers/_splitter.scss */ .split-layout.vertical > .splitter.flush-right.edge-shdw { background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuMCIgeTE9IjAuNSIgeDI9IjEuMCIgeTI9IjAuNSI+PHN0b3Agb2Zmc2V0PSI0MCUiIHN0b3AtY29sb3I9IiMwMDAwMDAiIHN0b3Atb3BhY2l0eT0iMC4wIi8+PHN0b3Agb2Zmc2V0PSI3MCUiIHN0b3AtY29sb3I9IiMwMDAwMDAiIHN0b3Atb3BhY2l0eT0iMC4wNSIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzAwMDAwMCIgc3RvcC1vcGFjaXR5PSIwLjIiLz48L2xpbmVhckdyYWRpZW50PjwvZGVmcz48cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMTAwJSIgaGVpZ2h0PSIxMDAlIiBmaWxsPSJ1cmwoI2dyYWQpIiAvPjwvc3ZnPiA='); background-size: 100%; @@ -3696,31 +3678,34 @@ span.req { .s-menu-btn span.bar.l-flex.l-click-area .right { width: auto; } -/* line 99, ../../../../general/res/sass/user-environ/_layout.scss */ +/* line 98, ../../../../general/res/sass/user-environ/_layout.scss */ .user-environ .browse-area, -.user-environ .edit-area, .user-environ .editor { top: 0; left: 0; right: 0; bottom: 25px; } -/* line 107, ../../../../general/res/sass/user-environ/_layout.scss */ +/* line 105, ../../../../general/res/sass/user-environ/_layout.scss */ .user-environ .browse-area > .contents, .user-environ .edit-area > .contents { left: 0; right: 0; } -/* line 113, ../../../../general/res/sass/user-environ/_layout.scss */ +/* line 111, ../../../../general/res/sass/user-environ/_layout.scss */ .user-environ .edit-area { - top: 45px; } - /* line 116, ../../../../general/res/sass/user-environ/_layout.scss */ + top: 45px; + left: 10px; + right: 10px; + bottom: 35px; } + /* line 117, ../../../../general/res/sass/user-environ/_layout.scss */ .user-environ .edit-area .tool-bar { bottom: auto; height: 30px; line-height: 25px; } - /* line 121, ../../../../general/res/sass/user-environ/_layout.scss */ - .user-environ .edit-area .work-area { - top: 40px; } -/* line 126, ../../../../general/res/sass/user-environ/_layout.scss */ + /* line 122, ../../../../general/res/sass/user-environ/_layout.scss */ + .user-environ .edit-area .object-holder.work-area { + top: 40px; + overflow: auto; } +/* line 128, ../../../../general/res/sass/user-environ/_layout.scss */ .user-environ .ue-bottom-bar { overflow: hidden; position: absolute; @@ -3732,20 +3717,20 @@ span.req { height: auto; top: auto; height: 25px; } - /* line 131, ../../../../general/res/sass/user-environ/_layout.scss */ + /* line 133, ../../../../general/res/sass/user-environ/_layout.scss */ .user-environ .ue-bottom-bar .status-holder { z-index: 1; } - /* line 135, ../../../../general/res/sass/user-environ/_layout.scss */ + /* line 137, ../../../../general/res/sass/user-environ/_layout.scss */ .user-environ .ue-bottom-bar .app-logo { left: auto; width: 105px; z-index: 2; } -/* line 143, ../../../../general/res/sass/user-environ/_layout.scss */ +/* line 145, ../../../../general/res/sass/user-environ/_layout.scss */ .cols { overflow: hidden; *zoom: 1; } - /* line 145, ../../../../general/res/sass/user-environ/_layout.scss */ + /* line 147, ../../../../general/res/sass/user-environ/_layout.scss */ .cols .col { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; @@ -3756,93 +3741,93 @@ span.req { margin-left: 1.5%; padding-left: 5px; position: relative; } - /* line 153, ../../../../general/res/sass/user-environ/_layout.scss */ + /* line 155, ../../../../general/res/sass/user-environ/_layout.scss */ .cols .col:first-child { margin-left: 0; padding-left: 0; } - /* line 160, ../../../../general/res/sass/user-environ/_layout.scss */ + /* line 162, ../../../../general/res/sass/user-environ/_layout.scss */ .cols.cols-2 .col-1 { min-width: 250px; width: 48.5%; } - /* line 166, ../../../../general/res/sass/user-environ/_layout.scss */ + /* line 168, ../../../../general/res/sass/user-environ/_layout.scss */ .cols.cols-2-ff .col-100px { width: 100px; } - /* line 173, ../../../../general/res/sass/user-environ/_layout.scss */ + /* line 175, ../../../../general/res/sass/user-environ/_layout.scss */ .cols.cols-6 .col-1 { min-width: 83.33333px; width: 15.16667%; } - /* line 179, ../../../../general/res/sass/user-environ/_layout.scss */ + /* line 181, ../../../../general/res/sass/user-environ/_layout.scss */ .cols.cols-16 .col-1 { min-width: 31.25px; width: 4.75%; } - /* line 182, ../../../../general/res/sass/user-environ/_layout.scss */ + /* line 184, ../../../../general/res/sass/user-environ/_layout.scss */ .cols.cols-16 .col-2 { min-width: 62.5px; width: 11%; } - /* line 185, ../../../../general/res/sass/user-environ/_layout.scss */ + /* line 187, ../../../../general/res/sass/user-environ/_layout.scss */ .cols.cols-16 .col-7 { min-width: 218.75px; width: 42.25%; } - /* line 191, ../../../../general/res/sass/user-environ/_layout.scss */ + /* line 193, ../../../../general/res/sass/user-environ/_layout.scss */ .cols.cols-32 .col-2 { min-width: 31.25px; width: 4.75%; } - /* line 194, ../../../../general/res/sass/user-environ/_layout.scss */ + /* line 196, ../../../../general/res/sass/user-environ/_layout.scss */ .cols.cols-32 .col-15 { min-width: 234.375px; width: 45.375%; } - /* line 198, ../../../../general/res/sass/user-environ/_layout.scss */ + /* line 200, ../../../../general/res/sass/user-environ/_layout.scss */ .cols .l-row { overflow: hidden; *zoom: 1; padding: 5px 0; } -/* line 208, ../../../../general/res/sass/user-environ/_layout.scss */ +/* line 210, ../../../../general/res/sass/user-environ/_layout.scss */ .browse-mode .split-layout .split-pane-component.pane.treeview.left { min-width: 150px; max-width: 800px; width: 25%; } -/* line 213, ../../../../general/res/sass/user-environ/_layout.scss */ +/* line 215, ../../../../general/res/sass/user-environ/_layout.scss */ .browse-mode .split-layout .split-pane-component.pane.t-inspect.right { min-width: 200px; max-width: 600px; width: 20%; } -/* line 225, ../../../../general/res/sass/user-environ/_layout.scss */ +/* line 227, ../../../../general/res/sass/user-environ/_layout.scss */ .edit-mode .split-layout .split-pane-component.pane.right { width: 15%; } - /* line 227, ../../../../general/res/sass/user-environ/_layout.scss */ + /* line 229, ../../../../general/res/sass/user-environ/_layout.scss */ .edit-mode .split-layout .split-pane-component.pane.right .pane.bottom { min-height: 50px; height: 30%; } -/* line 235, ../../../../general/res/sass/user-environ/_layout.scss */ +/* line 237, ../../../../general/res/sass/user-environ/_layout.scss */ .pane { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; position: absolute; } - /* line 239, ../../../../general/res/sass/user-environ/_layout.scss */ + /* line 241, ../../../../general/res/sass/user-environ/_layout.scss */ .pane .pane-header { text-transform: uppercase; height: 24px; line-height: 24px; margin-bottom: 5px; } - /* line 246, ../../../../general/res/sass/user-environ/_layout.scss */ + /* line 248, ../../../../general/res/sass/user-environ/_layout.scss */ .pane .primary-pane { z-index: 2; } - /* line 264, ../../../../general/res/sass/user-environ/_layout.scss */ + /* line 266, ../../../../general/res/sass/user-environ/_layout.scss */ .pane.treeview.left .search-holder { top: 34px; } - /* line 267, ../../../../general/res/sass/user-environ/_layout.scss */ + /* line 269, ../../../../general/res/sass/user-environ/_layout.scss */ .pane.treeview.left .tree-holder { overflow: auto; top: 64px; } - /* line 273, ../../../../general/res/sass/user-environ/_layout.scss */ + /* line 275, ../../../../general/res/sass/user-environ/_layout.scss */ .pane .mini-tab-icon.toggle-pane { z-index: 5; } @media screen and (min-device-width: 800px) and (min-device-height: 1025px), screen and (min-device-width: 1025px) and (min-device-height: 800px) { - /* line 273, ../../../../general/res/sass/user-environ/_layout.scss */ + /* line 275, ../../../../general/res/sass/user-environ/_layout.scss */ .pane .mini-tab-icon.toggle-pane { top: 10px; height: 24px; @@ -3852,33 +3837,33 @@ span.req { content:"M" } }*/ } - /* line 282, ../../../../general/res/sass/user-environ/_layout.scss */ + /* line 284, ../../../../general/res/sass/user-environ/_layout.scss */ .pane .mini-tab-icon.toggle-pane:after { opacity: 0; } - /* line 287, ../../../../general/res/sass/user-environ/_layout.scss */ + /* line 289, ../../../../general/res/sass/user-environ/_layout.scss */ .pane .mini-tab-icon.toggle-pane.collapsed:before { opacity: 0; } - /* line 290, ../../../../general/res/sass/user-environ/_layout.scss */ + /* line 292, ../../../../general/res/sass/user-environ/_layout.scss */ .pane .mini-tab-icon.toggle-pane.collapsed:after { opacity: 1; } - /* line 294, ../../../../general/res/sass/user-environ/_layout.scss */ + /* line 296, ../../../../general/res/sass/user-environ/_layout.scss */ .pane .mini-tab-icon.toggle-pane.toggle-tree.anchor-left { left: 0; -moz-transform: translateX(-33px); -ms-transform: translateX(-33px); -webkit-transform: translateX(-33px); transform: translateX(-33px); } - /* line 297, ../../../../general/res/sass/user-environ/_layout.scss */ + /* line 299, ../../../../general/res/sass/user-environ/_layout.scss */ .pane .mini-tab-icon.toggle-pane.toggle-tree.anchor-left:after { content: '\6d'; } - /* line 300, ../../../../general/res/sass/user-environ/_layout.scss */ + /* line 302, ../../../../general/res/sass/user-environ/_layout.scss */ .pane .mini-tab-icon.toggle-pane.toggle-tree.anchor-left.collapsed { left: 0; -moz-transform: translateX(-15px); -ms-transform: translateX(-15px); -webkit-transform: translateX(-15px); transform: translateX(-15px); } - /* line 304, ../../../../general/res/sass/user-environ/_layout.scss */ + /* line 306, ../../../../general/res/sass/user-environ/_layout.scss */ .pane .mini-tab-icon.toggle-pane.toggle-tree.anchor-left:not(.collapsed):before { -moz-transition-property: opacity; -o-transition-property: opacity; @@ -3896,16 +3881,16 @@ span.req { -o-transition-delay: 200ms; -webkit-transition-delay: 200ms; transition-delay: 200ms; } - /* line 308, ../../../../general/res/sass/user-environ/_layout.scss */ + /* line 310, ../../../../general/res/sass/user-environ/_layout.scss */ .pane .mini-tab-icon.toggle-pane.toggle-inspect.anchor-right { right: 10px; } - /* line 310, ../../../../general/res/sass/user-environ/_layout.scss */ + /* line 312, ../../../../general/res/sass/user-environ/_layout.scss */ .pane .mini-tab-icon.toggle-pane.toggle-inspect.anchor-right:after { content: '\e608'; } - /* line 313, ../../../../general/res/sass/user-environ/_layout.scss */ + /* line 315, ../../../../general/res/sass/user-environ/_layout.scss */ .pane .mini-tab-icon.toggle-pane.toggle-inspect.anchor-right.collapsed { right: 5px; } } - /* line 327, ../../../../general/res/sass/user-environ/_layout.scss */ + /* line 329, ../../../../general/res/sass/user-environ/_layout.scss */ .pane.items .object-browse-bar .left.abs, .pane.items .object-browse-bar .left.l-inspect, .pane.items .object-browse-bar .l-datetime-picker .l-month-year-pager .left.pager, .l-datetime-picker .l-month-year-pager .pane.items .object-browse-bar .left.pager, .pane.items .object-browse-bar .l-datetime-picker .l-month-year-pager .left.val, .l-datetime-picker .l-month-year-pager .pane.items .object-browse-bar .left.val, .pane.items .object-browse-bar .s-menu-btn span.left.l-click-area, .s-menu-btn .pane.items .object-browse-bar span.left.l-click-area, @@ -3919,7 +3904,7 @@ span.req { .s-menu-btn .pane.items .object-browse-bar span.right.l-click-area { top: auto; } -/* line 335, ../../../../general/res/sass/user-environ/_layout.scss */ +/* line 337, ../../../../general/res/sass/user-environ/_layout.scss */ .split-layout { /* &.vertical { // Slides left and right @@ -3934,40 +3919,40 @@ span.req { } } }*/ } - /* line 338, ../../../../general/res/sass/user-environ/_layout.scss */ + /* line 340, ../../../../general/res/sass/user-environ/_layout.scss */ .split-layout.horizontal > .pane { margin-top: 5px; } - /* line 341, ../../../../general/res/sass/user-environ/_layout.scss */ + /* line 343, ../../../../general/res/sass/user-environ/_layout.scss */ .split-layout.horizontal > .pane:first-child { margin-top: 0; } - /* line 361, ../../../../general/res/sass/user-environ/_layout.scss */ + /* line 363, ../../../../general/res/sass/user-environ/_layout.scss */ .split-layout .holder.holder-create-and-search { top: 10px; right: 0; bottom: 10px; left: 10px; } - /* line 368, ../../../../general/res/sass/user-environ/_layout.scss */ + /* line 370, ../../../../general/res/sass/user-environ/_layout.scss */ .split-layout .holder.holder-object-and-inspector { top: 0; right: 0; bottom: 0; left: 0; } - /* line 373, ../../../../general/res/sass/user-environ/_layout.scss */ + /* line 375, ../../../../general/res/sass/user-environ/_layout.scss */ .split-layout .holder.holder-object-and-inspector .holder-object { top: 10px; bottom: 10px; } - /* line 377, ../../../../general/res/sass/user-environ/_layout.scss */ + /* line 379, ../../../../general/res/sass/user-environ/_layout.scss */ .split-layout .holder.holder-object-and-inspector .holder-inspector-elements { top: 10px; bottom: 10px; left: 10px; right: 10px; } -/* line 387, ../../../../general/res/sass/user-environ/_layout.scss */ +/* line 389, ../../../../general/res/sass/user-environ/_layout.scss */ .object-holder { overflow: hidden; top: 34px; } - /* line 390, ../../../../general/res/sass/user-environ/_layout.scss */ + /* line 392, ../../../../general/res/sass/user-environ/_layout.scss */ .object-holder > ng-include { overflow: auto; position: absolute; @@ -3977,11 +3962,11 @@ span.req { left: 0; width: auto; height: auto; } - /* line 394, ../../../../general/res/sass/user-environ/_layout.scss */ + /* line 396, ../../../../general/res/sass/user-environ/_layout.scss */ .object-holder.l-controls-visible.l-time-controller-visible { bottom: 88px; } -/* line 400, ../../../../general/res/sass/user-environ/_layout.scss */ +/* line 402, ../../../../general/res/sass/user-environ/_layout.scss */ .object-browse-bar .s-btn, .object-browse-bar .s-menu-btn, .top-bar .buttons-main .s-btn, .top-bar .buttons-main .s-menu-btn, @@ -3993,12 +3978,12 @@ span.req { line-height: 25px; vertical-align: top; } -/* line 413, ../../../../general/res/sass/user-environ/_layout.scss */ +/* line 415, ../../../../general/res/sass/user-environ/_layout.scss */ .object-browse-bar .view-switcher, .top-bar .view-switcher { margin-right: 20px; } -/* line 418, ../../../../general/res/sass/user-environ/_layout.scss */ +/* line 420, ../../../../general/res/sass/user-environ/_layout.scss */ .object-browse-bar { overflow: visible; position: absolute; @@ -4014,28 +3999,28 @@ span.req { height: 24px; line-height: 24px; white-space: nowrap; } - /* line 426, ../../../../general/res/sass/user-environ/_layout.scss */ + /* line 428, ../../../../general/res/sass/user-environ/_layout.scss */ .object-browse-bar .left { padding-right: 20px; } - /* line 428, ../../../../general/res/sass/user-environ/_layout.scss */ + /* line 430, ../../../../general/res/sass/user-environ/_layout.scss */ .object-browse-bar .left .l-back { display: inline-block; float: left; margin-right: 10px; } -/* line 436, ../../../../general/res/sass/user-environ/_layout.scss */ +/* line 438, ../../../../general/res/sass/user-environ/_layout.scss */ .l-flex { display: flex; display: -webkit-flex; flex-flow: row nowrap; -webkit-flex-flow: row nowrap; } - /* line 439, ../../../../general/res/sass/user-environ/_layout.scss */ + /* line 441, ../../../../general/res/sass/user-environ/_layout.scss */ .l-flex .left { flex: 1 1 0; -webkit-flex: 1 1 0; padding-right: 10px; } -/* line 449, ../../../../general/res/sass/user-environ/_layout.scss */ +/* line 451, ../../../../general/res/sass/user-environ/_layout.scss */ .pane-tree-hidden { /*.holder-create-and-search { @include trans-prop-nice((top, left), 250ms); @@ -4056,13 +4041,13 @@ span.req { } } }*/ } - /* line 452, ../../../../general/res/sass/user-environ/_layout.scss */ + /* line 454, ../../../../general/res/sass/user-environ/_layout.scss */ .pane-tree-hidden .tree-holder, .pane-tree-hidden .splitter-treeview, .pane-tree-hidden .holder-create-and-search { opacity: 0; } -/* line 481, ../../../../general/res/sass/user-environ/_layout.scss */ +/* line 483, ../../../../general/res/sass/user-environ/_layout.scss */ .pane-tree-showing .tree-holder, .pane-tree-showing .splitter-treeview { -moz-transition-property: opacity; @@ -4082,7 +4067,7 @@ span.req { -webkit-transition-delay: 250ms; transition-delay: 250ms; opacity: 1; } -/* line 487, ../../../../general/res/sass/user-environ/_layout.scss */ +/* line 489, ../../../../general/res/sass/user-environ/_layout.scss */ .pane-tree-showing .holder-create-and-search { -moz-transition-property: opacity; -o-transition-property: opacity; @@ -4101,7 +4086,7 @@ span.req { -webkit-transition-delay: 200ms; transition-delay: 200ms; } -/* line 494, ../../../../general/res/sass/user-environ/_layout.scss */ +/* line 496, ../../../../general/res/sass/user-environ/_layout.scss */ .pane-inspect-showing .l-object-and-inspector .l-inspect, .pane-inspect-showing .l-object-and-inspector .splitter-inspect { -moz-transition-property: opacity; @@ -4122,21 +4107,21 @@ span.req { transition-delay: 250ms; opacity: 1; } -/* line 503, ../../../../general/res/sass/user-environ/_layout.scss */ +/* line 505, ../../../../general/res/sass/user-environ/_layout.scss */ .pane-inspect-hidden .l-object-and-inspector .l-inspect, .pane-inspect-hidden .l-object-and-inspector .splitter-inspect { opacity: 0; } @media screen and (min-device-width: 800px) and (min-device-height: 1025px), screen and (min-device-width: 1025px) and (min-device-height: 800px) { - /* line 512, ../../../../general/res/sass/user-environ/_layout.scss */ + /* line 514, ../../../../general/res/sass/user-environ/_layout.scss */ .pane-tree-hidden .pane.right.primary-pane { left: 20px !important; } - /* line 515, ../../../../general/res/sass/user-environ/_layout.scss */ + /* line 517, ../../../../general/res/sass/user-environ/_layout.scss */ .pane-inspect-hidden .l-object-and-inspector .pane.left { right: 20px !important; } - /* line 518, ../../../../general/res/sass/user-environ/_layout.scss */ + /* line 520, ../../../../general/res/sass/user-environ/_layout.scss */ .pane:not(.resizing) { -moz-transition-property: width, left, right; -o-transition-property: width, left, right; diff --git a/platform/representation/bundle.json b/platform/representation/bundle.json index 331856a9a8..8b185422b9 100644 --- a/platform/representation/bundle.json +++ b/platform/representation/bundle.json @@ -4,12 +4,12 @@ { "key": "mctInclude", "implementation": "MCTInclude.js", - "depends": [ "templates[]", "$sce" ] + "depends": [ "templates[]", "templateLinker" ] }, { "key": "mctRepresentation", "implementation": "MCTRepresentation.js", - "depends": [ "representations[]", "views[]", "representers[]", "$q", "$sce", "$log" ] + "depends": [ "representations[]", "views[]", "representers[]", "$q", "templateLinker", "$log" ] } ], "gestures": [ @@ -48,6 +48,12 @@ "key": "dndService", "implementation": "services/DndService.js", "depends": [ "$log" ] + }, + { + "key": "templateLinker", + "implementation": "TemplateLinker.js", + "depends": [ "$templateRequest", "$sce", "$compile", "$log" ], + "comment": "For internal use by mct-include and mct-representation." } ], "actions": [ diff --git a/platform/representation/src/MCTInclude.js b/platform/representation/src/MCTInclude.js index dc00c8b89d..761a798dfa 100644 --- a/platform/representation/src/MCTInclude.js +++ b/platform/representation/src/MCTInclude.js @@ -54,36 +54,38 @@ define( * @param {TemplateDefinition[]} templates an array of * template extensions */ - function MCTInclude(templates, $sce) { + function MCTInclude(templates, templateLinker) { var templateMap = {}; + function link(scope, element) { + var changeTemplate = templateLinker.link( + scope, + element, + scope.key && templateMap[scope.key] + ); + + scope.$watch('key', function (key) { + changeTemplate(key && templateMap[key]); + }); + } + // Prepopulate templateMap for easy look up by key templates.forEach(function (template) { - var key = template.key, - path = $sce.trustAsResourceUrl([ - template.bundle.path, - template.bundle.resources, - template.templateUrl - ].join("/")); + var key = template.key; // First found should win (priority ordering) - templateMap[key] = templateMap[key] || path; + templateMap[key] = + templateMap[key] || templateLinker.getPath(template); }); - function controller($scope) { - // Pass the template URL to ng-include via scope. - $scope.inclusion = templateMap[$scope.key]; - } - return { // Only show at the element level restrict: "E", // Use the included controller to populate scope - controller: controller, + link: link, - // Use ng-include as a template; "inclusion" will be the real - // template path - template: '', + // May hide the element, so let other directives act first + priority: -1000, // Two-way bind key, ngModel, and parameters scope: { key: "=", ngModel: "=", parameters: "=" } diff --git a/platform/representation/src/MCTRepresentation.js b/platform/representation/src/MCTRepresentation.js index 98a814c362..10b6d3ccec 100644 --- a/platform/representation/src/MCTRepresentation.js +++ b/platform/representation/src/MCTRepresentation.js @@ -55,7 +55,7 @@ define( * representation extensions * @param {ViewDefinition[]} views an array of view extensions */ - function MCTRepresentation(representations, views, representers, $q, $sce, $log) { + function MCTRepresentation(representations, views, representers, $q, templateLinker, $log) { var representationMap = {}, gestureMap = {}; @@ -72,11 +72,7 @@ define( // Get a path to a representation function getPath(representation) { - return $sce.trustAsResourceUrl([ - representation.bundle.path, - representation.bundle.resources, - representation.templateUrl - ].join("/")); + return templateLinker.getPath(representation); } // Look up a matching representation for this domain object @@ -94,12 +90,13 @@ define( } } - function link($scope, element, attrs) { + function link($scope, element, attrs, ctrl, transclude) { var activeRepresenters = representers.map(function (Representer) { return new Representer($scope, element, attrs); }), toClear = [], // Properties to clear out of scope on change - counter = 0; + counter = 0, + changeTemplate = templateLinker.link($scope, element); // Populate scope with any capabilities indicated by the // representation's extension definition @@ -150,15 +147,17 @@ define( function refresh() { var domainObject = $scope.domainObject, representation = lookup($scope.key, domainObject), - uses = ((representation || {}).uses || []); + path = representation && getPath(representation), + uses = ((representation || {}).uses || []), + canRepresent = !!(path && domainObject); // Create an empty object named "representation", for this // representation to store local variables into. $scope.representation = {}; - // Look up the actual template path, pass it to ng-include - // via the "inclusion" field - $scope.inclusion = representation && getPath(representation); + // Change templates (passing in undefined to clear + // if we don't have enough info to show a template.) + changeTemplate(canRepresent ? path : undefined); // Any existing representers are no longer valid; release them. destroyRepresenters(); @@ -176,7 +175,7 @@ define( // Populate scope with fields associated with the current // domain object (if one has been passed in) - if (domainObject) { + if (canRepresent) { // Track how many representations we've made in this scope, // to ensure that the correct representations are matched to // the correct object/key pairs. @@ -233,9 +232,8 @@ define( // Handle Angular's linking step link: link, - // Use ng-include as a template; "inclusion" will be the real - // template path - template: '', + // May hide the element, so let other directives act first + priority: -1000, // Two-way bind key and parameters, get the represented domain // object as "mct-object" diff --git a/platform/representation/src/TemplateLinker.js b/platform/representation/src/TemplateLinker.js new file mode 100644 index 0000000000..426bbbe318 --- /dev/null +++ b/platform/representation/src/TemplateLinker.js @@ -0,0 +1,153 @@ +/***************************************************************************** + * Open MCT Web, Copyright (c) 2014-2015, United States Government + * as represented by the Administrator of the National Aeronautics and Space + * Administration. All rights reserved. + * + * Open MCT Web is licensed under the Apache License, Version 2.0 (the + * "License"); you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * http://www.apache.org/licenses/LICENSE-2.0. + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT + * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the + * License for the specific language governing permissions and limitations + * under the License. + * + * Open MCT Web includes source code licensed under additional open source + * licenses. See the Open Source Licenses file (LICENSES.md) included with + * this source code distribution or the Licensing information page available + * at runtime from the About dialog for additional information. + *****************************************************************************/ +/*global define,Promise*/ + +define( + [], + function () { + "use strict"; + + /** + * The `templateLinker` service is intended for internal use by + * the `mct-include` and `mct-representation` directives. It is + * used to support common behavior of directives; specifically, + * loading templates and inserting them into a specified element, + * and/or removing that element from the DOM when there is no + * template to populate it with. + * + * @param {Function} $templateRequest Angular's `$templateRequest` + * service + * @param $sce Angular's `$sce` service + * @param {Function} $compile Angular's `$compile` service + * @param $log Angular's `$log` service + * @private + */ + function TemplateLinker($templateRequest, $sce, $compile, $log) { + this.$templateRequest = $templateRequest; + this.$sce = $sce; + this.$compile = $compile; + this.$log = $log; + } + + /** + * Load a template from the given URL. This request will be handled + * via `$templateRequest` to ensure caching et cetera. + * @param {string} the URL for the template + * @returns {Promise.} a promise for the HTML content of + * the template + * @private + */ + TemplateLinker.prototype.load = function (templateUrl) { + return this.$templateRequest( + this.$sce.trustAsResourceUrl(templateUrl), + false + ); + }; + + /** + * Get a path to a template from an extension definition fo + * a template, representation, or view. + * @param {TemplateDefinition} extensionDefinition the definition + * of the template/representation/view to resolve + */ + TemplateLinker.prototype.getPath = function (extensionDefinition) { + return [ + extensionDefinition.bundle.path, + extensionDefinition.bundle.resources, + extensionDefinition.templateUrl + ].join('/'); + }; + + /** + * Populate the given element with templates, within the given scope; + * intended to support the `link` function of the supported directives. + * + * @param {Scope} scope the Angular scope to use when rendering + * templates + * @param element the jqLite-wrapped element into which templates + * should be inserted + * @returns {Function} a function which can be called with a template + * URL to switch templates, or `undefined` to remove. + */ + TemplateLinker.prototype.link = function (scope, element, templateUrl) { + var activeElement = element, + activeTemplateUrl, + comment = this.$compile('')(scope), + self = this; + + function removeElement() { + if (activeElement !== comment) { + activeElement.replaceWith(comment); + activeElement = comment; + } + } + + function addElement() { + if (activeElement !== element) { + activeElement.replaceWith(element); + activeElement = element; + activeElement.empty(); + } + } + + function populateElement(template) { + element.empty(); + element.append(self.$compile(template)(scope)); + } + + function badTemplate(templateUrl) { + self.$log.warn("Couldn't load template at " + templateUrl); + removeElement(); + } + + function changeTemplate(templateUrl) { + if (templateUrl !== activeTemplateUrl) { + if (templateUrl) { + addElement(); + self.load(templateUrl).then(function (template) { + // Avoid race conditions + if (templateUrl === activeTemplateUrl) { + populateElement(template); + } + }, function () { + badTemplate(templateUrl); + }); + } else { + removeElement(); + } + activeTemplateUrl = templateUrl; + } + } + + if (templateUrl) { + changeTemplate(templateUrl); + } else { + removeElement(); + } + + return changeTemplate; + }; + + return TemplateLinker; + } +); + diff --git a/platform/representation/test/MCTIncludeSpec.js b/platform/representation/test/MCTIncludeSpec.js index 135988b509..94dc62fd0a 100644 --- a/platform/representation/test/MCTIncludeSpec.js +++ b/platform/representation/test/MCTIncludeSpec.js @@ -31,9 +31,21 @@ define( describe("The mct-include directive", function () { var testTemplates, - mockSce, + testUrls, + mockLinker, + mockScope, + mockElement, + mockChangeTemplate, mctInclude; + function fireWatch(expr, value) { + mockScope.$watch.calls.forEach(function (call) { + if (call.args[0] === expr) { + call.args[1](value); + } + }); + } + beforeEach(function () { testTemplates = [ { @@ -47,40 +59,44 @@ define( templateUrl: "z/template.html" } ]; - mockSce = jasmine.createSpyObj( - '$sce', - ['trustAsResourceUrl'] - ); - mockSce.trustAsResourceUrl.andCallFake(function (url) { - return url; + testUrls = {}; + testTemplates.forEach(function (t, i) { + testUrls[t.key] = "some URL " + String(i); }); - mctInclude = new MCTInclude(testTemplates, mockSce); - }); - - it("has a built-in template, with ng-include src=inclusion", function () { - // Not rigorous, but should detect many cases when template is broken. - expect(mctInclude.template.indexOf("ng-include")).not.toEqual(-1); - expect(mctInclude.template.indexOf("inclusion")).not.toEqual(-1); + mockLinker = jasmine.createSpyObj( + 'templateLinker', + ['link', 'getPath'] + ); + mockScope = jasmine.createSpyObj('$scope', ['$watch', '$on']); + mockElement = jasmine.createSpyObj('element', ['empty']); + mockChangeTemplate = jasmine.createSpy('changeTemplate'); + mockLinker.link.andReturn(mockChangeTemplate); + mockLinker.getPath.andCallFake(function (template) { + return testUrls[template.key]; + }); + mctInclude = new MCTInclude(testTemplates, mockLinker); + mctInclude.link(mockScope, mockElement, {}); }); it("is restricted to elements", function () { expect(mctInclude.restrict).toEqual("E"); }); - it("reads a template location from a scope's key variable", function () { - var scope = { key: "abc" }; - mctInclude.controller(scope); - expect(scope.inclusion).toEqual("a/b/c/template.html"); - - scope = { key: "xyz" }; - mctInclude.controller(scope); - expect(scope.inclusion).toEqual("x/y/z/template.html"); + it("exposes templates via the templateLinker", function () { + expect(mockLinker.link) + .toHaveBeenCalledWith(mockScope, mockElement, undefined); }); - it("trusts template URLs", function () { - mctInclude.controller({ key: "xyz" }); - expect(mockSce.trustAsResourceUrl) - .toHaveBeenCalledWith("x/y/z/template.html"); + it("reads a template location from a scope's key variable", function () { + mockScope.key = 'abc'; + fireWatch('key', mockScope.key); + expect(mockChangeTemplate) + .toHaveBeenCalledWith(testUrls.abc); + + mockScope.key = 'xyz'; + fireWatch('key', mockScope.key); + expect(mockChangeTemplate) + .toHaveBeenCalledWith(testUrls.xyz); }); }); diff --git a/platform/representation/test/MCTRepresentationSpec.js b/platform/representation/test/MCTRepresentationSpec.js index a50347df70..30fed7c0ca 100644 --- a/platform/representation/test/MCTRepresentationSpec.js +++ b/platform/representation/test/MCTRepresentationSpec.js @@ -36,10 +36,12 @@ define( describe("The mct-representation directive", function () { var testRepresentations, testViews, + testUrls, mockRepresenters, mockQ, - mockSce, + mockLinker, mockLog, + mockChangeTemplate, mockScope, mockElement, mockDomainObject, @@ -54,7 +56,17 @@ define( }; } + function fireWatch(expr, value) { + mockScope.$watch.calls.forEach(function (call) { + if (call.args[0] === expr) { + call.args[1](value); + } + }); + } + beforeEach(function () { + testUrls = {}; + testRepresentations = [ { key: "abc", @@ -85,6 +97,11 @@ define( testModel = { someKey: "some value" }; + testUrls = {}; + testViews.concat(testRepresentations).forEach(function (t, i) { + testUrls[t.key] = "some URL " + String(i); + }); + mockRepresenters = ["A", "B"].map(function (name) { var constructor = jasmine.createSpy("Representer" + name), representer = jasmine.createSpyObj( @@ -96,45 +113,44 @@ define( }); mockQ = { when: mockPromise }; - mockSce = jasmine.createSpyObj( - '$sce', - ['trustAsResourceUrl'] + mockLinker = jasmine.createSpyObj( + 'templateLinker', + ['link', 'getPath'] ); + mockChangeTemplate = jasmine.createSpy('changeTemplate'); mockLog = jasmine.createSpyObj("$log", LOG_FUNCTIONS); - - mockSce.trustAsResourceUrl.andCallFake(function (url) { - return url; - }); mockScope = jasmine.createSpyObj("scope", [ "$watch", "$on" ]); mockElement = jasmine.createSpyObj("element", JQLITE_FUNCTIONS); mockDomainObject = jasmine.createSpyObj("domainObject", DOMAIN_OBJECT_METHODS); mockDomainObject.getModel.andReturn(testModel); + mockLinker.link.andReturn(mockChangeTemplate); + mockLinker.getPath.andCallFake(function (ext) { + return testUrls[ext.key]; + }); mctRepresentation = new MCTRepresentation( testRepresentations, testViews, mockRepresenters, mockQ, - mockSce, + mockLinker, mockLog ); - }); - - - it("has a built-in template, with ng-include src=inclusion", function () { - // Not rigorous, but should detect many cases when template is broken. - expect(mctRepresentation.template.indexOf("ng-include")).not.toEqual(-1); - expect(mctRepresentation.template.indexOf("inclusion")).not.toEqual(-1); + mctRepresentation.link(mockScope, mockElement); }); it("is restricted to elements", function () { expect(mctRepresentation.restrict).toEqual("E"); }); + it("exposes templates via the templateLinker", function () { + expect(mockLinker.link) + .toHaveBeenCalledWith(mockScope, mockElement); + }); + it("watches scope when linked", function () { - mctRepresentation.link(mockScope, mockElement); expect(mockScope.$watch).toHaveBeenCalledWith( "key", jasmine.any(Function) @@ -150,42 +166,46 @@ define( }); it("recognizes keys for representations", function () { - mctRepresentation.link(mockScope, mockElement); - mockScope.key = "abc"; + mockScope.domainObject = mockDomainObject; // Trigger the watch - mockScope.$watch.calls[0].args[1](); + fireWatch('key', mockScope.key); + fireWatch('domainObject', mockDomainObject); - expect(mockScope.inclusion).toEqual("a/b/c/template.html"); + expect(mockChangeTemplate) + .toHaveBeenCalledWith(testUrls.abc); }); it("recognizes keys for views", function () { - mctRepresentation.link(mockScope, mockElement); - mockScope.key = "xyz"; + mockScope.domainObject = mockDomainObject; - // Trigger the watch - mockScope.$watch.calls[0].args[1](); + // Trigger the watches + fireWatch('key', mockScope.key); + fireWatch('domainObject', mockDomainObject); - expect(mockScope.inclusion).toEqual("x/y/z/template.html"); + expect(mockChangeTemplate) + .toHaveBeenCalledWith(testUrls.xyz); }); - it("trusts template URLs", function () { - mctRepresentation.link(mockScope, mockElement); - + it("does not load templates until there is an object", function () { mockScope.key = "xyz"; // Trigger the watch - mockScope.$watch.calls[0].args[1](); + fireWatch('key', mockScope.key); - expect(mockSce.trustAsResourceUrl) - .toHaveBeenCalledWith("x/y/z/template.html"); + expect(mockChangeTemplate) + .not.toHaveBeenCalledWith(jasmine.any(String)); + + mockScope.domainObject = mockDomainObject; + fireWatch('domainObject', mockDomainObject); + + expect(mockChangeTemplate) + .toHaveBeenCalledWith(jasmine.any(String)); }); it("loads declared capabilities", function () { - mctRepresentation.link(mockScope, mockElement); - mockScope.key = "def"; mockScope.domainObject = mockDomainObject; @@ -199,8 +219,6 @@ define( }); it("logs when no representation is available for a key", function () { - mctRepresentation.link(mockScope, mockElement); - mockScope.key = "someUnknownThing"; // Verify precondition @@ -214,8 +232,6 @@ define( }); it("clears out obsolete peroperties from scope", function () { - mctRepresentation.link(mockScope, mockElement); - mockScope.key = "def"; mockScope.domainObject = mockDomainObject; mockDomainObject.useCapability.andReturn("some value"); diff --git a/platform/representation/test/TemplateLinkerSpec.js b/platform/representation/test/TemplateLinkerSpec.js new file mode 100644 index 0000000000..bf762fba53 --- /dev/null +++ b/platform/representation/test/TemplateLinkerSpec.js @@ -0,0 +1,211 @@ +/***************************************************************************** + * Open MCT Web, Copyright (c) 2014-2015, United States Government + * as represented by the Administrator of the National Aeronautics and Space + * Administration. All rights reserved. + * + * Open MCT Web is licensed under the Apache License, Version 2.0 (the + * "License"); you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * http://www.apache.org/licenses/LICENSE-2.0. + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT + * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the + * License for the specific language governing permissions and limitations + * under the License. + * + * Open MCT Web includes source code licensed under additional open source + * licenses. See the Open Source Licenses file (LICENSES.md) included with + * this source code distribution or the Licensing information page available + * at runtime from the About dialog for additional information. + *****************************************************************************/ +/*global define,Promise,describe,it,expect,beforeEach,waitsFor,jasmine*/ + + +define( + ["../src/TemplateLinker"], + function (TemplateLinker) { + 'use strict'; + + var JQLITE_METHODS = [ 'replaceWith', 'empty', 'append' ]; + + describe("TemplateLinker", function () { + var mockTemplateRequest, + mockSce, + mockCompile, + mockLog, + mockScope, + mockElement, + mockTemplates, + mockElements, + mockPromise, + linker; + + beforeEach(function () { + mockTemplateRequest = jasmine.createSpy('$templateRequest'); + mockSce = jasmine.createSpyObj('$sce', ['trustAsResourceUrl']); + mockCompile = jasmine.createSpy('$compile'); + mockLog = jasmine.createSpyObj('$log', ['error', 'warn']); + mockScope = jasmine.createSpyObj('$scope', ['$on']); + mockElement = jasmine.createSpyObj('element', JQLITE_METHODS); + mockPromise = jasmine.createSpyObj('promise', ['then']); + mockTemplates = {}; + mockElements = {}; + + mockTemplateRequest.andReturn(mockPromise); + mockCompile.andCallFake(function (html) { + mockTemplates[html] = jasmine.createSpy('template'); + mockElements[html] = + jasmine.createSpyObj('templateEl', JQLITE_METHODS); + mockTemplates[html].andReturn(mockElements[html]); + return mockTemplates[html]; + }); + mockSce.trustAsResourceUrl.andCallFake(function (url) { + return { trusted: url }; + }); + + linker = new TemplateLinker( + mockTemplateRequest, + mockSce, + mockCompile, + mockLog + ); + }); + + it("resolves extension paths", function () { + expect(linker.getPath({ + bundle: { + path: 'a', + resources: 'b' + }, + templateUrl: 'c/d.html' + })).toEqual('a/b/c/d.html'); + }); + + describe("when linking elements", function () { + var changeTemplate, + commentElement; + + function findCommentElement() { + mockCompile.calls.forEach(function (call) { + var html = call.args[0]; + if (html.indexOf("