Few UI bugs fixed (#1555)

google · Jan 11, 2021 · 77862c9 · 77862c9
1 parent 73dc520
commit 77862c9
Show file tree

Hide file tree

Showing 13 changed files with 36 additions and 20 deletions.
diff --git a/...ontend/dist/css/chunk-common.b4a070aa.css → ...ontend/dist/css/chunk-common.01d7a770.css b/...ontend/dist/css/chunk-common.b4a070aa.css → ...ontend/dist/css/chunk-common.01d7a770.css
diff --git a/timesketch/frontend/dist/index.html b/timesketch/frontend/dist/index.html
@@ -1 +1 @@
-<!DOCTYPE html><html lang=en><head><meta name=csrf-token content="{{ csrf_token() }}"><meta charset=utf-8><meta http-equiv=X-UA-Compatible content="IE=edge"><meta name=viewport content="width=device-width,initial-scale=1"><link rel=icon href=/dist/favicon.ico><title>Timesketch</title><link href=/dist/css/chunk-common.b4a070aa.css rel=preload as=style><link href=/dist/css/chunk-vendors.4a602e4f.css rel=preload as=style><link href=/dist/js/chunk-common.9389d8d5.js rel=preload as=script><link href=/dist/js/chunk-vendors.53acc4a0.js rel=preload as=script><link href=/dist/js/index.0c45ccdf.js rel=preload as=script><link href=/dist/css/chunk-vendors.4a602e4f.css rel=stylesheet><link href=/dist/css/chunk-common.b4a070aa.css rel=stylesheet></head><body><div id=app></div><script src=/dist/js/chunk-vendors.53acc4a0.js></script><script src=/dist/js/chunk-common.9389d8d5.js></script><script src=/dist/js/index.0c45ccdf.js></script></body></html>
+<!DOCTYPE html><html lang=en><head><meta name=csrf-token content="{{ csrf_token() }}"><meta charset=utf-8><meta http-equiv=X-UA-Compatible content="IE=edge"><meta name=viewport content="width=device-width,initial-scale=1"><link rel=icon href=/dist/favicon.ico><title>Timesketch</title><link href=/dist/css/chunk-common.01d7a770.css rel=preload as=style><link href=/dist/css/chunk-vendors.4a602e4f.css rel=preload as=style><link href=/dist/js/chunk-common.ec7a6c11.js rel=preload as=script><link href=/dist/js/chunk-vendors.53acc4a0.js rel=preload as=script><link href=/dist/js/index.0c45ccdf.js rel=preload as=script><link href=/dist/css/chunk-vendors.4a602e4f.css rel=stylesheet><link href=/dist/css/chunk-common.01d7a770.css rel=stylesheet></head><body><div id=app></div><script src=/dist/js/chunk-vendors.53acc4a0.js></script><script src=/dist/js/chunk-common.ec7a6c11.js></script><script src=/dist/js/index.0c45ccdf.js></script></body></html>
diff --git a/timesketch/frontend/dist/js/chunk-common.9389d8d5.js b/timesketch/frontend/dist/js/chunk-common.9389d8d5.js
diff --git a/timesketch/frontend/dist/js/chunk-common.9389d8d5.js.map b/timesketch/frontend/dist/js/chunk-common.9389d8d5.js.map
diff --git a/timesketch/frontend/dist/js/chunk-common.ec7a6c11.js b/timesketch/frontend/dist/js/chunk-common.ec7a6c11.js
diff --git a/timesketch/frontend/dist/js/chunk-common.ec7a6c11.js.map b/timesketch/frontend/dist/js/chunk-common.ec7a6c11.js.map
diff --git a/timesketch/frontend/dist/login.html b/timesketch/frontend/dist/login.html
@@ -15,4 +15,4 @@
         .card-content {
             justify-content: center;
             align-items: center;
-        }</style><link href=/dist/css/chunk-common.b4a070aa.css rel=preload as=style><link href=/dist/css/chunk-vendors.4a602e4f.css rel=preload as=style><link href=/dist/js/chunk-common.9389d8d5.js rel=preload as=script><link href=/dist/js/chunk-vendors.53acc4a0.js rel=preload as=script><link href=/dist/js/login.c1fa2383.js rel=preload as=script><link href=/dist/css/chunk-vendors.4a602e4f.css rel=stylesheet><link href=/dist/css/chunk-common.b4a070aa.css rel=stylesheet></head><body class=login-page><div class=columns><div class=column><div class="card is-wide has-text-centered"><div class=card-content><div class=content><div><img src=/dist/timesketch-color.png style=width:40px;><div style="font-size: 1.5em;">time<b>sketch</b></div><div style="font-size: 0.8em;">Digital Forensic Timeline Analysis</div></div><br><form method=post style="width:50%;margin-left: auto; margin-right: auto;"><div class=field><div class=control><input type=text class=input name=username placeholder=Username style=text-align:center;></div></div><div class=field><div class=control><input type=password class=input name=password placeholder=Password style=text-align:center;></div></div><div class=field><div class="control has-text-centered"><button type=submit class="button is-rounded is-wide is-info" style=width:100%;>Sign in</button></div></div>{{ form.csrf_token }}</form></div></div></div></div></div><script src=/dist/js/chunk-vendors.53acc4a0.js></script><script src=/dist/js/chunk-common.9389d8d5.js></script><script src=/dist/js/login.c1fa2383.js></script></body></html>
+        }</style><link href=/dist/css/chunk-common.01d7a770.css rel=preload as=style><link href=/dist/css/chunk-vendors.4a602e4f.css rel=preload as=style><link href=/dist/js/chunk-common.ec7a6c11.js rel=preload as=script><link href=/dist/js/chunk-vendors.53acc4a0.js rel=preload as=script><link href=/dist/js/login.c1fa2383.js rel=preload as=script><link href=/dist/css/chunk-vendors.4a602e4f.css rel=stylesheet><link href=/dist/css/chunk-common.01d7a770.css rel=stylesheet></head><body class=login-page><div class=columns><div class=column><div class="card is-wide has-text-centered"><div class=card-content><div class=content><div><img src=/dist/timesketch-color.png style=width:40px;><div style="font-size: 1.5em;">time<b>sketch</b></div><div style="font-size: 0.8em;">Digital Forensic Timeline Analysis</div></div><br><form method=post style="width:50%;margin-left: auto; margin-right: auto;"><div class=field><div class=control><input type=text class=input name=username placeholder=Username style=text-align:center;></div></div><div class=field><div class=control><input type=password class=input name=password placeholder=Password style=text-align:center;></div></div><div class=field><div class="control has-text-centered"><button type=submit class="button is-rounded is-wide is-info" style=width:100%;>Sign in</button></div></div>{{ form.csrf_token }}</form></div></div></div></div></div><script src=/dist/js/chunk-vendors.53acc4a0.js></script><script src=/dist/js/chunk-common.ec7a6c11.js></script><script src=/dist/js/login.c1fa2383.js></script></body></html>
diff --git a/timesketch/frontend/src/components/Sketch/AggregationListDropdown.vue b/timesketch/frontend/src/components/Sketch/AggregationListDropdown.vue
@@ -14,7 +14,7 @@ See the License for the specific language governing permissions and
 limitations under the License.
 -->
 <template>
-  <b-dropdown ref="dropdown" animation="none" aria-role="menu" append-to-body>
+  <b-dropdown ref="dropdown" animation="none" aria-role="menu" :position="position">
     <a class="button" v-bind:class="{ 'is-rounded': isRounded}" slot="trigger">
       <span>+ Aggregation</span>
       <b-icon :icon="active ? 'chevron-up' : 'chevron-down'" style="font-size: 0.6em;"></b-icon>
@@ -32,14 +32,25 @@ limitations under the License.
 
 <script>
 export default {
-  props: ['isRounded', 'aggregations'],
+  props: ['isRounded', 'aggregations', 'isLast'],
+  data () {
+    return {
+      position: "is-bottom-right"
+    }
+  },
   methods: {
     setActiveAggregation: function (aggregation) {
       this.$emit('addAggregation', aggregation)
     }
+  },
+  created: function () {
+    if (this.isLast) {
+      this.position = 'is-top-right'
+    }
   }
 }
 </script>
 
+
 <!-- CSS scoped to this component only -->
 <style scoped lang="scss"></style>
diff --git a/timesketch/frontend/src/components/Sketch/CreateStoryForm.vue b/timesketch/frontend/src/components/Sketch/CreateStoryForm.vue
@@ -48,6 +48,7 @@ export default {
         let newStoryId = response.data.objects[0].id
         this.clearFormData()
         this.$router.push({ name: 'SketchStoryContent', params: { storyId: newStoryId } })
+        this.$store.dispatch('updateSketch', this.sketch.id)
       }).catch((e) => {})
     }
   },

diff --git a/timesketch/frontend/src/components/Sketch/TimelineList.vue b/timesketch/frontend/src/components/Sketch/TimelineList.vue
@@ -53,10 +53,7 @@ export default {
       }).catch((e) => {
         console.error(e)
       })
-    },
-  },
-  created() {
-    this.$store.dispatch('updateSketch', this.sketch.id)
+    }
   }
 }
 </script>
diff --git a/timesketch/frontend/src/components/Sketch/ViewListDropdown.vue b/timesketch/frontend/src/components/Sketch/ViewListDropdown.vue
@@ -29,7 +29,7 @@ limitations under the License.
           </div>
         </b-modal>
 
-        <b-dropdown ref="dropdown" animation="none" aria-role="menu" append-to-body>
+        <b-dropdown ref="dropdown" animation="none" aria-role="menu" :position="position" :append-to-body="!isSimple">
 
           <a class="button" v-bind:class="{ 'is-rounded': isSimple, 'ts-search-dropdown': !isSimple}" slot="trigger" slot-scope="{ active }">
             <b-icon v-if="!isSimple" icon="save" style="margin-right: 7px; font-size: 0.6em;"></b-icon>
@@ -86,11 +86,12 @@ export default {
   components: {
     TsCreateViewForm
   },
-  props: ['currentQueryString', 'currentQueryFilter', 'isSimple', 'sketchId'],
+  props: ['currentQueryString', 'currentQueryFilter', 'isSimple', 'isLast', 'sketchId'],
   data () {
     return {
       activeView: null,
-      showCreateViewModal: false
+      showCreateViewModal: false,
+      position: "is-bottom-right"
     }
   },
   methods: {
@@ -131,6 +132,9 @@ export default {
     }
   },
   created: function () {
+    if (this.isLast) {
+      this.position = 'is-top-right'
+    }
     let queryViewId = this.$route.query.view
     if (queryViewId) {
       let view =  this.meta.views.filter(function(view) {

diff --git a/timesketch/frontend/src/views/Home.vue b/timesketch/frontend/src/views/Home.vue
@@ -125,6 +125,8 @@ limitations under the License.
       </div>
     </section>
 
+    <br>
+
   </div>
 </template>
 

diff --git a/timesketch/frontend/src/views/SketchStoryContent.vue b/timesketch/frontend/src/views/SketchStoryContent.vue
@@ -39,7 +39,7 @@ limitations under the License.
 
             <div v-for="(obj, index) in blocks" :key="index">
 
-              <div v-if="!obj.componentName" @mouseover="obj.isActive = true" @mouseleave="obj.isActive = false" v-bind:class="{ activeBlock: obj.isActive }" class="inactiveBlock" style="padding-left:10px;">
+              <div v-if="!obj.componentName" @mouseover="obj.isActive = true" @mouseleave="obj.isActive = false" v-bind:class="{ activeBlock: obj.isActive }" class="inactiveBlock" style="padding-left:10px;margin-top:10px;margin-bottom: 10px;">
 
                 <span v-if="obj.isActive" style="float:right;">
                   <button class="delete" v-on:click="deleteBlock(index)"></button>
@@ -66,7 +66,7 @@ limitations under the License.
                 <div v-on:dblclick="obj.edit = !obj.edit" class="markdown-body" v-if="!obj.edit" v-html="toHtml(obj.content)"></div>
               </div>
 
-              <div v-if="obj.componentName" @mouseover="obj.isActive = true" @mouseleave="obj.isActive = false">
+              <div style="margin-top:10px;margin-bottom: 10px;" v-if="obj.componentName" @mouseover="obj.isActive = true" @mouseleave="obj.isActive = false">
                 <article class="message">
                   <div class="message-header">
                     <p v-if="obj.componentName === 'TsViewEventList'">
@@ -86,7 +86,7 @@ limitations under the License.
                 </article>
               </div>
 
-              <div style="min-height:35px;margin-top:10px;margin-bottom:10px;" @mouseover="obj.showPanel = true" @mouseleave="obj.showPanel = false">
+              <div style="min-height:40px;" @mouseover="obj.showPanel = true" @mouseleave="obj.showPanel = false">
                 <div v-if="index === blocks.length - 1" style="padding-top:20px;"></div>
                   <div v-if="index === blocks.length - 1 || obj.showPanel || obj.isActive" class="field is-grouped">
                     <p class="control">
@@ -95,10 +95,10 @@ limitations under the License.
                       </button>
                     </p>
                     <p class="control" v-if="meta.views.length">
-                      <ts-view-list-dropdown @setActiveView="addViewComponent($event, index)" :is-simple="true" :title="'+ Saved search'"></ts-view-list-dropdown>
+                      <ts-view-list-dropdown @setActiveView="addViewComponent($event, index)" :is-simple="true" :is-last="index === blocks.length - 1" :title="'+ Saved search'"></ts-view-list-dropdown>
                     </p>
                     <p class="control" v-if="allAggregations">
-                      <ts-aggregation-list-dropdown @addAggregation="addAggregationComponent($event, index)" :is-rounded="true" :aggregations="allAggregations" ></ts-aggregation-list-dropdown>
+                      <ts-aggregation-list-dropdown @addAggregation="addAggregationComponent($event, index)" :is-rounded="true" :is-last="index === blocks.length - 1" :aggregations="allAggregations" ></ts-aggregation-list-dropdown>
                     </p>
                   </div>
               </div>
@@ -176,6 +176,7 @@ export default {
       this.save()
     },
     addViewComponent (event, index) {
+      this.showPanel = false
       let newIndex = index + 1
       let newBlock = defaultBlock()
       newBlock.componentName = 'TsViewEventList'