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:
Deep Tailor 2019-12-02 18:55:08 -08:00 committed by Pegah Sarram
parent c51fd21847
commit 14ce5e159b
8 changed files with 106 additions and 120 deletions

View File

@ -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>

View File

@ -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);
});
});
}
);

View File

@ -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);

View File

@ -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);
});
}
}
};
});

View File

@ -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;
});

View 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;
}
};
}

View 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>

View File

@ -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"
}
]
});
};
}