Initial import of Angular5 components services and modules
Change-Id: I3953f1fbf7d5697a1c6d432808dd17d816ec285a
diff --git a/web/gui2/src/main/webapp/app/view/apps/apps.component.css b/web/gui2/src/main/webapp/app/view/apps/apps.component.css
new file mode 100644
index 0000000..a1963c0
--- /dev/null
+++ b/web/gui2/src/main/webapp/app/view/apps/apps.component.css
@@ -0,0 +1,154 @@
+/*
+ * Copyright 2015-present Open Networking Foundation
+ *
+ * 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.
+ */
+
+/*
+ ONOS GUI -- Applications View (layout) -- CSS file
+ */
+
+#ov-app h2 {
+ display: inline-block;
+}
+
+#ov-app div.ctrl-btns {
+ width: 290px;
+}
+
+/* -- Drag-n-Drop oar file upload -- */
+#ov-app form#inputFileForm,
+#ov-app input#uploadFile {
+ display: none;
+}
+
+.dropping {
+
+}
+
+/* -- Confirmation Dialog -- */
+#app-dialog {
+ top: 140px;
+ padding: 12px;
+}
+
+#app-dialog p {
+ font-size: 12pt;
+}
+
+#app-dialog p.strong {
+ font-weight: bold;
+ padding: 8px;
+ text-align: center;
+}
+
+/* -- Details Panel -- */
+#application-details-panel.floatpanel {
+ z-index: 0;
+}
+
+#application-details-panel.floatpanel a {
+ font-weight: bold;
+}
+
+#application-details-panel .container {
+ padding: 0 30px;
+ overflow-y: scroll;
+}
+
+#application-details-panel .close-btn {
+ position: absolute;
+ right: 26px;
+ top: 26px;
+ cursor: pointer;
+}
+
+#application-details-panel .app-icon {
+ display: inline-block;
+ padding: 0 6px 0 0;
+ vertical-align: middle;
+}
+
+#application-details-panel h2 {
+ display: inline-block;
+ margin: 12px 0 6px 0;
+ font-size: 11pt;
+ font-variant: small-caps;
+ text-transform: uppercase;
+}
+
+#application-details-panel .top .app-title {
+ width: 90%;
+ height: 62px;
+ font-size: 16pt;
+ font-weight: lighter;
+ overflow: hidden;
+ white-space: nowrap;
+ padding: 0 12px 0 2px;
+ margin-top: 19px;
+ margin-bottom: 5px;
+}
+
+#application-details-panel .top div.left {
+ float: left;
+ padding: 12px 12px 0 3px;
+}
+
+#application-details-panel .top div.right {
+ display: inline-block;
+ overflow: hidden;
+ width: 320px;
+}
+
+#application-details-panel td.label,
+#application-details-panel .app-url i {
+ font-weight: bold;
+ text-align: right;
+ font-size: 10pt;
+ padding-right: 6px;
+}
+
+#application-details-panel td.value-bold {
+ font-weight: bold;
+}
+
+#application-details-panel .app-url {
+ padding: 10px 6px 6px;
+ overflow: hidden;
+ clear: left;
+}
+
+#application-details-panel hr {
+ width: 100%;
+ margin: 12px auto;
+}
+
+#application-details-panel .middle {
+ padding: 7px 0 7px 6px;
+}
+
+#application-details-panel .bottom {
+ padding: 0px;
+}
+
+#application-details-panel .bottom table {
+ border-spacing: 0;
+ width: 100%;
+}
+
+#application-details-panel .bottom td {
+ margin-left: -6px;
+ padding: 6px 6px;
+ text-align: left;
+}
+
diff --git a/web/gui2/src/main/webapp/app/view/apps/apps.component.html b/web/gui2/src/main/webapp/app/view/apps/apps.component.html
new file mode 100644
index 0000000..90f9a16
--- /dev/null
+++ b/web/gui2/src/main/webapp/app/view/apps/apps.component.html
@@ -0,0 +1,3 @@
+<div id="ov-app">
+ <p>apps works!</p>
+</div>
\ No newline at end of file
diff --git a/web/gui2/src/main/webapp/app/view/apps/apps.component.ts b/web/gui2/src/main/webapp/app/view/apps/apps.component.ts
new file mode 100644
index 0000000..5eaa38f
--- /dev/null
+++ b/web/gui2/src/main/webapp/app/view/apps/apps.component.ts
@@ -0,0 +1,58 @@
+/*
+ * Copyright 2015-present Open Networking Foundation
+ *
+ * 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.
+ */
+import { Component, OnInit } from '@angular/core';
+import { DialogService } from '../../fw/layer/dialog.service';
+import { FnService } from '../../fw/util/fn.service';
+import { IconService } from '../../fw/svg/icon.service';
+import { KeyService } from '../../fw/util/key.service';
+import { LionService } from '../../fw/util/lion.service';
+import { LogService } from '../../log.service';
+import { PanelService } from '../../fw/layer/panel.service';
+import { TableBuilderService } from '../../fw/widget/tablebuilder.service';
+import { UrlFnService } from '../../fw/remote/urlfn.service';
+import { WebSocketService } from '../../fw/remote/websocket.service';
+
+/**
+ * ONOS GUI -- Apps View Component
+ */
+@Component({
+ selector: 'onos-apps',
+ templateUrl: './apps.component.html',
+ styleUrls: ['./apps.component.css']
+})
+export class AppsComponent implements OnInit {
+
+ constructor(
+ private fs: FnService,
+ private ds: DialogService,
+ private is: IconService,
+ private ks: KeyService,
+ private ls: LionService,
+ private log: LogService,
+ private ps: PanelService,
+ private tbs: TableBuilderService,
+ private ufs: UrlFnService,
+ private wss: WebSocketService,
+ private window: Window
+ ) {
+ this.log.debug('AppsComponent constructed');
+ }
+
+ ngOnInit() {
+ this.log.debug('AppsComponent initialized');
+ }
+
+}
diff --git a/web/gui2/src/main/webapp/app/view/apps/apps.module.ts b/web/gui2/src/main/webapp/app/view/apps/apps.module.ts
new file mode 100644
index 0000000..3083b55
--- /dev/null
+++ b/web/gui2/src/main/webapp/app/view/apps/apps.module.ts
@@ -0,0 +1,40 @@
+/*
+ * Copyright 2015-present Open Networking Foundation
+ *
+ * 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.
+ */
+import { NgModule } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { AppsComponent } from './apps.component';
+import { TriggerFormDirective } from './triggerform.directive';
+
+/**
+ * ONOS GUI -- Apps View Module
+ *
+ * Note: This has been updated from onos-gui-1.0.0 where it was called 'app'
+ * whereas here it is now called 'apps'. This is to avoid any confusion with
+ * the 'app' folder which is the root of the complete framework
+ */
+@NgModule({
+ exports: [
+ AppsComponent
+ ],
+ imports: [
+ CommonModule
+ ],
+ declarations: [
+ AppsComponent,
+ TriggerFormDirective
+ ]
+})
+export class AppsModule { }
diff --git a/web/gui2/src/main/webapp/app/view/apps/apps.theme.css b/web/gui2/src/main/webapp/app/view/apps/apps.theme.css
new file mode 100644
index 0000000..3de7ad8
--- /dev/null
+++ b/web/gui2/src/main/webapp/app/view/apps/apps.theme.css
@@ -0,0 +1,52 @@
+/*
+ * Copyright 2016-present Open Networking Foundation
+ *
+ * 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.
+ */
+
+/*
+ ONOS GUI -- Applications View (theme) -- CSS file
+ */
+
+/* -- Drag-n-Drop OAR files -- */
+div.dropping {
+ border: solid 3px #0095d6;
+}
+
+
+/* -- confirmation dialog -- */
+.light #app-dialog p.strong {
+ color: white;
+ background-color: #ce5b58;
+}
+
+.light #app-dialog.floatpanel.dialog {
+ background-color: #ffffff;
+}
+
+/* ========== DARK Theme ========== */
+
+
+.dark .app-title {
+ color: #dddddd;
+}
+
+/* -- confirmation dialog -- */
+.dark #app-dialog p.strong {
+ color: red;
+ background-color: #ecd98e;
+}
+.dark #app-dialog.floatpanel.dialog {
+ background-color: #282528;
+ color:#ddddee;
+}
diff --git a/web/gui2/src/main/webapp/app/view/apps/triggerform.directive.ts b/web/gui2/src/main/webapp/app/view/apps/triggerform.directive.ts
new file mode 100644
index 0000000..2bf9cd7
--- /dev/null
+++ b/web/gui2/src/main/webapp/app/view/apps/triggerform.directive.ts
@@ -0,0 +1,28 @@
+/*
+ * Copyright 2015-present Open Networking Foundation
+ *
+ * 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.
+ */
+import { Directive } from '@angular/core';
+
+/**
+ * ONOS GUI -- Apps -- Trigger Form Directive
+ */
+@Directive({
+ selector: '[onosTriggerForm]'
+})
+export class TriggerFormDirective {
+
+ constructor() { }
+
+}
diff --git a/web/gui2/src/main/webapp/app/view/device/device.component.css b/web/gui2/src/main/webapp/app/view/device/device.component.css
new file mode 100644
index 0000000..c578112
--- /dev/null
+++ b/web/gui2/src/main/webapp/app/view/device/device.component.css
@@ -0,0 +1,105 @@
+/*
+ * Copyright 2015-present Open Networking Foundation
+ *
+ * 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.
+ */
+
+/*
+ ONOS GUI -- Device View (layout) -- CSS file
+ */
+
+#ov-device h2 {
+ display: inline-block;
+}
+
+#ov-device div.ctrl-btns {
+}
+
+
+/* More in generic panel.css */
+
+#device-details-panel.floatpanel {
+ z-index: 0;
+}
+
+
+#device-details-panel .container {
+ padding: 8px 12px;
+}
+
+#device-details-panel .close-btn {
+ position: absolute;
+ right: 12px;
+ top: 12px;
+ cursor: pointer;
+}
+
+#device-details-panel .dev-icon {
+ display: inline-block;
+ padding: 0 6px 0 0;
+ vertical-align: middle;
+}
+
+#device-details-panel h2 {
+ display: inline-block;
+ margin: 8px 0;
+}
+
+
+#device-details-panel h2 input {
+ font-size: 0.90em;
+ width: 106%;
+}
+
+#device-details-panel .top-tables {
+ font-size: 10pt;
+ white-space: nowrap;
+}
+
+#device-details-panel .top div.left {
+ float: left;
+ padding: 0 18px 0 0;
+}
+#device-details-panel .top div.right {
+ display: inline-block;
+}
+
+#device-details-panel td.label {
+ font-weight: bold;
+ text-align: right;
+ padding-right: 6px;
+}
+
+#device-details-panel .actionBtns div {
+ padding: 12px 6px;
+}
+
+#device-details-panel hr {
+ width: 100%;
+ margin: 2px auto;
+}
+
+#device-details-panel .bottom table {
+ border-spacing: 0;
+}
+
+#device-details-panel .bottom th {
+ letter-spacing: 0.02em;
+}
+
+#device-details-panel .bottom th,
+#device-details-panel .bottom td {
+ padding: 6px 12px;
+ text-align: center;
+}
+
diff --git a/web/gui2/src/main/webapp/app/view/device/device.component.html b/web/gui2/src/main/webapp/app/view/device/device.component.html
new file mode 100644
index 0000000..febc99a
--- /dev/null
+++ b/web/gui2/src/main/webapp/app/view/device/device.component.html
@@ -0,0 +1,3 @@
+<div id="ov-device">
+ <p>device works!</p>
+</div>
diff --git a/web/gui2/src/main/webapp/app/view/device/device.component.ts b/web/gui2/src/main/webapp/app/view/device/device.component.ts
new file mode 100644
index 0000000..db42c4d
--- /dev/null
+++ b/web/gui2/src/main/webapp/app/view/device/device.component.ts
@@ -0,0 +1,64 @@
+/*
+ * Copyright 2015-present Open Networking Foundation
+ *
+ * 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.
+ */
+import { Component, OnInit } from '@angular/core';
+import { DetailsPanelService } from '../../fw/layer/detailspanel.service';
+import { FnService } from '../../fw/util/fn.service';
+import { IconService } from '../../fw/svg/icon.service';
+import { KeyService } from '../../fw/util/key.service';
+import { LoadingService } from '../../fw/layer/loading.service';
+import { LogService } from '../../log.service';
+import { MastService } from '../../fw/mast/mast.service';
+import { NavService } from '../../fw/nav/nav.service';
+import { PanelService } from '../../fw/layer/panel.service';
+import { TableBuilderService } from '../../fw/widget/tablebuilder.service';
+import { TableDetailService } from '../../fw/widget/tabledetail.service';
+import { WebSocketService } from '../../fw/remote/websocket.service';
+
+/**
+ * ONOS GUI -- Device View Component
+ */
+@Component({
+ selector: 'onos-device',
+ templateUrl: './device.component.html',
+ styleUrls: ['./device.component.css']
+})
+export class DeviceComponent implements OnInit {
+
+ constructor(
+ private dps: DetailsPanelService,
+ private fs: FnService,
+ private is: IconService,
+ private ks: KeyService,
+ private log: LogService,
+ private mast: MastService,
+ private nav: NavService,
+ private ps: PanelService,
+ private tbs: TableBuilderService,
+ private tds: TableDetailService,
+ private wss: WebSocketService,
+ private ls: LoadingService, // TODO: Remove - already added through tbs
+ private window: Window
+ ) {
+ this.log.debug('DeviceComponent constructed');
+ }
+
+ ngOnInit() {
+ this.log.debug('DeviceComponent initialized');
+ // TODO: Remove this - it's only for demo purposes
+ this.ls.startAnim();
+ }
+
+}
diff --git a/web/gui2/src/main/webapp/app/view/device/device.module.ts b/web/gui2/src/main/webapp/app/view/device/device.module.ts
new file mode 100644
index 0000000..9cd50cb
--- /dev/null
+++ b/web/gui2/src/main/webapp/app/view/device/device.module.ts
@@ -0,0 +1,36 @@
+/*
+ * Copyright 2015-present Open Networking Foundation
+ *
+ * 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.
+ */
+import { NgModule } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { DeviceComponent } from './device.component';
+import { DeviceDetailsPanelDirective } from './devicedetailspanel.directive';
+
+/**
+ * ONOS GUI -- Device View Module
+ */
+@NgModule({
+ exports: [
+ DeviceComponent
+ ],
+ imports: [
+ CommonModule
+ ],
+ declarations: [
+ DeviceComponent,
+ DeviceDetailsPanelDirective
+ ]
+})
+export class DeviceModule { }
diff --git a/web/gui2/src/main/webapp/app/view/device/device.theme.css b/web/gui2/src/main/webapp/app/view/device/device.theme.css
new file mode 100644
index 0000000..df0f139
--- /dev/null
+++ b/web/gui2/src/main/webapp/app/view/device/device.theme.css
@@ -0,0 +1,31 @@
+/*
+ * Copyright 2016-present Open Networking Foundation
+ *
+ * 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.
+ */
+
+/*
+ ONOS GUI -- Device View (theme) -- CSS file
+ */
+
+.light #device-details-panel .bottom th {
+ background-color: #e5e5e6;
+}
+
+.light #device-details-panel .bottom tr:nth-child(odd) {
+ background-color: #fbfbfb;
+}
+.light #device-details-panel .bottom tr:nth-child(even) {
+ background-color: #f4f4f4;
+}
+
diff --git a/web/gui2/src/main/webapp/app/view/device/devicedetailspanel.directive.ts b/web/gui2/src/main/webapp/app/view/device/devicedetailspanel.directive.ts
new file mode 100644
index 0000000..13e7e69
--- /dev/null
+++ b/web/gui2/src/main/webapp/app/view/device/devicedetailspanel.directive.ts
@@ -0,0 +1,40 @@
+/*
+ * Copyright 2015-present Open Networking Foundation
+ *
+ * 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.
+ */
+import { Directive } from '@angular/core';
+import { KeyService } from '../../fw/util/key.service';
+import { LogService } from '../../log.service';
+
+/**
+ * ONOS GUI -- Device Details Panel Directive
+ *
+ * TODO: figure out if this should be a directive or a component. In the old
+ * code it was a directive, but was referred to in device.html like a component
+ * would be
+ */
+@Directive({
+ selector: '[onosDeviceDetailsPanel]'
+})
+export class DeviceDetailsPanelDirective {
+
+ constructor(
+ private ks: KeyService,
+ private log: LogService,
+ private window: Window
+ ) {
+ this.log.debug('DeviceDetailsPanelDirective constructed');
+ }
+
+}