Skip to content

K
k3s
Commit 75d062b8 authored by Patrick Reilly's avatar Patrick Reilly
Browse files
Options

Restore WebUI breadcrumbs

- Update paths to svg images - Restore sections concept - Tested with local cluster
parent 96749565
Hide whitespace changes
Inline Side-by-side
Showing with 419 additions and 23 deletions
.gitignore
View file @ 75d062b8
......@@ -53,6 +53,6 @@ network_closure.sh
# Web UI
www/master/node_modules/
www/master/npm-debug.log
# Karma output
www/test_out
pkg/ui/datafile.go
View file @ 75d062b8
This source diff could not be displayed because it is too large. You can view the blob instead.
www/app/assets/css/app.css
View file @ 75d062b8
......@@ -7,7 +7,7 @@
.nav-back {
/* :before */
/* content: ""; */
background: url('assets/img/icons/arrow-back.png');
background: url('../img/arrow-back.png');
background-size: 14px 14px;
background-repeat: no-repeat;
display: block;
......@@ -219,7 +219,7 @@ md-select-menu {
text-transform: none;
}
.md-button-toggle .md-toggle-icon {
background: transparent url(assets/img/icons/list_control_down.png) no-repeat center center;
background: transparent url(../img/icons/list_control_down.png) no-repeat center center;
background-size: 100% auto;
display: inline-block;
height: 24px;
......
www/app/assets/img/ic_arrow_drop_down_24px.svg 0 → 100644
View file @ 75d062b8
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
<path d="M7 10l5 5 5-5z"/>
<path d="M0 0h24v24h-24z" fill="none"/>
</svg>
www/app/assets/img/ic_arrow_drop_up_24px.svg 0 → 100644
View file @ 75d062b8
<?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 17.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="24px"
height="24px" viewBox="0 0 24 24" enable-background="new 0 0 24 24" xml:space="preserve">
<g id="Header">
<g>
<rect x="-618" y="-952" fill="none" width="1400" height="3600"/>
</g>
</g>
<g id="Label">
</g>
<g id="Icon">
<g>
<g>
<polygon points="7,14 12,9 17,14 "/>
</g>
<rect fill="none" width="24" height="24"/>
</g>
</g>
<g id="Grid" display="none">
<g display="inline">
</g>
</g>
</svg>
www/app/assets/img/ic_keyboard_arrow_left_24px.svg 0 → 100644
View file @ 75d062b8
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M15.41 16.09l-4.58-4.59 4.58-4.59L14 5.5l-6 6 6 6z"/></svg>
\ No newline at end of file
www/app/assets/img/ic_keyboard_arrow_right_24px.svg 0 → 100644
View file @ 75d062b8
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M8.59 16.34l4.58-4.59-4.58-4.59L10 5.75l6 6-6 6z"/></svg>
\ No newline at end of file
www/app/assets/js/app.js
View file @ 75d062b8
......@@ -16,6 +16,61 @@ var app = angular.module('kubernetesApp', [
'angular.filter'
].concat(componentNamespaces));
app.factory('menu', [
'$location',
'$rootScope',
'sections',
function($location, $rootScope, sections) {
var self;
$rootScope.$on('$locationChangeSuccess', onLocationChange);
return self = {
sections: sections,
setSections: function(_sections) { this.sections = _sections; },
selectSection: function(section) { self.openedSection = section; },
toggleSelectSection: function(section) {
self.openedSection = (self.openedSection === section ? null : section);
},
isSectionSelected: function(section) { return self.openedSection === section; },
selectPage: function(section, page) {
page && page.url && $location.path(page.url);
self.currentSection = section;
self.currentPage = page;
},
isPageSelected: function(page) { return self.currentPage === page; }
};
function onLocationChange() {
var path = $location.path();
var matchPage = function(section, page) {
if (path === page.url) {
self.selectSection(section);
self.selectPage(section, page);
}
};
sections.forEach(function(section) {
if (section.children) {
section.children.forEach(function(childSection) {
if (childSection.pages) {
childSection.pages.forEach(function(page) { matchPage(childSection, page); });
}
});
} else if (section.pages) {
section.pages.forEach(function(page) { matchPage(section, page); });
} else if (section.type === 'link') {
matchPage(section, section);
}
});
}
}
]);
angular.module('kubernetesApp.config', []);
angular.module('kubernetesApp.services', ['kubernetesApp.config']);
......@@ -46,6 +101,8 @@ app.config([
}
]);
app.value("sections", [{"name":"Dashboard","url":"/dashboard","type":"link","templateUrl":"/components/dashboard/pages/home.html"},{"name":"Dashboard","type":"heading","children":[{"name":"Dashboard","type":"toggle","url":"/dashboard","templateUrl":"/components/dashboard/pages/home.html","pages":[{"name":"Pods","url":"/dashboard/pods","templateUrl":"/components/dashboard/views/listPods.html","type":"link"},{"name":"Pod Visualizer","url":"/dashboard/visualpods","templateUrl":"/components/dashboard/views/listPodsVisualizer.html","type":"link"},{"name":"Services","url":"/dashboard/services","templateUrl":"/components/dashboard/views/listServices.html","type":"link"},{"name":"Replication Controllers","url":"/dashboard/replicationcontrollers","templateUrl":"/components/dashboard/views/listReplicationControllers.html","type":"link"},{"name":"Events","url":"/dashboard/events","templateUrl":"/components/dashboard/views/listEvents.html","type":"link"},{"name":"Nodes","url":"/dashboard/minions","templateUrl":"/components/dashboard/views/listMinions.html","type":"link"},{"name":"Replication Controller","url":"/dashboard/replicationcontrollers/:replicationControllerId","templateUrl":"/components/dashboard/views/replication.html","type":"link"},{"name":"Service","url":"/dashboard/services/:serviceId","templateUrl":"/components/dashboard/views/service.html","type":"link"},{"name":"Explore","url":"/dashboard/groups/:grouping*?/selector/:selector*?","templateUrl":"/components/dashboard/views/groups.html","type":"link"},{"name":"Pod","url":"/dashboard/pods/:podId","templateUrl":"/components/dashboard/views/pod.html","type":"link"}]}]},{"name":"Graph","url":"/graph","type":"link","templateUrl":"/components/graph/pages/home.html"},{"name":"Graph","url":"/graph/inspect","type":"link","templateUrl":"/components/graph/pages/inspect.html","css":"/components/graph/css/show-details-table.css"},{"name":"Graph","type":"heading","children":[{"name":"Graph","type":"toggle","url":"/graph","templateUrl":"/components/graph/pages/home.html","pages":[{"name":"Test","url":"/graph/test","type":"link","templateUrl":"/components/graph/pages/home.html"}]}]}]);
app.directive('includeReplace',
function() {
'use strict';
......@@ -137,7 +194,7 @@ app.service('SidebarService', [
app.value("tabs", [{"component":"dashboard","title":"Dashboard"}]);
app.constant("manifestRoutes", [{"description":"Dashboard visualization.","url":"/dashboard/","templateUrl":"components/dashboard/pages/home.html"},{"description":"Pods","url":"/dashboard/pods","templateUrl":"components/dashboard/views/listPods.html"},{"description":"Pod Visualizer","url":"/dashboard/visualpods","templateUrl":"components/dashboard/views/listPodsVisualizer.html"},{"description":"Services","url":"/dashboard/services","templateUrl":"components/dashboard/views/listServices.html"},{"description":"Replication Controllers","url":"/dashboard/replicationcontrollers","templateUrl":"components/dashboard/views/listReplicationControllers.html"},{"description":"Events","url":"/dashboard/events","templateUrl":"components/dashboard/views/listEvents.html"},{"description":"Minions","url":"/dashboard/minions","templateUrl":"components/dashboard/views/listMinions.html"},{"description":"Replication Controller","url":"/dashboard/replicationcontrollers/:replicationControllerId","templateUrl":"components/dashboard/views/replication.html"},{"description":"Service","url":"/dashboard/services/:serviceId","templateUrl":"components/dashboard/views/service.html"},{"description":"Explore","url":"/dashboard/groups/:grouping*?/selector/:selector*?","templateUrl":"components/dashboard/views/groups.html"},{"description":"Pod","url":"/dashboard/pods/:podId","templateUrl":"components/dashboard/views/pod.html"}]);
app.constant("manifestRoutes", [{"description":"Dashboard visualization.","url":"/dashboard/","templateUrl":"components/dashboard/pages/home.html"},{"description":"Pods","url":"/dashboard/pods","templateUrl":"components/dashboard/views/listPods.html"},{"description":"Pod Visualizer","url":"/dashboard/visualpods","templateUrl":"components/dashboard/views/listPodsVisualizer.html"},{"description":"Services","url":"/dashboard/services","templateUrl":"components/dashboard/views/listServices.html"},{"description":"Replication Controllers","url":"/dashboard/replicationcontrollers","templateUrl":"components/dashboard/views/listReplicationControllers.html"},{"description":"Events","url":"/dashboard/events","templateUrl":"components/dashboard/views/listEvents.html"},{"description":"Nodes","url":"/dashboard/minions","templateUrl":"components/dashboard/views/listMinions.html"},{"description":"Replication Controller","url":"/dashboard/replicationcontrollers/:replicationControllerId","templateUrl":"components/dashboard/views/replication.html"},{"description":"Service","url":"/dashboard/services/:serviceId","templateUrl":"components/dashboard/views/service.html"},{"description":"Explore","url":"/dashboard/groups/:grouping*?/selector/:selector*?","templateUrl":"components/dashboard/views/groups.html"},{"description":"Pod","url":"/dashboard/pods/:podId","templateUrl":"components/dashboard/views/pod.html"}]);
angular.module("kubernetesApp.config", [])
......@@ -166,6 +223,122 @@ angular.module("kubernetesApp.config", [])
* Define constants to inject across the application
=========================================================*/
/**=========================================================
* Module: home-page.js
* Page Controller
=========================================================*/
app.controller('PageCtrl', [
'$scope',
'$timeout',
'$mdSidenav',
'menu',
'$rootScope',
function($scope, $timeout, $mdSidenav, menu, $rootScope) {
$scope.menu = menu;
$scope.path = path;
$scope.goHome = goHome;
$scope.openMenu = openMenu;
$rootScope.openMenu = openMenu;
$scope.closeMenu = closeMenu;
$scope.isSectionSelected = isSectionSelected;
$rootScope.$on('$locationChangeSuccess', openPage);
// Methods used by menuLink and menuToggle directives
this.isOpen = isOpen;
this.isSelected = isSelected;
this.toggleOpen = toggleOpen;
this.shouldLockOpen = shouldLockOpen;
$scope.toggleKubernetesUiMenu = toggleKubernetesUiMenu;
var mainContentArea = document.querySelector("[role='main']");
var kubernetesUiMenu = document.querySelector("[role='kubernetes-ui-menu']");
// *********************
// Internal methods
// *********************
var _t = false;
$scope.showKubernetesUiMenu = false;
function shouldLockOpen() {
return _t;
}
function toggleKubernetesUiMenu() {
$scope.showKubernetesUiMenu = !$scope.showKubernetesUiMenu;
}
function closeMenu() {
$timeout(function() {
$mdSidenav('left').close();
});
}
function openMenu() {
$timeout(function() {
_t = !$mdSidenav('left').isOpen();
$mdSidenav('left').toggle();
});
}
function path() {
return $location.path();
}
function goHome($event) {
menu.selectPage(null, null);
$location.path( '/' );
}
function openPage() {
$scope.closeMenu();
mainContentArea.focus();
}
function isSelected(page) {
return menu.isPageSelected(page);
}
function isSectionSelected(section) {
var selected = false;
var openedSection = menu.openedSection;
if(openedSection === section){
selected = true;
}
else if(section.children) {
section.children.forEach(function(childSection) {
if(childSection === openedSection){
selected = true;
}
});
}
return selected;
}
function isOpen(section) {
return menu.isSectionSelected(section);
}
function toggleOpen(section) {
menu.toggleSelectSection(section);
}
}
]).filter('humanizeDoc', function() {
return function(doc) {
if (!doc) return;
if (doc.type === 'directive') {
return doc.name.replace(/([A-Z])/g, function($1) {
return '-'+$1.toLowerCase();
});
}
return doc.label || doc.name;
}; });
/**=========================================================
* Module: main.js
* Main Application Controller
=========================================================*/
......@@ -2111,8 +2284,10 @@ app.controller('ServiceCtrl', [
'$scope',
'$filter',
'$location',
'menu',
'$rootScope',
function($scope, $filter, $location, $rootScope) {
function($scope, $filter, $location, menu, $rootScope) {
$scope.menu = menu;
$scope.$watch('page', function(newValue, oldValue) {
if (typeof newValue !== 'undefined') {
$location.path(newValue);
......@@ -2127,7 +2302,7 @@ app.controller('ServiceCtrl', [
id: 'groupsView'
},
{category: 'dashboard', name: 'Pods', value: '/dashboard/pods', id: 'podsView'},
{category: 'dashboard', name: 'Minions', value: '/dashboard/minions', id: 'minionsView'},
{category: 'dashboard', name: 'Nodes', value: '/dashboard/minions', id: 'minionsView'},
{
category: 'dashboard',
name: 'Replication Controllers',
......
www/app/components/README.md
View file @ 75d062b8
......@@ -125,4 +125,4 @@ Content available under the [CC-By 3.0
license](http://creativecommons.org/licenses/by/3.0/)
[![Analytics](https://kubernetes-site.appspot.com/UA-36037335-10/GitHub/www/app/components/README.md?pixel)]()
[![Analytics](https://kubernetes-site.appspot.com/UA-36037335-10/GitHub/www/master/components/README.md?pixel)]()
www/app/components/dashboard/README.md
View file @ 75d062b8
Dashboard Component for Kubernetes WebUI
[![Analytics](https://kubernetes-site.appspot.com/UA-36037335-10/GitHub/www/app/components/dashboard/README.md?pixel)]()
[![Analytics](https://kubernetes-site.appspot.com/UA-36037335-10/GitHub/www/master/components/dashboard/README.md?pixel)]()
www/app/components/dashboard/manifest.json
View file @ 75d062b8
{
"description": "The basic kubernetes ui dashboard... ",
"description": "The basic Kubernetes UI dashboard... ",
"routes": [
{
"description": "Dashboard visualization.",
......@@ -32,7 +32,7 @@
"templateUrl": "components/dashboard/views/listEvents.html"
},
{
"description": "Minions",
"description": "Nodes",
"url": "/minions",
"templateUrl": "components/dashboard/views/listMinions.html"
},
......
www/app/components/dashboard/pages/header.html
View file @ 75d062b8
......@@ -3,7 +3,13 @@
<div class="md-toolbar-tools">
<div layout="row" flex class="fill-height">
<div class="md-toolbar-item md-breadcrumb"></div>
<span style="display: inline-block;">Kubernetes</span>
<span ng-if="menu.currentPage.name !== menu.currentSection.name">
<span hide-sm hide-md><a href="#{{menu.currentSection.url}}">{{menu.currentSection.name}}</a></span>
<span class="menu-separator-icon" style="padding: 0 10px;" hide-sm hide-md>
<img style="height: 12px;" src="assets/img/docArrow.png" alt="" aria-hidden="true">
</span>
</span>
<span style="display: inline-block;">{{(menu.currentPage | humanizeDoc) || 'Kubernetes' }}</span>
<span flex></span>
<div class="md-toolbar-item md-tools" layout="row">
<div layout="column" class="selectSubPages">
......
www/app/components/dashboard/test/controllers/header.spec.js 0 → 100644
View file @ 75d062b8
"use strict";describe("header controller",function(){beforeEach(module("kubernetesApp.components.dashboard")),beforeEach(inject(function(e,t,o){this.rootScope=e,this.scope=e.$new(),this.location=t,spyOn(this.location,"path"),this.controller=o,this.ctrl=this.controller("HeaderCtrl",{$scope:this.scope}),this.scope.$apply()})),describe("subPages",function(){it("is defined",function(){expect(this.scope.subPages).not.toBeUndefined()}),it("is an array",function(){expect(Array.isArray(this.scope.subPages)).toBeTruthy()}),it("is not empty",function(){expect(this.scope.subPages.length).toBeGreaterThan(0)}),describe("each subPage",function(){it("has a category",function(){this.scope.subPages.forEach(function(e){expect(e.category).toBeTruthy()})}),it("has a name",function(){this.scope.subPages.forEach(function(e){expect(e.name).toBeTruthy()})}),it("has a value",function(){this.scope.subPages.forEach(function(e){expect(e.value).toBeTruthy()})})})}),describe("Pages",function(){it("does not change location on first detected change",function(){expect(this.location.path).not.toHaveBeenCalled()}),it("changes location on second detected change",function(){var e=this;this.scope.$apply(function(){e.scope.Pages="test_Pages"}),expect(this.location.path).toHaveBeenCalledWith("test_Pages")})})});
\ No newline at end of file
www/app/index.html
View file @ 75d062b8
......@@ -10,7 +10,7 @@
<link rel="stylesheet" href="assets/css/app.css" >
<link rel="shortcut icon" href="assets/img/icons/favicon.png" type="image/vnd.microsoft.icon" />
</head>
<body layout="row">
<body layout="row" ng-controller="PageCtrl">
<md-sidenav layout="column"
md-is-locked-open="shouldLockOpen()"
style="overflow: hidden; display: flex;"
......
www/app/views/partials/md-table.tmpl.html
View file @ 75d062b8
......@@ -2,7 +2,7 @@
<thead>
<tr class="md-table-headers-row">
<th class="md-table-header" ng-repeat="h in headers">
<a href ng-if="handleSort(h.field)" ng-click="reverse=!reverse;order(h.field,reverse)">{{h.name}} <span class="md-table-caret" ng-show="reverse && h.field == predicate"><img src="https://google.github.io/material-design-icons/navigation/svg/ic_arrow_drop_up_24px.svg"></span><span class="md-table-caret" ng-show="!reverse && h.field == predicate"><img src="https://google.github.io/material-design-icons/navigation/svg/ic_arrow_drop_down_24px.svg"></span></a>
<a href ng-if="handleSort(h.field)" ng-click="reverse=!reverse;order(h.field,reverse)">{{h.name}} <span class="md-table-caret" ng-show="reverse && h.field == predicate"><img src="assets/img/ic_arrow_drop_up_24px.svg"></span><span class="md-table-caret" ng-show="!reverse && h.field == predicate"><img src="assets/img/ic_arrow_drop_down_24px.svg"></span></a>
<span ng-if="!handleSort(h.field)">{{h.name}}</span>
</th>
<th class="md-table-header"></th>
......@@ -31,7 +31,7 @@
<span flex></span>
<span ng-show="nbOfPages() > 1">
<md-button aria-label="Back" class="md-table-footer-item" ng-disabled="currentPage==0" ng-click="currentPage=currentPage-1">
<img src="//google.github.io/material-design-icons/hardware/svg/ic_keyboard_arrow_left_24px.svg">
<img src="assets/img/ic_keyboard_arrow_left_24px.svg">
</md-button>
<a href ng-repeat="i in getNumber(nbOfPages()) track by $index" >
<md-button aria-label="Next" class="md-primary md-table-footer-item" ng-click="goToPage($index)">
......@@ -39,7 +39,7 @@
</md-button>
</a>
<md-button aria-label="Jump" class="md-table-footer-item" ng-disabled="currentPage==nbOfPages()-1" ng-click="currentPage=currentPage+1">
<img src="//google.github.io/material-design-icons/hardware/svg/ic_keyboard_arrow_right_24px.svg">
<img src="assets/img/ic_keyboard_arrow_right_24px.svg">
</md-button>
</span>
</div>
www/master/components/dashboard/js/modules/directives/dashboard.js
View file @ 75d062b8
......@@ -15,8 +15,10 @@
'$scope',
'$filter',
'$location',
'menu',
'$rootScope',
function($scope, $filter, $location, $rootScope) {
function($scope, $filter, $location, menu, $rootScope) {
$scope.menu = menu;
$scope.$watch('page', function(newValue, oldValue) {
if (typeof newValue !== 'undefined') {
$location.path(newValue);
......@@ -31,7 +33,7 @@
id: 'groupsView'
},
{category: 'dashboard', name: 'Pods', value: '/dashboard/pods', id: 'podsView'},
{category: 'dashboard', name: 'Minions', value: '/dashboard/minions', id: 'minionsView'},
{category: 'dashboard', name: 'Nodes', value: '/dashboard/minions', id: 'minionsView'},
{
category: 'dashboard',
name: 'Replication Controllers',
......
www/master/components/dashboard/manifest.json
View file @ 75d062b8
{
"description": "The basic kubernetes ui dashboard... ",
"description": "The basic Kubernetes UI dashboard... ",
"routes": [
{
"description": "Dashboard visualization.",
......@@ -32,7 +32,7 @@
"templateUrl": "components/dashboard/views/listEvents.html"
},
{
"description": "Minions",
"description": "Nodes",
"url": "/minions",
"templateUrl": "components/dashboard/views/listMinions.html"
},
......
www/master/components/dashboard/pages/header.html
View file @ 75d062b8
......@@ -3,7 +3,13 @@
<div class="md-toolbar-tools">
<div layout="row" flex class="fill-height">
<div class="md-toolbar-item md-breadcrumb"></div>
<span style="display: inline-block;">Kubernetes</span>
<span ng-if="menu.currentPage.name !== menu.currentSection.name">
<span hide-sm hide-md><a href="#{{menu.currentSection.url}}">{{menu.currentSection.name}}</a></span>
<span class="menu-separator-icon" style="padding: 0 10px;" hide-sm hide-md>
<img style="height: 12px;" src="assets/img/docArrow.png" alt="" aria-hidden="true">
</span>
</span>
<span style="display: inline-block;">{{(menu.currentPage | humanizeDoc) || 'Kubernetes' }}</span>
<span flex></span>
<div class="md-toolbar-item md-tools" layout="row">
<div layout="column" class="selectSubPages">
......
www/master/js/app.config.js
View file @ 75d062b8
......@@ -27,3 +27,5 @@ app.config([
});
}
]);
app.value("sections", [{"name":"Dashboard","url":"/dashboard","type":"link","templateUrl":"/components/dashboard/pages/home.html"},{"name":"Dashboard","type":"heading","children":[{"name":"Dashboard","type":"toggle","url":"/dashboard","templateUrl":"/components/dashboard/pages/home.html","pages":[{"name":"Pods","url":"/dashboard/pods","templateUrl":"/components/dashboard/views/listPods.html","type":"link"},{"name":"Pod Visualizer","url":"/dashboard/visualpods","templateUrl":"/components/dashboard/views/listPodsVisualizer.html","type":"link"},{"name":"Services","url":"/dashboard/services","templateUrl":"/components/dashboard/views/listServices.html","type":"link"},{"name":"Replication Controllers","url":"/dashboard/replicationcontrollers","templateUrl":"/components/dashboard/views/listReplicationControllers.html","type":"link"},{"name":"Events","url":"/dashboard/events","templateUrl":"/components/dashboard/views/listEvents.html","type":"link"},{"name":"Nodes","url":"/dashboard/minions","templateUrl":"/components/dashboard/views/listMinions.html","type":"link"},{"name":"Replication Controller","url":"/dashboard/replicationcontrollers/:replicationControllerId","templateUrl":"/components/dashboard/views/replication.html","type":"link"},{"name":"Service","url":"/dashboard/services/:serviceId","templateUrl":"/components/dashboard/views/service.html","type":"link"},{"name":"Explore","url":"/dashboard/groups/:grouping*?/selector/:selector*?","templateUrl":"/components/dashboard/views/groups.html","type":"link"},{"name":"Pod","url":"/dashboard/pods/:podId","templateUrl":"/components/dashboard/views/pod.html","type":"link"}]}]},{"name":"Graph","url":"/graph","type":"link","templateUrl":"/components/graph/pages/home.html"},{"name":"Graph","url":"/graph/inspect","type":"link","templateUrl":"/components/graph/pages/inspect.html","css":"/components/graph/css/show-details-table.css"},{"name":"Graph","type":"heading","children":[{"name":"Graph","type":"toggle","url":"/graph","templateUrl":"/components/graph/pages/home.html","pages":[{"name":"Test","url":"/graph/test","type":"link","templateUrl":"/components/graph/pages/home.html"}]}]}]);
www/master/js/app.init.js
View file @ 75d062b8
......@@ -14,3 +14,58 @@ var app = angular.module('kubernetesApp', [
'kubernetesApp.services',
'angular.filter'
].concat(componentNamespaces));
app.factory('menu', [
'$location',
'$rootScope',
'sections',
function($location, $rootScope, sections) {
var self;
$rootScope.$on('$locationChangeSuccess', onLocationChange);
return self = {
sections: sections,
setSections: function(_sections) { this.sections = _sections; },
selectSection: function(section) { self.openedSection = section; },
toggleSelectSection: function(section) {
self.openedSection = (self.openedSection === section ? null : section);
},
isSectionSelected: function(section) { return self.openedSection === section; },
selectPage: function(section, page) {
page && page.url && $location.path(page.url);
self.currentSection = section;
self.currentPage = page;
},
isPageSelected: function(page) { return self.currentPage === page; }
};
function onLocationChange() {
var path = $location.path();
var matchPage = function(section, page) {
if (path === page.url) {
self.selectSection(section);
self.selectPage(section, page);
}
};
sections.forEach(function(section) {
if (section.children) {
section.children.forEach(function(childSection) {
if (childSection.pages) {
childSection.pages.forEach(function(page) { matchPage(childSection, page); });
}
});
} else if (section.pages) {
section.pages.forEach(function(page) { matchPage(section, page); });
} else if (section.type === 'link') {
matchPage(section, section);
}
});
}
}
]);
www/master/js/sections.js
View file @ 75d062b8
app.constant("manifestRoutes", [{"description":"Dashboard visualization.","url":"/dashboard/","templateUrl":"components/dashboard/pages/home.html"},{"description":"Pods","url":"/dashboard/pods","templateUrl":"components/dashboard/views/listPods.html"},{"description":"Pod Visualizer","url":"/dashboard/visualpods","templateUrl":"components/dashboard/views/listPodsVisualizer.html"},{"description":"Services","url":"/dashboard/services","templateUrl":"components/dashboard/views/listServices.html"},{"description":"Replication Controllers","url":"/dashboard/replicationcontrollers","templateUrl":"components/dashboard/views/listReplicationControllers.html"},{"description":"Events","url":"/dashboard/events","templateUrl":"components/dashboard/views/listEvents.html"},{"description":"Minions","url":"/dashboard/minions","templateUrl":"components/dashboard/views/listMinions.html"},{"description":"Replication Controller","url":"/dashboard/replicationcontrollers/:replicationControllerId","templateUrl":"components/dashboard/views/replication.html"},{"description":"Service","url":"/dashboard/services/:serviceId","templateUrl":"components/dashboard/views/service.html"},{"description":"Explore","url":"/dashboard/groups/:grouping*?/selector/:selector*?","templateUrl":"components/dashboard/views/groups.html"},{"description":"Pod","url":"/dashboard/pods/:podId","templateUrl":"components/dashboard/views/pod.html"}]);
app.constant("manifestRoutes", [{"description":"Dashboard visualization.","url":"/dashboard/","templateUrl":"components/dashboard/pages/home.html"},{"description":"Pods","url":"/dashboard/pods","templateUrl":"components/dashboard/views/listPods.html"},{"description":"Pod Visualizer","url":"/dashboard/visualpods","templateUrl":"components/dashboard/views/listPodsVisualizer.html"},{"description":"Services","url":"/dashboard/services","templateUrl":"components/dashboard/views/listServices.html"},{"description":"Replication Controllers","url":"/dashboard/replicationcontrollers","templateUrl":"components/dashboard/views/listReplicationControllers.html"},{"description":"Events","url":"/dashboard/events","templateUrl":"components/dashboard/views/listEvents.html"},{"description":"Nodes","url":"/dashboard/minions","templateUrl":"components/dashboard/views/listMinions.html"},{"description":"Replication Controller","url":"/dashboard/replicationcontrollers/:replicationControllerId","templateUrl":"components/dashboard/views/replication.html"},{"description":"Service","url":"/dashboard/services/:serviceId","templateUrl":"components/dashboard/views/service.html"},{"description":"Explore","url":"/dashboard/groups/:grouping*?/selector/:selector*?","templateUrl":"components/dashboard/views/groups.html"},{"description":"Pod","url":"/dashboard/pods/:podId","templateUrl":"components/dashboard/views/pod.html"}]);
www/master/less/app/base.less
View file @ 75d062b8
......@@ -8,7 +8,7 @@
.nav-back {
/* :before */
/* content: ""; */
background: url('assets/img/icons/arrow-back.png');
background: url('../img/arrow-back.png');
background-size: 14px 14px;
background-repeat: no-repeat;
display: block;
......@@ -251,7 +251,7 @@ md-select-menu {
text-transform: none;
}
.md-button-toggle .md-toggle-icon {
background: transparent url(assets/img/icons/list_control_down.png) no-repeat center center;
background: transparent url(../img/icons/list_control_down.png) no-repeat center center;
background-size: 100% auto;
display: inline-block;
height: 24px;
......
www/master/shared/js/modules/controllers/home-page.js 0 → 100644
View file @ 75d062b8
/**=========================================================
* Module: home-page.js
* Page Controller
=========================================================*/
app.controller('PageCtrl', [
'$scope',
'$timeout',
'$mdSidenav',
'menu',
'$rootScope',
function($scope, $timeout, $mdSidenav, menu, $rootScope) {
$scope.menu = menu;
$scope.path = path;
$scope.goHome = goHome;
$scope.openMenu = openMenu;
$rootScope.openMenu = openMenu;
$scope.closeMenu = closeMenu;
$scope.isSectionSelected = isSectionSelected;
$rootScope.$on('$locationChangeSuccess', openPage);
// Methods used by menuLink and menuToggle directives
this.isOpen = isOpen;
this.isSelected = isSelected;
this.toggleOpen = toggleOpen;
this.shouldLockOpen = shouldLockOpen;
$scope.toggleKubernetesUiMenu = toggleKubernetesUiMenu;
var mainContentArea = document.querySelector("[role='main']");
var kubernetesUiMenu = document.querySelector("[role='kubernetes-ui-menu']");
// *********************
// Internal methods
// *********************
var _t = false;
$scope.showKubernetesUiMenu = false;
function shouldLockOpen() {
return _t;
}
function toggleKubernetesUiMenu() {
$scope.showKubernetesUiMenu = !$scope.showKubernetesUiMenu;
}
function closeMenu() {
$timeout(function() {
$mdSidenav('left').close();
});
}
function openMenu() {
$timeout(function() {
_t = !$mdSidenav('left').isOpen();
$mdSidenav('left').toggle();
});
}
function path() {
return $location.path();
}
function goHome($event) {
menu.selectPage(null, null);
$location.path( '/' );
}
function openPage() {
$scope.closeMenu();
mainContentArea.focus();
}
function isSelected(page) {
return menu.isPageSelected(page);
}
function isSectionSelected(section) {
var selected = false;
var openedSection = menu.openedSection;
if(openedSection === section){
selected = true;
}
else if(section.children) {
section.children.forEach(function(childSection) {
if(childSection === openedSection){
selected = true;
}
});
}
return selected;
}
function isOpen(section) {
return menu.isSectionSelected(section);
}
function toggleOpen(section) {
menu.toggleSelectSection(section);
}
}
]).filter('humanizeDoc', function() {
return function(doc) {
if (!doc) return;
if (doc.type === 'directive') {
return doc.name.replace(/([A-Z])/g, function($1) {
return '-'+$1.toLowerCase();
});
}
return doc.label || doc.name;
}; });
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment