diff options
Diffstat (limited to 'ui/imports/ui/components/detailed-node-info-box')
3 files changed, 143 insertions, 0 deletions
diff --git a/ui/imports/ui/components/detailed-node-info-box/detailed-node-info-box.html b/ui/imports/ui/components/detailed-node-info-box/detailed-node-info-box.html new file mode 100644 index 0000000..f8c7221 --- /dev/null +++ b/ui/imports/ui/components/detailed-node-info-box/detailed-node-info-box.html @@ -0,0 +1,53 @@ +<!-- +######################################################################################## +# Copyright (c) 2017 Koren Lev (Cisco Systems), Yaron Yogev (Cisco Systems) and others # +# # +# All rights reserved. This program and the accompanying materials # +# are made available under the terms of the Apache License, Version 2.0 # +# which accompanies this distribution, and is available at # +# http://www.apache.org/licenses/LICENSE-2.0 # +######################################################################################## + --> +<template name="DetailedNodeInfoBox"> +<div class="os-detailed-node-info-box cards-450 white"> + <div class="sm-icon-segment"> + </div> + <div class="sm-info-segment"> + <div class="sm-info-title">{{ node.type }} - {{#if node.objectName }}{{ node.objectName }}{{else}} {{ node.name }}{{/if}}</div> + <div class="sm-info-bits"> + <div class="cl-info-bit"> + <div class="cl-label">Environment</div> + <div class="cl-data"><div class="">{{ node.environment }}</div></div> + </div> + <div class="cl-info-bit"> + <div class="cl-label">Name</div> + <div class="cl-data"><div class="">{{ node.name }}</div></div> + </div> + <div class="cl-info-bit"> + <div class="cl-label">Parent Id</div> + <div class="cl-data"><div class="">{{ node.parent_id }}</div></div> + </div> + <div class="cl-info-bit"> + <div class="cl-label">Host</div> + <div class="cl-data"><div class="">{{ node.host }}</div></div> + </div> + <div class="cl-info-bit"> + <div class="cl-label">Last Scanned</div> + <div class="cl-data"><div class="">{{ node.last_scanned }}</div></div> + </div> + <div class="cl-info-bit"> + <div class="cl-label">Configurations</div> + <div class="cl-data"><div class="">{{ node.configurations }}</div></div> + </div> + <div class="cl-info-bit"> + <div class="cl-label">Agent Type</div> + <div class="cl-data"><div class="">{{ node.agent_type }}</div></div> + </div> + <div class="cl-info-bit"> + <div class="cl-label">Admin State Up</div> + <div class="cl-data"><div class="">{{ node.admin_state_up }}</div></div> + </div> + </div> + </div> +</div> +</template> diff --git a/ui/imports/ui/components/detailed-node-info-box/detailed-node-info-box.js b/ui/imports/ui/components/detailed-node-info-box/detailed-node-info-box.js new file mode 100644 index 0000000..1f0917f --- /dev/null +++ b/ui/imports/ui/components/detailed-node-info-box/detailed-node-info-box.js @@ -0,0 +1,57 @@ +///////////////////////////////////////////////////////////////////////////////////////// +// Copyright (c) 2017 Koren Lev (Cisco Systems), Yaron Yogev (Cisco Systems) and others / +// / +// All rights reserved. This program and the accompanying materials / +// are made available under the terms of the Apache License, Version 2.0 / +// which accompanies this distribution, and is available at / +// http://www.apache.org/licenses/LICENSE-2.0 / +///////////////////////////////////////////////////////////////////////////////////////// +/* + * Template Component: DetailedNodeInfoBox + */ + +//import { Meteor } from 'meteor/meteor'; +import { Template } from 'meteor/templating'; +import { SimpleSchema } from 'meteor/aldeed:simple-schema'; +import { ReactiveDict } from 'meteor/reactive-dict'; + +import './detailed-node-info-box.html'; + +/* + * Lifecycles + */ + +Template.DetailedNodeInfoBox.onCreated(function() { + var instance = this; + instance.state = new ReactiveDict(); + instance.state.setDefault({ + }); + + instance.autorun(function () { + let data = Template.currentData(); + new SimpleSchema({ + node: { type: Object, blackbox: true }, + }).validate(data); + }); +}); + +/* +Template.DetailedNodeInfoBox.rendered = function() { +}; +*/ + +/* + * Events + */ + +Template.DetailedNodeInfoBox.events({ +}); + +/* + * Helpers + */ + +Template.DetailedNodeInfoBox.helpers({ +}); + + diff --git a/ui/imports/ui/components/detailed-node-info-box/detailed-node-info-box.styl b/ui/imports/ui/components/detailed-node-info-box/detailed-node-info-box.styl new file mode 100644 index 0000000..d51b393 --- /dev/null +++ b/ui/imports/ui/components/detailed-node-info-box/detailed-node-info-box.styl @@ -0,0 +1,33 @@ +.os-detailed-node-info-box + display: flex; + flex-flow: row nowrap; + + .sm-icon-segment + flex: 0 1 70px; + + .sm-info-segment + flex: 1; + display: flex; + flex-flow: column nowrap; + + .sm-info-title + color: #0a9ad7; + font-size: 2em; + border-bottom: 3px solid #0a9ad7; + line-height: 1.5em; + + .sm-info-bits + padding: 5px 0px; + + display: flex; + flex-flow: column nowrap; + + .cl-info-bit + display: flex; + flex-flow: row nowrap; + + .cl-label + flex: 0 0 110px; + color: black; + font-weight: bold; + |