initial seed code commit VVP-9

Change-Id: I4d48180db7eba7cb7c299ab618f04d2092868085
Signed-off-by: Paul McGoldrick <paul.mcgoldrick@att.com>

21 files changed, 1801 insertions, 0 deletions

diff --git a/d2ice.att.io/app/directives/ice-announcement/ice-announcement.directive.js b/d2ice.att.io/app/directives/ice-announcement/ice-announcement.directive.js
new file mode 100755
index 00000000..e70d5d61
--- /dev/null
+++ b/d2ice.att.io/app/directives/ice-announcement/ice-announcement.directive.js
@@ -0,0 +1,91 @@
+//
+// ============LICENSE_START========================================== 
+// org.onap.vvp/portal
+// ===================================================================
+// Copyright © 2017 AT&T Intellectual Property. All rights reserved.
+// ===================================================================
+//
+// Unless otherwise specified, all software contained herein is licensed
+// under the Apache License, Version 2.0 (the “License”);
+// you may not use this software 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.
+//
+//
+//
+// Unless otherwise specified, all documentation contained herein is licensed
+// under the Creative Commons License, Attribution 4.0 Intl. (the “License”);
+// you may not use this documentation except in compliance with the License.
+// You may obtain a copy of the License at
+// 
+//          https:creativecommons.org/licenses/by/4.0/
+//
+// Unless required by applicable law or agreed to in writing, documentation
+// 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.
+//
+// ============LICENSE_END============================================
+// 
+// ECOMP is a trademark and service mark of AT&T Intellectual Property.
+(function () {
+
+    'use strict';
+
+    angular
+        .module('ice.directives')
+        .directive('iceAnnouncement', ['$rootScope', 'cmsService', 'localStorageService', iceAnnouncement]);
+
+    function iceAnnouncement($rootScope, cmsService, localStorageService) {
+        var directive = {};
+        directive.restrict = 'E';
+        directive.templateUrl = 'directives/ice-announcement/ice-announcement.html';
+        directive.link = function (scope, element, attrs) {
+            var lastAnnouncementStorageKey = 'lastAnnouncement';
+
+            var init = function() {
+                var announcement = cmsService.getAnnouncement();
+
+                if(announcement) {
+                    scope.toast = announcement;
+
+                    //announcement will be presented for two days:
+                    var twoDaysBeforeDate = new Date();
+                    twoDaysBeforeDate.setDate(twoDaysBeforeDate.getDate() - 2);
+                    var publishedDate = new Date(scope.toast.publishDate);
+                    if(publishedDate < twoDaysBeforeDate) {
+                        scope.closeAlert();
+                    }
+                }
+            };
+
+            scope.closeAlert = function() {
+                scope.toast.show = false;
+                setLastAnnouncementClosedParam(true);
+            };
+
+            function setLastAnnouncementClosedParam(closed) {
+                var lastAnnouncement = localStorageService.getJson(lastAnnouncementStorageKey) || {};
+                lastAnnouncement['closed'] = closed;
+                localStorageService.setJson(lastAnnouncementStorageKey, lastAnnouncement);
+            };
+
+            init();
+
+            //whenever the announcement updated we will update the directive view:
+            $rootScope.$watch('showAnnouncement', function(newVal, OldVal){
+                init();
+            }, true);
+        };
+
+        return directive;
+    }
+})();
diff --git a/d2ice.att.io/app/directives/ice-announcement/ice-announcement.html b/d2ice.att.io/app/directives/ice-announcement/ice-announcement.html
new file mode 100755
index 00000000..04d9b3f0
--- /dev/null
+++ b/d2ice.att.io/app/directives/ice-announcement/ice-announcement.html
@@ -0,0 +1,44 @@
+<!--
+============LICENSE_START========================================== 
+org.onap.vvp/portal
+===================================================================
+Copyright © 2017 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the “License”);
+you may not use this software 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.
+
+
+
+Unless otherwise specified, all documentation contained herein is licensed
+under the Creative Commons License, Attribution 4.0 Intl. (the “License”);
+you may not use this documentation except in compliance with the License.
+You may obtain a copy of the License at
+
+         https:creativecommons.org/licenses/by/4.0/
+
+Unless required by applicable law or agreed to in writing, documentation
+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.
+
+============LICENSE_END============================================
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.-->
+<div class="ice-toast" ng-if="toast.show" ng-show="toast.displayFor=='all' || (toast.displayFor=='modal' && isModal)">
+    <uib-alert type="{{toast.type}}" close="closeAlert()">
+        <span id="announcement-successfully-message" ng-bind-html="toast.message"></span>
+        <a ng-if="toast.readMore" id="read-more-button" ng-click="toast.readMore()"><u> Read more >></u></a>
+    </uib-alert>
+</div>
diff --git a/d2ice.att.io/app/directives/ice-loader/ice-loader.directive.js b/d2ice.att.io/app/directives/ice-loader/ice-loader.directive.js
new file mode 100755
index 00000000..1456df42
--- /dev/null
+++ b/d2ice.att.io/app/directives/ice-loader/ice-loader.directive.js
@@ -0,0 +1,96 @@
+//
+// ============LICENSE_START========================================== 
+// org.onap.vvp/portal
+// ===================================================================
+// Copyright © 2017 AT&T Intellectual Property. All rights reserved.
+// ===================================================================
+//
+// Unless otherwise specified, all software contained herein is licensed
+// under the Apache License, Version 2.0 (the “License”);
+// you may not use this software 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.
+//
+//
+//
+// Unless otherwise specified, all documentation contained herein is licensed
+// under the Creative Commons License, Attribution 4.0 Intl. (the “License”);
+// you may not use this documentation except in compliance with the License.
+// You may obtain a copy of the License at
+// 
+//          https:creativecommons.org/licenses/by/4.0/
+//
+// Unless required by applicable law or agreed to in writing, documentation
+// 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.
+//
+// ============LICENSE_END============================================
+// 
+// ECOMP is a trademark and service mark of AT&T Intellectual Property.
+(function () {
+
+    'use strict';
+
+    angular
+        .module('ice.directives')
+        .directive('iceLoader', iceLoader);
+
+    function iceLoader($rootScope) {
+        var directive = {};
+        directive.restrict = 'E';
+        directive.transclude = false;
+        //directive.templateUrl = 'directives/ice-loader/ice-loader.html';
+        directive.scope = {
+            selector: "@selector"
+        };
+
+        directive.link = function (scope, element, attrs) {
+
+            $rootScope.$watch('ice.loader.show', function(newVal, OldVal){
+                //scope.loader = $rootScope.ice.loader;
+                if (newVal===true) {
+                    var selector = $(scope.selector);
+                    var loaderId = calculateUniqueId();
+                    var loader = $('<div class="ice-loader" id="' + loaderId + '"></div>');
+                    $('body').append(loader);
+                    selector.addClass('ice-loader-overlay');
+                    var pos = selector.offset();
+                    if (pos) {
+                        loader.css({
+                            top: pos.top + selector.height() / 2,
+                            left: pos.left + selector.width() / 2,
+                            position: 'fixed'
+                        });
+                    }
+                 } else if (newVal===false) {
+                    var selector = $(scope.selector);
+                    selector.removeClass('ice-loader-overlay');
+                    var loaderId = calculateUniqueId();
+                    var loader = $('#' + loaderId);
+                    loader.remove();
+                }
+            }, true);
+
+            var calculateUniqueId = function(){
+                var prefix = 'ice-loader-';
+                var name = scope.selector;
+                name = name.replace(".","");
+                name = name.replace("#","");
+                return prefix + name;
+            };
+
+        };
+        return directive;
+
+    }
+
+})();
diff --git a/d2ice.att.io/app/directives/ice-loader/ice-loader.html b/d2ice.att.io/app/directives/ice-loader/ice-loader.html
new file mode 100755
index 00000000..009a7ee6
--- /dev/null
+++ b/d2ice.att.io/app/directives/ice-loader/ice-loader.html
@@ -0,0 +1,39 @@
+<!--
+============LICENSE_START========================================== 
+org.onap.vvp/portal
+===================================================================
+Copyright © 2017 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the “License”);
+you may not use this software 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.
+
+
+
+Unless otherwise specified, all documentation contained herein is licensed
+under the Creative Commons License, Attribution 4.0 Intl. (the “License”);
+you may not use this documentation except in compliance with the License.
+You may obtain a copy of the License at
+
+         https:creativecommons.org/licenses/by/4.0/
+
+Unless required by applicable law or agreed to in writing, documentation
+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.
+
+============LICENSE_END============================================
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.-->
+<div class="ice-loader" ng-if="loader.show===true"></div>
diff --git a/d2ice.att.io/app/directives/ice-loader/ice-loader.less b/d2ice.att.io/app/directives/ice-loader/ice-loader.less
new file mode 100755
index 00000000..22b761e3
--- /dev/null
+++ b/d2ice.att.io/app/directives/ice-loader/ice-loader.less
@@ -0,0 +1,52 @@
+//
+// ============LICENSE_START========================================== 
+// org.onap.vvp/portal
+// ===================================================================
+// Copyright © 2017 AT&T Intellectual Property. All rights reserved.
+// ===================================================================
+//
+// Unless otherwise specified, all software contained herein is licensed
+// under the Apache License, Version 2.0 (the “License”);
+// you may not use this software 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.
+//
+//
+//
+// Unless otherwise specified, all documentation contained herein is licensed
+// under the Creative Commons License, Attribution 4.0 Intl. (the “License”);
+// you may not use this documentation except in compliance with the License.
+// You may obtain a copy of the License at
+// 
+//          https:creativecommons.org/licenses/by/4.0/
+//
+// Unless required by applicable law or agreed to in writing, documentation
+// 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.
+//
+// ============LICENSE_END============================================
+// 
+// ECOMP is a trademark and service mark of AT&T Intellectual Property.
+.ice-loader {
+
+    background: url('images/wait.gif') no-repeat top left; width: 16px; height: 11px;
+    display: block;
+    .m_14_m;
+    /*top: 50%;
+    left: 50%;*/
+
+}
+
+.ice-loader-overlay {
+    /*background-color: #F2F2F2;*/
+    opacity: 0.2;
+}
diff --git a/d2ice.att.io/app/directives/ice-news-and-announcement/ice-news-and-announcement.directive.js b/d2ice.att.io/app/directives/ice-news-and-announcement/ice-news-and-announcement.directive.js
new file mode 100755
index 00000000..d46a0903
--- /dev/null
+++ b/d2ice.att.io/app/directives/ice-news-and-announcement/ice-news-and-announcement.directive.js
@@ -0,0 +1,87 @@
+//
+// ============LICENSE_START========================================== 
+// org.onap.vvp/portal
+// ===================================================================
+// Copyright © 2017 AT&T Intellectual Property. All rights reserved.
+// ===================================================================
+//
+// Unless otherwise specified, all software contained herein is licensed
+// under the Apache License, Version 2.0 (the “License”);
+// you may not use this software 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.
+//
+//
+//
+// Unless otherwise specified, all documentation contained herein is licensed
+// under the Creative Commons License, Attribution 4.0 Intl. (the “License”);
+// you may not use this documentation except in compliance with the License.
+// You may obtain a copy of the License at
+// 
+//          https:creativecommons.org/licenses/by/4.0/
+//
+// Unless required by applicable law or agreed to in writing, documentation
+// 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.
+//
+// ============LICENSE_END============================================
+// 
+// ECOMP is a trademark and service mark of AT&T Intellectual Property.
+(function () {
+    'use strict';
+
+    angular
+        .module('ice.directives')
+        .directive('iceNewsAndAnnouncement', ['cmsService', '$uibModal', '$log', iceNewsAndAnnouncement]);
+
+    function iceNewsAndAnnouncement(cmsService, $uibModal, $log) {
+        var directive = {};
+        directive.restrict = 'E';
+        directive.templateUrl = 'directives/ice-news-and-announcement/ice-news-and-announcement.html';
+        directive.scope = {limit: '=limit', fromLastDays: '=fromLastDays', showDescription: "=showDescription"};
+        directive.link = function (scope, element, attrs) {
+            var limit = scope.limit || 5;
+            var fromLastDays = scope.fromLastDays || "";
+            var init = function () {
+                cmsService.getPosts(limit, fromLastDays, ['Announcement', 'News'])
+                .then(function(response) {
+                    scope.cmsPosts = response.data;
+                })
+                .catch(function(error) {
+                    $log.error(error);
+                });
+            };
+
+            scope.openCMSReadMoreModal = function(cmsPost) {
+                if(cmsPost) {
+                    $uibModal.open({
+                        templateUrl: 'main/modals/cms-post-modal/cms-post-modal.html',
+                        controller: 'cmsPostModalController',
+                        controllerAs: 'vm',
+                        size: 'cms-post-read-more',
+                        resolve: {
+                            post: function () {
+                                return cmsPost;
+                            }
+                        }
+                    });
+                } else {
+                    $log.debug("Cannot open cms post.")
+                }
+            };
+
+            init();
+        };
+
+        return directive;
+    }
+})();
diff --git a/d2ice.att.io/app/directives/ice-news-and-announcement/ice-news-and-announcement.html b/d2ice.att.io/app/directives/ice-news-and-announcement/ice-news-and-announcement.html
new file mode 100755
index 00000000..df377dd6
--- /dev/null
+++ b/d2ice.att.io/app/directives/ice-news-and-announcement/ice-news-and-announcement.html
@@ -0,0 +1,51 @@
+<!--
+============LICENSE_START========================================== 
+org.onap.vvp/portal
+===================================================================
+Copyright © 2017 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the “License”);
+you may not use this software 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.
+
+
+
+Unless otherwise specified, all documentation contained herein is licensed
+under the Creative Commons License, Attribution 4.0 Intl. (the “License”);
+you may not use this documentation except in compliance with the License.
+You may obtain a copy of the License at
+
+         https:creativecommons.org/licenses/by/4.0/
+
+Unless required by applicable law or agreed to in writing, documentation
+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.
+
+============LICENSE_END============================================
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.-->
+<div class="col-md-12" id="news-and-announcements">
+    <div id="news-and-announcements-header">News & Announcements</div>
+    <ul id="news-and-announcements-list">
+        <h4 class="news-and-announcements-details-title" ng-if="!cmsPosts || cmsPosts.length === 0">There are no posts.</h4>
+        <li data-ng-repeat="post in cmsPosts" class="news-and-announcements-details">
+            <div class="news-and-announcements-details-header row">
+                <h2 class="news-and-announcements-details-title" id="{{post.title}}" ng-click="openCMSReadMoreModal(post)">{{post.title}}</h2>
+            </div>
+            <span class="news-and-announcements-creation">Posted at {{post.publish_date | date2: 'EEEE  MMMM doo yyyy'}} by {{post.user.username}}</span>
+            <p ng-show="showDescription" class="news-and-announcements-description" id="{{post.description}}" ng-bind-html="post.description | htmlspecialchars"></p>
+        </li>
+    </ul>
+</div>
diff --git a/d2ice.att.io/app/directives/ice-news-and-announcement/ice-news-and-announcement.less b/d2ice.att.io/app/directives/ice-news-and-announcement/ice-news-and-announcement.less
new file mode 100755
index 00000000..47c9fc81
--- /dev/null
+++ b/d2ice.att.io/app/directives/ice-news-and-announcement/ice-news-and-announcement.less
@@ -0,0 +1,80 @@
+//
+// ============LICENSE_START========================================== 
+// org.onap.vvp/portal
+// ===================================================================
+// Copyright © 2017 AT&T Intellectual Property. All rights reserved.
+// ===================================================================
+//
+// Unless otherwise specified, all software contained herein is licensed
+// under the Apache License, Version 2.0 (the “License”);
+// you may not use this software 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.
+//
+//
+//
+// Unless otherwise specified, all documentation contained herein is licensed
+// under the Creative Commons License, Attribution 4.0 Intl. (the “License”);
+// you may not use this documentation except in compliance with the License.
+// You may obtain a copy of the License at
+// 
+//          https:creativecommons.org/licenses/by/4.0/
+//
+// Unless required by applicable law or agreed to in writing, documentation
+// 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.
+//
+// ============LICENSE_END============================================
+// 
+// ECOMP is a trademark and service mark of AT&T Intellectual Property.
+#news-and-announcements {
+    border: 1px solid @func_color_x;
+    padding:0px;
+
+    #news-and-announcements-header {
+        background-color: @func_color_x;
+        .p_22_m;
+        padding: 10px 10px 0;
+    }
+    #news-and-announcements-list {
+        list-style:none;
+        padding:  0 15px;
+        .news-and-announcements-details {
+            border-bottom: 1px dashed @main_color_a;
+            padding-bottom:10px;
+
+            .news-and-announcements-details-header {
+                .news-and-announcements-details-title {
+                    .f-type ._20_m;
+                    cursor: pointer;
+                    margin-top: 15px;
+                    margin-bottom: 0px;
+                    margin-left: 15px;
+                    word-wrap: break-word;
+                }
+            }
+            .news-and-announcements-description {
+                .m_18_r;
+                margin: 3px 0px;
+                line-height: 20px;
+                word-wrap: break-word;
+            }
+            .news-and-announcements-creation {
+                .m_12_r;
+            }
+        }
+        .news-and-announcements-details:last-child {
+            padding:0px;
+            border:none;
+        }
+    }
+}
diff --git a/d2ice.att.io/app/directives/ice-toast/ice-toast.directive.js b/d2ice.att.io/app/directives/ice-toast/ice-toast.directive.js
new file mode 100755
index 00000000..bb7df0c5
--- /dev/null
+++ b/d2ice.att.io/app/directives/ice-toast/ice-toast.directive.js
@@ -0,0 +1,76 @@
+//
+// ============LICENSE_START========================================== 
+// org.onap.vvp/portal
+// ===================================================================
+// Copyright © 2017 AT&T Intellectual Property. All rights reserved.
+// ===================================================================
+//
+// Unless otherwise specified, all software contained herein is licensed
+// under the Apache License, Version 2.0 (the “License”);
+// you may not use this software 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.
+//
+//
+//
+// Unless otherwise specified, all documentation contained herein is licensed
+// under the Creative Commons License, Attribution 4.0 Intl. (the “License”);
+// you may not use this documentation except in compliance with the License.
+// You may obtain a copy of the License at
+// 
+//          https:creativecommons.org/licenses/by/4.0/
+//
+// Unless required by applicable law or agreed to in writing, documentation
+// 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.
+//
+// ============LICENSE_END============================================
+// 
+// ECOMP is a trademark and service mark of AT&T Intellectual Property.
+(function () {
+
+    'use strict';
+
+    angular
+        .module('ice.directives')
+        .directive('iceToast', ['$rootScope', 'toastService', iceToast]);
+
+    function iceToast($rootScope, toastService) {
+        var directive = {};
+        directive.restrict = 'E';
+        directive.templateUrl = 'directives/ice-toast/ice-toast.html';
+        directive.scope = {isModal: '=isModal'};
+        directive.link = function (scope, element, attrs) {
+            var init = function() {
+                var toast = toastService.getToast();
+
+                if(toast) {
+                    scope.toast = toast;
+                }
+            };
+
+            scope.closeAlert = function() {
+                toastService.clearToast();
+            };
+
+            init();
+
+            //whenever the toast updated we will update the directive view:
+            $rootScope.$watch('showToast', function(newVal, OldVal){
+                init();
+            }, true);
+        };
+
+        return directive;
+    }
+
+})();
diff --git a/d2ice.att.io/app/directives/ice-toast/ice-toast.html b/d2ice.att.io/app/directives/ice-toast/ice-toast.html
new file mode 100755
index 00000000..9badf3bf
--- /dev/null
+++ b/d2ice.att.io/app/directives/ice-toast/ice-toast.html
@@ -0,0 +1,44 @@
+<!--
+============LICENSE_START========================================== 
+org.onap.vvp/portal
+===================================================================
+Copyright © 2017 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the “License”);
+you may not use this software 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.
+
+
+
+Unless otherwise specified, all documentation contained herein is licensed
+under the Creative Commons License, Attribution 4.0 Intl. (the “License”);
+you may not use this documentation except in compliance with the License.
+You may obtain a copy of the License at
+
+         https:creativecommons.org/licenses/by/4.0/
+
+Unless required by applicable law or agreed to in writing, documentation
+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.
+
+============LICENSE_END============================================
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.-->
+<div class="ice-toast" ng-if="toast.show" ng-show="toast.displayFor=='all' || (toast.displayFor=='modal' && isModal)">
+    <uib-alert type="{{toast.type}}" close="closeAlert()">
+        <span id="toast-successfully-message" ng-bind-html="toast.message"></span>
+        <a ng-if="toast.readMore" id="read-more-button" ng-click="toast.readMore()"><u> Read more >></u></a>
+    </uib-alert>
+</div>
diff --git a/d2ice.att.io/app/directives/ice-toast/ice-toast.less b/d2ice.att.io/app/directives/ice-toast/ice-toast.less
new file mode 100755
index 00000000..0741fee1
--- /dev/null
+++ b/d2ice.att.io/app/directives/ice-toast/ice-toast.less
@@ -0,0 +1,48 @@
+//
+// ============LICENSE_START========================================== 
+// org.onap.vvp/portal
+// ===================================================================
+// Copyright © 2017 AT&T Intellectual Property. All rights reserved.
+// ===================================================================
+//
+// Unless otherwise specified, all software contained herein is licensed
+// under the Apache License, Version 2.0 (the “License”);
+// you may not use this software 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.
+//
+//
+//
+// Unless otherwise specified, all documentation contained herein is licensed
+// under the Creative Commons License, Attribution 4.0 Intl. (the “License”);
+// you may not use this documentation except in compliance with the License.
+// You may obtain a copy of the License at
+// 
+//          https:creativecommons.org/licenses/by/4.0/
+//
+// Unless required by applicable law or agreed to in writing, documentation
+// 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.
+//
+// ============LICENSE_END============================================
+// 
+// ECOMP is a trademark and service mark of AT&T Intellectual Property.
+.ice-toast {
+    u {
+        .m_14_r;
+    }
+
+    @media (max-width: 992px) {
+        padding-top: 10px;
+        padding-left: 0%;
+  }
+}
diff --git a/d2ice.att.io/app/directives/ice-tooltip/ice-tooltip.directive.js b/d2ice.att.io/app/directives/ice-tooltip/ice-tooltip.directive.js
new file mode 100755
index 00000000..3c5b867f
--- /dev/null
+++ b/d2ice.att.io/app/directives/ice-tooltip/ice-tooltip.directive.js
@@ -0,0 +1,69 @@
+//
+// ============LICENSE_START========================================== 
+// org.onap.vvp/portal
+// ===================================================================
+// Copyright © 2017 AT&T Intellectual Property. All rights reserved.
+// ===================================================================
+//
+// Unless otherwise specified, all software contained herein is licensed
+// under the Apache License, Version 2.0 (the “License”);
+// you may not use this software 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.
+//
+//
+//
+// Unless otherwise specified, all documentation contained herein is licensed
+// under the Creative Commons License, Attribution 4.0 Intl. (the “License”);
+// you may not use this documentation except in compliance with the License.
+// You may obtain a copy of the License at
+// 
+//          https:creativecommons.org/licenses/by/4.0/
+//
+// Unless required by applicable law or agreed to in writing, documentation
+// 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.
+//
+// ============LICENSE_END============================================
+// 
+// ECOMP is a trademark and service mark of AT&T Intellectual Property.
+(function () {
+    'use strict';
+
+    angular
+        .module('ice.directives')
+        .directive('iceToolTip', ['cmsService', '$log', iceToolTip]);
+
+    function iceToolTip(cmsService, $log) {
+        var directive = {};
+        directive.restrict = 'E';
+        directive.templateUrl = 'directives/ice-tooltip/ice-tooltip.html';
+        directive.link = function (scope, element, attrs) {
+            var limit = 5;
+
+            cmsService.getPosts(limit, '', ['FAQ'])
+            .then(function(response) {
+                if(response.data && response.data.length > 0) {
+                    var rangeMax = response.data.length;
+                    var randPostIndex = Math.floor(Math.random() * rangeMax);
+                    scope.tipContent = response.data[randPostIndex];
+                }
+            })
+            .catch(function(error) {
+                $log.error(error);
+            });
+        };
+
+        return directive;
+    }
+
+})();
diff --git a/d2ice.att.io/app/directives/ice-tooltip/ice-tooltip.html b/d2ice.att.io/app/directives/ice-tooltip/ice-tooltip.html
new file mode 100755
index 00000000..3c09051f
--- /dev/null
+++ b/d2ice.att.io/app/directives/ice-tooltip/ice-tooltip.html
@@ -0,0 +1,44 @@
+<!--
+============LICENSE_START========================================== 
+org.onap.vvp/portal
+===================================================================
+Copyright © 2017 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the “License”);
+you may not use this software 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.
+
+
+
+Unless otherwise specified, all documentation contained herein is licensed
+under the Creative Commons License, Attribution 4.0 Intl. (the “License”);
+you may not use this documentation except in compliance with the License.
+You may obtain a copy of the License at
+
+         https:creativecommons.org/licenses/by/4.0/
+
+Unless required by applicable law or agreed to in writing, documentation
+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.
+
+============LICENSE_END============================================
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.-->
+<div ng-show="tipContent && tipContent.excerpt" class="col-md-12 tooltip-container">
+    <div class="tooltip-title ng-binding" id="tooltip-title">Did you know?</div>
+    <div class="tooltip-content">
+        <h4 id="tooltip-description" >{{tipContent.excerpt}}</h4>
+    </div>
+</div>
diff --git a/d2ice.att.io/app/directives/ice-tooltip/ice-tooltip.less b/d2ice.att.io/app/directives/ice-tooltip/ice-tooltip.less
new file mode 100755
index 00000000..949e9a04
--- /dev/null
+++ b/d2ice.att.io/app/directives/ice-tooltip/ice-tooltip.less
@@ -0,0 +1,82 @@
+//
+// ============LICENSE_START========================================== 
+// org.onap.vvp/portal
+// ===================================================================
+// Copyright © 2017 AT&T Intellectual Property. All rights reserved.
+// ===================================================================
+//
+// Unless otherwise specified, all software contained herein is licensed
+// under the Apache License, Version 2.0 (the “License”);
+// you may not use this software 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.
+//
+//
+//
+// Unless otherwise specified, all documentation contained herein is licensed
+// under the Creative Commons License, Attribution 4.0 Intl. (the “License”);
+// you may not use this documentation except in compliance with the License.
+// You may obtain a copy of the License at
+// 
+//          https:creativecommons.org/licenses/by/4.0/
+//
+// Unless required by applicable law or agreed to in writing, documentation
+// 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.
+//
+// ============LICENSE_END============================================
+// 
+// ECOMP is a trademark and service mark of AT&T Intellectual Property.
+.tooltip-container {
+    border: 1px solid @main_color_o;
+    background-color: @main_color_p;
+    padding: 0px;
+
+    .tooltip-title {
+        .f-type._22_m;
+        background-color: @main_color_p;
+        color: @tooltip_header_color;
+        padding: 10px 10px 0;
+    }
+
+    .tooltip-content {
+        background-color: @main_color_p;
+        word-wrap: break-word;
+
+        h4 {
+           padding: 0 15px;
+        }
+    }
+}
+
+#nav-bar-wrapper {
+    .tooltip-container {
+        bottom: 10px;
+
+        .tooltip-title {
+            .f-type._16_m;
+            background-color: @main_color_p;
+            color: @tooltip_header_color;
+            padding: 15px 15px 0;
+            }
+
+        .tooltip-content {
+            background-color: @main_color_p;
+            word-wrap: break-word;
+
+            h4 {
+            .f-type._16_r;
+            padding: 0 15px;
+            }
+        }
+    }
+}
diff --git a/d2ice.att.io/app/directives/notifications/notifications.directive.js b/d2ice.att.io/app/directives/notifications/notifications.directive.js
new file mode 100755
index 00000000..159a535e
--- /dev/null
+++ b/d2ice.att.io/app/directives/notifications/notifications.directive.js
@@ -0,0 +1,130 @@
+//
+// ============LICENSE_START========================================== 
+// org.onap.vvp/portal
+// ===================================================================
+// Copyright © 2017 AT&T Intellectual Property. All rights reserved.
+// ===================================================================
+//
+// Unless otherwise specified, all software contained herein is licensed
+// under the Apache License, Version 2.0 (the “License”);
+// you may not use this software 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.
+//
+//
+//
+// Unless otherwise specified, all documentation contained herein is licensed
+// under the Creative Commons License, Attribution 4.0 Intl. (the “License”);
+// you may not use this documentation except in compliance with the License.
+// You may obtain a copy of the License at
+// 
+//          https:creativecommons.org/licenses/by/4.0/
+//
+// Unless required by applicable law or agreed to in writing, documentation
+// 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.
+//
+// ============LICENSE_END============================================
+// 
+// ECOMP is a trademark and service mark of AT&T Intellectual Property.
+(function () {
+    'use strict';
+    angular
+        .module('ice.directives')
+        .directive('notifications', notifications);
+    
+    String.prototype.replaceAll = function(str1, str2, ignore) 
+    {
+        return this.replace(new RegExp(str1.replace(/([\/\,\!\\\^\$\{\}\[\]\(\)\.\*\+\?\|\<\>\-\&])/g,"\\$&"),(ignore?"gi":"g")),(typeof(str2)=="string")?str2.replace(/\$/g,"$$$$"):str2);
+    }   
+    
+    function notifications($compile,$filter,$rootScope,$location,localStorageService) {
+        var directive = {};
+        directive.restrict = 'E';
+        directive.template = '<div></div>';
+        directive.scope = {activity : '='};
+	    directive.controller =  ['$scope', function($scope) {
+	        $scope.addDateStamp = function(activity) {
+	        	var description = "";
+				var timeGapLocal = moment().format("z");// timeGap();
+				
+	            var ampm =  moment().format('A');
+	            var mom =moment().tz( moment.tz.guess()).format('z');
+				
+				if (activity.description.indexOf(' at ') == -1)
+				{
+					if (activity.description.substr(activity.description.length - 1) == '.')
+						description = activity.description.substr(0, activity.description.length - 1);
+					else
+						description = activity.description;
+				} else {
+					description = activity.description.substring(0, activity.description.indexOf(" at "));
+				}	
+				activity.description = description + ' at ' + $filter('date')(activity.create_time,'yyyy-MM-dd hh:mm:ss',timeGapLocal) + " " + ampm + " " + mom;
+
+				return activity;
+	        }
+	        $scope.addPopover = function(activity,macro,short,long) {
+	        	
+	        	var template = "<span " +
+        						"popover-trigger='mouseenter' " + 
+        						"popover-html='true' " +
+        						"popover-placement='top' "+
+        						"uib-popover='" + long +"' " +
+        						"class='' " +
+        						" >" + short +"</span>";
+	        	activity.description = activity.description.replaceAll(macro, template);
+	        }
+	        
+	        $scope.addSelectEngagement = function (activity,macro,short,uuid) {
+	        	var template = "<span " +
+				'ng-click="goToEngagement('+"'"+uuid+"'"+')" ' + 
+				"class='engagement_link' " +
+				" >" + short +"</span>";
+				activity.description = activity.description.replaceAll(macro, template);
+	        }
+	        
+	        $scope.goToEngagement = function(uuid){
+	            localStorageService.setJson("ice.settings.eng_uuid",uuid);
+	        	$location.path('/dashboard/overview');
+	        	$location.replace();
+		        $rootScope.$broadcast('onUpdateEngagements',{select : {uuid:uuid,page_type:'overview',sub_id:undefined}});
+	        };
+	    	
+	        
+	      }];
+	    directive.link =  function(scope, iElement, iAttrs, ctrl) {
+	    	var activity = scope.activity;
+	    	activity.meta_data = JSON.parse(activity.metadata);
+	    	scope.addDateStamp(activity);
+	    	angular.forEach(activity.meta_data.macros,function(macro,key){
+	    		switch (macro.type)
+    			{
+	    			case 'popover':
+	    				scope.addPopover(activity,key,macro.short,macro.long);
+	    				break;
+	    			case 'select_engagement':
+	    				scope.addSelectEngagement(activity,key,macro.short,macro.eng_uuid);
+	    				break;
+
+    			}
+
+	    	});
+	    	var template = "<span>" + scope.activity.description + "</span>";
+	    	
+	    	iElement.html(template).show();
+	    	$compile(iElement.contents())(scope);
+	    };
+        return directive;
+    }
+
+})();
\ No newline at end of file
diff --git a/d2ice.att.io/app/directives/progress/progress.directive.js b/d2ice.att.io/app/directives/progress/progress.directive.js
new file mode 100755
index 00000000..073ff0cf
--- /dev/null
+++ b/d2ice.att.io/app/directives/progress/progress.directive.js
@@ -0,0 +1,211 @@
+//
+// ============LICENSE_START========================================== 
+// org.onap.vvp/portal
+// ===================================================================
+// Copyright © 2017 AT&T Intellectual Property. All rights reserved.
+// ===================================================================
+//
+// Unless otherwise specified, all software contained herein is licensed
+// under the Apache License, Version 2.0 (the “License”);
+// you may not use this software 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.
+//
+//
+//
+// Unless otherwise specified, all documentation contained herein is licensed
+// under the Creative Commons License, Attribution 4.0 Intl. (the “License”);
+// you may not use this documentation except in compliance with the License.
+// You may obtain a copy of the License at
+// 
+//          https:creativecommons.org/licenses/by/4.0/
+//
+// Unless required by applicable law or agreed to in writing, documentation
+// 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.
+//
+// ============LICENSE_END============================================
+// 
+// ECOMP is a trademark and service mark of AT&T Intellectual Property.
+(function () {
+
+    'use strict';
+
+    angular
+        .module('ice.directives')
+        .directive('progressDirective', ["$uibModal", "$rootScope", "$log", "vfService", ProgressDirective]);
+
+    function ProgressDirective($uibModal, $rootScope, $log, vfService) {
+        var directive = {};
+        directive.restrict = 'E';
+        directive.templateUrl = 'directives/progress/progress.html';
+        directive.scope = {
+            progress: "@progress",
+            data: "=data",
+            callback: "=callback",
+            statuses: "@statuses",
+            enable_refresh: "@enableRefresh",
+        };
+        directive.link = function (scope, element, attrs) {
+            var init = function() {
+                if(!scope.statuses){
+                    scope.statuses = false;
+                }
+
+                calculateDaysLeft();
+                registerWatches();
+            };
+
+            var calculateDaysLeft = function(){
+                var currentDate = moment();
+                var completionDate = moment(scope.data.completion_date);
+                var days_diff = Math.ceil(completionDate.diff(currentDate, 'days',true));
+                if (days_diff < 0 )
+                    days_diff = 0;
+                scope.daysLeft = days_diff;
+            };
+
+            var registerWatches = function() {
+                scope.$watch('data.completion_date', function(oldVal, newVal) {
+                    if (oldVal !== newVal){
+                        calculateDaysLeft();
+                    }
+                });
+
+                scope.$watch('data.heat_validated_time', function(oldVal, newVal) {
+                    if (oldVal !== newVal){
+                        normalizeData();
+                    }
+                });
+
+                scope.$watch('data.vnf_version', function(oldVal, newVal) {
+                    if (oldVal !== newVal){
+                        normalizeData();
+                    }
+                });
+
+                scope.$watch('data.image_scan_time', function(oldVal, newVal) {
+                    if (oldVal !== newVal){
+                        normalizeData();
+                    }
+                });
+
+                scope.$watch('data.aic_instantiation_time', function(oldVal, newVal) {
+                    if (oldVal !== newVal){
+                        normalizeData();
+                    }
+                });
+
+                scope.$watch('data.asdc_onboarding_time', function(oldVal, newVal) {
+                    if (oldVal !== newVal){
+                        normalizeData();
+                    }
+                });
+            };
+
+            var normalizeData = function() {
+                if(scope.data) {
+                    if(!scope.data.ecomp_release){
+                        scope.data.ecomp_release = "-";
+                    }
+                    if(!scope.data.aic_version){
+                        scope.data.aic_version = "-";
+                    }
+
+                    if(!scope.data.aic_instantiation_time){
+                        scope.data.aic_instantiation_time = "-";
+                    }
+
+                    if(!scope.data.vnf_version){
+                        scope.data.vnf_version = "-";
+                    }
+
+                    if(!scope.data.asdc_onboarding_time){
+                        scope.data.asdc_onboarding_time = "-";
+                    }
+
+                    if(!scope.data.heat_validated_time){
+                        scope.data.heat_validated_time = "-";
+                    }
+
+                    if(!scope.data.image_scan_time){
+                        scope.data.image_scan_time = "-";
+                    }
+                }
+            };
+
+            scope.starEngagement = function () {
+                vfService.putStarredEngagements(scope.data.engagement_uuid)
+                    .then(function (response) {
+                        $rootScope.ice.loader.show = false;
+                        if (response.status === 200 && response.data && response.data !== '') {
+                            $rootScope.$broadcast('onUpdateEngagements', {select: {
+                                uuid: scope.data.engagement_uuid,
+                                page_type: 'dashboard',
+                                sub_id: undefined,
+                                enable_refresh: scope.enable_refresh
+                            }
+                            });
+                            if(scope.data.starred == false){
+                                scope.data.starred = true;
+                            }
+                            else {
+                                scope.data.starred = false;
+                            }
+                        }
+                    })
+                    .catch(function (error) {
+                        $rootScope.ice.loader.show = false;
+                        $log.error(error);
+                    });
+            };
+
+            scope.goToEngagement = function(uuid){
+            	$rootScope.$broadcast('searchSelectEngagement',uuid);
+            };
+
+            scope.changeProgress = function(){
+                var modalInstance = $uibModal.open({
+                    templateUrl: 'main/modals/change-progress/change-progress.html',
+                    controller: 'ChangeProgressModalController',
+                    controllerAs: 'vm',
+                    resolve: {
+                        progress: function () {
+                            return scope.progress;
+                        },
+                        engagementUuid: function () {
+                            return scope.data.engagement_uuid;
+                        }
+                    }
+                });
+
+                // Update the progress after modal closed.
+                modalInstance.result.then(function (data) {
+                    if (!data){
+                        return;
+                    }
+                    scope.progress = data.progress || scope.progress;
+                    if (data.progress) {
+                        scope.callback(data);
+                    }
+                }, function () {
+                    $log.debug('Modal dismissed at: ' + new Date());
+                });
+            };
+
+            init();
+        };
+
+        return directive;
+    }
+
+})();
diff --git a/d2ice.att.io/app/directives/progress/progress.html b/d2ice.att.io/app/directives/progress/progress.html
new file mode 100755
index 00000000..6656a913
--- /dev/null
+++ b/d2ice.att.io/app/directives/progress/progress.html
@@ -0,0 +1,82 @@
+<!--
+============LICENSE_START========================================== 
+org.onap.vvp/portal
+===================================================================
+Copyright © 2017 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the “License”);
+you may not use this software 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.
+
+
+
+Unless otherwise specified, all documentation contained herein is licensed
+under the Creative Commons License, Attribution 4.0 Intl. (the “License”);
+you may not use this documentation except in compliance with the License.
+You may obtain a copy of the License at
+
+         https:creativecommons.org/licenses/by/4.0/
+
+Unless required by applicable law or agreed to in writing, documentation
+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.
+
+============LICENSE_END============================================
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.-->
+<div class="steps-progress-wrapper">
+    <div class="row progress-body-content">
+        <span id="progress_bar_{{data.manual_id}}" class="progress-left-content col-md-8">
+            <div class="description">
+                <span ng-if="!statuses" class="progress-title "><span class="manual-id">Progress</span>
+                    <span uib-popover="This is where you can see the current progress in the validation.
+                                                  You will also see the projected days left before the {{'program.name' | i18next}} team has completed
+                                                  the validation."
+                                     popover-title="Progress"
+                                     popover-trigger="click"
+                                     popover-html='true'
+                                     popover-placement="right"
+                                     class="progress-question-mark fa fa-question-circle-o">
+                        <span ng-mouseover="" ng-mouseleave="" class="" data-ng-click="vm"></span>
+                    </span>
+                </span>
+                <span ng-if="statuses" class="progress-title">
+                     <span id="starred-{{data.manual_id}}" class="star-engagement-action fa" ng-class="data.starred ? 'fa-star' : 'fa-star-o'" ng-click="starEngagement()"></span>
+                    <span ng-click="goToEngagement(data.engagement_uuid)" class="progress-click" ><span class="manual-id" id="eng-{{data.manual_id}}: {{data.name}}">{{data.manual_id}}: </span>{{data.name}}</span>
+                </span>
+            </div>
+
+            <div class="steps-progress-bar">
+                <div class="progress-filled" ng-style="{'flex-grow': progress}"></div>
+                <div class="progress-empty" data-ng-class="{'right': progress<=50, 'full' : progress==100}" ng-style="{'flex-grow': 100-progress}">
+                    <span id="progress-percentage" class="percents">{{progress}}&nbsp;%</span>
+                    <span id="edit-change-progress" class="edit fa fa-pencil-square-o" data-ng-if="data.enable_edit" data-ng-click="changeProgress()"></span>
+                </div>
+            </div>
+            <div class="progress-version-release row">
+                <span class="col-md-4">Target AIC Version: {{data.aic_version}}</span>
+                <span class="col-md-4"> ECOMP Release: {{data.ecomp_release}}</span>
+                <span class="col-md-4"> VNF Version: <span class="vnf_version_value" ng-bind="data.vnf_version ? data.vnf_version : '-'"></span></span>
+            </div>
+        </span>
+        <span class="progress-side-info col-md-4">
+            <div class="row">
+            	<div><span class="progress-side-info-row progress-side-info-first-row col-md-7">Heat Validated:</span><span id="heat-validated-time" class="value col-md-5">{{data.heat_validated_time | date:'shortDate'}}</span></div>
+                <div><span class="progress-side-info-row col-md-7">Image Scan:</span><span id="image-scan-time" class="value col-md-5">{{data.image_scan_time | date:'shortDate'}}</span></div>
+                <div><span class="progress-side-info-row col-md-7">AIC Instantiation:</span><span id="aic-instantiation-time" class="value col-md-5">{{data.aic_instantiation_time | date:'shortDate'}}</span></div>
+                <div><span class="progress-side-info-row progress-side-info-last-row col-md-7">ASDC Onboarding:</span><span id="asdc-onboarding-time" class="value col-md-5">{{data.asdc_onboarding_time | date:'shortDate'}}</span></div>
+            </div>
+        </span>
+    </div>
diff --git a/d2ice.att.io/app/directives/progress/progress.less b/d2ice.att.io/app/directives/progress/progress.less
new file mode 100755
index 00000000..c374886a
--- /dev/null
+++ b/d2ice.att.io/app/directives/progress/progress.less
@@ -0,0 +1,184 @@
+//
+// ============LICENSE_START========================================== 
+// org.onap.vvp/portal
+// ===================================================================
+// Copyright © 2017 AT&T Intellectual Property. All rights reserved.
+// ===================================================================
+//
+// Unless otherwise specified, all software contained herein is licensed
+// under the Apache License, Version 2.0 (the “License”);
+// you may not use this software 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.
+//
+//
+//
+// Unless otherwise specified, all documentation contained herein is licensed
+// under the Creative Commons License, Attribution 4.0 Intl. (the “License”);
+// you may not use this documentation except in compliance with the License.
+// You may obtain a copy of the License at
+// 
+//          https:creativecommons.org/licenses/by/4.0/
+//
+// Unless required by applicable law or agreed to in writing, documentation
+// 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.
+//
+// ============LICENSE_END============================================
+// 
+// ECOMP is a trademark and service mark of AT&T Intellectual Property.
+.steps-progress-wrapper {
+    position: relative;
+    border: 1px solid;
+    border-color: @main_color_o;
+    padding: 10px 15px;
+    background-color: @main_color_p;
+
+    .progress-side-info {
+    	padding: 0 10px;
+		margin-top: 4px;
+
+        .value {
+            line-height: 20px;
+            .m_12_r;
+        }
+
+        .progress-side-info-row {
+            .m_12_m;
+            line-height:20px;
+
+            .progress-side-info-first-row {
+                padding-top: 1%;
+            }
+
+            .progress-side-info-last-row {
+                padding-bottom: 1%;
+            }
+        }
+    }
+
+    .progress-body-content {
+		.progress-left-content {
+		        border-right: solid 1px  @main_color_o;
+
+		}
+
+        .progress-version-release {
+            margin-top: 5px;
+            color: @main_color_m
+        }
+
+        .description {
+            .progress-title {
+                .b_20;
+
+                .manual-id {
+                    .b_20_m;
+                }
+
+                .progress-click {
+                	cursor:pointer;
+                }
+
+                .progress-question-mark {
+                    font-size: 20px;
+                    color: @main_color_r;
+                    display: inline-block;
+                    margin-left: 1px;
+                    cursor: pointer;
+                    position: relative;
+                    top: 1px;
+                }
+
+                .star-engagement-action {
+                    display: inline-block;
+                    cursor: pointer;
+                    position: relative;
+                    margin-right: 5px;
+                }
+            }
+
+            .progress-edit-days-left {
+                float: right;
+                position: relative;
+                margin-right: 1%;
+
+                .steps-progress-days-left {
+                    .m_14_m;
+                    vertical-align: bottom;
+                }
+
+                .edit {
+                    .sprite;
+                    .sprite.edit-medium;
+                    display: inline-block;
+                    cursor: pointer;
+                    position:relative;
+                    top:3px;
+                }
+            }
+        }
+
+        .steps-progress-bar {
+            display: flex;
+            flex-direction: row;
+            justify-content: space-between;
+            overflow: hidden;
+            border: solid 1px @main_color_o;
+            height: 30px;
+
+            .progress-filled {
+                background-color: red;
+                /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#1672a4+0,c2e1f2+100 */
+                background: @gradient_left; /* Old browsers */
+                background: -moz-linear-gradient(left, @gradient_left 0%, @gradient_right 100%); /* FF3.6-15 */
+                background: -webkit-linear-gradient(left, @gradient_left 0%, @gradient_right 100%); /* Chrome10-25,Safari5.1-6 */
+                background: linear-gradient(to right, @gradient_left 0%, @gradient_right 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
+                filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=@gradient_left, endColorstr=@gradient_right, GradientType=1); /* IE6-9 */
+                border-right: solid 1px @main_color_o;
+            }
+
+            .progress-empty {
+                position: relative;
+
+                &.right {
+                    .percents {
+                        left: 10px;
+                    }
+                    .edit {
+                        left: 50px;
+                    }
+                }
+
+                .edit {
+                    font-size: 21px;
+                    color: @main_color_r;
+                    display: inline-block;
+                    position: absolute;
+                    top: 5px;
+                    left: -25px;
+                    cursor: pointer;
+                }
+
+                .percents {
+                    position: absolute;
+                    top: 4px;
+                    left: -60px;
+                }
+
+                &.full {
+               		 .percents { left: -70px; }
+          		}
+            }
+        }
+    }
+}
diff --git a/d2ice.att.io/app/directives/step-stages/step-stages.directive.js b/d2ice.att.io/app/directives/step-stages/step-stages.directive.js
new file mode 100755
index 00000000..50a97206
--- /dev/null
+++ b/d2ice.att.io/app/directives/step-stages/step-stages.directive.js
@@ -0,0 +1,172 @@
+//
+// ============LICENSE_START========================================== 
+// org.onap.vvp/portal
+// ===================================================================
+// Copyright © 2017 AT&T Intellectual Property. All rights reserved.
+// ===================================================================
+//
+// Unless otherwise specified, all software contained herein is licensed
+// under the Apache License, Version 2.0 (the “License”);
+// you may not use this software 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.
+//
+//
+//
+// Unless otherwise specified, all documentation contained herein is licensed
+// under the Creative Commons License, Attribution 4.0 Intl. (the “License”);
+// you may not use this documentation except in compliance with the License.
+// You may obtain a copy of the License at
+// 
+//          https:creativecommons.org/licenses/by/4.0/
+//
+// Unless required by applicable law or agreed to in writing, documentation
+// 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.
+//
+// ============LICENSE_END============================================
+// 
+// ECOMP is a trademark and service mark of AT&T Intellectual Property.
+(function () {
+
+    'use strict';
+
+    angular
+        .module('ice.directives', [])
+        .directive('stepStagesDirective', ProgressDirective);
+
+    function ProgressDirective($rootScope, iceConstants, localStorageService, usersService, $uibModal) {
+        var directive = {};
+        directive.restrict = 'E';
+        directive.templateUrl = 'directives/step-stages/step-stages.html';
+        directive.scope = {
+            stage : "=stage",
+            stage_num: "=stageNum",
+            eng_uuid : "@engUuid",
+            team: "=team",
+            eng_name: "@engName",
+            initactivitylogs: '&'
+        };
+        directive.controller =  ['$scope', 'vfService', '$log', function($scope, vfService, $log) {
+            $scope.set_engagement_stage = function(scope, requested_stage){
+                var modalInstance = $uibModal.open({
+                    templateUrl: 'main/modals/set-eng-stage/set-eng-stage-modal.html',
+                    controller: 'setEngStageModalController',
+                    controllerAs: 'vm',
+                    resolve: {
+                        stage: function () {
+                            return requested_stage;
+                        },
+                        eng_name: function () {
+                            return $scope.eng_name;
+                        },
+                        current_stage: function () {
+                            return $scope.stage;
+                        }
+                    }
+                });
+
+                modalInstance.result.then(function (bool) {
+                    if(bool) {
+                        vfService.set_engagement_stage(scope.eng_uuid, requested_stage)
+                            .then(function (response) {
+                                if (response.status === 202) {
+                                    scope.stage = requested_stage;
+                                    switch (requested_stage) {
+                                        case 'Intake':
+                                            scope.stage_num = 1;
+                                            break;
+                                        case 'Active':
+                                            scope.stage_num = 2;
+                                            break;
+                                        case 'Validated':
+                                            scope.stage_num = 3;
+                                            break;
+                                        case 'Completed':
+                                            scope.stage_num = 4;
+                                            break;
+                                    }
+                                    $rootScope.$broadcast('onUpdateNextSteps',{'stage': scope.stage, 'eng_uuid': scope.eng_uuid});
+                                    $scope.initactivitylogs();
+                                }
+                                else {
+                                    return false;
+                                }
+                            })
+                            .catch(function (error) {
+                                $log.error(error);
+                            });
+                    }
+                    else {
+                        return;
+                    }
+                });
+
+
+            };
+
+            $scope.hover_design = function(bool, num){
+                $scope.temp_num = num;
+                $scope.hover = bool;
+                return;
+            };
+
+
+        }];
+
+
+        directive.link = function (scope, element, attrs) {
+            scope.hover = false;
+            scope.temp_num = 0;
+            scope.priviliged = false;
+            scope.const = iceConstants.stages;
+            scope.loaded = false;
+            scope.user = usersService.getUserData();
+            scope.$watchGroup(['user','team'], function(new_vals, old_vals, scope){
+                if(!(new_vals[0]) || !(new_vals[1])){
+                    return;
+                }
+                else if (!(scope.loaded)){
+                    if( (usersService.isEngagementEL(scope.team)) || (usersService.isAdmin(scope.user))){
+                        scope.priviliged = true;
+                    };
+                    scope.loaded = true;
+
+                }
+            });
+
+            scope.hover_actions = function(bool, num){
+                if(!(scope.priviliged)){
+                    return;
+                };
+                scope.hover_design(bool, num);
+            };
+
+            scope.set_stage = function(requested_stage){
+                if(!(scope.priviliged)){
+                    return;
+                };
+                if (scope.stage === requested_stage){
+                    $log.debug("Same stage was chosen, request ignored.");
+                    return;
+                };
+
+                var result = scope.set_engagement_stage(scope, requested_stage);
+
+            };
+
+        };
+        return directive;
+    }
+
+})();
+
diff --git a/d2ice.att.io/app/directives/step-stages/step-stages.html b/d2ice.att.io/app/directives/step-stages/step-stages.html
new file mode 100755
index 00000000..0ccbd1d8
--- /dev/null
+++ b/d2ice.att.io/app/directives/step-stages/step-stages.html
@@ -0,0 +1,44 @@
+<!--
+============LICENSE_START========================================== 
+org.onap.vvp/portal
+===================================================================
+Copyright © 2017 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the “License”);
+you may not use this software 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.
+
+
+
+Unless otherwise specified, all documentation contained herein is licensed
+under the Creative Commons License, Attribution 4.0 Intl. (the “License”);
+you may not use this documentation except in compliance with the License.
+You may obtain a copy of the License at
+
+         https:creativecommons.org/licenses/by/4.0/
+
+Unless required by applicable law or agreed to in writing, documentation
+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.
+
+============LICENSE_END============================================
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.-->
+<div class="steps-stages-wrapper">
+    <div id="set-stage-{{const.intake}}" ng-click="set_stage('Intake')" class="steps-stage" ng-mouseover="hover_actions(true,1)" ng-mouseleave="hover_actions(false,0)" data-ng-class="{'selected': stage_num == 1, 'previous-stage': stage_num > 1, 'hover-selected': (priviliged == true) && (hover == true && temp_num == 1), 'hover-previous-stage': (priviliged == true) &&(hover == true && temp_num > 1)}"><span class="circle"></span><span class="line"></span><span class="text">{{const.intake}}</span></div>
+    <div id="set-stage-{{const.active}}" ng-click="set_stage('Active')" class="steps-stage" ng-mouseover="hover_actions(true,2)" ng-mouseleave="hover_actions(false,0)" data-ng-class="{'selected': stage_num == 2, 'previous-stage': stage_num > 2, 'hover-selected': (priviliged == true) && (hover == true && temp_num == 2), 'hover-previous-stage': (priviliged == true) &&(hover == true && temp_num > 2)}"><span class="circle"></span><span class="line"></span><span class="text">{{const.active}}</span></div>
+    <div id="set-stage-{{const.validated}}" ng-click="set_stage('Validated')" class="steps-stage" ng-mouseover="hover_actions(true,3)" ng-mouseleave="hover_actions(false,0)" data-ng-class="{'selected': stage_num == 3, 'previous-stage': stage_num > 3, 'hover-selected': (priviliged == true) && (hover == true && temp_num == 3), 'hover-previous-stage': (priviliged == true) &&(hover == true && temp_num > 3)}"><span class="circle"></span><span class="line"></span><span class="text">{{const.validated}}</span></div>
+    <div id="set-stage-{{const.completed}}" ng-click="set_stage('Completed')" class="steps-stage" ng-mouseover="hover_actions(true,4)" ng-mouseleave="hover_actions(false,0)" data-ng-class="{'selected': stage_num == 4, 'hover-selected': (priviliged == true) && (hover == true && temp_num == 4), }"><span class="circle"></span><span class="line"></span><span class="text">{{const.completed}}</span></div>
+</div>
diff --git a/d2ice.att.io/app/directives/step-stages/step-stages.less b/d2ice.att.io/app/directives/step-stages/step-stages.less
new file mode 100755
index 00000000..617d0c64
--- /dev/null
+++ b/d2ice.att.io/app/directives/step-stages/step-stages.less
@@ -0,0 +1,75 @@
+//
+// ============LICENSE_START========================================== 
+// org.onap.vvp/portal
+// ===================================================================
+// Copyright © 2017 AT&T Intellectual Property. All rights reserved.
+// ===================================================================
+//
+// Unless otherwise specified, all software contained herein is licensed
+// under the Apache License, Version 2.0 (the “License”);
+// you may not use this software 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.
+//
+//
+//
+// Unless otherwise specified, all documentation contained herein is licensed
+// under the Creative Commons License, Attribution 4.0 Intl. (the “License”);
+// you may not use this documentation except in compliance with the License.
+// You may obtain a copy of the License at
+// 
+//          https:creativecommons.org/licenses/by/4.0/
+//
+// Unless required by applicable law or agreed to in writing, documentation
+// 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.
+//
+// ============LICENSE_END============================================
+// 
+// ECOMP is a trademark and service mark of AT&T Intellectual Property.
+.steps-stages-wrapper {
+
+    display: flex;
+    flex-direction: row;
+    justify-content: space-between;
+    overflow: hidden;
+    padding: 10px 0 0 0;
+
+    .steps-stage {
+
+        width: 100%;
+
+        &:not(.selected) {
+            .step-progress-dashed(34px, @toolbar_background_color, 100%);
+        }
+
+        &.selected {
+            .step-progress(34px, @toolbar_background_color, 100%);
+        }
+
+        &.hover-selected {
+            .step-progress(34px, @toolbar_background_color, 100%);
+            cursor: pointer;
+        }
+
+        &.previous-stage {
+            .step-progress-solid(34px, @toolbar_background_color, 100%);
+        }
+
+        &.hover-previous-stage {
+            .step-progress-solid(34px, @toolbar_background_color, 100%);
+            cursor: pointer;
+        }
+
+    }
+
+}