Merge pull request #586 from Kamidu/cloud-3.1.0

cloud relatd ui fixes

components/device-mgt/org.wso2.carbon.device.mgt.ui/src/main/resources/jaggeryapps/devicemgt/app/units/cdmf.unit.ui.header.cloud.user-menu/public/js/user-menu.js

@@ -0,0 +1,29 @@
+/*
+ * Copyright (c) 2017, WSO2 Inc. (http://www.wso2.org) All Rights Reserved.
+ *
+ * WSO2 Inc. licenses this file to you 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.
+ */
+$(document).ready(function () {
+    $('#cloud-menu-popover i.fw-tiles').popover({
+        html: true,
+        trigger:'click',
+        title: function() {
+            return $("#popover-head").html();
+        },
+        content: function() {
+            return $("#popover-content").html();
+        }
+    });
+});

components/device-mgt/org.wso2.carbon.device.mgt.ui/src/main/resources/jaggeryapps/devicemgt/app/units/cdmf.unit.ui.header.cloud.user-menu/user-menu.hbs

@@ -18,7 +18,7 @@
 <ul class="nav navbar-right float-remove-xs text-center-xs">
 
     <li class="visible-inline-block">
-        <a href="#" target="_self" title="kachiex">
+        <a href="#" target="_self" title="{{@user.domain}}">
                         <span class="icon fw-stack fw-lg">
                             <i class="fw fw-organization fw-stack-1x" title=" {{@user.domain}}"></i>
                         </span>
@@ -75,25 +75,38 @@
 
     <li class="visible-inline-block">
 
-        <a href="#" target="null" class="dropdown" data-toggle="dropdown" title="Configure">
+        <a href="#" target="null" class="dropdown" data-toggle="dropdown" title="App Management">
                     <span class="icon fw-stack fw-lg">
-                        <i class="fw fw-settings fw-stack-1x" title="Configure"></i>
+                        <i class="fw fw-settings fw-stack-1x" title="App Management"></i>
                     </span>
             <span class="hidden-xs">
-                        Configure
+                        App Management
             </span>
-            <span class="caret"></span>
+            <!--<span class="caret"></span>-->
         </a>
 
         <ul class="dropdown-menu dropdown-menu-right float-remove-xs position-static-xs text-center-xs remove-margin-xs slideInDown"
             role="menu">
+            <li class="visible-inline-block">
+                <a title="Mobile App Publisher" href="https://devicemgt.clouddev.wso2.com/publisher"
+                   target="_self">
+                    <i class="fw fw-user" title="Mobilr App Publisher"></i> App Publisher
+                </a>
+            </li>
 
+            <li class="visible-inline-block">
+                <a title="App Store " href="https://devicemgt.clouddev.wso2.com/store"
+                   target="_self">
+                    <i class="fw fw-store" title="App Store"></i> App Store
+                </a>
+            </li>
 
         </ul>
     </li>
 
     <li class="visible-inline-block">
-        <a href="https://cloudmgt.clouddev.wso2.com/cloudmgt/site/pages/contact-us.jag" target="_self" title="Support">
+        <a href="https://cloudmgt.clouddev.wso2.com/cloudmgt/site/pages/contact-us.jag" target="_self"
+           title="Support">
 
 
                     <span class="icon fw-stack fw-lg" style="color: #ff8c27;">
@@ -122,28 +135,32 @@
             role="menu">
 
             <li>
-                <a title="API Cloud" href="https://docs.wso2.com/display/APICloud/WSO2+API+Cloud+Documentation"
+                <a title="API Cloud"
+                   href="https://docs.wso2.com/display/APICloud/WSO2+API+Cloud+Documentation"
                    target="_blank">
                     <i class="fw fw-api" title="API Cloud"></i> API Cloud
                 </a>
             </li>
 
             <li>
-                <a title="App Cloud" href="https://docs.wso2.com/display/AppCloud/WSO2+App+Cloud+Documentation"
+                <a title="App Cloud"
+                   href="https://docs.wso2.com/display/AppCloud/WSO2+App+Cloud+Documentation"
                    target="_blank">
                     <i class="fw fw-application" title="App Cloud"></i> App Cloud
                 </a>
             </li>
 
             <li>
-                <a title="App Cloud" href="https://docs.wso2.com/display/AppCloud/WSO2+Device+Cloud+Documentation"
+                <a title="App Cloud"
+                   href="https://docs.wso2.com/display/AppCloud/WSO2+Device+Cloud+Documentation"
                    target="_blank">
                     <i class="fw fw-application" title="App Cloud"></i> Device Cloud
                 </a>
             </li>
 
             <li>
-                <a title="API Cloud Walkthrough" href="https://api.clouddev.wso2.com/publisher?interactiveTutorial=true"
+                <a title="API Cloud Walkthrough"
+                   href="https://api.clouddev.wso2.com/publisher?interactiveTutorial=true"
                    target="_self">
                     <i class="fw fw-document" title="API Cloud Walkthrough"></i> API Cloud Walkthrough
                 </a>
@@ -152,21 +169,6 @@
         </ul>
     </li>
 
-
-    <li class="visible-inline-block">
-        <a title="Mobile App Publisher" href="https://devicemgt.clouddev.wso2.com/publisher" target="_self">
-            <i class="fw fw-user" title="Mobilr App Publisher"></i> App Publisher
-        </a>
-    </li>
-
-    <li class="visible-inline-block">
-        <a title="App Store " href="https://devicemgt.clouddev.wso2.com/store"
-           target="_self">
-            <i class="fw fw-store" title="App Store"></i> App Store
-        </a>
-    </li>
-
-
     <li class="visible-inline-block">
         <a href="#" class="dropdown" data-toggle="dropdown" title="user">
                     <span class="icon fw-stack fw-lg">
@@ -184,7 +186,8 @@
             role="menu">
 
             <li>
-                <a title="Profile" href="https://cloudmgt.clouddev.wso2.com/cloudmgt/site/pages/user-profile.jag"
+                <a title="Profile"
+                   href="https://cloudmgt.clouddev.wso2.com/cloudmgt/site/pages/user-profile.jag"
                    target="_self">
                     <i class="fw fw-user" title="Profile"></i> Profile
                 </a>
@@ -192,13 +195,15 @@
 
             <li>
                 <a title="Change Password"
-                   href="https://cloudmgt.clouddev.wso2.com/cloudmgt/site/pages/change-password.jag" target="_self">
+                   href="https://cloudmgt.clouddev.wso2.com/cloudmgt/site/pages/change-password.jag"
+                   target="_self">
                     <i class="fw fw-lock" title="Change Password"></i> Change Password
                 </a>
             </li>
 
             <li>
-                <a title="Logout" href="https://api.clouddev.wso2.com/publisher/site/pages/logout.jag" target="_self">
+                <a title="Logout" href="https://api.clouddev.wso2.com/publisher/site/pages/logout.jag"
+                   target="_self">
                     <i class="fw fw-sign-out" title="Logout"></i> Logout
                 </a>
             </li>
@@ -217,3 +222,48 @@
         </a>
     </li>
 </ul>
+
+
+<div class="cloud-menu-content hide">
+    <div id="popover-head" class="hide">Navigate to Cloud</div>
+    <div id="popover-content" class="hide">
+        <div class="cloud-apps">
+
+            <a href="https://api.cloud.wso2.com/publisher" target="_self" class="cloud-block add-padding-top-3x">
+                <i class="fw fw-api fw-3x"></i>
+                <div class="cloud-name">API Cloud</div>
+            </a>
+
+            <a href="https://apps.cloud.wso2.com/appmgt" target="_self" class="cloud-block add-padding-top-3x">
+                <i class="fw fw-application fw-3x"></i>
+                <div class="cloud-name">App Cloud</div>
+            </a>
+
+            <a href="https://devicemgt.cloud.wso2.com/devicemgt" target="_self" class="cloud-block add-padding-top-3x">
+                <i class="fw fw-mobile fw-3x"></i>
+                <div class="cloud-name">Device Cloud</div>
+            </a>
+
+            <div class="clearfix"></div><!-- to make seperate -->
+        </div>
+        <div class="cloud-actions">
+            <h3>Manage your cloud</h3>
+
+            <a href="https://cloudmgt.cloud.wso2.com/cloudmgt/site/pages/organization.jag" target="_self" class="cloud-block-invert add-padding-top-3x">
+                <i class="fw fw-organization  fw-3x"></i>
+                <div class="cloud-name">Organization</div>
+            </a>
+
+            <a href="https://cloudmgt.cloud.wso2.com/cloudmgt/site/pages/user.jag" target="_self" class="cloud-block-invert add-padding-top-3x">
+                <i class="fa fa-users  fa-3x"></i>
+                <div class="cloud-name">Members</div>
+            </a>
+
+        </div>
+    </div>
+</div>
+
+
+{{#zone "bottomJs"}}
+    {{js "/js/user-menu.js"}}
+{{/zone}}

components/device-mgt/org.wso2.carbon.device.mgt.ui/src/main/resources/jaggeryapps/devicemgt/app/units/cdmf.unit.ui.header.logo/logo.hbs

@@ -15,5 +15,11 @@
   specific language governing permissions and limitations
   under the License.
 }}
+
+{{#if isCloud}}
+    {{#zone "productName"}}WSO2 Cloud{{/zone}}
+    {{#zone "productNameResponsive"}}WSO2 Cloud{{/zone}}
+{{else}}
     {{#zone "productName"}}WSO2 IoT Server{{/zone}}
     {{#zone "productNameResponsive"}}WSO2 IoT Server{{/zone}}
+{{/if}}

components/device-mgt/org.wso2.carbon.device.mgt.ui/src/main/resources/jaggeryapps/devicemgt/app/units/cdmf.unit.ui.header.logo/logo.js

@@ -0,0 +1,24 @@
+/*
+ * Copyright (c) 2015, WSO2 Inc. (http://www.wso2.org) All Rights Reserved.
+ *
+ * WSO2 Inc. licenses this file to you 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.
+ */
+
+function onRequest(context) {
+    var mdmProps = require("/app/modules/conf-reader/main.js")["conf"];
+    var viewModal = {};
+    viewModal.isCloud = mdmProps["isCloud"];
+    return viewModal;
+}

components/device-mgt/org.wso2.carbon.device.mgt.ui/src/main/resources/jaggeryapps/devicemgt/app/units/cdmf.unit.ui.theme/public/css/custom-common.css

@@ -109,3 +109,126 @@
 header .brand h1 {
     text-transform: none !important;
 }
+
+.visible-inline-block {
+    display: inline-block !important;
+}
+
+.cloud-menu .popover {
+    border-radius: 0px;
+    width: 24em;
+    left: -21.1em !important;
+    max-width: 32em;
+    background-color: #006690
+}
+.cloud-menu .popover-title,.navbar-header .popover-title {
+    background-color: #006690;
+    font-size: 16px;
+    border-bottom: none;
+    font-weight: 400;
+}
+.cloud-menu .popover.bottom>.arrow{
+    margin-left:-2px;
+}
+.cloud-menu .popover.bottom>.arrow:after,.navbar-header .popover.bottom>.arrow:after{
+    border-bottom-color: #006690;
+}
+.cloud-block {
+    float: left;
+    width: 8.2em;
+    height: 8.2em;
+    background-color: #fff;
+    margin: 0.5em 0em 0.5em 0.5em;
+    text-align: center;
+    vertical-align: middle;
+}
+.cloud-name {
+    font-size:14px;
+    margin-top: .5em;
+    font-weight: 400;
+}
+.cloud-menu-popover {
+    position: relative;
+    float: right;
+    padding: 0px 8px;
+    background-color: transparent;
+    background-image: none;
+    border: 1px solid transparent;
+    border-radius: 4px;
+    color: #fff;
+    cursor: pointer;
+}
+#cloud-menu-popover-xs {
+    color: #fff;
+    line-height:24px;
+    border: none;
+    margin-right: 15px!important;
+}
+.navbar-toggle{
+    border:none;
+    border-radius: 0px;
+}
+.navbar-header .popover {
+    border-radius: 0px;
+    width: 21em;
+    max-width:32em;
+    background-color: #006690;
+}
+.navbar-header .popover .popover-content{
+    padding:0px;
+}
+.cloud-menu .popover-content {
+    padding: 0px;
+}
+.cloud-actions {
+    background-color: #005578;
+    float: left;
+    position: absolute;
+    width: 100%;
+    left: 0px;
+    overflow:hidden;
+}
+.cloud-actions h3 {
+    font-size: 16px;
+    font-weight: 400;
+    padding-left: 14px;
+    margin-top: 10px;
+}
+.cloud-block-invert {
+    color: #fff;
+    float: left;
+    width: 8.2em;
+    height: 8.2em;
+    background-color: #1f1f1f;
+    margin: 0.5em 0em 0.5em 0.5em;
+    text-align: center;
+    cursor: pointer;
+}
+
+.cloud-block-default {
+    color: #006690;
+    background-color: #fff;
+    cursor: pointer;
+}
+.cloud-actions a:hover {
+    color: #d7d5d5;
+    background-color: #3d3d3d;
+    text-decoration: none
+}
+.cloud-apps a {
+    text-decoration: none;
+    color: #006690 !important;
+    cursor: pointer
+}
+.cloud-apps a:hover {
+    text-decoration: none;
+    color: #006690;
+    background-color: #c5c5c5;
+}
+.cloud-apps .cloud-actions a {
+    color: #fff
+}
+
+.add-padding-top-3x {
+    padding-top: 15px !important;
+}