diff --git a/src/server/web/pages/template/header.go b/src/server/web/pages/template/header.go
index 36f96d6..83887cc 100644
--- a/src/server/web/pages/template/header.go
+++ b/src/server/web/pages/template/header.go
@@ -19,6 +19,9 @@ const header = `
+
+
+
TorrServer ` + version.Version + `
`
diff --git a/src/server/web/pages/template/html/api.js b/src/server/web/pages/template/html/api.js
new file mode 100644
index 0000000..dd658bb
--- /dev/null
+++ b/src/server/web/pages/template/html/api.js
@@ -0,0 +1,83 @@
+// Torrents
+function addTorrent(link, title, poster, save, done, fail){
+ torrent("add",link,null,title,poster,save,done,fail);
+}
+
+function getTorrent(hash, done, fail){
+ torrent("get",null,hash,null,null,null,done,fail);
+}
+
+function remTorrent(hash, done, fail){
+ torrent("rem",null,hash,null,null,null,done,fail);
+}
+
+function listTorrent(done, fail){
+ torrent("list",null,null,null,null,null,done,fail);
+}
+
+function dropTorrent(hash, done, fail){
+ torrent("drop",null,hash,null,null,null,done,fail);
+}
+
+function torrent(action, link, hash, title, poster, save, done, fail){
+ var req = JSON.stringify({ action:action, link: link, title: title, poster: poster, save_to_db: save});
+ $.post('/torrents',req)
+ .done(function( data ) {
+ if (done)
+ done(data);
+ })
+ .fail(function( data ) {
+ if (fail)
+ fail(data);
+ });
+}
+//
+
+// Settings
+function getSettings(done, fail){
+ sendApi("get",null,"/settings",done,fail);
+}
+
+function setSettings(sets, done, fail){
+ sendApi("set",sets,"/settings",done,fail);
+}
+//
+
+// Viewed
+function listViewed(done, fail){
+ sendApi("list",null,"/viewed",done,fail);
+}
+
+function setViewed(hash, index, done, fail){
+ var obj = {"hash":hash, "file_index":index};
+ sendApi("set",obj,"/viewed",done,fail);
+}
+
+function remViewed(hash, index, done, fail){
+ var obj = {"hash":hash, "file_index":index};
+ sendApi("rem",obj,"/viewed",done,fail);
+}
+//
+
+function sendApi(action, obj, path, done, fail){
+ if (obj==null)
+ obj={};
+ obj[action]=action;
+ var req = JSON.stringify(obj);
+ $.post(path,req)
+ .done(function( data ) {
+ if (done)
+ done(data);
+ })
+ .fail(function( data ) {
+ if (fail)
+ fail(data);
+ });
+}
+
+function humanizeSize(size) {
+ if (typeof size == 'undefined' || size == 0)
+ return "";
+ var i = Math.floor( Math.log(size) / Math.log(1024) );
+ return ( size / Math.pow(1024, i) ).toFixed(2) * 1 + ' ' + ['B', 'kB', 'MB', 'GB', 'TB'][i];
+}
\ No newline at end of file
diff --git a/src/server/web/pages/template/html/main.html b/src/server/web/pages/template/html/main.html
new file mode 100644
index 0000000..fab0567
--- /dev/null
+++ b/src/server/web/pages/template/html/main.html
@@ -0,0 +1,41 @@
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ TorrServer ` + version.Version + `
+
+
+
+
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/src/server/web/pages/template/html/main.js b/src/server/web/pages/template/html/main.js
new file mode 100644
index 0000000..e94fc2f
--- /dev/null
+++ b/src/server/web/pages/template/html/main.js
@@ -0,0 +1,47 @@
+
+(function() {
+ const Torrent = Backbone.Model.extend({
+ defaults: function() {
+ return {
+ title: "",
+ torr: {},
+ url:"/torrents"
+ };
+ },
+ remove: function() {
+ this.destroy();
+ },
+ fetch: function (){
+ const collection = this;
+ getTorrent(this.torr.hash, function (torr){
+ console.log(torr);
+ collection.reset(torr);
+ })
+ }
+ });
+
+ var TorrentList = Backbone.Collection.extend({
+ model: Torrent,
+ update: function(){
+ listTorrent(function(torrs){
+ // torrs.forEach(tr=>
+ //
+ // )
+ Torrents.create({title:""});
+ console.log(Torrents);
+ },function (error) {
+ console.log(error);
+ });
+ }
+ });
+
+ var AppView = Backbone.View.extend({
+ el: $("#torrents"),
+ initialize: function() {
+ Torrents.update();
+ },
+ });
+
+ var Torrents = new TorrentList;
+ var App = new AppView;
+})();
\ No newline at end of file
diff --git a/src/server/web/pages/template/mainPage.go b/src/server/web/pages/template/mainPage.go
index c2ac633..62c45cb 100644
--- a/src/server/web/pages/template/mainPage.go
+++ b/src/server/web/pages/template/mainPage.go
@@ -10,11 +10,30 @@ func (t *Template) parseMainPage() {
const mainPage = `
-
+
` + header + `
-
-
-
+
+
+
+
+
+
+ Please click a menu item
+ You chose {{active}}
+
+
+
+
+`
+
+const tmp = `