mirror of
https://github.com/nasa/openmct.git
synced 2025-01-18 02:39:56 +00:00
Webpage plugin vue (#2440)
* Move table cell selection to table cell component * move webpage from angular to vue * make review requested changes * fix npm install error * change cache version * change cache version * rename view provider * rename file to WebPageViewProvider * change webpage vue file * change webpage vue file
This commit is contained in:
parent
c51fd21847
commit
14ce5e159b
@ -1,26 +0,0 @@
|
||||
<!--
|
||||
Open MCT, Copyright (c) 2014-2018, 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.
|
||||
-->
|
||||
<div class="l-iframe abs">
|
||||
<iframe ng-controller="EmbeddedPageController as ctl"
|
||||
ng-src="{{ctl.trust(model.url)}}">
|
||||
</iframe>
|
||||
</div>
|
@ -1,56 +0,0 @@
|
||||
/*****************************************************************************
|
||||
* Open MCT, Copyright (c) 2014-2018, 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/EmbeddedPageController"],
|
||||
function (EmbeddedPageController) {
|
||||
|
||||
describe("The controller for embedded pages", function () {
|
||||
var mockSCE,
|
||||
controller;
|
||||
|
||||
beforeEach(function () {
|
||||
mockSCE = jasmine.createSpyObj(
|
||||
'$sce',
|
||||
["trustAsResourceUrl"]
|
||||
);
|
||||
|
||||
mockSCE.trustAsResourceUrl.and.callFake(function (v) {
|
||||
return v;
|
||||
});
|
||||
|
||||
controller = new EmbeddedPageController(mockSCE);
|
||||
});
|
||||
|
||||
it("allows URLs to be marked as trusted", function () {
|
||||
var testURL = "http://www.nasa.gov";
|
||||
|
||||
expect(controller.trust(testURL))
|
||||
.toEqual(testURL);
|
||||
|
||||
expect(mockSCE.trustAsResourceUrl)
|
||||
.toHaveBeenCalledWith(testURL);
|
||||
});
|
||||
|
||||
});
|
||||
}
|
||||
);
|
@ -263,6 +263,8 @@ define([
|
||||
this.install(this.plugins.Tabs());
|
||||
this.install(this.plugins.FlexibleLayout());
|
||||
this.install(this.plugins.GoToOriginalAction());
|
||||
this.install(this.plugins.ImportExport());
|
||||
this.install(this.plugins.WebPage());
|
||||
}
|
||||
|
||||
MCT.prototype = Object.create(EventEmitter.prototype);
|
||||
|
@ -39,7 +39,6 @@ const DEFAULTS = [
|
||||
'platform/telemetry',
|
||||
'platform/features/clock',
|
||||
'platform/features/imagery',
|
||||
'platform/features/pages',
|
||||
'platform/features/hyperlink',
|
||||
'platform/features/timeline',
|
||||
'platform/forms',
|
||||
@ -55,7 +54,6 @@ const DEFAULTS = [
|
||||
|
||||
define([
|
||||
'../src/adapter/bundle',
|
||||
|
||||
'../example/eventGenerator/bundle',
|
||||
'../example/export/bundle',
|
||||
'../example/forms/bundle',
|
||||
@ -68,7 +66,6 @@ define([
|
||||
'../example/profiling/bundle',
|
||||
'../example/scratchpad/bundle',
|
||||
'../example/styleguide/bundle',
|
||||
|
||||
'../platform/commonUI/about/bundle',
|
||||
'../platform/commonUI/browse/bundle',
|
||||
'../platform/commonUI/dialog/bundle',
|
||||
@ -87,7 +84,6 @@ define([
|
||||
'../platform/features/clock/bundle',
|
||||
'../platform/features/imagery/bundle',
|
||||
'../platform/features/my-items/bundle',
|
||||
'../platform/features/pages/bundle',
|
||||
'../platform/features/hyperlink/bundle',
|
||||
'../platform/features/static-markup/bundle',
|
||||
'../platform/features/timeline/bundle',
|
||||
@ -123,5 +119,5 @@ define([
|
||||
bundleRegistry.enable(bundlePath);
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
});
|
||||
|
@ -44,7 +44,8 @@ define([
|
||||
'./filters/plugin',
|
||||
'./objectMigration/plugin',
|
||||
'./goToOriginalAction/plugin',
|
||||
'./clearData/plugin'
|
||||
'./clearData/plugin',
|
||||
'./webPage/plugin'
|
||||
], function (
|
||||
_,
|
||||
UTCTimeSystem,
|
||||
@ -69,7 +70,8 @@ define([
|
||||
Filters,
|
||||
ObjectMigration,
|
||||
GoToOriginalAction,
|
||||
ClearData
|
||||
ClearData,
|
||||
WebPagePlugin
|
||||
) {
|
||||
var bundleMap = {
|
||||
LocalStorage: 'platform/persistence/local',
|
||||
@ -170,6 +172,7 @@ define([
|
||||
plugins.ObjectMigration = ObjectMigration.default;
|
||||
plugins.GoToOriginalAction = GoToOriginalAction.default;
|
||||
plugins.ClearData = ClearData;
|
||||
plugins.WebPage = WebPagePlugin.default;
|
||||
|
||||
return plugins;
|
||||
});
|
||||
|
61
src/plugins/webPage/WebPageViewProvider.js
Normal file
61
src/plugins/webPage/WebPageViewProvider.js
Normal file
@ -0,0 +1,61 @@
|
||||
/*****************************************************************************
|
||||
* Open MCT, Copyright (c) 2014-2019, 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.
|
||||
*****************************************************************************/
|
||||
|
||||
import WebPageComponent from './components/WebPage.vue';
|
||||
import Vue from 'vue';
|
||||
|
||||
export default function WebPage(openmct) {
|
||||
return {
|
||||
key: 'webPage',
|
||||
name: 'Web Page',
|
||||
cssClass: 'icon-page',
|
||||
canView: function (domainObject) {
|
||||
return domainObject.type === 'webPage';
|
||||
},
|
||||
view: function (domainObject) {
|
||||
let component;
|
||||
|
||||
return {
|
||||
show: function (element) {
|
||||
component = new Vue({
|
||||
components: {
|
||||
WebPageComponent: WebPageComponent
|
||||
},
|
||||
provide: {
|
||||
openmct,
|
||||
domainObject
|
||||
},
|
||||
el: element,
|
||||
template: '<web-page-component></web-page-component>'
|
||||
});
|
||||
},
|
||||
destroy: function (element) {
|
||||
component.$destroy();
|
||||
component = undefined;
|
||||
}
|
||||
};
|
||||
},
|
||||
priority: function () {
|
||||
return 1;
|
||||
}
|
||||
};
|
||||
}
|
16
src/plugins/webPage/components/WebPage.vue
Normal file
16
src/plugins/webPage/components/WebPage.vue
Normal file
@ -0,0 +1,16 @@
|
||||
<template>
|
||||
<div class="l-iframe abs">
|
||||
<iframe :src="currentDomainObject.url"></iframe>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
inject: ['openmct', 'domainObject'],
|
||||
data: function () {
|
||||
return {
|
||||
currentDomainObject: this.domainObject
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
@ -20,36 +20,26 @@
|
||||
* at runtime from the About dialog for additional information.
|
||||
*****************************************************************************/
|
||||
|
||||
/**
|
||||
* This bundle adds the Web Page object type, which can be used to embed
|
||||
* other web pages with layouts.
|
||||
* @namespace platform/features/pages
|
||||
*/
|
||||
define(
|
||||
[],
|
||||
function () {
|
||||
import WebPageViewProvider from './WebPageViewProvider.js';
|
||||
|
||||
/**
|
||||
* Controller for embedded web pages; serves simply as a
|
||||
* wrapper for `$sce` to mark pages as trusted.
|
||||
* @constructor
|
||||
* @memberof platform/features/pages
|
||||
*/
|
||||
function EmbeddedPageController($sce) {
|
||||
this.$sce = $sce;
|
||||
}
|
||||
export default function plugin() {
|
||||
return function install(openmct) {
|
||||
openmct.objectViews.addProvider(new WebPageViewProvider(openmct));
|
||||
|
||||
/**
|
||||
* Alias of `$sce.trustAsResourceUrl`.
|
||||
* @param {string} url the URL to trust
|
||||
* @returns {string} the trusted URL
|
||||
*/
|
||||
EmbeddedPageController.prototype.trust = function (url) {
|
||||
return this.$sce.trustAsResourceUrl(url);
|
||||
};
|
||||
|
||||
|
||||
return EmbeddedPageController;
|
||||
}
|
||||
|
||||
);
|
||||
openmct.types.addType('webPage', {
|
||||
name: "Web Page",
|
||||
description: "Embed a web page or web-based image in a resizeable window component. Note that the URL being embedded must allow iframing.",
|
||||
creatable: true,
|
||||
cssClass: 'icon-page',
|
||||
form: [
|
||||
{
|
||||
"key": "url",
|
||||
"name": "URL",
|
||||
"control": "textfield",
|
||||
"required": true,
|
||||
"cssClass": "l-input-lg"
|
||||
}
|
||||
]
|
||||
});
|
||||
};
|
||||
}
|
Loading…
Reference in New Issue
Block a user