From e2f0f61862f6125e108c3866a8012218f973aecf Mon Sep 17 00:00:00 2001 From: Luis-Johannes Schubert Date: Mon, 19 Jun 2017 18:35:18 -0700 Subject: [PATCH] Implement new folder List view (#1610) * refactored code for listView * minimum viable folder list functionality * moved listview directory inside of platform/features * [Folder ListView] First Code Review Fixes Changes made: Updated listview icon as the hamburger menu. Injecting listview template as textfile instead of using the template's url. Added callback to $scope to listen for $destroy to release resources for the mutation listener and the gesture recognizer. Refactored ListViewController formatting function to use map instead of foreach. Added listview plugin to the default registry. Updated table styling. * working progress commit. ListViewControllerSpec is implemented and all tests are passing. MCTGestureSpec is not fully implemented. Testing the gestureService release is in progress. * All tests in MCTGestureSpec and ListViewControllerSpec are passing. * ListViewControllerSpec and MCTGesture Tests all passing. * refactored variable names in ListviewController to make more sense. * [Frontend] Styling of Luis's list view WIP Fixes #1615 This will have conflicts with Luis's work, be careful! * [Folder ListView] Second Code Review Fixes Changes made: updated listview to utilize open-mct sorting style. added license comments to all files. modified mctgesture interface to use $scope.eval(). * [Frontend] Styling of Luis's list view WIP Fixes #1615 New list-view glyph added * [Frontend] Styling of Luis's list view WIP Fixes #1615 Changed name of "Items" view to "Grid"; * [Frontend] Styling of Luis's list view WIP Fixes #1615 Updated icomoon project file with new list-view glyph e1042; * [Folder ListView] Second Code Review Fixes Changes made: updated listview to utilize open-mct sorting style. added license comments to all files. modified mctgesture interface to use $scope.eval(). * [Frontend] Styling of Luis's list view WIP Fixes #1615 Refined cursor CSS; * [Frontend] Styling of Luis's list view WIP Fixes #1615 Added logic to refine how sorting occurs: now, clicking a table header that wasn't the orderByField always sorts by its default; --- platform/commonUI/browse/bundle.js | 2 +- .../icomoon-project-openmct-symbols-16px.json | 121 ++++++++++----- .../fonts/symbols/openmct-symbols-16px.eot | Bin 15076 -> 15148 bytes .../fonts/symbols/openmct-symbols-16px.svg | 3 +- .../fonts/symbols/openmct-symbols-16px.ttf | Bin 14860 -> 14932 bytes .../fonts/symbols/openmct-symbols-16px.woff | Bin 14936 -> 15008 bytes .../commonUI/general/res/sass/_glyphs.scss | 2 + .../general/res/sass/items/_item.scss | 30 +++- platform/features/listview/bundle.js | 64 ++++++++ .../listview/res/templates/listview.html | 88 +++++++++++ .../src/controllers/ListViewController.js | 67 +++++++++ .../listview/src/directives/MCTGesture.js | 44 ++++++ .../controllers/ListViewControllerSpec.js | 138 ++++++++++++++++++ .../test/directives/MCTGestureSpec.js | 86 +++++++++++ src/defaultRegistry.js | 2 + 15 files changed, 610 insertions(+), 37 deletions(-) create mode 100644 platform/features/listview/bundle.js create mode 100644 platform/features/listview/res/templates/listview.html create mode 100644 platform/features/listview/src/controllers/ListViewController.js create mode 100644 platform/features/listview/src/directives/MCTGesture.js create mode 100644 platform/features/listview/test/controllers/ListViewControllerSpec.js create mode 100644 platform/features/listview/test/directives/MCTGestureSpec.js diff --git a/platform/commonUI/browse/bundle.js b/platform/commonUI/browse/bundle.js index 222be9afcd..1526b63384 100644 --- a/platform/commonUI/browse/bundle.js +++ b/platform/commonUI/browse/bundle.js @@ -240,7 +240,7 @@ define([ "views": [ { "key": "items", - "name": "Items", + "name": "Grid", "cssClass": "icon-thumbs-strip", "description": "Grid of available items", "template": itemsTemplate, diff --git a/platform/commonUI/general/res/fonts/symbols/icomoon-project-openmct-symbols-16px.json b/platform/commonUI/general/res/fonts/symbols/icomoon-project-openmct-symbols-16px.json index 844858334d..57e2d60579 100644 --- a/platform/commonUI/general/res/fonts/symbols/icomoon-project-openmct-symbols-16px.json +++ b/platform/commonUI/general/res/fonts/symbols/icomoon-project-openmct-symbols-16px.json @@ -1,8 +1,8 @@ { "metadata": { "name": "openmct-symbols-16px", - "lastOpened": 1487197651675, - "created": 1487194069058 + "lastOpened": 0, + "created": 1497475810461 }, "iconSets": [ { @@ -573,20 +573,28 @@ "tempChar": "" }, { - "order": 122, + "order": 124, "id": 106, "name": "icon-expand", "prevSize": 24, "code": 921665, "tempChar": "" }, + { + "order": 123, + "id": 107, + "name": "icon-list-view", + "prevSize": 24, + "code": 921666, + "tempChar": "" + }, { "order": 37, "prevSize": 24, "name": "icon-activity", "id": 32, "code": 921856, - "tempChar": "" + "tempChar": "" }, { "order": 36, @@ -594,7 +602,7 @@ "name": "icon-activity-mode", "id": 31, "code": 921857, - "tempChar": "" + "tempChar": "" }, { "order": 52, @@ -602,7 +610,7 @@ "name": "icon-autoflow-tabular", "id": 47, "code": 921858, - "tempChar": "" + "tempChar": "" }, { "order": 55, @@ -610,7 +618,7 @@ "name": "icon-clock", "id": 50, "code": 921859, - "tempChar": "" + "tempChar": "" }, { "order": 58, @@ -618,7 +626,7 @@ "name": "icon-database", "id": 53, "code": 921860, - "tempChar": "" + "tempChar": "" }, { "order": 57, @@ -626,7 +634,7 @@ "name": "icon-database-query", "id": 52, "code": 921861, - "tempChar": "" + "tempChar": "" }, { "order": 17, @@ -634,7 +642,7 @@ "name": "icon-dataset", "id": 12, "code": 921862, - "tempChar": "" + "tempChar": "" }, { "order": 22, @@ -642,7 +650,7 @@ "name": "icon-datatable", "id": 17, "code": 921863, - "tempChar": "" + "tempChar": "" }, { "order": 59, @@ -650,7 +658,7 @@ "name": "icon-dictionary", "id": 54, "code": 921864, - "tempChar": "" + "tempChar": "" }, { "order": 62, @@ -658,7 +666,7 @@ "name": "icon-folder", "id": 57, "code": 921865, - "tempChar": "" + "tempChar": "" }, { "order": 66, @@ -666,7 +674,7 @@ "name": "icon-image", "id": 61, "code": 921872, - "tempChar": "" + "tempChar": "" }, { "order": 68, @@ -674,7 +682,7 @@ "name": "icon-layout", "id": 63, "code": 921873, - "tempChar": "" + "tempChar": "" }, { "order": 77, @@ -682,7 +690,7 @@ "name": "icon-object", "id": 72, "code": 921874, - "tempChar": "" + "tempChar": "" }, { "order": 78, @@ -690,7 +698,7 @@ "name": "icon-object-unknown", "id": 73, "code": 921875, - "tempChar": "" + "tempChar": "" }, { "order": 79, @@ -698,7 +706,7 @@ "name": "icon-packet", "id": 74, "code": 921876, - "tempChar": "" + "tempChar": "" }, { "order": 80, @@ -706,7 +714,7 @@ "name": "icon-page", "id": 75, "code": 921877, - "tempChar": "" + "tempChar": "" }, { "order": 114, @@ -714,7 +722,7 @@ "name": "icon-plot-overlay", "prevSize": 24, "code": 921878, - "tempChar": "" + "tempChar": "" }, { "order": 113, @@ -722,7 +730,7 @@ "name": "icon-plot-stacked", "prevSize": 24, "code": 921879, - "tempChar": "" + "tempChar": "" }, { "order": 10, @@ -730,7 +738,7 @@ "name": "icon-session", "id": 5, "code": 921880, - "tempChar": "" + "tempChar": "" }, { "order": 24, @@ -738,7 +746,7 @@ "name": "icon-tabular", "id": 19, "code": 921881, - "tempChar": "" + "tempChar": "" }, { "order": 7, @@ -746,7 +754,7 @@ "name": "icon-tabular-lad", "id": 2, "code": 921888, - "tempChar": "" + "tempChar": "" }, { "order": 6, @@ -754,7 +762,7 @@ "name": "icon-tabular-lad-set", "id": 1, "code": 921889, - "tempChar": "" + "tempChar": "" }, { "order": 8, @@ -762,7 +770,7 @@ "name": "icon-tabular-realtime", "id": 3, "code": 921890, - "tempChar": "" + "tempChar": "" }, { "order": 23, @@ -770,7 +778,7 @@ "name": "icon-tabular-scrolling", "id": 18, "code": 921891, - "tempChar": "" + "tempChar": "" }, { "order": 112, @@ -778,7 +786,7 @@ "name": "icon-telemetry", "id": 86, "code": 921892, - "tempChar": "" + "tempChar": "" }, { "order": 90, @@ -786,7 +794,7 @@ "name": "icon-telemetry-panel", "id": 85, "code": 921893, - "tempChar": "" + "tempChar": "" }, { "order": 93, @@ -794,7 +802,7 @@ "name": "icon-timeline", "id": 88, "code": 921894, - "tempChar": "" + "tempChar": "" }, { "order": 116, @@ -802,7 +810,7 @@ "name": "icon-timer-v1.5", "prevSize": 24, "code": 921895, - "tempChar": "" + "tempChar": "" }, { "order": 11, @@ -810,7 +818,7 @@ "name": "icon-topic", "id": 6, "code": 921896, - "tempChar": "" + "tempChar": "" }, { "order": 115, @@ -818,7 +826,7 @@ "name": "icon-box-with-dashed-lines", "id": 29, "code": 921897, - "tempChar": "" + "tempChar": "" } ], "metadata": { @@ -2363,6 +2371,51 @@ ] } }, + { + "id": 107, + "paths": [ + "M0 64h1024v128h-1024v-128z", + "M0 320h1024v128h-1024v-128z", + "M0 576h1024v128h-1024v-128z", + "M0 832h1024v128h-1024v-128z" + ], + "attrs": [ + { + "fill": "rgb(0, 161, 75)" + }, + { + "fill": "rgb(0, 161, 75)" + }, + { + "fill": "rgb(0, 161, 75)" + }, + { + "fill": "rgb(0, 161, 75)" + } + ], + "isMulticolor": false, + "isMulticolor2": false, + "grid": 16, + "tags": [ + "icon-list-view" + ], + "colorPermutations": { + "1161751207457516161751": [ + { + "f": 1 + }, + { + "f": 1 + }, + { + "f": 1 + }, + { + "f": 1 + } + ] + } + }, { "paths": [ "M576 64h-256l320 320h-290.256c-44.264-76.516-126.99-128-221.744-128h-128v512h128c94.754 0 177.48-51.484 221.744-128h290.256l-320 320h256l448-448-448-448z" @@ -3237,4 +3290,4 @@ "showGrid": true }, "uid": -1 -} +} \ No newline at end of file diff --git a/platform/commonUI/general/res/fonts/symbols/openmct-symbols-16px.eot b/platform/commonUI/general/res/fonts/symbols/openmct-symbols-16px.eot index ed27fdfafa9819e7afb9f1e5d51373cb402ef890..f68a67f6d4cc633852a8fb1cd2e7a001d801a158 100755 GIT binary patch delta 407 zcmaD-x~7a($C`m5WFo6Mi|5~!`4b&>Gqz0pBUA5DS+Jov>MhSyIlH1;}JzVPI|m8ph7R&A`vVAgm~g z0)f(hP%v`?6l}IrEEAE*U-{QFp5Nvx12@<(hO6nZIv`U)^yCYs=8RdJIn0b1H=CRD zG5Txp`|!8$uM$uYh!fZ%$RSuJxJ2-gkdTm_P>j$mp+CZE!plSqL=K3miB1s{5Zfd6 oMZ84(g@l1bfh3D$9MDikAkJbaVc-JUz`!*5qLuLG#TJfC0KDT|EdT%j delta 327 zcmZ2e_N0{ci4_9_&qP*pma8lbp%Wc;Gd4{8BUAs;T~e8WfhmH4!Kfx9H8F)}OIRoa zgUJ;J1_rYXpaAmoGiESqIs$o~ z419tNK+Fkbdjn|!AeIEOLxHpc5CdJo5WiW2SyFCuqhhg$Oeh1()p&lJuMFHQKpCLz zr#fE2=*a?R=8Tz}Jvcu4S*kerZ>&@Q1n t!fe8AA_5`{MA<}3L_dhl5xXKDB7Q + @@ -108,4 +109,4 @@ - + \ No newline at end of file diff --git a/platform/commonUI/general/res/fonts/symbols/openmct-symbols-16px.ttf b/platform/commonUI/general/res/fonts/symbols/openmct-symbols-16px.ttf index 783d69c302b34a6dc5182eb97d18c06f5e4dd0a6..cb3ec37b00858359a9652ac9ab6de55e539d23e2 100755 GIT binary patch delta 395 zcmeAvxl%GgxxR&gfl&sCP0|yK3m6y}1Q-~Y0)R9}dQN4UM`hVkAU}eE!DvrLYGMlS z+kZD17)(Wg@@5%80ro>IT0p)Jkgt-FTT(HDljSpz4>X5yMNWQlqWVASDh38~384J7 z+{B6khEj$yApZl9uaK9Rn`-_`Of8Lp!2)EdQbB%k2?H}wiowcc0!bFhIG~}7K%BLCop~G+0IQo=WdHyG delta 343 zcmcao(o-@)xxRscfl&sCP0|yK3m6y}1Q-~Y0)R9}dQN59M|VkOAU}eE!Kfx9H8F)} zOIRoagUJ=3yjccNfc+4QCIf>h50I~tky}zRg_GqokZ%AqZ%Iyma-!e?xeGw0AoW*r z6DtZBN*Kx*7|d4y`3iZ7xvA#A#MIJ&0w;i$C>7)vmoP8`r5G&VY}}F0sObn~dNS|{ zG5|3rknIhm1%Ox*$PNY43P23Bo*{m70F$KL=9LP?A~K;2ELY?CZN4&avjAm))}HEk z1*0chn3^+YZZ0r2X575ojEm7*hd+hCOMpSZPGE|_3&AkK7QsV;pM>OuY=m|R-4SLJ zZW9p@Ss=wC!@euJ75&{wd5>F)U7#M-3W&-`g1u~t1X|ki0@Md8PMs!(jiwhVSnC1W_IG|V{J*P4a zD7J)w!DtT%dsLP!%}7m5VPG�ID$qVcxg@Ze{=lfnqa&d=(I8Kg6Pyky}y$6a(sG zTmix}I9WdDcgdrXZPH-9$cVszBuPvP$pU=Xkqm?H2( zFifyT@Q~mqAvqx%p6h<*^8BX&hRMErz=fJA`A6G=O8@Mdmy IvWQ~>0AQ_DVgLXD diff --git a/platform/commonUI/general/res/sass/_glyphs.scss b/platform/commonUI/general/res/sass/_glyphs.scss index 24d2052f0a..b341f021af 100644 --- a/platform/commonUI/general/res/sass/_glyphs.scss +++ b/platform/commonUI/general/res/sass/_glyphs.scss @@ -85,6 +85,7 @@ $glyph-icon-x-in-circle: '\e1038'; $glyph-icon-brightness: '\e1039'; $glyph-icon-contrast: '\e1040'; $glyph-icon-expand: '\e1041'; +$glyph-icon-list-view: '\e1042'; $glyph-icon-activity: '\e1100'; $glyph-icon-activity-mode: '\e1101'; $glyph-icon-autoflow-tabular: '\e1102'; @@ -189,6 +190,7 @@ $glyph-icon-box-with-dashed-lines: '\e1129'; .icon-brightness { @include glyphBefore($glyph-icon-brightness); } .icon-contrast { @include glyphBefore($glyph-icon-contrast); } .icon-expand { @include glyphBefore($glyph-icon-expand); } +.icon-list-view { @include glyphBefore($glyph-icon-list-view); } .icon-activity { @include glyphBefore($glyph-icon-activity); } .icon-activity-mode { @include glyphBefore($glyph-icon-activity-mode); } .icon-autoflow-tabular { @include glyphBefore($glyph-icon-autoflow-tabular); } diff --git a/platform/commonUI/general/res/sass/items/_item.scss b/platform/commonUI/general/res/sass/items/_item.scss index 4dcbcbc1c3..7d19ed0ce4 100644 --- a/platform/commonUI/general/res/sass/items/_item.scss +++ b/platform/commonUI/general/res/sass/items/_item.scss @@ -132,5 +132,33 @@ } } } - +} + +table.list-view { + $s: 1.2em; + width: 100%; + th, td { + cursor: pointer; + } + tr:hover td { + background-color: $colorItemBg; + color: $colorItemFg; + } + td { + $p: $interiorMargin; + @include ellipsize; + color: $colorItemFg; + font-size: 1em; + line-height: $s; + max-width: 0; + padding-top: $p; + padding-bottom: $p; + } + .t-item-icon { + font-size: $s; + margin-right: $interiorMargin; + } + .t-title-label { + @include ellipsize; // Yep, need it here too as well as the + } } diff --git a/platform/features/listview/bundle.js b/platform/features/listview/bundle.js new file mode 100644 index 0000000000..f1082fb35b --- /dev/null +++ b/platform/features/listview/bundle.js @@ -0,0 +1,64 @@ +/***************************************************************************** + * Open MCT, Copyright (c) 2014-2017, United States Government + * as represented by the Administrator of the National Aeronautics and Space + * Administration. All rights reserved. + * + * Open MCT 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 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. + *****************************************************************************/ + + define([ + './src/controllers/ListViewController', + './src/directives/MCTGesture', + 'text!./res/templates/listview.html', + 'legacyRegistry' +], function ( + ListViewController, + MCTGesture, + listViewTemplate, + legacyRegistry +) { + legacyRegistry.register("platform/features/listview", { + "name": "List View Plugin", + "description": "Allows folder contents to be shown in list format", + "extensions": + { + "views": [ + { + "key": "list", + "type": "folder", + "name": "List", + "cssClass": "icon-list-view", + "template": listViewTemplate + } + ], + "controllers": [ + { + "key": "ListViewController", + "implementation": ListViewController, + "depends": ["$scope"] + } + ], + "directives": [ + { + "key": "mctGesture", + "implementation" : MCTGesture, + "depends": ["gestureService"] + } + ] + } + }); +}); diff --git a/platform/features/listview/res/templates/listview.html b/platform/features/listview/res/templates/listview.html new file mode 100644 index 0000000000..bde831dae6 --- /dev/null +++ b/platform/features/listview/res/templates/listview.html @@ -0,0 +1,88 @@ + +
+ + + + + + + + + + + + + + + + + + + + + + +
+ Name + + Type + + Created Date + + Update Date +
+
+ + + + {{child.title}} +
+ 		{{child.type}}{{child.persisted}}{{child.modified}}
+
diff --git a/platform/features/listview/src/controllers/ListViewController.js b/platform/features/listview/src/controllers/ListViewController.js new file mode 100644 index 0000000000..3dd99bb02f --- /dev/null +++ b/platform/features/listview/src/controllers/ListViewController.js @@ -0,0 +1,67 @@ +/***************************************************************************** + * Open MCT, Copyright (c) 2014-2017, United States Government + * as represented by the Administrator of the National Aeronautics and Space + * Administration. All rights reserved. + * + * Open MCT 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 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. + *****************************************************************************/ + +define(function () { + function ListViewController($scope) { + this.$scope = $scope; + $scope.orderByField = 'title'; + $scope.reverseSort = false; + + this.updateView(); + var unlisten = $scope.domainObject.getCapability('mutation') + .listen(this.updateView.bind(this)); + + $scope.$on('$destroy', function () { + unlisten(); + }); + + } + ListViewController.prototype.updateView = function () { + this.$scope.domainObject.useCapability('composition') + .then(function (children) { + var formattedChildren = this.formatChildren(children); + this.$scope.children = formattedChildren; + this.$scope.data = {children: formattedChildren}; + }.bind(this) + ); + }; + ListViewController.prototype.formatChildren = function (children) { + return children.map(function (child) { + return { + icon: child.getCapability('type').getCssClass(), + title: child.getModel().name, + type: child.getCapability('type').getName(), + persisted: new Date( + child.getModel().persisted + ).toUTCString(), + modified: new Date( + child.getModel().modified + ).toUTCString(), + asDomainObject: child, + location: child.getCapability('location'), + action: child.getCapability('action') + }; + }); + }; + + return ListViewController; +}); diff --git a/platform/features/listview/src/directives/MCTGesture.js b/platform/features/listview/src/directives/MCTGesture.js new file mode 100644 index 0000000000..cc97a279ef --- /dev/null +++ b/platform/features/listview/src/directives/MCTGesture.js @@ -0,0 +1,44 @@ +/***************************************************************************** + * Open MCT, Copyright (c) 2014-2017, United States Government + * as represented by the Administrator of the National Aeronautics and Space + * Administration. All rights reserved. + * + * Open MCT 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 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. + *****************************************************************************/ + + define(function () { + function MCTGesture(gestureService) { + return { + restrict : 'A', + scope: { + domainObject: '=mctObject' + }, + link : function ($scope, $element, attrs) { + var activeGestures = gestureService.attachGestures( + $element, + $scope.domainObject, + $scope.$eval(attrs.mctGesture) + ); + $scope.$on('$destroy', function () { + activeGestures.destroy(); + delete this.activeGestures; + }); + } + }; + } + return MCTGesture; +}); diff --git a/platform/features/listview/test/controllers/ListViewControllerSpec.js b/platform/features/listview/test/controllers/ListViewControllerSpec.js new file mode 100644 index 0000000000..a5d6e06a20 --- /dev/null +++ b/platform/features/listview/test/controllers/ListViewControllerSpec.js @@ -0,0 +1,138 @@ +/***************************************************************************** + * Open MCT, Copyright (c) 2014-2017, United States Government + * as represented by the Administrator of the National Aeronautics and Space + * Administration. All rights reserved. + * + * Open MCT 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 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. +*****************************************************************************/ + +define( + ["../../src/controllers/ListViewController"], + function (ListViewController) { + describe("The Controller for the ListView", function () { + var scope, + unlistenFunc, + domainObject, + childObject, + controller, + childModel, + typeCapability, + mutationCapability; + beforeEach(function () { + unlistenFunc = jasmine.createSpy("unlisten"); + + mutationCapability = jasmine.createSpyObj( + "mutationCapability", + ["listen"] + ); + mutationCapability.listen.andReturn(unlistenFunc); + + typeCapability = jasmine.createSpyObj( + "typeCapability", + ["getCssClass", "getName"] + ); + typeCapability.getCssClass.andReturn("icon-folder"); + typeCapability.getName.andReturn("Folder"); + + + childModel = jasmine.createSpyObj( + "childModel", + ["persisted", "modified", "name"] + ); + childModel.persisted = 1496867697303; + childModel.modified = 1496867697303; + childModel.name = "Battery Charge Status"; + + childObject = jasmine.createSpyObj( + "childObject", + ["getModel", "getCapability"] + ); + childObject.getModel.andReturn( + childModel + ); + // childObject.getCapability.andReturn( + // typeCapability + // ); + childObject.getCapability.andCallFake(function (arg) { + if (arg === 'location') { + return ''; + } else if (arg === 'type') { + return typeCapability; + } + }); + childObject.location = ''; + + domainObject = jasmine.createSpyObj( + "domainObject", + ["getCapability", "useCapability"] + ); + domainObject.useCapability.andReturn( + Promise.resolve([childObject]) + ); + domainObject.getCapability.andReturn( + mutationCapability + ); + + + scope = jasmine.createSpyObj( + "$scope", + ["$on"] + ); + scope.domainObject = domainObject; + + controller = new ListViewController(scope); + + waitsFor(function () { + return scope.children; + }); + }); + it("updates the view", function () { + expect(scope.children[0]).toEqual( + { + icon: "icon-folder", + title: "Battery Charge Status", + type: "Folder", + persisted: "Wed, 07 Jun 2017 20:34:57 GMT", + modified: "Wed, 07 Jun 2017 20:34:57 GMT", + asDomainObject: childObject, + location: '' + } + ); + }); + it("updates the scope when mutation occurs", function () { + domainObject.useCapability.andReturn( + Promise.resolve([]) + ); + expect(mutationCapability.listen).toHaveBeenCalledWith(jasmine.any(Function)); + mutationCapability.listen.mostRecentCall.args[0](); + waitsFor(function () { + return scope.children.length !== 1; + }); + runs(function () { + expect(scope.children.length).toEqual(0); + }); + }); + it("releases listeners on $destroy", function () { + expect(scope.$on).toHaveBeenCalledWith('$destroy', jasmine.any(Function)); + scope.$on.mostRecentCall.args[1](); + expect(unlistenFunc).toHaveBeenCalled(); + }); + + + }); + } +); diff --git a/platform/features/listview/test/directives/MCTGestureSpec.js b/platform/features/listview/test/directives/MCTGestureSpec.js new file mode 100644 index 0000000000..09a9da2cc4 --- /dev/null +++ b/platform/features/listview/test/directives/MCTGestureSpec.js @@ -0,0 +1,86 @@ +/***************************************************************************** + * Open MCT, Copyright (c) 2014-2017, United States Government + * as represented by the Administrator of the National Aeronautics and Space + * Administration. All rights reserved. + * + * Open MCT 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 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. + *****************************************************************************/ + +define( + ["../../src/directives/MCTGesture"], + function (MCTGesture) { + describe("The Gesture Listener for the ListView items", function () { + var mctGesture, + gestureService, + scope, + element, + attrs, + attachedGesture; + beforeEach(function () { + attachedGesture = jasmine.createSpyObj( + "attachedGesture", + ['destroy'] + ); + gestureService = jasmine.createSpyObj( + "gestureService", + ["attachGestures"] + ); + gestureService.attachGestures.andReturn( + attachedGesture + ); + mctGesture = MCTGesture(gestureService); + }); + it("creates a directive Object", function () { + expect(mctGesture).toBeDefined(); + }); + it("has link function that attaches gesture to gestureService", + function () { + attrs = { + mctGesture: "menu,info" + }; + element = jasmine.createSpy("element"); + scope = jasmine.createSpyObj( + "$scope", + ["$on", "$eval"] + ); + scope.domainObject = "fake domainObject"; + mctGesture.link(scope, element, attrs); + expect(gestureService.attachGestures).toHaveBeenCalled(); + } + ); + it("release gesture service on $destroy", function () { + attrs = { + mctGesture: "menu,info" + }; + element = jasmine.createSpy("element"); + scope = jasmine.createSpyObj( + "$scope", + ["$on", "$eval"] + ); + scope.domainObject = "fake domainObject"; + mctGesture.link(scope, element, attrs); + expect(scope.$on).toHaveBeenCalledWith( + '$destroy', + jasmine.any(Function) + ); + scope.$on.mostRecentCall.args[1](); + expect(attachedGesture.destroy).toHaveBeenCalled(); + }); + + }); + } +); diff --git a/src/defaultRegistry.js b/src/defaultRegistry.js index c2808fad0d..226cea420c 100644 --- a/src/defaultRegistry.js +++ b/src/defaultRegistry.js @@ -69,6 +69,7 @@ define([ '../platform/features/conductor/compatibility/bundle', '../platform/features/imagery/bundle', '../platform/features/layout/bundle', + '../platform/features/listview/bundle', '../platform/features/my-items/bundle', '../platform/features/pages/bundle', '../platform/features/plot/bundle', @@ -115,6 +116,7 @@ define([ 'platform/features/fixed', 'platform/features/imagery', 'platform/features/layout', + 'platform/features/listview', 'platform/features/pages', 'platform/features/plot', 'platform/features/timeline',