rebuilding js

Former-commit-id: 027e2f6546614d28750e437b9a3545cb95235d9d [formerly 6dbfe621a5774304295c17f216b5c96beaaaa95a] [formerly d44822f30d9a3649b20daa7a3cdbf86c87e63c99 [formerly 3258552349]]
Former-commit-id: 7f34ddc1b32076c6ad2c2a4374b170b7f5d84000 [formerly aaafd299a933d25ebcb5fdebe1b00cb9e8309d7a]
Former-commit-id: 7bb183c165ba2c9711ba1c04e3af6e2048245ded

_assets/js/app.js

@@ -0,0 +1,122 @@
+'use strict'
+
+var data = (window.data || window.alert('Something is wrong, please refresh!'))
+var ssl = (window.location.protocol === 'https:')
+
+// Remove the last directory of an url
+var removeLastDirectoryPartOf = function (url) {
+  var arr = url.split('/')
+  if (arr.pop() === '') {
+    arr.pop()
+  }
+  return (arr.join('/'))
+}
+
+var search = new window.Vue({
+  el: '#search',
+  data: {
+    hover: false,
+    focus: false,
+    scrollable: null,
+    box: null,
+    input: null
+  },
+  mounted: function () {
+    this.scrollable = document.querySelector('#search > div')
+    this.box = document.querySelector('#search > div div')
+    this.input = document.querySelector('#search input')
+    this.reset()
+  },
+  methods: {
+    reset: function () {
+      if (data.user.AllowCommands && data.user.Commands.length > 0) {
+        this.box.innerHTML = `Search or use one of your supported commands: ${data.user.Commands.join(", ")}.`
+      } else {
+        this.box.innerHTML = 'Type and press enter to search.'
+      }
+    },
+    supported: function () {
+      let value = this.input.value
+      let pieces = value.split(' ')
+
+      for (let i = 0; i < data.user.Commands.length; i++) {
+        if (pieces[0] === data.user.Commands[0]) {
+          return true
+        }
+      }
+
+      return false
+    },
+    click: function (event) {
+      event.currentTarget.classList.add('active')
+      this.$el.querySelector('input').focus()
+    },
+    keyup: function (event) {
+      let el = event.currentTarget
+
+      if (el.value.length === 0) {
+        this.reset()
+        return
+      }
+
+      if (!this.supported() || !data.user.AllowCommands) {
+        this.box.innerHTML = 'Press enter to search.'
+      } else {
+        this.box.innerHTML = 'Press enter to execute.'
+      }
+    },
+    submit: function (event) {
+      this.box.innerHTML = ''
+      this.$el.classList.add('ongoing')
+
+      let url = window.location.host + window.location.pathname
+
+      if (document.getElementById('editor')) {
+        url = removeLastDirectoryPartOf(url)
+      }
+
+      let protocol = ssl ? 'wss:' : 'ws:'
+
+      if (this.supported() && data.user.AllowCommands) {
+        let conn = new window.WebSocket(`${protocol}//${url}?command=true`)
+
+        conn.onopen = () => {
+          conn.send(this.input.value)
+        }
+
+        conn.onmessage = (event) => {
+          this.box.innerHTML = event.data
+          this.scrollable.scrollTop = this.scrollable.scrollHeight
+        }
+
+        conn.onclose = (event) => {
+          this.$el.classList.remove('ongoing')
+          // TODO: if is listing!
+          // listing.reload()
+        }
+
+        return
+      }
+
+      this.box.innerHTML = '<ul></ul>'
+
+      let ul = this.box.querySelector('ul')
+      let conn = new window.WebSocket(`${protocol}//${url}?search=true`)
+
+      conn.onopen = () => {
+        conn.send(this.input.value)
+      }
+
+      conn.onmessage = (event) => {
+        ul.innerHTML += `<li><a href=".${event.data}">${event.data}</a></li>`
+        this.scrollable.scrollTop = this.scrollable.scrollHeight
+      }
+
+      conn.onclose = () => {
+        this.$el.classList.remove('ongoing')
+      }
+    }
+  }
+})
+
+console.log(search)