#119 Add tag autocomplete on case creation dialog

TheHive-Project · Mar 15, 2017 · f7f2193 · f7f2193
1 parent 1f74739
commit f7f2193
Show file tree

Hide file tree

Showing 5 changed files with 33 additions and 142 deletions.
diff --git a/ui/app/scripts/controllers/case/CaseCreationCtrl.js b/ui/app/scripts/controllers/case/CaseCreationCtrl.js
@@ -4,7 +4,7 @@
 (function () {
     'use strict';
     angular.module('theHiveControllers').controller('CaseCreationCtrl',
-        function ($rootScope, $scope, $state, $uibModalInstance, CaseSrv, AlertSrv, MetricsCacheSrv, template) {
+        function ($rootScope, $scope, $state, $uibModalInstance, CaseSrv, AlertSrv, MetricsCacheSrv, TagSrv, template) {
 
             $rootScope.title = 'New case';
             $scope.activeTlp = 'active';
@@ -110,6 +110,10 @@
             $scope.cancel = function () {
                 $uibModalInstance.dismiss();
             };
+
+            $scope.getTags = function(query) {
+                return TagSrv.fromCases(query);
+            };
         }
     );
 })();
diff --git a/ui/app/styles/main.css b/ui/app/styles/main.css
@@ -450,3 +450,19 @@ table tr.tr-warning>td {
 .box.box-navy {
     border-top-color: #001f3f;
 }
+
+tags-input .tags {
+    border-radius: 0;
+}
+
+tags-input.input-sm .tags {
+    border-radius: 0;
+    height: 30px;
+    line-height: 30px;
+}
+
+
+tags-input.input-sm .tags.focused {
+    border-color: #3c8dbc;
+    box-shadow: none;
+}
diff --git a/ui/app/views/partials/case/_case.list.html b/ui/app/views/partials/case/_case.list.html
diff --git a/ui/app/views/partials/case/case.creation.html b/ui/app/views/partials/case/case.creation.html
@@ -17,7 +17,7 @@ <h4 class="vpad10 text-primary">Case details</h4>
 
                         <div class="input-group" ng-if="fromTemplate">
                             <span class="input-group-addon">{{template.titlePrefix}}</span>
-                            <input class="form-control" name="title" ng-model="newCase.title" placeholder="Title" required type="text"/>
+                            <input class="form-control input-sm" name="title" ng-model="newCase.title" placeholder="Title" required type="text"/>
                         </div>
 
                         <p class="help-block" ng-show="caseCreateForm.title.$invalid && !caseCreateForm.title.$pristine">The case title is required.</p>
@@ -54,7 +54,7 @@ <h4 class="vpad10 text-primary">Case details</h4>
                     </label>
                     <div class="col-md-9">
                         <a href ng-click="activeTlp='active'">
-                            <tlp format="activeTlp" on-update="updateTlp(newValue)" style="float:left; font-size:16px" value="newCase.tlp"></tlp>
+                            <tlp format="activeTlp" on-update="updateTlp(newValue)" value="newCase.tlp"></tlp>
                         </a>
                     </div>
                 </div>
@@ -65,7 +65,15 @@ <h4 class="vpad10 text-primary">Case details</h4>
                 <div class="form-group">
                     <label class="col-md-3 control-label">Tags</label>
                     <div class="col-md-9">
-                        <tags-input class="ti-input-sm" min-length="2" name="tags" ng-model="tags" placeholder="Tags" replace-spaces-with-dashes="false"></tags-input>
+                        <!-- <tags-input class="ti-input-sm" replace-spaces-with-dashes="false"></tags-input> -->
+                        <tags-input class="ti-input-sm input-sm form-control form-control-wrapper"
+                            name="tags"
+                            placeholder="Tags"
+                            min-length="2"
+                            ng-model="tags"
+                            replace-spaces-with-dashes="false">
+                                <auto-complete debounceDelay="400" source="getTags($query)"></auto-complete>
+                            </tags-input>
                     </div>
                 </div>
             </div>

diff --git a/ui/app/views/partials/observables/creation/form.html b/ui/app/views/partials/observables/creation/form.html
@@ -46,7 +46,7 @@
     <label class="col-md-3 control-label">TLP <i class="fa fa-asterisk text-danger"></i></label>
     <div class="col-md-9">
         <a href ng-click="activeTlp='active'">
-            <tlp value="params.tlp" format="activeTlp" style="float:left; font-size:16px" on-update="updateTlp(newValue)"></tlp>
+            <tlp value="params.tlp" format="activeTlp" on-update="updateTlp(newValue)"></tlp>
         </a>
     </div>
 </div>