From b3d8989d9733e3e8741d11a3f9c94c605199a9bd Mon Sep 17 00:00:00 2001
From: Joxit <Joxit972@gmail.com>
Date: Fri, 13 May 2016 00:01:47 +0200
Subject: [PATCH] [add] Add add dialog and tag for menu

---
 add.tag    | 58 ++++++++++++++++++++++++++++++++++++++++++++++++++++++
 index.html |  2 ++
 menu.tag   |  2 +-
 script.js  | 15 ++++++++++++--
 4 files changed, 74 insertions(+), 3 deletions(-)
 create mode 100644 add.tag

diff --git a/add.tag b/add.tag
new file mode 100644
index 0000000..3fdc896
--- /dev/null
+++ b/add.tag
@@ -0,0 +1,58 @@
+<!--
+ Copyright (C) 2016  Jones Magloire @Joxit
+ 
+ This program is free software: you can redistribute it and/or modify
+ it under the terms of the GNU Affero General Public License as published by
+ the Free Software Foundation, either version 3 of the License, or
+ (at your option) any later version.
+ 
+ This program is distributed in the hope that it will be useful,
+ but WITHOUT ANY WARRANTY; without even the implied warranty of
+ MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ GNU Affero General Public License for more details.
+ 
+ You should have received a copy of the GNU Affero General Public License
+ along with this program.  If not, see <http://www.gnu.org/licenses/>.
+-->
+<add>
+<dialog id="add-server-dialog" class="mdl-dialog">
+ <h4 class="mdl-dialog__title">Add your Server ?</h4>
+ <div class="mdl-dialog__content">
+  <div class="mdl-textfield mdl-js-textfield">
+    <input class="mdl-textfield__input" type="text" id="add-server-input">
+    <label class="mdl-textfield__label" for="add-server-input">Server url</label>
+  </div>
+ </div>
+ <div class="mdl-dialog__actions">
+ <button type="button" class="mdl-button change" onClick="registryUI.addTag.add();">Add</button>
+ <button type="button" class="mdl-button close" onClick="registryUI.addTag.close();">Cancel</button>
+</div>
+</dialog> <script type="text/javascript">
+registryUI.addTag = registryUI.addTag || {};
+registryUI.addTag.update = this.update;
+this.on('updated', function () {
+  componentHandler.upgradeElements(this['add-server-dialog']);
+  registryUI.addTag.dialog = registryUI.addTag.dialog
+      || document.querySelector('#add-server-dialog');
+  registryUI.addTag.addServer = registryUI.addTag.tileServerList
+      || registryUI.addTag.dialog.querySelector('#add-server-input');
+  if (!registryUI.addTag.dialog.showModal) {
+    dialogPolyfill.registerDialog(registryUI.addTag.dialog);
+  }
+});
+registryUI.addTag.show = function() {
+  registryUI.addTag.dialog.showModal();
+};
+registryUI.addTag.add = function() {
+  if (registryUI.addTag.addServer.value && registryUI.addTag.addServer.value.length > 0) {
+    registryUI.addServer(registryUI.addTag.addServer.value);
+  }
+  registryUI.addTag.addServer.value = '';
+  registryUI.addTag.dialog.close();
+};
+registryUI.addTag.close = function() {
+  registryUI.addTag.dialog.close();
+};
+registryUI.addTag.update();
+</script>
+</add>
diff --git a/index.html b/index.html
index b2d8fce..842b37d 100644
--- a/index.html
+++ b/index.html
@@ -42,6 +42,7 @@
   </div>
   </main>
   <change></change>
+  <add></add>
   <footer class="mdl-mini-footer">
    <div class="mdl-mini-footer__left-section">
     <div class="mdl-logo">Docker Registry UI</div>
@@ -54,6 +55,7 @@
  </div>
  <script src="catalog.tag" type="riot/tag"></script>
  <script src="taglist.tag" type="riot/tag"></script>
+ <script src="add.tag" type="riot/tag"></script>
  <script src="change.tag" type="riot/tag"></script>
  <script src="menu.tag" type="riot/tag"></script>
  <script src="node_modules/riot/riot+compiler.min.js"></script>
diff --git a/menu.tag b/menu.tag
index ee6ba3f..bde5f07 100644
--- a/menu.tag
+++ b/menu.tag
@@ -20,7 +20,7 @@
   <i class="material-icons">more_vert</i>
  </button>
  <ul class="mdl-menu mdl-menu--bottom-right mdl-js-menu mdl-js-ripple-effect" for="registry-menu">
-  <li class="mdl-menu__item">Add URL</li>
+  <li class="mdl-menu__item" onclick="registryUI.addTag.show();">Add URL</li>
   <li class="mdl-menu__item" onclick="registryUI.changeTag.show();">Change URL</li>
  </ul>
 </div>
diff --git a/script.js b/script.js
index 0969f20..726e3d8 100644
--- a/script.js
+++ b/script.js
@@ -22,10 +22,20 @@ registryUI.getRegistryServer = function (i) {
   try {
     var res = JSON.parse(localStorage.getItem('registryServer'));
     if (res instanceof Array) {
-      return i ? res[i] : res;
+      return (!isNaN(i)) ? res[i] : res;
     }
   } catch (e) {}
-  return i ? '' : [];
+  return (!isNaN(i)) ? '' : [];
+}
+registryUI.addServer = function (url) {
+  var registryServer = registryUI.getRegistryServer();
+  url = url.trim();
+  var index = registryServer.indexOf(url);
+  if (index != -1) {
+    return;
+  }
+  registryServer.push(url);
+  localStorage.setItem('registryServer', JSON.stringify(registryServer));
 }
 registryUI.changeServer = function (url) {
   var registryServer = registryUI.getRegistryServer();
@@ -44,5 +54,6 @@ registryUI.taglist = {};
 
 riot.mount('catalog');
 riot.mount('taglist');
+riot.mount('add');
 riot.mount('change');
 riot.mount('menu');