atlas-commits mailing list archives

Site index · List index
Message view « Date » · « Thread »
Top « Date » · « Thread »
From suma...@apache.org
Subject [2/9] incubator-atlas git commit: ATLAS-886 : Improve association of terms with entity (Show tree view)
Date Mon, 20 Jun 2016 18:50:03 GMT
ATLAS-886 : Improve association of terms with entity (Show tree view)


Project: http://git-wip-us.apache.org/repos/asf/incubator-atlas/repo
Commit: http://git-wip-us.apache.org/repos/asf/incubator-atlas/commit/59bd56c8
Tree: http://git-wip-us.apache.org/repos/asf/incubator-atlas/tree/59bd56c8
Diff: http://git-wip-us.apache.org/repos/asf/incubator-atlas/diff/59bd56c8

Branch: refs/heads/0.7-incubating
Commit: 59bd56c8ef8f8794f8e1dd8785d8f78363c91da5
Parents: 8c1c969
Author: Keval Bhatt <keval.bhatt@freestoneinfotech.com>
Authored: Tue Jun 14 18:09:57 2016 +0530
Committer: Suma Shivaprasad <sumasai.shivaprasad@gmail.com>
Committed: Fri Jun 17 18:17:36 2016 -0700

----------------------------------------------------------------------
 .../public/css/scss/business-catlog.scss        |   3 +
 dashboardv2/public/css/scss/main.scss           |  56 +-
 dashboardv2/public/css/scss/override.scss       |  12 +-
 dashboardv2/public/css/scss/tag.scss            |  11 +
 dashboardv2/public/css/scss/theme.scss          |   2 +-
 dashboardv2/public/css/scss/tree.scss           |  55 +-
 dashboardv2/public/js/router/Router.js          |  16 +-
 .../AddTermToEntityLayoutView_tmpl.html         |  13 +-
 .../BusinessCatalogLayoutView_tmpl.html         |  18 +-
 .../business_catalog/TreeLayoutView_tmpl.html   |  33 +
 .../search/SearchResultLayoutView_tmpl.html     |   2 +-
 .../templates/tag/createTagLayoutView_tmpl.html |   2 +-
 .../public/js/utils/CommonViewFunction.js       | 140 +++-
 dashboardv2/public/js/utils/Messages.js         |   3 +-
 dashboardv2/public/js/utils/Overrides.js        |  24 +
 .../AddTermToEntityLayoutView.js                |  60 +-
 .../BusinessCatalogDetailLayoutView.js          |   2 +-
 .../business_catalog/BusinessCatalogHeader.js   |  44 +-
 .../BusinessCatalogLayoutView.js                | 569 +---------------
 .../js/views/business_catalog/TreeLayoutView.js | 653 +++++++++++++++++++
 .../public/js/views/schema/SchemaLayoutView.js  |  50 +-
 .../js/views/search/SearchResultLayoutView.js   |  66 +-
 22 files changed, 1072 insertions(+), 762 deletions(-)
----------------------------------------------------------------------


http://git-wip-us.apache.org/repos/asf/incubator-atlas/blob/59bd56c8/dashboardv2/public/css/scss/business-catlog.scss
----------------------------------------------------------------------
diff --git a/dashboardv2/public/css/scss/business-catlog.scss b/dashboardv2/public/css/scss/business-catlog.scss
index 1b364af..572c51e 100644
--- a/dashboardv2/public/css/scss/business-catlog.scss
+++ b/dashboardv2/public/css/scss/business-catlog.scss
@@ -31,6 +31,9 @@
 .dropdown-menu > li > a {
     color: $color_jungle_green_approx;
     padding: 6px 20px;
+    text-overflow: ellipsis;
+    max-width: 276px;
+    overflow: hidden;
 }
 
 .branchListParent {

http://git-wip-us.apache.org/repos/asf/incubator-atlas/blob/59bd56c8/dashboardv2/public/css/scss/main.scss
----------------------------------------------------------------------
diff --git a/dashboardv2/public/css/scss/main.scss b/dashboardv2/public/css/scss/main.scss
index 933bc19..1311662 100644
--- a/dashboardv2/public/css/scss/main.scss
+++ b/dashboardv2/public/css/scss/main.scss
@@ -119,10 +119,6 @@ a {
     }
 }
 
-hr {
-    border-top: 1px solid $color_mirage_approx
-}
-
 th {
     text-transform: capitalize;
 }
@@ -172,7 +168,57 @@ ul {
     border: 1px solid $color_jungle_green_approx;
     cursor: pointer;
 }
+
 .add-seperator {
     margin-bottom: 10px;
     border-bottom: 1px solid $color_mirage_approx
-}
\ No newline at end of file
+}
+
+.termTableBreadcrumb {
+    min-width: 200px;
+    /*   width: 200px; */
+    /*  display: inline-block; */
+    i {
+        cursor: pointer;
+    }
+    .liContent {
+        /*  width: 150px; */
+        float: left;
+        line-height: 21px !important;
+        padding: 0px 10px 0px 0px !important;
+    }
+}
+
+.table-quickMenu > tbody > tr > td {
+    &.searchTerm {
+        overflow: visible;
+    }
+    &.searchTag {}
+}
+
+.tab-content >.tab-pane {
+    display: block;
+    opacity: 0;
+    height: 0;
+    padding: 0px;
+    overflow: hidden;
+    &.active {
+        padding: 25px;
+        opacity: 1;
+        height: auto;
+        overflow: auto;
+    }
+}
+
+.ellipsis {
+    text-overflow: ellipsis;
+    max-width: 98%;
+    overflow: hidden;
+}
+
+.modal-body {
+    .table {
+        table-layout: fixed;
+        word-wrap: break-word;
+    }
+}

http://git-wip-us.apache.org/repos/asf/incubator-atlas/blob/59bd56c8/dashboardv2/public/css/scss/override.scss
----------------------------------------------------------------------
diff --git a/dashboardv2/public/css/scss/override.scss b/dashboardv2/public/css/scss/override.scss
index 76edcb2..6fc1e1f 100644
--- a/dashboardv2/public/css/scss/override.scss
+++ b/dashboardv2/public/css/scss/override.scss
@@ -20,7 +20,7 @@
 .modal-footer {
     padding: 15px;
     text-align: right;
-    border: 1px solid #DEDEDE;
+    border-top: 1px solid #DEDEDE;
 }
 
 .modal-body {
@@ -119,3 +119,13 @@
         padding-left: 12px;
     }
 }
+
+.fixedPopover {
+    position: fixed;
+}
+
+.popover.fade {
+    -webkit-transition: ease-in .1s ease-out;
+    -o-transition: ease-in .1s ease-out;
+    transition: ease-in .1s ease-out;
+}

http://git-wip-us.apache.org/repos/asf/incubator-atlas/blob/59bd56c8/dashboardv2/public/css/scss/tag.scss
----------------------------------------------------------------------
diff --git a/dashboardv2/public/css/scss/tag.scss b/dashboardv2/public/css/scss/tag.scss
index fb10ed0..b69fcd2 100644
--- a/dashboardv2/public/css/scss/tag.scss
+++ b/dashboardv2/public/css/scss/tag.scss
@@ -109,6 +109,7 @@
     float: left;
     cursor: pointer;
     background-color: $white;
+    white-space: nowrap;
     i.fa {
         position: relative;
         right: -5px;
@@ -120,6 +121,16 @@
     }
 }
 
+.inputTagGreen {
+    border: 1px $color_jungle_green_approx solid;
+    background-color: $white;
+    color: $color_jungle_green_approx;
+    &:hover {
+        color: $white;
+        background-color: $color_jungle_green_approx;
+    }
+}
+
 .addTagBase {
     padding: 2px 8px;
     border: 1px solid $action_gray;

http://git-wip-us.apache.org/repos/asf/incubator-atlas/blob/59bd56c8/dashboardv2/public/css/scss/theme.scss
----------------------------------------------------------------------
diff --git a/dashboardv2/public/css/scss/theme.scss b/dashboardv2/public/css/scss/theme.scss
index 6f0ca41..b05f7a2 100644
--- a/dashboardv2/public/css/scss/theme.scss
+++ b/dashboardv2/public/css/scss/theme.scss
@@ -2,7 +2,7 @@
 
 .user-dropdown {
     display: inline-block;
-    padding: 20px;
+    padding: 14px;
     color: $color_ironside_gray_approx;
     .user-circle {
         padding: 8px 10px;

http://git-wip-us.apache.org/repos/asf/incubator-atlas/blob/59bd56c8/dashboardv2/public/css/scss/tree.scss
----------------------------------------------------------------------
diff --git a/dashboardv2/public/css/scss/tree.scss b/dashboardv2/public/css/scss/tree.scss
index 139b1bb..e6c8ebf 100644
--- a/dashboardv2/public/css/scss/tree.scss
+++ b/dashboardv2/public/css/scss/tree.scss
@@ -22,16 +22,6 @@
             // color: $white;
             display: block;
         }
-        // .jstree-node[aria-selected="true"]:before {
-        //     content: "";
-        //     position: absolute;
-        //     height: 33px;
-        //     background: $color_jungle_green_approx;
-        //     top: 0px;
-        //     left: -100%;
-        //     right: -100%;
-        //     z-index: -1;
-        // }
     }
     
     .taxonomyTree {
@@ -139,3 +129,48 @@
     .alertTerm {
         color: #FF0000 !important;
     }
+    /**Css changes**/
+    
+    .modal-body {
+        .add-seperator {
+            border: none;
+        }
+        .taxonomyTree li {
+            .children {
+                text-indent: 20px;
+            }
+            &.parentChild {
+                ul {
+                    padding-left: 0px;
+                }
+                li {
+                    &.children {
+                        width: 100%;
+                    }
+                    a {
+                        max-width: 100%;
+                    }
+                }
+            }
+            &.active {
+                color: $concrete;
+                a {
+                    color: $concrete;
+                }
+            }
+            a {
+                color: #6C6C6C;
+            }
+            &.children:hover {
+                a {
+                    color: $concrete;
+                }
+                background-color: #ABABAB;
+                color: $white;
+            }
+            .tools {
+                text-indent: 0px;
+                background: none;
+            }
+        }
+    }

http://git-wip-us.apache.org/repos/asf/incubator-atlas/blob/59bd56c8/dashboardv2/public/js/router/Router.js
----------------------------------------------------------------------
diff --git a/dashboardv2/public/js/router/Router.js b/dashboardv2/public/js/router/Router.js
index 64605bd..3d2e785 100644
--- a/dashboardv2/public/js/router/Router.js
+++ b/dashboardv2/public/js/router/Router.js
@@ -112,26 +112,12 @@ define([
                 this.collection = new VCatalogList();
                 this.collection.url = url;
                 App.rNHeader.show(new BusinessCatalogHeader({ 'globalVent': that.globalVent, 'url': url, 'collection': this.collection }));
-                // App.rSideNav.show(new SideNavLayoutView({ 'globalVent': that.globalVent, 'url': url }));
                 if (!App.rSideNav.currentView) {
                     App.rSideNav.show(new SideNavLayoutView({ 'globalVent': that.globalVent, 'url': url }));
                 } else {
-                    var view = App.rSideNav.currentView.RBusinessCatalogLayoutView.currentView;
-                    if (view.dblClick == false && view.singleClick == false && !Globals.saveApplicationState.tabState.stateChanged) {
-                        if (paramObj && paramObj.back == "true") {
-                            App.rSideNav.currentView.RBusinessCatalogLayoutView.currentView.manualRender(url, true, true);
-                        } else {
-                            App.rSideNav.currentView.RBusinessCatalogLayoutView.currentView.manualRender(url, true);
-                        }
-                        view.dblClick == false;
-                    } else if (view.singleClick) {
-                        view.singleClick = false;
-                    }
+                    App.rSideNav.currentView.RBusinessCatalogLayoutView.currentView.manualRender("/" + url);
                     App.rSideNav.currentView.selectTab();
                 }
-                if (Globals.saveApplicationState.tabState.stateChanged) {
-                    Globals.saveApplicationState.tabState.stateChanged = false;
-                }
                 App.rNContent.show(new BusinessCatalogDetailLayoutView({
                     'globalVent': that.globalVent,
                     'url': url,

http://git-wip-us.apache.org/repos/asf/incubator-atlas/blob/59bd56c8/dashboardv2/public/js/templates/business_catalog/AddTermToEntityLayoutView_tmpl.html
----------------------------------------------------------------------
diff --git a/dashboardv2/public/js/templates/business_catalog/AddTermToEntityLayoutView_tmpl.html b/dashboardv2/public/js/templates/business_catalog/AddTermToEntityLayoutView_tmpl.html
index f84f47d..36cf43a 100644
--- a/dashboardv2/public/js/templates/business_catalog/AddTermToEntityLayoutView_tmpl.html
+++ b/dashboardv2/public/js/templates/business_catalog/AddTermToEntityLayoutView_tmpl.html
@@ -14,15 +14,4 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
 -->
-<div class="row">
-    <div name="tagDefinitionform" class="css-form">
-        <div class="form-group">
-            <label class="control-label col-sm-4">Term</label>
-            <div class="col-sm-8 input-spacing">
-                <select class="form-control" data-id="addTermOptions" required>
-                </select>
-            </div>
-        </div>
-    </div>
-</div>
-</div>
+<div id="r_treeLayoutView"></div>

http://git-wip-us.apache.org/repos/asf/incubator-atlas/blob/59bd56c8/dashboardv2/public/js/templates/business_catalog/BusinessCatalogLayoutView_tmpl.html
----------------------------------------------------------------------
diff --git a/dashboardv2/public/js/templates/business_catalog/BusinessCatalogLayoutView_tmpl.html b/dashboardv2/public/js/templates/business_catalog/BusinessCatalogLayoutView_tmpl.html
index 5923da9..36cf43a 100644
--- a/dashboardv2/public/js/templates/business_catalog/BusinessCatalogLayoutView_tmpl.html
+++ b/dashboardv2/public/js/templates/business_catalog/BusinessCatalogLayoutView_tmpl.html
@@ -14,20 +14,4 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
 -->
-<div class="form-group">
-    <select type="text" class="form-control" data-id="searchTermInput" placeholder="Search term"></select>
-</div>
-<div class="clearfix">
-    <button class="btn btn-atlasAction btn-atlas pull-left" data-id="backTaxanomy"><i class="fa fa-chevron-left"></i> Back</button>
-    <button class="btn btn-atlasAction btn-atlas pull-right" onclick="this.blur();" data-id="refreshTaxanomy"><i class="fa fa-refresh"></i> Refresh</button>
-</div>
-<div class="">
-    <ul class="taxonomyTree">
-        <div class="contentLoading"></div>
-        <li class="children parent" data-id="Parent"></li>
-        <li class="childs parentChild">
-            <ul data-id="childList">
-            </ul>
-        </li>
-    </ul>
-</div>
+<div id="r_treeLayoutView"></div>

http://git-wip-us.apache.org/repos/asf/incubator-atlas/blob/59bd56c8/dashboardv2/public/js/templates/business_catalog/TreeLayoutView_tmpl.html
----------------------------------------------------------------------
diff --git a/dashboardv2/public/js/templates/business_catalog/TreeLayoutView_tmpl.html b/dashboardv2/public/js/templates/business_catalog/TreeLayoutView_tmpl.html
new file mode 100644
index 0000000..b915680
--- /dev/null
+++ b/dashboardv2/public/js/templates/business_catalog/TreeLayoutView_tmpl.html
@@ -0,0 +1,33 @@
+<!--
+ * Licensed to the Apache Software Foundation (ASF) under one or more
+ * contributor license agreements.  See the NOTICE file distributed with
+ * this work for additional information regarding copyright ownership.
+ * The ASF 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.
+-->
+<div class="clearfix add-seperator">
+    <button class="btn btn-atlasAction btn-atlas pull-left" data-id="backTaxanomy"><i class="fa fa-chevron-left"></i> Back</button>
+    <button class="btn btn-atlasAction btn-atlas pull-right" onclick="this.blur();" title="Refresh" data-id="refreshTaxanomy"><i class="fa fa-refresh"></i></button>
+</div>
+<div>
+    <select type="text" class="form-control" data-id="searchTermInput" placeholder="Search term"></select>
+</div>
+<div class="">
+    <ul class="taxonomyTree">
+        <div class="contentLoading"></div>
+        <li class="children parent" data-id="Parent"></li>
+        <li class="childs parentChild">
+            <ul data-id="childList">
+            </ul>
+        </li>
+    </ul>
+</div>

http://git-wip-us.apache.org/repos/asf/incubator-atlas/blob/59bd56c8/dashboardv2/public/js/templates/search/SearchResultLayoutView_tmpl.html
----------------------------------------------------------------------
diff --git a/dashboardv2/public/js/templates/search/SearchResultLayoutView_tmpl.html b/dashboardv2/public/js/templates/search/SearchResultLayoutView_tmpl.html
index 8d7dd6e..e3b3cc9 100644
--- a/dashboardv2/public/js/templates/search/SearchResultLayoutView_tmpl.html
+++ b/dashboardv2/public/js/templates/search/SearchResultLayoutView_tmpl.html
@@ -18,6 +18,6 @@
     <div class="fontLoader">
         <i class="fa fa-refresh fa-spin-custom"></i>
     </div>
-    <span class="searchResult" style=" font-size: 16px;"></span>
+    <div class="ellipsis"><span class="searchResult" style=" font-size: 16px;"></span></div>
     <div id="r_searchResultTableLayoutView" class="searchTable"></div>
 </div>

http://git-wip-us.apache.org/repos/asf/incubator-atlas/blob/59bd56c8/dashboardv2/public/js/templates/tag/createTagLayoutView_tmpl.html
----------------------------------------------------------------------
diff --git a/dashboardv2/public/js/templates/tag/createTagLayoutView_tmpl.html b/dashboardv2/public/js/templates/tag/createTagLayoutView_tmpl.html
index 57836ed..b990130 100644
--- a/dashboardv2/public/js/templates/tag/createTagLayoutView_tmpl.html
+++ b/dashboardv2/public/js/templates/tag/createTagLayoutView_tmpl.html
@@ -21,7 +21,7 @@
         <input class="form-control row-margin-bottom" data-id="tagName" placeholder="Name(required)" autofocus>
         </input>
         {{else}}
-        <h4><span data-id="title"></span></h4>
+        <h4 class="ellipsis"><span data-id="title"></span></h4>
         </input>
         {{/if}}
         <input class="form-control row-margin-bottom" data-id="description" value="{{description}}" placeholder="Description">

http://git-wip-us.apache.org/repos/asf/incubator-atlas/blob/59bd56c8/dashboardv2/public/js/utils/CommonViewFunction.js
----------------------------------------------------------------------
diff --git a/dashboardv2/public/js/utils/CommonViewFunction.js b/dashboardv2/public/js/utils/CommonViewFunction.js
index 2b1ff4d..be028a4 100644
--- a/dashboardv2/public/js/utils/CommonViewFunction.js
+++ b/dashboardv2/public/js/utils/CommonViewFunction.js
@@ -25,9 +25,9 @@ define(['require', 'utils/Utils', 'modules/Modal', 'utils/Messages'], function(r
         if (tagName) {
             var tagOrTerm = Utils.checkTagOrTerm(tagName);
             if (tagOrTerm.term) {
-                msg = "<b>Term: " + tagName + "</b>";
+                msg = "<div class='ellipsis'><b>Term: " + tagName + "</b></div>";
             } else {
-                msg = "<b>Tag: " + tagName + "</b>";
+                msg = "<div class='ellipsis'><b>Tag: " + tagName + "</b></div>";
             }
         }
         var modal = new Modal({
@@ -197,6 +197,142 @@ define(['require', 'utils/Utils', 'modules/Modal', 'utils/Messages'], function(r
         });
         return table;
     }
+    CommonViewFunction.breadcrumbUrlMaker = function(url) {
+        if (url) {
+            var urlList = [];
+            var splitURL = url.split("api/atlas/v1/taxonomies/");
+            if (splitURL.length > 1) {
+                var splitUrlWithoutTerm = splitURL[1].split("/terms/");
+                if (splitUrlWithoutTerm.length == 1) {
+                    splitUrlWithoutTerm = splitUrlWithoutTerm[0].split("/");
+                }
+            } else {
+                var splitUrlWithoutTerm = splitURL[0].split("/terms/");
+                if (splitUrlWithoutTerm.length == 1) {
+                    splitUrlWithoutTerm = splitUrlWithoutTerm[0].split("/");
+                }
+            }
+
+            var href = "";
+            for (var i in splitUrlWithoutTerm) {
+                if (i == 0) {
+                    href = splitUrlWithoutTerm[i];
+                    urlList.push({
+                        value: splitUrlWithoutTerm[i],
+                        href: href
+                    });
+                } else {
+                    href += "/terms/" + splitUrlWithoutTerm[i];
+                    urlList.push({
+                        value: splitUrlWithoutTerm[i],
+                        href: href
+                    });
+                };
+            }
+            return urlList;
+        }
+    }
+    CommonViewFunction.breadcrumbMaker = function(options) {
+        var li = "";
+        if (options.urlList) {
+            _.each(options.urlList, function(object) {
+                li += '<li><a href="javascript:void(0)" class="link" data-href="/api/atlas/v1/taxonomies/' + object.href + '">' + object.value + '</a></li>';
+            });
+        }
+        if (options.scope) {
+            options.scope.html(li);
+            options.scope.asBreadcrumbs("destroy");
+            options.scope.asBreadcrumbs({
+                namespace: 'breadcrumb',
+                overflow: "left",
+                dropicon: "fa fa-ellipsis-h",
+                dropdown: function() {
+                    return '<div class=\"dropdown\">' +
+                        '<a href=\"javascript:void(0);\" class=\"' + this.namespace + '-toggle\" data-toggle=\"dropdown\"><i class=\"' + this.dropicon + '\"</i></a>' +
+                        '<ul class=\"' + this.namespace + '-menu dropdown-menu popover bottom arrowPosition \" ><div class="arrow"></div></ul>' +
+                        '</div>';
+                },
+                dropdownContent: function(a) {
+                    return '<li><a class="link" href="javascript:void(0)" data-href="' + a.find('a').data('href') + '" class="dropdown-item">' + a.text() + "</a></li>";
+                }
+            });
+        }
+        options.scope.find('li a.link').click(function() {
+            Utils.setUrl({
+                url: "#!/taxonomy/detailCatalog" + $(this).data('href') + "?load=true",
+                mergeBrowserUrl: false,
+                trigger: true,
+                updateTabState: function() {
+                    return { taxonomyUrl: this.url, stateChanged: false };
+                }
+            });
+        });
+    }
+    CommonViewFunction.termTableBreadcrumbMaker = function(model) {
+        var traits = model.get('$traits$'),
+            url = "",
+            deleteHtml = "";
+        _.keys(traits).map(function(key) {
+            var tagName = Utils.checkTagOrTerm(traits[key].$typeName$);
+            if (tagName.term) {
+                deleteHtml = '<a class="pull-left" title="Delete Term"><i class="fa fa-trash" data-id="tagClick" data-name="' + traits[key].$typeName$ + '" data-guid="' + model.get('$id$').id + '" ></i></a>';
+                url = traits[key].$typeName$.split(".").join("/");
+            }
+        });
+        if (url.length == 0) {
+            if (model.get('$id$')) {
+                return {
+                    html: ' <a href="javascript:void(0)" class="inputAssignTag" data-id="addTerm" data-guid="' + model.get('$id$').id + '"><i class="fa fa-folder-o"><span> Assign Term</span></i></a>'
+                }
+            } else {
+                return {
+                    html: ' <a href="javascript:void(0)" class="inputAssignTag" data-id="addTerm"><i class="fa fa-folder-o"><span> Assign Term</span></i></a>'
+                }
+            }
+        } else {
+            var value = CommonViewFunction.breadcrumbUrlMaker(url),
+                id = model.get('$id$').id
+            if (id && value) {
+                return {
+                    html: '<div class="termTableBreadcrumb" dataTerm-id="' + id + '"><div class="liContent"></div>' + deleteHtml + '</div>',
+                    object: { scopeId: id, value: value }
+                }
+
+            } else {
+                return {
+                    html: '<div class="termTableBreadcrumb"></div>'
+                }
+            }
+        }
+    }
+    CommonViewFunction.tagForTable = function(model) {
+        var traits = model.get('$traits$'),
+            atags = "",
+            addTag = "",
+            count = 0;
+        _.keys(model.get('$traits$')).map(function(key) {
+            var tagName = Utils.checkTagOrTerm(traits[key].$typeName$),
+                className = "inputTag";
+            if (!tagName.term) {
+                if (count >= 1) {
+                    className += " hide";
+                }
+                ++count;
+                atags += '<a class="' + className + '" data-id="tagClick">' + traits[key].$typeName$ + '<i class="fa fa-times" data-id="delete" data-name="' + tagName.name + '" data-guid="' + model.get('$id$').id + '" ></i></a>';
+            }
+        });
+
+        if (model.get('$id$')) {
+            addTag += '<a href="javascript:void(0)" data-id="addTag" class="inputTag" data-guid="' + model.get('$id$').id + '" ><i style="right:0" class="fa fa-plus"></i></a>';
+        } else {
+            addTag += '<a href="javascript:void(0)" data-id="addTag" class="inputTag"><i style="right:0" class="fa fa-plus"></i></a>';
+        }
+        if (count > 1) {
+            addTag += '<a  href="javascript:void(0)" data-id="showMoreLess" class="inputTag inputTagGreen"><span>Show More </span><i class="fa fa-angle-right"></i></a>'
+        }
+        return '<div class="tagList">' + atags + addTag + '</div>';
+
+    }
     CommonViewFunction.userDataFetch = function(options) {
         if (options.url) {
             $.ajax({

http://git-wip-us.apache.org/repos/asf/incubator-atlas/blob/59bd56c8/dashboardv2/public/js/utils/Messages.js
----------------------------------------------------------------------
diff --git a/dashboardv2/public/js/utils/Messages.js b/dashboardv2/public/js/utils/Messages.js
index 257d5e0..b94df69 100644
--- a/dashboardv2/public/js/utils/Messages.js
+++ b/dashboardv2/public/js/utils/Messages.js
@@ -27,7 +27,8 @@ define(['require'], function(require) {
         deleteSuccessMessage: " has been deleted successfully",
         deleteErrorMessage: " could not be deleted",
         addAttributeSuccessMessage: "Tag attribute is added successfully",
-        updateTagDescriptionMessage: "Tag description is updated successfully"
+        updateTagDescriptionMessage: "Tag description is updated successfully",
+        updateTermDescriptionMessage: "Term description is updated successfully",
     };
     return Messages;
 });

http://git-wip-us.apache.org/repos/asf/incubator-atlas/blob/59bd56c8/dashboardv2/public/js/utils/Overrides.js
----------------------------------------------------------------------
diff --git a/dashboardv2/public/js/utils/Overrides.js b/dashboardv2/public/js/utils/Overrides.js
index d46a94f..3f9dd0c 100644
--- a/dashboardv2/public/js/utils/Overrides.js
+++ b/dashboardv2/public/js/utils/Overrides.js
@@ -18,6 +18,7 @@
 
 define(['require', 'backgrid', 'asBreadcrumbs'], function(require) {
     'use strict';
+
     $.asBreadcrumbs.prototype.generateChildrenInfo = function() {
         var self = this;
         this.$children.each(function() {
@@ -38,6 +39,29 @@ define(['require', 'backgrid', 'asBreadcrumbs'], function(require) {
             return (this.length > n) ? this.substr(0, n - 1) + '...' : this;
         };
     /*
+     * Overriding Cell for adding custom className to Cell i.e <td>
+     */
+    var cellInit = Backgrid.Cell.prototype.initialize;
+    Backgrid.Cell.prototype.initialize = function() {
+            cellInit.apply(this, arguments);
+            var className = this.column.get('className');
+            if (className) this.$el.addClass(className);
+        }
+        /*
+         * Overriding Cell for adding custom width to Cell i.e <td>
+         */
+    Backgrid.HeaderRow = Backgrid.HeaderRow.extend({
+        render: function() {
+            var that = this;
+            Backgrid.HeaderRow.__super__.render.apply(this, arguments);
+            _.each(this.columns.models, function(modelValue) {
+                if (modelValue.get('width')) that.$el.find('.' + modelValue.get('name')).css('width', modelValue.get('width') + '%')
+                if (modelValue.get('toolTip')) that.$el.find('.' + modelValue.get('name')).attr('title', modelValue.get('toolTip'))
+            });
+            return this;
+        }
+    });
+    /*
      * HtmlCell renders any html code
      * @class Backgrid.HtmlCell
      * @extends Backgrid.Cell

http://git-wip-us.apache.org/repos/asf/incubator-atlas/blob/59bd56c8/dashboardv2/public/js/views/business_catalog/AddTermToEntityLayoutView.js
----------------------------------------------------------------------
diff --git a/dashboardv2/public/js/views/business_catalog/AddTermToEntityLayoutView.js b/dashboardv2/public/js/views/business_catalog/AddTermToEntityLayoutView.js
index a5356f2..0739abc 100644
--- a/dashboardv2/public/js/views/business_catalog/AddTermToEntityLayoutView.js
+++ b/dashboardv2/public/js/views/business_catalog/AddTermToEntityLayoutView.js
@@ -34,12 +34,11 @@ define(['require',
             template: AddTermToEntityLayoutViewTmpl,
 
             /** Layout sub regions */
-            regions: {},
-            /** ui selector cache */
-            ui: {
-                termName: '[data-id="termName"]',
-                addTermOptions: '[data-id="addTermOptions"]'
+            regions: {
+                RTreeLayoutView: "#r_treeLayoutView"
             },
+            /** ui selector cache */
+            ui: {},
             /** ui events hash */
             events: function() {
                 var events = {};
@@ -66,58 +65,31 @@ define(['require',
                 this.on('closeModal', function() {
                     this.modal.trigger('cancel');
                 });
-                this.fetchTaxonomy = true;
-                this.bindEvents();
-            },
-            bindEvents: function() {
-                this.listenTo(this.vCatalogList, 'reset', function() {
-                    var url = "",
-                        that = this;
-                    _.each(this.vCatalogList.models, function(obj) {
-                        if (that.fetchTaxonomy && obj.get('href').search("terms") == -1) {
-                            url = obj.get('href');
-                            that.fetchTaxonomy = false;
-                        }
-                    });
-                    if (url.length == 0) {
-                        this.generateTerm();
-                    } else {
-                        url = "/api" + url.split("/api")[1] + "/terms";
-                        this.fetchTerms(url);
-                    }
-                }, this);
             },
             onRender: function() {
-                this.fetchTerms();
+                this.renderTreeLayoutView();
             },
-            fetchTerms: function(url) {
-                if (url) {
-                    this.vCatalogList.url = url;
-                }
-                this.vCatalogList.fetch({ reset: true });
-            },
-            generateTerm: function() {
-                var terms = '<option selected="selected" disabled="disabled">-- Select Term --</option>';
-                _.each(this.vCatalogList.fullCollection.models, function(obj, key) {
-                    terms += '<option value="' + obj.get('name') + '">' + obj.get('name') + '</option>';
-                });
-                this.ui.addTermOptions.html(terms);
-                this.ui.addTermOptions.select2({
-                    placeholder: "Select Term",
-                    allowClear: true
+            renderTreeLayoutView: function() {
+                var that = this;
+                require(['views/business_catalog/TreeLayoutView'], function(TreeLayoutView) {
+                    that.RTreeLayoutView.show(new TreeLayoutView({
+                        url: that.url,
+                        viewBased: false
+                    }));
                 });
             },
             saveTermToAsset: function() {
                 var that = this;
                 var VCatalog = new this.vCatalogList.model();
+                var termName = this.modal.$el.find('.taxonomyTree li.active a').data('name').split("`").join("");
                 VCatalog.url = function() {
-                    return "api/atlas/v1/entities/" + that.guid + "/tags/" + that.ui.addTermOptions.val();
-                }
+                    return "api/atlas/v1/entities/" + that.guid + "/tags/" + termName;
+                };
                 VCatalog.save(null, {
                     beforeSend: function() {},
                     success: function(data) {
                         Utils.notifySuccess({
-                            content: "Term " + that.ui.addTermOptions.val() + Messages.addTermToEntitySuccessMessage
+                            content: "Term " + termName + Messages.addTermToEntitySuccessMessage
                         });
                         if (that.callback) {
                             that.callback();

http://git-wip-us.apache.org/repos/asf/incubator-atlas/blob/59bd56c8/dashboardv2/public/js/views/business_catalog/BusinessCatalogDetailLayoutView.js
----------------------------------------------------------------------
diff --git a/dashboardv2/public/js/views/business_catalog/BusinessCatalogDetailLayoutView.js b/dashboardv2/public/js/views/business_catalog/BusinessCatalogDetailLayoutView.js
index 3cf3ec2..7e3e586 100644
--- a/dashboardv2/public/js/views/business_catalog/BusinessCatalogDetailLayoutView.js
+++ b/dashboardv2/public/js/views/business_catalog/BusinessCatalogDetailLayoutView.js
@@ -215,7 +215,7 @@ define(['require',
             },
             onSaveDescriptionClick: function(view) {
                 view.description = view.ui.description.val();
-                this.onSaveButton(this.collection.first().toJSON(), Messages.updateTagDescriptionMessage, view);
+                this.onSaveButton(this.collection.first().toJSON(), Messages.updateTermDescriptionMessage, view);
                 this.ui.description.show();
             },
             onSaveButton: function(saveObject, message, view) {

http://git-wip-us.apache.org/repos/asf/incubator-atlas/blob/59bd56c8/dashboardv2/public/js/views/business_catalog/BusinessCatalogHeader.js
----------------------------------------------------------------------
diff --git a/dashboardv2/public/js/views/business_catalog/BusinessCatalogHeader.js b/dashboardv2/public/js/views/business_catalog/BusinessCatalogHeader.js
index 7a3d9a1..8fa436c 100644
--- a/dashboardv2/public/js/views/business_catalog/BusinessCatalogHeader.js
+++ b/dashboardv2/public/js/views/business_catalog/BusinessCatalogHeader.js
@@ -54,29 +54,7 @@ define(['require',
             }
             var that = this;
             if (this.url) {
-                var t = [];
-                var splitURL = this.url.split("api/atlas/v1/taxonomies/");
-                if (splitURL.length > 1) {
-                    var x = splitURL[1].split("/terms/");
-                }
-
-                var href = "";
-                for (var v in x) {
-                    if (v == 0) {
-                        href = x[v];
-                        t.push({
-                            value: x[v],
-                            href: href
-                        });
-                    } else {
-                        href += "/terms/" + x[v];
-                        t.push({
-                            value: x[v],
-                            href: href
-                        });
-                    };
-                }
-                this.value = t;
+                this.value = CommonViewFunction.breadcrumbUrlMaker(this.url);
             }
             this.listenTo(this.collection, 'reset', function() {
                 setTimeout(function() {
@@ -90,25 +68,7 @@ define(['require',
             var li = "",
                 value = this.value,
                 that = this;
-            _.each(value, function(object) {
-                li += '<li><a href="/#!/taxonomy/detailCatalog/api/atlas/v1/taxonomies/' + object.href + '?back=true">' + object.value + '</a></li>';
-            });
-            this.$('.breadcrumb').html(li);
-            //this.$(".breadcrumb").asBreadcrumbs("destroy");
-            this.$('.breadcrumb').asBreadcrumbs({
-                namespace: 'breadcrumb',
-                overflow: "left",
-                dropicon: "fa fa-ellipsis-h",
-                dropdown: function() {
-                    return '<div class=\"dropdown\">' +
-                        '<a href=\"javascript:void(0);\" class=\"' + this.namespace + '-toggle\" data-toggle=\"dropdown\"><i class=\"' + this.dropicon + '\"</i></a>' +
-                        '<ul class=\"' + this.namespace + '-menu dropdown-menu popover bottom arrowPosition \" ><div class="arrow"></div></ul>' +
-                        '</div>';
-                },
-                dropdownContent: function(a) {
-                    return '<li><a href="' + a.find('a').attr('href') + '" class="dropdown-item">' + a.text() + "</a></li>";
-                }
-            });
+            CommonViewFunction.breadcrumbMaker({ urlList: this.value, scope: this.$('.breadcrumb') });
         }
     });
     return BusinessCatalogHeader;

http://git-wip-us.apache.org/repos/asf/incubator-atlas/blob/59bd56c8/dashboardv2/public/js/views/business_catalog/BusinessCatalogLayoutView.js
----------------------------------------------------------------------
diff --git a/dashboardv2/public/js/views/business_catalog/BusinessCatalogLayoutView.js b/dashboardv2/public/js/views/business_catalog/BusinessCatalogLayoutView.js
index 92fe48a..e7c657f 100644
--- a/dashboardv2/public/js/views/business_catalog/BusinessCatalogLayoutView.js
+++ b/dashboardv2/public/js/views/business_catalog/BusinessCatalogLayoutView.js
@@ -18,12 +18,8 @@
 
 define(['require',
     'backbone',
-    'hbs!tmpl/business_catalog/BusinessCatalogLayoutView_tmpl',
-    'utils/Utils',
-    'collection/VCatalogList',
-    'utils/CommonViewFunction',
-    'utils/Messages'
-], function(require, Backbone, BusinessCatalogLayoutViewTmpl, Utils, VCatalogList, CommonViewFunction, Messages) {
+    'hbs!tmpl/business_catalog/BusinessCatalogLayoutView_tmpl'
+], function(require, Backbone, BusinessCatalogLayoutViewTmpl) {
     'use strict';
 
     var BusinessCatalogLayoutView = Backbone.Marionette.LayoutView.extend(
@@ -34,564 +30,35 @@ define(['require',
             template: BusinessCatalogLayoutViewTmpl,
 
             /** Layout sub regions */
-            regions: {},
-            /** ui selector cache */
-            ui: {
-                Parent: '[data-id="Parent"]',
-                childList: '[data-id="childList"]',
-                liClick: 'li a[data-href]',
-                backTaxanomy: '[data-id="backTaxanomy"]',
-                expandArrow: '[data-id="expandArrow"]',
-                searchTermInput: '[data-id="searchTermInput"]',
-                refreshTaxanomy: '[data-id="refreshTaxanomy"]'
+            regions: {
+                RTreeLayoutView: "#r_treeLayoutView"
             },
+            /** ui selector cache */
+            ui: {},
             /** ui events hash */
-            events: function() {
-                var events = {};
-                events['dblclick ' + this.ui.liClick] = function(e) {
-                    $(e.currentTarget).parent('li').find('.tools .taxanomyloader').show();
-                    this.singleClick = false;
-                    this.forwardClick(e, true);
-                };
-                events['click ' + this.ui.liClick] = function(e) {
-                    this.dblClick = false;
-                    this.forwardClick(e);
-                };
-                events['click ' + this.ui.backTaxanomy] = 'backButtonTaxanomy';
-                events['click ' + this.ui.refreshTaxanomy] = 'refreshButtonTaxanomy';
-                events['click ' + this.ui.expandArrow] = 'changeArrowState';
-                events["change " + this.ui.searchTermInput] = function() {
-                    this.singleClick = false;
-                    var termUrl = this.termCollection.url.split("/", 5).join("/") + "/" + this.ui.searchTermInput.val().split(".").join("/terms/");
-                    this.forwardClick(undefined, true, termUrl);
-                };
-                return events;
-            },
+            events: function() {},
             /**
              * intialize a new BusinessCatalogLayoutView Layout
              * @constructs
              */
             initialize: function(options) {
-                _.extend(this, _.pick(options, 'globalVent', 'url'));
-                this.parentCollection = new VCatalogList();
-                this.childCollection = new VCatalogList();
-                this.taxanomy = new VCatalogList();
-                this.termCollection = new VCatalogList();
-                this.dblClick = false;
-                this.singleClick = false;
-            },
-            bindEvents: function() {
-                var that = this;
-                this.listenTo(this.parentCollection, 'reset', function() {
-                    this.dblClick = false;
-                    if (this.parentCollection.fullCollection.models.length) {
-                        this.generateTree(true);
-                    } else {
-                        if (Utils.getUrlState.isTaxonomyTab() || Utils.getUrlState.isInitial()) {
-                            this.createDefaultTaxonomy();
-                        }
-                    }
-                }, this);
-                this.listenTo(this.childCollection, 'reset', function() {
-                    this.dblClick = false;
-                    this.generateTree();
-                }, this);
-                this.listenTo(this.taxanomy, 'reset', function() {
-                    this.searchResult();
-                }, this);
-                this.listenTo(this.termCollection, 'reset', function() {
-                    this.termSearchData();
-                }, this);
-                this.listenTo(this.childCollection, 'error', function(model, response) {
-                    if (response && response.responseJSON && response.responseJSON.message) {
-                        Utils.notifyError({
-                            content: response.responseJSON.message
-                        });
-                    }
-                    this.hideLoader();
-                }, this);
-                this.listenTo(this.parentCollection, 'error', function(model, response) {
-                    if (response && response.responseJSON && response.responseJSON.message) {
-                        Utils.notifyError({
-                            content: response.responseJSON.message
-                        });
-                    }
-                    this.hideLoader();
-                }, this);
+                _.extend(this, _.pick(options, 'url'));
             },
+            bindEvents: function() {},
             onRender: function() {
-                var that = this;
-                this.bindEvents();
-                that.ui.backTaxanomy.hide();
-
-                this.fetchCollection(this.url, true);
-
-                $('body').on("click", '.termPopoverList li', function(e) {
-                    that[$(this).find("a").data('fn')](e);
-                });
-                $('body').click(function(e) {
-                    if ($('.termPopoverList').length) {
-                        if ($(e.target).hasClass('termPopover')) {
-                            return;
-                        }
-                        that.$('.termPopover').popover('hide');
-                    }
-                });
-                this.fetchTaxanomyCollections();
-            },
-            manualRender: function(url, isParent, back) {
-                if (back) {
-                    this.backButton = back;
-                }
-                if (this.ui.Parent.children().length <= 0 || this.backButton) {
-                    this.fetchCollection(url, isParent);
-                }
-                if (url && isParent && !this.backButton) {
-                    this.fetchCollection(url, isParent);
-                }
-                if (!url && !back && isParent) {
-                    var url = this.$('.taxonomyTree').find('.active a').data('href');
-                    this.forwardClick(undefined, undefined, url);
-                }
-                if (this.backButton) {
-                    this.backButton = false;
-                }
-            },
-            changeArrowState: function(e) {
-                var scope = this.$('[data-id="expandArrow"]');
-                if (e) {
-                    scope = $(e.currentTarget);
-                }
-                if (scope.hasClass('fa-chevron-down')) {
-                    scope.removeClass('fa-chevron-down');
-                    scope.addClass('fa-chevron-right');
-                    this.addActiveClass(scope[0]);
-                    this.ui.childList.hide();
-                } else {
-                    if (e && $(e.currentTarget).parents('li.parentChild').length) {
-                        scope.parent('li').find('.tools .taxanomyloader').show();
-                        this.forwardClick(e, true);
-                    } else {
-                        scope.addClass('fa-chevron-down');
-                        scope.removeClass('fa-chevron-right');
-                        this.singleClick = false;
-                        this.ui.childList.show();
-                    }
-                }
-            },
-            fetchCollection: function(url, isParent) {
-                if (url) {
-                    this.url = url;
-                } else {
-                    var parentURL = this.ui.Parent.find('a').data('href');
-                    if (parentURL) {
-                        this.url = parentURL;
-                    } else {
-                        this.url = "api/atlas/v1/taxonomies";
-                    }
-
-                }
-                this.showLoader();
-                if (isParent) {
-                    this.parentCollection.url = this.url;
-                    this.parentCollection.fullCollection.reset(undefined, { silent: true });
-                    this.parentCollection.fetch({ reset: true });
-                } else {
-                    this.childCollection.url = this.url + "?hierarchy/path:.";
-                    this.childCollection.fullCollection.reset(undefined, { silent: true });
-                    this.childCollection.fetch({ reset: true });
-                }
-            },
-            showLoader() {
-                this.$('.taxonomyTree').find('li.active .tools .taxanomyloader').show();
-                this.$('.contentLoading').show();
-            },
-            hideLoader() {
-                this.$('.taxanomyloader').hide();
-                this.$('.contentLoading').hide();
-            },
-            forwardClick: function(e, forward, url) {
-                var hrefUrl = "";
-                if (e) {
-                    hrefUrl = $(e.currentTarget).data('href');
-                }
-                if (url) {
-                    hrefUrl = url;
-                }
-                if (!e && !url) {
-                    var dataHref = this.ui.Parent.find('a').data('href');
-                    if (dataHref) {
-                        hrefUrl = dataHref;
-                    }
-                }
-                if (forward) {
-                    this.dblClick = true;
-                    this.ui.childList.show();
-                    this.fetchCollection(hrefUrl, true);
-                } else {
-                    this.singleClick = true;
-                }
-                if (hrefUrl.length > 1) {
-                    Utils.setUrl({
-                        url: '#!/taxonomy/detailCatalog' + hrefUrl,
-                        mergeBrowserUrl: false,
-                        updateTabState: function() {
-                            return { taxonomyUrl: this.url, stateChanged: false };
-                        },
-                        trigger: true
-                    });
-                }
-                if (e) {
-                    this.addActiveClass(e);
-                }
-            },
-            addActiveClass: function(e) {
-                $(e.currentTarget).parents('ul.taxonomyTree').find('li').removeClass('active');
-                $(e.currentTarget).parent('li').addClass('active');
-            },
-            generateTree: function(isParent) {
-                var parentLi = "",
-                    childLi = "",
-                    that = this;
-
-                function createTaxonomy(url) {
-                    var href = false;
-                    _.each(that.parentCollection.fullCollection.models, function(model, key) {
-
-                        if (model.get('terms')) {
-                            href = model.get('terms').href;
-                        } else if (model.get('href')) {
-                            href = model.get('href') + "/terms";
-                        }
-                        var hrefUrl = "/api" + model.get('href').split("/api")[1];
-                        if (hrefUrl) {
-                            var backUrlCheck = hrefUrl.split("taxonomies/");
-                            if (backUrlCheck.length > 1) {
-                                if (backUrlCheck[1].split("/terms").length <= 1) {
-                                    that.ui.backTaxanomy.hide();
-                                } else {
-                                    that.ui.backTaxanomy.show();
-                                }
-                            }
-                        }
-                        var name = Utils.checkTagOrTerm(model.get('name'));
-                        parentLi = '<div class="tools"><i class="fa fa-refresh fa-spin-custom taxanomyloader"></i><i class="fa fa-ellipsis-h termPopover"></i></div><i class="fa fa-chevron-right toggleArrow" data-id="expandArrow" data-href="' + hrefUrl + '"></i><a href="javascript:void(0)" data-href="' + hrefUrl + '" data-name="`' + model.get('name') + '`">' + name.name + '</a>';
-                    });
-                    if (href) {
-                        var hrefUrl = "/api" + href.split("/api")[1];
-                        that.fetchCollection(hrefUrl);
-                    }
-                    that.ui.childList.html('');
-                    that.ui.Parent.addClass('active');
-                    that.ui.Parent.html(parentLi);
-                }
-
-                function createTerm() {
-                    _.each(that.childCollection.fullCollection.models, function(model, key) {
-                        var name = Utils.checkTagOrTerm(model.get('name'));
-                        var hrefUrl = "/api" + model.get('href').split("/api")[1]
-                        childLi += '<li class="children"><div class="tools"><i class="fa fa-refresh fa-spin-custom taxanomyloader"></i><i class="fa fa-ellipsis-h termPopover" ></i></div><i class="fa fa-chevron-right toggleArrow" data-id="expandArrow" data-href="' + hrefUrl + '"></i><a href="javascript:void(0)" data-href="' + hrefUrl + '" data-name="`' + model.get('name') + '`">' + name.name + '</a></li>';
-                    });
-                    that.ui.childList.html(childLi);
-                }
-
-                if (isParent) {
-                    createTaxonomy();
-                } else {
-                    this.changeArrowState();
-                    createTerm();
-                }
-                if (this.refresh) {
-                    this.$('.taxonomyTree').find('a[data-href="' + this.refresh + '"]').parent().addClass('active');
-                    this.refresh = undefined;
-                }
-                this.hideLoader();
-                this.$('.termPopover').popover({
-                    placement: 'bottom',
-                    html: true,
-                    trigger: 'manual',
-                    container: 'body',
-                    content: function() {
-                        var li = "<li class='listTerm' ><i class='fa fa-search'></i> <a href='javascript:void(0)' data-fn='onSearchTerm'>Search Assets</a></li>" +
-                            "<li class='listTerm'><i class='fa fa-plus'></i> <a href='javascript:void(0)' data-fn='onAddTerm'>Add Subterm</a></li>";
-                        /* "<li class='listTerm' ><i class='fa fa-arrow-right'></i> <a href='javascript:void(0)' data-fn='moveTerm'>Move Term</a></li>" +
-                         "<li class='listTerm' ><i class='fa fa-edit'></i> <a href='javascript:void(0)' data-fn='onEditTerm'>Edit Term</a></li>" +*/
-                        var termDataURL = Utils.getUrlState.getQueryUrl().hash.split("terms");
-                        if (termDataURL.length > 1) {
-                            li += "<li class='listTerm'><i class='fa fa-trash'></i> <a href='javascript:void(0)' data-fn='deleteTerm'>Delete Term</a></li>"
-                        }
-                        return "<ul class='termPopoverList'>" + li + "</ul>";
-                    }
-                });
-                this.$('.termPopover').off('click').on('click', function(e) {
-                    // if any other popovers are visible, hide them
-                    e.preventDefault();
-                    that.$('.termPopover').not(this).popover('hide');
-                    $(this).popover('toggle');
-                });
-                if (Utils.getUrlState.isInitial()) {
-                    this.forwardClick();
-                }
-            },
-            onAddTerm: function(e) {
-                var that = this;
-                require([
-                    'views/business_catalog/AddTermLayoutView',
-                    'modules/Modal'
-                ], function(AddTermLayoutView, Modal) {
-                    var view = new AddTermLayoutView({
-                        url: that.$('.taxonomyTree').find('li.active').find("a").data("href"),
-                        model: new that.parentCollection.model()
-                    });
-                    var modal = new Modal({
-                        title: 'Create a new subterm',
-                        content: view,
-                        okCloses: true,
-                        showFooter: true,
-                        allowCancel: true,
-                        okText: 'Add',
-                    }).open();
-                    modal.$el.find('button.ok').attr('disabled', true);
-                    modal.on('ok', function() {
-                        that.saveAddTerm(view);
-                    });
-                    view.ui.termName.on('keyup', function() {
-                        if (this.value.indexOf(' ') >= 0) {
-                            modal.$el.find('button.ok').prop('disabled', true);
-                            view.ui.termName.addClass("addTermDiable");
-                            view.$('.alertTerm').show();
-                        } else {
-                            modal.$el.find('button.ok').prop('disabled', false);
-                            view.ui.termName.removeClass("addTermDiable");
-                            view.$('.alertTerm').hide();
-                        }
-
-                    });
-                    view.on('closeModal', function() {
-                        modal.trigger('cancel');
-                    });
-
-                });
-            },
-            saveAddTerm: function(view) {
-                var that = this;
-                var url = view.url;
-                view.model.url = url + "/terms/" + view.ui.termName.val();
-                this.showLoader();
-                view.model.set({ description: view.ui.termDetail.val() }).save(null, {
-                    success: function(model, response) {
-                        that.create = true;
-                        that.fetchTaxanomyCollections();
-                        that.forwardClick(undefined, true, url);
-                        //that.fetchCollection(that.url);
-                        Utils.notifySuccess({
-                            content: "Term " + view.ui.termName.val() + Messages.addSuccessMessage
-                        });
-                    },
-                    error: function(model, response) {
-                        Utils.notifyError({
-                            content: "Term " + view.ui.termName.val() + Messages.addErrorMessage
-                        });
-                    },
-                    complete: function() {
-                        that.hideLoader();
-                    }
-                });
-            },
-            deleteTerm: function(e) {
-                var termName = this.$('.taxonomyTree').find('li.active a').data("name"),
-                    that = this,
-                    modal = CommonViewFunction.deleteTagModel(termName);
-                modal.on('ok', function() {
-                    that.deleteTermData(e);
-                });
-                modal.on('closeModal', function() {
-                    modal.trigger('cancel');
-                });
+                this.renderTreeLayoutView();
             },
-            deleteTermData: function(e) {
+            renderTreeLayoutView: function() {
                 var that = this;
-                this.showLoader();
-                require(['models/VCatalog'], function(VCatalog) {
-                    var termModel = new VCatalog(),
-                        url = that.$('.taxonomyTree').find('li.active a').data('href');
-                    var termName = that.$('.taxonomyTree').find('li.active a').text();
-                    termModel.deleteTerm(url, {
-                        beforeSend: function() {},
-                        success: function(data) {
-                            Utils.notifySuccess({
-                                content: "Term " + termName + Messages.deleteSuccessMessage
-                            });
-                            var termURL = url.split("/").slice(0, -2).join("/");
-                            that.forwardClick(undefined, true, termURL);
-                        },
-                        error: function(error, data, status) {
-                            var message = "Term " + termName + Messages.deleteErrorMessage;
-                            if (data.error) {
-                                message = data.error;
-                            }
-                            Utils.notifyError({
-                                content: message
-                            });
-                        },
-                        complete: function() {
-                            that.hideLoader();
-                        }
-                    });
+                require(['views/business_catalog/TreeLayoutView'], function(TreeLayoutView) {
+                    that.RTreeLayoutView.show(new TreeLayoutView({
+                        url: that.url,
+                        viewBased: true
+                    }));
                 });
             },
-            moveTerm: function() {
-                var that = this;
-                require([
-                    'views/business_catalog/MoveTermLayoutView',
-                    'modules/Modal'
-                ], function(MoveTermLayoutView, Modal) {
-                    var view = new MoveTermLayoutView({
-                        taxanomyCollection: that.collection
-                    });
-                    var modal = new Modal({
-                        title: 'Move Term',
-                        content: view,
-                        okCloses: true,
-                        showFooter: true,
-                        allowCancel: true,
-                        okText: 'Move',
-                    }).open();
-                    // modal.on('ok', function() {
-                    //     that.saveAddTerm(view);
-                    // });
-                    view.on('closeModal', function() {
-                        modal.trigger('cancel');
-                    });
-                });
-            },
-            onSearchTerm: function() {
-                this.showLoader();
-                Utils.setUrl({
-                    url: '#!/search/searchResult',
-                    urlParams: {
-                        query: this.$('.taxonomyTree').find('li.active').find("a").data('name'),
-                        searchType: "dsl",
-                        dslChecked: true
-                    },
-                    updateTabState: function() {
-                        return { searchUrl: this.url, stateChanged: true };
-                    },
-                    mergeBrowserUrl: false,
-                    trigger: true
-                });
-            },
-            backButtonTaxanomy: function(e) {
-                var that = this;
-                this.dblClick = false;
-                this.backButton = true;
-                var dataURL = this.$('.taxonomyTree').find('li[data-id="Parent"]').find("a").data('href').split("/terms");
-                var backUrl = dataURL.pop();
-                if (dataURL.join("/terms").length) {
-                    this.ui.backTaxanomy.show();
-                    var currentURL = "!/taxonomy/detailCatalog" + dataURL.join("/terms");
-                    Utils.setUrl({
-                        url: currentURL,
-                        mergeBrowserUrl: false,
-                        trigger: true,
-                        updateTabState: function() {
-                            return { taxonomyUrl: currentURL, stateChanged: false };
-                        }
-                    });
-                }
-            },
-            fetchTaxanomyCollections: function() {
-                this.taxanomy.fetch({ reset: true });
-            },
-            searchResult: function() {
-                var that = this;
-                _.each(this.taxanomy.models, function(model, key) {
-                    var name = model.get('name');
-                    that.termCollection.url = "/api/atlas/v1/taxonomies/" + name + "/terms";
-                });
-                this.termCollection.fetch({ reset: true });
-            },
-            termSearchData: function() {
-                var that = this;
-                var str = '<option></option>';
-                for (var j = 0; j < this.termCollection.models.length; j++) {
-                    var terms = this.termCollection.models[j].attributes.name;
-                    str += '<option>' + terms + '</option>';
-                    this.ui.searchTermInput.html(str);
-                }
-                // this.ui.searchTermInput.setAttribute('data-href' : that.termCollection.url);
-                this.ui.searchTermInput.select2({
-                    placeholder: "Search Term",
-                    allowClear: true
-                });
-            },
-            refreshButtonTaxanomy: function() {
-                this.fetchTaxanomyCollections();
-                this.refresh = this.$('.taxonomyTree').find('.active a').data('href');
-                this.fetchCollection(this.url);
-                this.changeArrowState();
-            },
-            createDefaultTaxonomy: function() {
-                var that = this;
-                require([
-                    'views/business_catalog/AddTermLayoutView',
-                    'modules/Modal'
-                ], function(AddTermLayoutView, Modal) {
-                    var view = new AddTermLayoutView({
-                        url: "/api/atlas/v1/taxonomies",
-                        model: new that.parentCollection.model()
-                    });
-                    var modal = new Modal({
-                        title: 'Taxonomy',
-                        content: view,
-                        okCloses: true,
-                        showFooter: true,
-                        allowCancel: true,
-                        okText: 'Create',
-                    }).open();
-                    modal.$el.find('button.ok').attr('disabled', true);
-                    modal.on('ok', function() {
-                        that.saveDefaultTaxonomy(view);
-                    });
-                    view.ui.termName.attr("placeholder", "Enter Taxonomy Name");
-                    view.ui.termName.on('keyup', function() {
-                        if (this.value.indexOf(' ') >= 0) {
-                            modal.$el.find('button.ok').prop('disabled', true);
-                            view.ui.termName.addClass("addTermDiable");
-                            view.$('.alertTerm').show();
-                        } else {
-                            modal.$el.find('button.ok').prop('disabled', false);
-                            view.ui.termName.removeClass("addTermDiable");
-                            view.$('.alertTerm').hide();
-                        }
-                    });
-                    view.on('closeModal', function() {
-                        modal.trigger('cancel');
-                    });
-                });
-            },
-            saveDefaultTaxonomy: function(view) {
-                var that = this;
-                var url = view.url;
-                view.model.url = url + "/" + view.ui.termName.val();
-                this.showLoader();
-                view.model.set({ description: view.ui.termDetail.val() }).save(null, {
-                    success: function(model, response) {
-                        that.fetchCollection(view.model.url, true);
-                        that.forwardClick(undefined, undefined, view.model.url);
-                        Utils.notifySuccess({
-                            content: "Default taxonomy" + view.ui.termName.val() + Messages.addSuccessMessage
-                        });
-                    },
-                    error: function(error, data, status) {
-                        Utils.notifyError({
-                            content: "Default taxonomy " + view.ui.termName.val() + Messages.addErrorMessage
-                        });
-                    },
-                    complete: function() {
-                        that.hideLoader();
-                    }
-                });
+            manualRender: function(url, isParent, back) {
+                this.RTreeLayoutView.currentView.manualRender(url, isParent, back);
             }
         });
     return BusinessCatalogLayoutView;


Mime
View raw message