Moved back to ng1
Change-Id: I43b284e3b3cb3ac19d43c088de988c89a7ea8807
diff --git a/src/app/core/footer/footer.html b/src/app/core/footer/footer.html
new file mode 100644
index 0000000..8d14479
--- /dev/null
+++ b/src/app/core/footer/footer.html
@@ -0,0 +1,6 @@
+<footer class="footer">
+ Build with ♥ by the
+ <a href="https://github.com/opencord/xos/team">
+ {{vm.brand}} Team
+ </a>
+</footer>
diff --git a/src/app/core/footer/footer.spec.ts b/src/app/core/footer/footer.spec.ts
new file mode 100644
index 0000000..06c1044
--- /dev/null
+++ b/src/app/core/footer/footer.spec.ts
@@ -0,0 +1,22 @@
+/// <reference path="../../../../typings/index.d.ts" />
+
+import * as angular from 'angular';
+import 'angular-mocks';
+import {xosFooter} from './footer';
+import {StyleConfig} from '../../config/style.config';
+
+describe('footer component', () => {
+ beforeEach(() => {
+ angular
+ .module('xosFooter', ['app/core/footer/footer.html'])
+ .component('xosFooter', xosFooter);
+ angular.mock.module('xosFooter');
+ });
+
+ it('should render "XOS Team"', angular.mock.inject(($rootScope: ng.IRootScopeService, $compile: ng.ICompileService) => {
+ const element = $compile('<xos-footer></xos-footer>')($rootScope);
+ $rootScope.$digest();
+ const footer = element.find('a');
+ expect(footer.html().trim()).toEqual(`${StyleConfig.projectName} Team`);
+ }));
+});
diff --git a/src/app/core/footer/footer.ts b/src/app/core/footer/footer.ts
new file mode 100644
index 0000000..77a223b
--- /dev/null
+++ b/src/app/core/footer/footer.ts
@@ -0,0 +1,16 @@
+import {StyleConfig} from '../../config/style.config';
+
+class FooterCtrl {
+ public brand: string;
+
+ /** @ngInject */
+ constructor() {
+ this.brand = StyleConfig.projectName;
+ }
+}
+
+export const xosFooter: angular.IComponentOptions = {
+ template: require('./footer.html'),
+ controllerAs: 'vm',
+ controller: FooterCtrl
+};
diff --git a/src/app/core/header/header.html b/src/app/core/header/header.html
new file mode 100644
index 0000000..b327754
--- /dev/null
+++ b/src/app/core/header/header.html
@@ -0,0 +1,7 @@
+<header class="header">
+ <p class="header-title">
+ <a href="#/" target="_blank">
+ {{vm.title}}
+ </a>
+ </p>
+</header>
diff --git a/src/app/core/header/header.spec.ts b/src/app/core/header/header.spec.ts
new file mode 100644
index 0000000..7c00602
--- /dev/null
+++ b/src/app/core/header/header.spec.ts
@@ -0,0 +1,22 @@
+/// <reference path="../../../../typings/index.d.ts" />
+
+import * as angular from 'angular';
+import 'angular-mocks';
+import {xosHeader} from './header';
+import {StyleConfig} from '../../config/style.config';
+
+describe('header component', () => {
+ beforeEach(() => {
+ angular
+ .module('xosHeader', ['app/core/header/header.html'])
+ .component('xosHeader', xosHeader);
+ angular.mock.module('xosHeader');
+ });
+
+ it('should render the appropriate title', angular.mock.inject(($rootScope: ng.IRootScopeService, $compile: ng.ICompileService) => {
+ const element = $compile('<xos-header></xos-header>')($rootScope);
+ $rootScope.$digest();
+ const header = element.find('a');
+ expect(header.html().trim()).toEqual(StyleConfig.projectName);
+ }));
+});
diff --git a/src/app/core/header/header.ts b/src/app/core/header/header.ts
new file mode 100644
index 0000000..c2e4c41
--- /dev/null
+++ b/src/app/core/header/header.ts
@@ -0,0 +1,15 @@
+import {StyleConfig} from '../../config/style.config';
+
+class HeaderController {
+ public title: string;
+
+ constructor() {
+ this.title = StyleConfig.projectName;
+ }
+}
+
+export const xosHeader: angular.IComponentOptions = {
+ template: require('./header.html'),
+ controllerAs: 'vm',
+ controller: HeaderController
+};
diff --git a/src/app/core/index.ts b/src/app/core/index.ts
new file mode 100644
index 0000000..d0875b6
--- /dev/null
+++ b/src/app/core/index.ts
@@ -0,0 +1,15 @@
+import {xosHeader} from './header/header';
+import {xosFooter} from './footer/footer';
+import {xosNav} from './nav/nav';
+import routesConfig from './routes';
+import {xosLogin} from './login/login';
+
+export const xosCore = 'xosCore';
+
+angular
+ .module('xosCore', ['ui.router'])
+ .config(routesConfig)
+ .component('xosHeader', xosHeader)
+ .component('xosFooter', xosFooter)
+ .component('xosNav', xosNav)
+ .component('xosLogin', xosLogin);
diff --git a/src/app/core/login/login.html b/src/app/core/login/login.html
new file mode 100644
index 0000000..f4a0724
--- /dev/null
+++ b/src/app/core/login/login.html
@@ -0,0 +1,5 @@
+<form name="login">
+ <input type="text" name="username" ng-model="username" required>
+ <input type="text" name="password" ng-model="password" required>
+ <button type="button" ng-click="vm.login(username, password)">Login</button>
+</form>
diff --git a/src/app/core/login/login.ts b/src/app/core/login/login.ts
new file mode 100644
index 0000000..af46619
--- /dev/null
+++ b/src/app/core/login/login.ts
@@ -0,0 +1,30 @@
+import {AuthService} from '../../rest/auth.rest';
+
+class LoginCtrl {
+ static $inject = ['AuthService', '$state'];
+
+ /** @ngInject */
+ constructor(
+ private authService: AuthService,
+ private $state: angular.ui.IStateService
+ ) {
+ }
+
+ public login(username: string, password: string) {
+ this.authService.login({
+ username: username,
+ password: password
+ })
+ .then(res => {
+ console.log(res);
+ this.$state.go('app');
+ })
+ .catch(e => console.error);
+ }
+}
+
+export const xosLogin: angular.IComponentOptions = {
+ template: require('./login.html'),
+ controllerAs: 'vm',
+ controller: LoginCtrl
+};
diff --git a/src/app/core/nav/nav.html b/src/app/core/nav/nav.html
new file mode 100644
index 0000000..6256369
--- /dev/null
+++ b/src/app/core/nav/nav.html
@@ -0,0 +1,7 @@
+<div class="nav">
+ <ul>
+ <li ng-repeat="route in vm.routes" ui-sref-active="active">
+ <a ui-sref="{{route.state}}">{{route.label}}</a>
+ </li>
+ </ul>
+</div>
diff --git a/src/app/core/nav/nav.scss b/src/app/core/nav/nav.scss
new file mode 100644
index 0000000..8591c15
--- /dev/null
+++ b/src/app/core/nav/nav.scss
@@ -0,0 +1,37 @@
+xos-nav {
+ display: flex;
+ flex: 1;
+ flex-direction: column;
+ flex-basis: 10%;
+ background: darken(grey, 10);
+
+ ul {
+ list-style: none;
+ padding: 0;
+ margin: 0;
+ background: grey;
+
+ > li {
+ display: flex;
+ flex-direction: column;
+ padding: 10px 20px;
+ border-bottom: 1px solid darken(grey, 20);
+
+ &.active {
+ background: darken(grey, 10);
+
+ > a {
+ color: #5aadbb;
+ }
+ }
+
+ &:hover {
+ background: darken(grey, 10);
+ }
+
+ > a {
+ cursor: pointer;
+ }
+ }
+ }
+}
diff --git a/src/app/core/nav/nav.ts b/src/app/core/nav/nav.ts
new file mode 100644
index 0000000..d90df10
--- /dev/null
+++ b/src/app/core/nav/nav.ts
@@ -0,0 +1,37 @@
+import './nav.scss';
+
+interface INavItem {
+ label: string;
+ state: string;
+}
+
+class NavCtrl {
+ public routes: INavItem[];
+
+ constructor() {
+ this.routes = [
+ {
+ label: 'Home',
+ state: 'xos.dashboard'
+ },
+ {
+ label: 'Instances',
+ state: 'xos.instances'
+ },
+ {
+ label: 'Slices',
+ state: 'xos.slices'
+ },
+ {
+ label: 'Nodes',
+ state: 'xos.nodes'
+ }
+ ];
+ }
+}
+
+export const xosNav: angular.IComponentOptions = {
+ template: require('./nav.html'),
+ controllerAs: 'vm',
+ controller: NavCtrl
+};
diff --git a/src/app/core/routes.ts b/src/app/core/routes.ts
new file mode 100644
index 0000000..5f37713
--- /dev/null
+++ b/src/app/core/routes.ts
@@ -0,0 +1,10 @@
+export default routesConfig;
+
+/** @ngInject */
+function routesConfig($stateProvider: angular.ui.IStateProvider, $urlRouterProvider: angular.ui.IUrlRouterProvider, $locationProvider: angular.ILocationProvider) {
+ $stateProvider
+ .state('login', {
+ url: '/login',
+ component: 'xosLogin'
+ });
+}