updates

about section copy paste
samatt · Jun 19, 2017 · a564ced · a564ced
1 parent 4a33b71
commit a564ced
Show file tree

Hide file tree

Showing 11 changed files with 104 additions and 40 deletions.
diff --git a/app/src/main/menuBar.js b/app/src/main/menuBar.js
@@ -20,17 +20,6 @@ const template = [
       }
     ]
   },
-  {
-    label: "Edit",
-      submenu: [
-      { label: "Undo", accelerator: "CmdOrCtrl+Z", selector: "undo:" },
-      { label: "Redo", accelerator: "Shift+CmdOrCtrl+Z", selector: "redo:" },
-      { type: "separator" },
-      { label: "Cut", accelerator: "CmdOrCtrl+X", selector: "cut:" },
-      { label: "Copy", accelerator: "CmdOrCtrl+C", selector: "copy:" },
-      { label: "Paste", accelerator: "CmdOrCtrl+V", selector: "paste:" },
-      { label: "Select All", accelerator: "CmdOrCtrl+A", selector: "selectAll:" }
-  ]},
   {
     label: 'About',
     submenu: [
@@ -76,6 +65,17 @@ const template = [
         }
       }
     ]
-  }
+  },
+  {
+    label: 'Edit',
+    submenu: [
+      { label: 'Undo', accelerator: 'CmdOrCtrl+Z', selector: 'undo:' },
+      { label: 'Redo', accelerator: 'Shift+CmdOrCtrl+Z', selector: 'redo:' },
+      { type: 'separator' },
+      { label: 'Cut', accelerator: 'CmdOrCtrl+X', selector: 'cut:' },
+      { label: 'Copy', accelerator: 'CmdOrCtrl+C', selector: 'copy:' },
+      { label: 'Paste', accelerator: 'CmdOrCtrl+V', selector: 'paste:' },
+      { label: 'Select All', accelerator: 'CmdOrCtrl+A', selector: 'selectAll:' }
+    ]}
 ]
 export const menu = Menu.buildFromTemplate(template)
diff --git a/app/src/renderer/App.vue b/app/src/renderer/App.vue
@@ -134,13 +134,13 @@ export default {
     },
     keyup (e) {
       // left
-      if ((e.keyCode || e.which) === 37) {
+      if ((e.keyCode || e.which) === 37 && this.$route.name !== 'About') {
         this.decViewIndex()
         this.$router.push({
           path: `/${this.view.names[this.view.index]}`
         })
       // right
-      } else if ((e.keyCode || e.which) === 39) {
+      } else if ((e.keyCode || e.which) === 39 && this.$route.name !== 'About') {
         this.incViewIndex()
         this.$router.push({
           path: `/${this.view.names[this.view.index]}`

diff --git a/app/src/renderer/components/layout/Alerts.vue b/app/src/renderer/components/layout/Alerts.vue
@@ -32,7 +32,7 @@ const openMessage = (propsData = {
   message: '',
   type: '',
   direction: '',
-  duration: 1500,
+  duration: 4500,
   container: '.messages'
 }) => {
   return new MessageComponent({

diff --git a/app/src/renderer/components/layout/Navbar.vue b/app/src/renderer/components/layout/Navbar.vue
@@ -1,7 +1,7 @@
 <template>
   <section class="hero app-navbar animated" :class="{ slideInDown: show, slideOutUp: !show }">
     <div class="hero">
-      <nav class="nav">
+      <nav v-if="$route.name !== 'About'" class="nav">
        <!--  <div class="nav-left">
           <a id="icon-padding" class="nav-item" @click="toggleSidebar(!sidebar.opened)">
             <i class="fa fa-bars" aria-hidden="true"></i>
@@ -79,10 +79,8 @@ export default {
     },
     popMessage () {
       let view = this.$route.name.toLowerCase()
-      console.log('post message')
-      console.log(this.helpText[view])
       this.newNotification(
-        { level: 'primary',
+        { level: 'info',
           title: this.helpText[view].title,
           duration: 15000,
           body: this.helpText[view].body

diff --git a/app/src/renderer/components/layout/helpText.json b/app/src/renderer/components/layout/helpText.json
@@ -3,12 +3,12 @@
         "title":"This is title for home",
         "body": "This is the help text for home"
     },
-    "sniffer": {
-        "title":"This is title for sniffer",
-        "body": "This is the help text for sniffer"
-    },
     "network": {
-        "title":"This is title for network",
-        "body": "This is the help text for network"
+        "title":"Network",
+        "body": "In this view you can choose on your current network to inspect. The figure shows the topology of the current network you're connected too and the table provides more information about individual devices."
+    },
+    "sniffer": {
+        "title":"Sniffer",
+        "body": "In this view you can inspect the packets of the device you selected in the network view. You should be able to see all HTTP and HTTPS traffic. If the information is encrypted you will see the 🔒 icon in the row, otherwise you should be able to read it's contents"
     }
 }
diff --git a/app/src/renderer/router/index.js b/app/src/renderer/router/index.js
@@ -13,6 +13,11 @@ export default new Router({
       path: '/',
       component: require('../views/home')
     },
+    {
+      name: 'About',
+      path: '/about',
+      component: require('../views/about')
+    },
     ...generateRoutesFromMenu(menuModule.state.items),
     {
       path: '*',

diff --git a/app/src/renderer/views/about/Index.vue b/app/src/renderer/views/about/Index.vue
@@ -0,0 +1,65 @@
+    <template>
+<section>
+    <div class="splash content">
+      <!-- <img class="test" src="./assets/herbivore-large.svg"> -->
+      <h1 class="title">This is the about page for herbivore</h1>
+      <div class="subtitle is-5 sub">
+    <div @click="goHome" class='button'> Click here to go back </div>
+    </div>
+    </div>
+</section>
+</template>
+<script type="text/javascript">
+import { mapGetters, mapActions } from 'vuex'
+export default {
+  data () {
+    return {
+    }
+  },
+  computed: mapGetters({
+    view: 'view'
+  }),
+  methods: {
+    goHome: function () {
+      this.$router.push({
+        path: `/$home`
+      })
+    },
+    ...mapActions([
+      'incViewIndex',
+      'newMessage',
+      'newNotification'
+    ])}
+}
+
+</script>
+<style scoped>
+.sub {
+  margin: auto 0;
+}
+.hint {
+    font-size: 1.1rem;
+    font-weight: 100;
+    line-height: 1.25;
+    margin-top: 6em;
+}
+.highlight{
+  color: #00d1b2;
+}
+  code {
+    background-color: rgba(40, 56, 76, .5);
+    border-radius: 3px;
+    color: #fff;
+    font-weight: bold;
+    padding: 3px 6px;
+    margin: 0 3px;
+    vertical-align: bottom;
+  }
+  .test{
+    width:256px;
+    height: auto;
+  }
+  .splash {
+    padding-top: 10%;
+  }
+</style>
diff --git a/app/src/renderer/views/home/Index.vue b/app/src/renderer/views/home/Index.vue
@@ -8,14 +8,14 @@
     A tool that lets you take a deeper look at the packets traveling through your networks.
     </br>
     Go checkout whats happening on your current network.
-      <span @click="goRight" class="icon">
+    <a>  <span @click="goRight" class="icon">
         <i class="fa fa-arrow-right highlight" aria-hidden="true"></i>
       </span>
+    </a>
   </div>
-    <a  class="nav-item">
 
-    </a>
   <div @click="newMessage({level:'primary', title:'', duration: 5000, body:'If this is your first time using herbivore you\'ll need to set some permissions. Click on the permissions tab in the menu bar to do so. You will have to enter your password 3 times. (Sorry)'})" class='button'> Click here if its your first time </div>
+  <div @click="goAbout" class='button'> About Herbivore </div>
   <p class="subtitle is-5 hint">
   Hint: you can also use the ← and → arrow keys to navigate.
   </p>
@@ -35,20 +35,17 @@ export default {
     view: 'view'
   }),
   methods: {
-    toggle () {
-      if (this.test === '1111') {
-        this.test = '2222'
-      } else {
-        this.test = '1111'
-      }
-    },
     goRight: function () {
-      console.log('there')
       this.incViewIndex()
       this.$router.push({
         path: `/${this.view.names[this.view.index]}`
       })
     },
+    goAbout: function () {
+      this.$router.push({
+        path: `/about`
+      })
+    },
     ...mapActions([
       'incViewIndex',
       'newMessage',

diff --git a/app/src/renderer/vuex/modules/menu.js b/app/src/renderer/vuex/modules/menu.js
@@ -12,7 +12,7 @@ const state = {
       path: '/network',
       meta: {
         icon: 'fa-info',
-        link: 'network/index.vue'
+        link: 'network/Index.vue'
       },
       component: require('../../views/network')
     },

diff --git a/app/src/renderer/vuex/modules/sniffer.js b/app/src/renderer/vuex/modules/sniffer.js
@@ -17,7 +17,6 @@ const actions = {
     commit(types.NEW_PACKET, packet)
   },
   clearPackets ({ commit, state }) {
-    console.log('here')
     commit(types.CLEAR_PACKETS)
   },
   startSniffer ({ commit, state }) {

diff --git a/webpack.renderer.config.js b/webpack.renderer.config.js
@@ -85,7 +85,7 @@ let rendererConfig = {
       template: './app/index.ejs',
       appModules: process.env.NODE_ENV !== 'production'
         ? path.resolve(__dirname, 'app/node_modules')
-        : false,
+        : false
     }),
     new webpack.NoEmitOnErrorsPlugin()
   ],
@@ -150,4 +150,4 @@ if (process.env.NODE_ENV === 'production') {
   )
 }
 
-module.exports = rendererConfig
+module.exports = rendererConfig