Merge pull request #162 from BuildFire/use-standard-tag-component

Use standard tag component

Author: mas-iota

control/settings/app.js

@@ -3,11 +3,9 @@
 // Declare app level module which depends on views, and components
 var app = angular.module('socialPluginSettings', [
     'ngRoute',
-    'ngTagsInput'
 ]);
-app.config(['$locationProvider', '$routeProvider', 'tagsInputConfigProvider', function ($locationProvider, $routeProvider, tagsInputConfigProvider) {
+app.config(['$locationProvider', '$routeProvider', function ($locationProvider, $routeProvider) {
     //config for tag-input plugin
-    tagsInputConfigProvider.setActiveInterpolation('tagsInput', { minTags: true });
 
     $routeProvider.when('/', {
         templateUrl: 'views/mainSettings.html',

control/settings/assets/css/ng-tags-input.bootstrap.min.css

@@ -11,6 +11,8 @@ app.controller('MainSettingsCtrl', ['$scope', function ($scope) {
         mainThreadUserTags: [],
         sideThreadUserTags: []
     };
+    var mainThreadUserTagsContainer = null;
+    var sideThreadUserTagsContainer = null;
 
     var load = function () {
         var editor = new buildfire.components.actionItems.sortableList("#actions");
@@ -92,6 +94,7 @@ app.controller('MainSettingsCtrl', ['$scope', function ($scope) {
                         $scope.save();
                     })
                 }
+                initUserTags();
             }
         });
 
@@ -129,6 +132,39 @@ app.controller('MainSettingsCtrl', ['$scope', function ($scope) {
         }
     }
 
+    var initUserTags = function () {
+        mainThreadUserTagsContainer = new buildfire.components.control.userTagsInput("#allowMainThreadTags", {});
+
+        mainThreadUserTagsContainer.onUpdate = (tags) => {
+            $scope.data.mainThreadUserTags = tags.tags.map(tag => ({ text: tag.tagName }));
+            $scope.save();
+        };
+
+        if ($scope.data.mainThreadUserTags && $scope.data.mainThreadUserTags.length) {
+            const tags = $scope.data.mainThreadUserTags.map(tag => ({
+                value: tag.text,
+                tagName: tag.text,
+            }));
+            mainThreadUserTagsContainer.append(tags);
+        }
+
+        sideThreadUserTagsContainer = new buildfire.components.control.userTagsInput("#allowSideThreadUserTags", {});
+
+        sideThreadUserTagsContainer.onUpdate = (tags) => {
+            $scope.data.sideThreadUserTags = tags.tags.map(tag => ({ text: tag.tagName }));
+            $scope.save();
+        };
+
+        if ($scope.data.sideThreadUserTags && $scope.data.sideThreadUserTags.length) {
+            const tags = $scope.data.sideThreadUserTags.map(tag => ({
+                value: tag.text,
+                tagName: tag.text,
+            }));
+            sideThreadUserTagsContainer.append(tags);
+        }
+
+    }
+
     $scope.handleChatFeatureActionItem = function () {
         var chatFeatureActionsItems = new buildfire.components.actionItems.sortableList("#chatFeatureActions");
         if ($scope.data.chatFeature.actionItem) {

control/settings/assets/css/ng-tags-input.min.css

@@ -11,17 +11,17 @@
     <script src="../../../../scripts/sortable.min.js"></script>
     <script src="../../../../scripts/buildfire/components/actionItems/sortableList.js"></script>
     <script src="../../../../scripts/angular/ui-bootstrap.min.js"></script>
+    <script src="../../../../scripts/buildfire/components/control/tagsInput/tagsInput.min.js"></script>
 
     <!-- Load helper.css to use our helper classes.
     -->
     <link href="../../../../styles/helper.css" rel="stylesheet" />
     <link href="../../../../styles/siteStyle.css" rel="stylesheet" />
     <link href="../../../../styles/control/siteIcons-control.css" rel="stylesheet" />
     <link href="../../../../styles/control/bf-base.css" rel="stylesheet" />
+    <link href="../../../../styles/components/control/tagsInput/tagsInput.min.css" rel="stylesheet"/>
 
     <!-- build:bundleCSSFiles  -->
-    <link href="assets/css/ng-tags-input.min.css" rel="stylesheet">
-    <link href="assets/css/ng-tags-input.bootstrap.min.css" rel="stylesheet">
     <link href="assets/css/style.css" rel="stylesheet">
     <link rel="stylesheet" href="assets/css/reset.css">
     <link rel="stylesheet" href="assets/css/sortable.css">
@@ -31,7 +31,6 @@
     <!-- build:bundleJSFiles  -->
     <script src="app.js"></script>
     <script src="controllers/mainSettingsCtrl.js"></script>
-    <script src="assets/js/ng-tags-input.min.js"></script>
     <script src="controllers/search-table-helper.js"></script>
     <script src="controllers/search-table-config.js"></script>
     <!-- endbuild -->

control/settings/assets/js/ng-tags-input.min.js

@@ -33,10 +33,7 @@ <h1>Post Permissions</h1>
                 </span>
             </div>
             <div class="col-md-8">
-                <tags-input class="margin-bottom-ten" ng-model="data.mainThreadUserTags"
-                            min-tags="{{data.allowMainThreadTags ? 1 : 0}}" on-tag-added="save()"
-                            on-tag-removed="save()">
-                </tags-input>
+                <div class="margin-bottom-ten" id="allowMainThreadTags"></div>
             </div>
         </div>
 
@@ -63,9 +60,7 @@ <h1>Post Permissions</h1>
             </div>
 
             <div class="col-md-8">
-                <tags-input class="margin-bottom-ten" ng-model="data.sideThreadUserTags" min-tags="{{data.allowSideThreadTags ? 1 : 0}}"
-                    on-tag-added="save()" on-tag-removed="save()">
-                </tags-input>
+                <div class="margin-bottom-ten" id="allowSideThreadUserTags"></div>
             </div>
         </div>
 

control/settings/controllers/mainSettingsCtrl.js

@@ -709,13 +709,15 @@
                 },
                 addComment: function (data) {
                     var deferred = $q.defer();
-                    if (data.userDetails.userTags) {
-                        delete data.userDetails.userTags
-                        delete data.userDetails.userToken
+                    const requestData = structuredClone(data);
+
+                    if (requestData.userDetails.userTags) {
+                        delete requestData.userDetails.userTags
+                        delete requestData.userDetails.userToken
                     }
-                    buildfire.publicData.getById(data.threadId, 'posts', function (err, post) {
+                    buildfire.publicData.getById(requestData.threadId, 'posts', function (err, post) {
                         if (err) return deferred.reject(err);
-                        post.data.comments.push(data);
+                        post.data.comments.push(requestData);
                         buildfire.publicData.update(post.id, post.data, 'posts', function (err, status) {
                             if (err) return deferred.reject(err);
                             else{

control/settings/index.html

@@ -166,6 +166,7 @@
               WidgetWall.showHidePrivateChat();
               WidgetWall.followLeaveGroupPermission();
               WidgetWall.showHideCommentBox();
+              WidgetWall.initFabButtons();
               let dldActionItem = new URLSearchParams(window.location.search).get('actionItem');
               if (dldActionItem)
                   WidgetWall.SocialItems.appSettings.actionItem = JSON.parse(dldActionItem);
@@ -616,6 +617,7 @@
                                 WidgetWall.stopSkeleton();
                                 return console.error("Getting user failed.", err);
                               }
+                              WidgetWall.setSettings(result);
                               WidgetWall.SocialItems.checkBlockedUsers();
                               WidgetWall.getPosts(()=>{
                                   if (user) {
@@ -820,12 +822,13 @@
           }
 
           WidgetWall.navigateToPrivateChat = function (privateChatData) {
-
               WidgetWall.SocialItems.isPrivateChat = true;
               WidgetWall.SocialItems.wid = privateChatData.wid;
               WidgetWall.SocialItems.showMorePosts = false;
               WidgetWall.SocialItems.pageSize = 5;
               WidgetWall.SocialItems.page = 0;
+              WidgetWall.allowCreateThread = true;
+              WidgetWall.initFabButtons();
               WidgetWall.SocialItems.setPrivateChatTitle(privateChatData.wid).then(() => {
                   if (WidgetWall.isFromDeepLink) {
                       buildfire.appearance.titlebar.setText({ text: WidgetWall.SocialItems.pluginTitle}, (err) => {
@@ -858,12 +861,10 @@
                       if (result) {
                           WidgetWall.SocialItems.appSettings = result.data && result.data.appSettings ? result.data.appSettings : {};
                           WidgetWall.setSettings(result);
-                          WidgetWall.initFabButtons();
 
                           Buildfire.datastore.onUpdate(function (response) {
                               if (response.tag === "Social") {
                                   WidgetWall.setSettings(response);
-                                  WidgetWall.initFabButtons()
                                   setTimeout(function () {
                                       if (!response.data.appSettings.disableFollowLeaveGroup) {
                                           let wallSVG = document.getElementById("WidgetWallSvg")