adding calipso ui

Change-Id: Ifa6f63daebb07f45580f747341960e898fdb00c4
Signed-off-by: Koren Lev <korenlev@gmail.com>

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;
+