added override image name in example.imagery plugin sample images.

API.md

@@ -430,6 +430,7 @@ Known hints:
 * `domain`: Values with a `domain` hint will be used for the x-axis of a plot, and tables will render columns for these values first.
 * `range`: Values with a `range` hint will be used as the y-axis on a plot, and tables will render columns for these values after the `domain` values.
 * `image`: Indicates that the value may be interpreted as the URL to an image file, in which case appropriate views will be made available.
+* `imageDownloadName`: Indicates that the value may be interpreted as the name of the image file.
 
 ##### The Time Conductor and Telemetry 
 

example/imagery/plugin.js

@@ -50,11 +50,16 @@ define([
         const IMAGE_DELAY = 20000;
 
         function pointForTimestamp(timestamp, name) {
+            const url = IMAGE_SAMPLES[Math.floor(timestamp / IMAGE_DELAY) % IMAGE_SAMPLES.length];
+            const urlItems = url.split('/');
+            const imageDownloadName = `example.imagery.${urlItems[urlItems.length - 1]}`;
+
             return {
-                name: name,
+                name,
                 utc: Math.floor(timestamp / IMAGE_DELAY) * IMAGE_DELAY,
                 local: Math.floor(timestamp / IMAGE_DELAY) * IMAGE_DELAY,
-                url: IMAGE_SAMPLES[Math.floor(timestamp / IMAGE_DELAY) % IMAGE_SAMPLES.length]
+                url,
+                imageDownloadName
             };
         }
 
@@ -139,6 +144,14 @@ define([
                                 hints: {
                                     image: 1
                                 }
+                            },
+                            {
+                                name: 'Image Download Name',
+                                key: 'imageDownloadName',
+                                format: 'imageDownloadName',
+                                hints: {
+                                    imageDownloadName: 1
+                                }
                             }
                         ]
                     };

package.json

@@ -1,6 +1,6 @@
 {
   "name": "openmct",
-  "version": "1.4.1-SNAPSHOT",
+  "version": "1.4.0",
   "description": "The Open MCT core platform",
   "dependencies": {},
   "devDependencies": {

platform/commonUI/edit/src/creation/CreateAction.js

@@ -86,7 +86,7 @@ define(
                         })
                         .join('/');
 
-                openmct.router.setHash(url);
+                window.location.href = url;
 
                 if (isFirstViewEditable(object.useCapability('adapter'))) {
                     openmct.editor.edit();

src/plugins/URLTimeSettingsSynchronizer/URLTimeSettingsSynchronizer.js

@@ -51,7 +51,7 @@ export default class URLTimeSettingsSynchronizer {
     initialize() {
         this.updateTimeSettings();
 
-        this.openmct.router.on('change:hash', this.updateTimeSettings);
+        window.addEventListener('hashchange', this.updateTimeSettings);
         TIME_EVENTS.forEach(event => {
             this.openmct.time.on(event, this.setUrlFromTimeApi);
         });
@@ -59,7 +59,7 @@ export default class URLTimeSettingsSynchronizer {
     }
 
     destroy() {
-        this.openmct.router.off('change:hash', this.updateTimeSettings);
+        window.removeEventListener('hashchange', this.updateTimeSettings);
         this.openmct.off('start', this.initialize);
         this.openmct.off('destroy', this.destroy);
 
@@ -69,8 +69,7 @@ export default class URLTimeSettingsSynchronizer {
         this.openmct.time.off('bounds', this.updateBounds);
     }
 
-    updateTimeSettings(hash) {
-        // console.log('updateTimeSettings', hash);
+    updateTimeSettings() {
         // Prevent from triggering self
         if (!this.isUrlUpdateInProgress) {
             let timeParameters = this.parseParametersFromUrl();
@@ -178,7 +177,7 @@ export default class URLTimeSettingsSynchronizer {
 
         searchParams.set(SEARCH_TIME_SYSTEM, this.openmct.time.timeSystem().key);
         this.isUrlUpdateInProgress = true;
-        setAllSearchParams(this.openmct, searchParams);
+        setAllSearchParams(searchParams);
     }
 
     areTimeParametersValid(timeParameters) {

src/plugins/goToOriginalAction/goToOriginalAction.js

@@ -39,7 +39,7 @@ export default class GoToOriginalAction {
                     .slice(1)
                     .join('/');
 
-                this._openmct.router.setHash(url);
+                window.location.href = url;
             });
     }
     appliesTo(objectPath) {

src/plugins/imagery/components/ImageryViewLayout.vue

@@ -87,9 +87,14 @@
              :class="{ selected: focusedImageIndex === index && isPaused }"
              @click="setFocusedImage(index, thumbnailClick)"
         >
-            <img class="c-thumb__image"
-                 :src="formatImageUrl(datum)"
+            <a :href="datum.url"
+               :download="datum.imageDownloadName"
+               @click.prevent
             >
+                <img class="c-thumb__image"
+                     :src="datum.url"
+                >
+            </a>
             <div class="c-thumb__timestamp">{{ formatTime(datum) }}</div>
         </div>
     </div>
@@ -156,6 +161,9 @@ export default {
         canTrackDuration() {
             return this.openmct.time.clock() && this.timeSystem.isUTCBased;
         },
+        focusedImageDownloadName() {
+            return this.getImageDownloadName(this.focusedImage);
+        },
         isNextDisabled() {
             let disabled = false;
 
@@ -214,6 +222,7 @@ export default {
         this.metadata = this.openmct.telemetry.getMetadata(this.domainObject);
         this.durationFormatter = this.getFormatter(this.timeSystem.durationFormat || DEFAULT_DURATION_FORMATTER);
         this.imageFormatter = this.openmct.telemetry.getValueFormatter(this.metadata.valuesForHints(['image'])[0]);
+        this.imageDownloadNameHints = { ...this.metadata.valuesForHints(['imageDownloadName'])[0]};
 
         // initialize
         this.timeKey = this.timeSystem.key;
@@ -275,6 +284,15 @@ export default {
             // Replace ISO "T" with a space to allow wrapping
             return dateTimeStr.replace("T", " ");
         },
+        getImageDownloadName(datum) {
+            let imageDownloadName = '';
+            if (datum) {
+                const key = this.imageDownloadNameHints.key;
+                imageDownloadName = datum[key];
+            }
+
+            return imageDownloadName;
+        },
         parseTime(datum) {
             if (!datum) {
                 return;
@@ -393,6 +411,7 @@ export default {
                 return;
             }
 
+            datum.imageDownloadName = this.getImageDownloadName(datum);
             this.imageHistory.push(datum);
 
             if (setFocused) {

src/plugins/notebook/components/Notebook.vue

@@ -125,11 +125,10 @@ export default {
         Sidebar
     },
     data() {
-        const configuration = this.domainObject.configuration || {};
         return {
             defaultPageId: getDefaultNotebook() ? getDefaultNotebook().page.id : '',
             defaultSectionId: getDefaultNotebook() ? getDefaultNotebook().section.id : '',
-            defaultSort: configuration.defaultSort,
+            defaultSort: this.domainObject.configuration.defaultSort,
             focusEntryId: null,
             internalDomainObject: this.domainObject,
             search: '',

src/plugins/notebook/components/NotebookEmbed.vue

@@ -144,7 +144,7 @@ export default {
             }
 
             const url = new URL(link);
-            this.openmct.router.setHash(url.hash);
+            window.location.href = url.hash;
         },
         formatTime(unixTime, timeFormat) {
             return Moment.utc(unixTime).format(timeFormat);

src/plugins/remove/RemoveAction.js

@@ -76,7 +76,7 @@ export default class RemoveAction {
             .map(object => this.openmct.objects.makeKeyString(object.identifier))
             .join("/");
 
-        this.openmct.router.setHash(`#/browse/${urlPath}`);
+        window.location.href = '#/browse/' + urlPath;
     }
 
     removeFromComposition(parent, child) {

src/plugins/tabs/components/tabs.vue

@@ -264,12 +264,12 @@ export default {
             let currentTabIndexInURL = getSearchParam(this.searchTabKey);
 
             if (index !== currentTabIndexInURL) {
-                setSearchParam(this.openmct, this.searchTabKey, index);
+                setSearchParam(this.searchTabKey, index);
                 this.currentTabIndex = index;
             }
         },
         clearCurrentTabIndexFromURL() {
-            deleteSearchParam(this.openmct, this.searchTabKey);
+            deleteSearchParam(this.searchTabKey);
         }
     }
 };

src/ui/components/ObjectLabel.vue

@@ -6,6 +6,7 @@
         'is-missing': observedObject.status === 'missing'
     }"
     draggable="true"
+    :href="objectLink"
     @dragstart="dragStart"
     @click="navigateOrPreview"
 >
@@ -84,11 +85,7 @@ export default {
             if (this.openmct.editor.isEditing()) {
                 event.preventDefault();
                 this.preview();
-
-                return;
             }
-
-            this.openmct.router.setPath(this.objectLink);
         },
         preview() {
             if (this.previewAction.appliesTo(this.objectPath)) {

src/ui/layout/BrowseBar.vue

@@ -304,7 +304,7 @@ export default {
             this.openmct.contextMenu._showContextMenuForObjectPath(this.openmct.router.path, event.clientX, event.clientY);
         },
         goToParent() {
-            this.openmct.router.setHash(this.parentUrl);
+            window.location.hash = this.parentUrl;
         },
         toggleLock(flag) {
             this.openmct.objects.mutate(this.domainObject, 'locked', flag);

src/ui/router/ApplicationRouter.js

@@ -21,8 +21,8 @@
  *****************************************************************************/
 /*global module*/
 
+const LocationBar = require('location-bar');
 const EventEmitter = require('EventEmitter');
-const lodash = require('lodash');
 
 function paramsToObject(searchParams) {
     let params = {};
@@ -61,9 +61,7 @@ class ApplicationRouter extends EventEmitter {
         super();
         this.routes = [];
         this.started = false;
-
-        this.hashChanged = this.hashChanged.bind(this);
-        // this.setHash = lodash.debounce(this.setHash, 500);
+        this.locationBar = new LocationBar();
     }
 
     /**
@@ -76,31 +74,14 @@ class ApplicationRouter extends EventEmitter {
 
         this.started = true;
 
-        this.hashChanged();
-
-        window.addEventListener('hashchange', this.hashChanged);
-    }
-
-    getPathString() {
-        const hash = window.location.hash;
-        return hash.substring(1);
+        this.locationBar.onChange(p => this.handleLocationChange(p));
+        this.locationBar.start({
+            root: location.pathname
+        });
     }
 
     destroy() {
-        window.removeEventListener(this.hashChanged);
-    }
-
-    hashChanged () {
-        const pathString = this.getPathString();
-        this.handleLocationChange(this.getPathString());
-        // const hasTimeSystem = pathString.includes('timeSystem=');
-        // if (hasTimeSystem) {
-            // console.log(location.hash);
-            // const currentState = history.state || {};
-            // history.pushState(currentState, 'hashchange', location.hash);
-        // }
-
-        // console.log('hashchanged', new Date().toISOString(), location.hash);
+        this.locationBar.stop();
     }
 
     handleLocationChange(pathString) {
@@ -205,25 +186,7 @@ class ApplicationRouter extends EventEmitter {
     }
 
     set(path, queryString) {
-        const hash = `${path}?${queryString}`;
-
-        this.setHash(hash);
-    }
-
-    setHash(hash) {
-        if (hash === location.hash) {
-            return;
-        }
-
-        console.log('setHash', new Date().toISOString(), hash);
-
-        if (hash.includes('timeSystem=')) {
-            location.hash = hash;
-        } else {
-            this.handleLocationChange(hash);
-        }
-
-        this.emit('change:hash', hash);
+        location.hash = `${path}?${queryString}`;
     }
 
     setQueryString(queryString) {

src/ui/router/Browse.js

@@ -15,7 +15,6 @@ define([
 
         openmct.router.route(/^\/browse\/(.*)$/, (path, results, params) => {
             isRoutingInProgress = true;
-
             let navigatePath = results[1];
             navigateToPath(navigatePath, params.view);
             onParamsChanged(null, null, params);

src/utils/openmctLocation.js

@@ -29,25 +29,25 @@ import objectUtils from '../api/objects/object-utils.js';
  * hash section of the URL.
  */
 
-export function setSearchParam(openmct, paramName, paramValue) {
+export function setSearchParam(paramName, paramValue) {
     let url = getHashRelativeURL();
 
     url.searchParams.set(paramName, paramValue);
-    setLocationFromUrl(openmct, url);
+    setLocationFromUrl(url);
 }
 
-export function deleteSearchParam(openmct, paramName) {
+export function deleteSearchParam(paramName) {
     let url = getHashRelativeURL();
 
     url.searchParams.delete(paramName);
-    setLocationFromUrl(openmct, url);
+    setLocationFromUrl(url);
 }
 
 /**
  * Will replace all current search parameters with the ones defined in urlSearchParams
  * @param {URLSearchParams} paramMap
  */
-export function setAllSearchParams(openmct, newSearchParams) {
+export function setAllSearchParams(newSearchParams) {
     let url = getHashRelativeURL();
 
     Array.from(url.searchParams.keys()).forEach((key) => url.searchParams.delete(key));
@@ -56,7 +56,7 @@ export function setAllSearchParams(openmct, newSearchParams) {
         url.searchParams.set(key, newSearchParams.get(key));
     });
 
-    setLocationFromUrl(openmct, url);
+    setLocationFromUrl(url);
 }
 
 export function getSearchParam(paramName) {
@@ -75,7 +75,7 @@ export function getObjectPath() {
     return getHashRelativeURL().pathname;
 }
 
-export function setObjectPath(openmct, objectPath) {
+export function setObjectPath(objectPath) {
     let objectPathString;
     let url = getHashRelativeURL();
 
@@ -92,16 +92,15 @@ export function setObjectPath(openmct, objectPath) {
     }
 
     url.pathname = objectPathString;
-    setLocationFromUrl(openmct, url);
+    setLocationFromUrl(url);
 }
 
 function isDomainObject(potentialObject) {
     return potentialObject.identifier === undefined;
 }
 
-function setLocationFromUrl(openmct, url) {
-    console.log('setLocationFromUrl');
-    openmct.router.setHash(`${url.pathname}${url.search}`);
+function setLocationFromUrl(url) {
+    window.location.hash = `${url.pathname}${url.search}`;
 }
 
 function getHashRelativeURL() {