BRANCH: Torrent with Vue and pure JS.

public/static/js/addTorrents.js

@@ -0,0 +1,49 @@
+// Get the modal
+var modal = document.getElementById('addTorrentModal');
+
+// Get the button that opens the modal
+var btn = document.getElementById("addTorrentLink");
+
+// Get the <span> element that closes the modal
+var span = document.getElementsByClassName("addTorrentModalClose")[0];
+
+
+// When the user clicks the button, open the modal 
+btn.onclick = function() {
+    modal.style.display = "block";
+}
+
+// When the user clicks on <span> (x), close the modal
+span.onclick = function() {
+    modal.style.display = "none";
+}
+
+// When the user clicks anywhere outside of the modal, close it
+window.onclick = function(event) {
+    if (event.target == modal) {
+        modal.style.display = "none";
+    }
+}
+
+var torrentFileModal = document.getElementById('addTorrentFileModal');
+
+var btnTorrentFile = document.getElementById("addTorrentFile");
+
+var spanTorrentFile = document.getElementsByClassName("addTorrentFileModalClose")[0];
+
+
+btnTorrentFile.onclick = function() {
+    torrentFileModal.style.display = "block";
+}
+
+// When the user clicks on <span> (x), close the modal
+spanTorrentFile.onclick = function() {
+    torrentFileModal.style.display = "none";
+}
+
+// When the user clicks anywhere outside of the modal, close it
+window.onclick = function(event) {
+    if (event.target == torrentFileModal) {
+        torrentFileModal.style.display = "none";
+    }
+}

public/static/js/grid.js

@@ -0,0 +1,31 @@
+Vue.use(Vuetable);
+
+var demo = new Vue({
+    delimiters: ['((', '))'],
+    el: '#torrentlist',
+    components:{
+        'vuetable-pagination': Vuetable.VuetablePagination
+    },
+    data: {
+        fields: ['Torrent Name', 'Status','Percent Complete','Size','Total Peers','Storage Location']
+    },
+    computed:{
+        /*httpOptions(){
+          return {headers: {'Authorization': "my-token"}} //table props -> :http-options="httpOptions"
+        },*/
+    },
+    methods: {
+        onPaginationData (paginationData) {
+            this.$refs.pagination.setPaginationData(paginationData)
+        },
+        onChangePage (page) {
+            this.$refs.vuetable.changePage(page)
+        },
+        editRow(rowData){
+            alert("You clicked edit on"+ JSON.stringify(rowData))
+        },
+        deleteRow(rowData){
+            alert("You clicked delete on"+ JSON.stringify(rowData))
+        }
+    }
+})

public/static/js/tabControl.js

@@ -0,0 +1,13 @@
+function openTab(evt, tabName) {
+    var i, x, tablinks;
+    x = document.getElementsByClassName("tab");
+    for (i = 0; i < x.length; i++) {
+        x[i].style.display = "none";
+    }
+    tablinks = document.getElementsByClassName("tablink");
+    for (i = 0; i < x.length; i++) {
+        tablinks[i].className = tablinks[i].className.replace(" activeButton", "");
+    }
+    document.getElementById(tabName).style.display = "block";
+    evt.currentTarget.className += " activeButton";
+}

public/static/js/websocket.js

@@ -0,0 +1,65 @@
+function myWebsocketStart()
+{
+
+    var torrentLinkSubmit = document.getElementById('torrentLinkSubmit');
+    var magnetLink = document.getElementById('magnetLink');
+    var modal = document.getElementById('addTorrentModal');
+    var myTextArea = document.getElementById("loggerData");
+    var torrentHash = document.getElementById("hash");
+
+
+    var ws = new WebSocket("ws://192.168.1.141:8000/websocket");
+
+    ws.onopen = function()
+    {
+        // Web Socket is connected, send data using send()
+        ws.send("ping");
+
+        myTextArea.innerHTML = myTextArea.innerHTML + "</br>" + "First message sent";
+    };
+
+    ws.onmessage = function (evt)
+    {
+        var myTextArea = document.getElementById("loggerData");
+        if(evt.data == "pong") {
+            setTimeout(function(){ws.send("ping");}, 2000);
+        } else {
+
+            var clientUpdate = JSON.parse(evt.data);
+            myTextArea.innerHTML = myTextArea.innerHTML + "</br>" + "Client Update Event...";
+            //myTextArea.innerHTML = myTextArea.innerHTML + "</br>" + clientUpdate.LocalTorrentInfo.DateAdded;
+            myTextArea.innerHTML = myTextArea.innerHTML + "</br>" + evt.data;
+            //myTextArea.innerHTML = myTextArea.innerHTML + "</br>" + clientUpdate[0].TorrentHashString;
+
+            //torrentHash.innerHTML = "Hash: " + clientUpdate[0].TorrentHashString;
+
+
+
+        }
+    };
+
+    ws.onclose = function()
+    {
+        var myTextArea = document.getElementById("loggerData");
+        myTextArea.innerHTML = myTextArea.innerHTML + "</br>" + "Connection closed";
+    };
+
+
+    torrentLinkSubmit.onclick = function(e) {
+        e.preventDefault();
+
+        var magnetLinkjs = magnetLink.value;
+
+        ws.send(magnetLinkjs);
+        myTextArea.innerHTML = myTextArea.innerHTML + "</br> Send:" + magnetLinkjs
+        modal.style.display = "none";
+        magnetLink.value = '';
+    }
+
+
+}
+
+function sendEvent(message)
+{
+    ws.send(message);
+}