From 3589a7e3690cfa09b675bcd84c6d819ca4081ec0 Mon Sep 17 00:00:00 2001
From: Joxit <Joxit972@gmail.com>
Date: Thu, 12 May 2016 22:24:35 +0200
Subject: [PATCH] [change] Add change dialog and tag for menu

---
 change.tag | 54 ++++++++++++++++++++++++++++++++++++++++++++++++++++++
 index.html |  2 ++
 menu.tag   |  2 +-
 script.js  |  1 +
 4 files changed, 58 insertions(+), 1 deletion(-)
 create mode 100644 change.tag

diff --git a/change.tag b/change.tag
new file mode 100644
index 0000000..3aa99b0
--- /dev/null
+++ b/change.tag
@@ -0,0 +1,54 @@
+<!--
+ 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/>.
+-->
+<change>
+<dialog id="change-server-dialog" class="mdl-dialog">
+<h4 class="mdl-dialog__title">Change your Server ?</h4>
+<div class="mdl-dialog__content">
+ <div class="mdl-textfield mdl-js-textfield">
+  <select class="mdl-textfield__input mdl-textfield__select" name="server-list" id="server-list">
+   <option each="{ url in registryUI.url() }" value={url}>{url}</option>
+  </select>
+ </div>
+</div>
+<div class="mdl-dialog__actions">
+ <button type="button" class="mdl-button change" onClick="registryUI.changeTag.change();">Change</button>
+ <button type="button" class="mdl-button close" onClick="registryUI.changeTag.close();">Cancel</button>
+</div>
+</dialog> <script type="text/javascript">
+registryUI.changeTag = registryUI.changeTag || {};
+registryUI.changeTag.update = this.update;
+this.on('updated', function () {
+  componentHandler.upgradeElements(this['change-server-dialog']);
+  registryUI.changeTag.dialog = registryUI.changeTag.dialog
+      || document.querySelector('#change-server-dialog');
+  registryUI.changeTag.tileServerList = registryUI.changeTag.tileServerList
+      || registryUI.changeTag.dialog.querySelector('#server-list');
+  if (!registryUI.changeTag.dialog.showModal) {
+    dialogPolyfill.registerDialog(registryUI.changeTag.dialog);
+  }
+});
+registryUI.changeTag.show = function() {
+  registryUI.changeTag.dialog.showModal();
+};
+registryUI.changeTag.change = function() {
+  registryUI.changeTag.dialog.close();
+};
+registryUI.changeTag.close = function() {
+  registryUI.changeTag.dialog.close();
+};
+</script>
+</change>
diff --git a/index.html b/index.html
index 6c5ca7d..b2d8fce 100644
--- a/index.html
+++ b/index.html
@@ -41,6 +41,7 @@
    <taglist></taglist>
   </div>
   </main>
+  <change></change>
   <footer class="mdl-mini-footer">
    <div class="mdl-mini-footer__left-section">
     <div class="mdl-logo">Docker Registry UI</div>
@@ -53,6 +54,7 @@
  </div>
  <script src="catalog.tag" type="riot/tag"></script>
  <script src="taglist.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>
  <script src="node_modules/dialog-polyfill/dialog-polyfill.js"></script>
diff --git a/menu.tag b/menu.tag
index 928caf3..ee6ba3f 100644
--- a/menu.tag
+++ b/menu.tag
@@ -21,7 +21,7 @@
  </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">Change 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 bd08afa..e05f753 100644
--- a/script.js
+++ b/script.js
@@ -22,4 +22,5 @@ var catalog = {};
 registryUI.taglist = {};
 riot.mount('catalog');
 riot.mount('taglist');
+riot.mount('change');
 riot.mount('menu');