Update version to 0.3.1 Fix for #24

dist/scripts/script.js

@@ -15,4 +15,4 @@
  * 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/>.
  */
-function Http(){this.oReq=new XMLHttpRequest,this.oReq.hasHeader=Http.hasHeader,this._events={},this._headers={}}Http.prototype.addEventListener=function(e,r){this._events[e]=r;var t=this;switch(e){case"loadend":t.oReq.addEventListener("loadend",function(){if(401==this.status){var e=new XMLHttpRequest;e.open(t._method,t._url);for(key in t._events)e.addEventListener(key,t._events[key]);for(key in t._headers)e.setRequestHeader(key,t._headers[key]);e.withCredentials=!0,e.hasHeader=Http.hasHeader,e.send()}else r.bind(this)()});break;case"load":t.oReq.addEventListener("load",function(){401!==this.status&&r.bind(this)()});break;default:t.oReq.addEventListener(e,function(){r.bind(this)()})}},Http.prototype.setRequestHeader=function(e,r){this.oReq.setRequestHeader(e,r),this._headers[e]=r},Http.prototype.open=function(e,r){this._method=e,this._url=r,this.oReq.open(e,r)},Http.prototype.send=function(){this.oReq.send()},Http.hasHeader=function(e){return this.getAllResponseHeaders().split("\n").some(function(r){return new RegExp("^"+e+":","i").test(r)})};var registryUI={};registryUI.URL_QUERY_PARAM_REGEX=/[&?]url=/,registryUI.URL_PARAM_REGEX=/^url=/,registryUI.url=function(e){if(!registryUI._url){var r=registryUI.getUrlQueryParam();if(r)try{return registryUI._url=registryUI.decodeURI(r),registryUI._url}catch(e){console.log(e)}registryUI._url=registryUI.getRegistryServer(0)}return registryUI._url},registryUI.getRegistryServer=function(e){try{var r=JSON.parse(localStorage.getItem("registryServer"));if(r instanceof Array)return isNaN(e)?r.map(function(e){return e.trim().replace(/\/*$/,"")}):r[e]}catch(e){}return isNaN(e)?[]:""},registryUI.addServer=function(e){var r=registryUI.getRegistryServer();e=e.trim().replace(/\/*$/,"");var t=r.indexOf(e);t==-1&&(r.push(e),registryUI._url||registryUI.updateHistory(e),localStorage.setItem("registryServer",JSON.stringify(r)))},registryUI.changeServer=function(e){var r=registryUI.getRegistryServer();e=e.trim().replace(/\/*$/,"");var t=r.indexOf(e);t!=-1&&(r.splice(t,1),r=[e].concat(r),registryUI.updateHistory(e),localStorage.setItem("registryServer",JSON.stringify(r)))},registryUI.removeServer=function(e){var r=registryUI.getRegistryServer();e=e.trim().replace(/\/*$/,"");var t=r.indexOf(e);t!=-1&&(r.splice(t,1),localStorage.setItem("registryServer",JSON.stringify(r)),e==registryUI.url()&&(registryUI.updateHistory(registryUI.getRegistryServer(0)),rg.router.go("home")))},registryUI.updateHistory=function(e){history.pushState(null,"",(e?"?url="+registryUI.encodeURI(e):"?")+window.location.hash),registryUI._url=e},registryUI.getUrlQueryParam=function(){var e=window.location.search;if(registryUI.URL_QUERY_PARAM_REGEX.test(e)){var r=e.split(/^\?|&/).find(function(e){return e&&registryUI.URL_PARAM_REGEX.test(e)});return r?r.replace(registryUI.URL_PARAM_REGEX,""):r}},registryUI.encodeURI=function(e){return e.indexOf("&")<0?window.encodeURIComponent(e):btoa(e)},registryUI.decodeURI=function(e){return e.startsWith("http")?window.decodeURIComponent(e):atob(e)},registryUI.isImageRemoveActivated=!0,registryUI.catalog={},registryUI.taglist={},riot.mount("*");
+function Http(){this.oReq=new XMLHttpRequest,this.oReq.hasHeader=Http.hasHeader,this._events={},this._headers={}}Http.prototype.addEventListener=function(e,t){this._events[e]=t;var r=this;switch(e){case"loadend":r.oReq.addEventListener("loadend",function(){if(401==this.status){var e=new XMLHttpRequest;e.open(r._method,r._url);for(key in r._events)e.addEventListener(key,r._events[key]);for(key in r._headers)e.setRequestHeader(key,r._headers[key]);e.withCredentials=!0,e.hasHeader=Http.hasHeader,e.send()}else t.bind(this)()});break;case"load":r.oReq.addEventListener("load",function(){401!==this.status&&t.bind(this)()});break;default:r.oReq.addEventListener(e,function(){t.bind(this)()})}},Http.prototype.setRequestHeader=function(e,t){this.oReq.setRequestHeader(e,t),this._headers[e]=t},Http.prototype.open=function(e,t){this._method=e,this._url=t,this.oReq.open(e,t)},Http.prototype.send=function(){this.oReq.send()},Http.hasHeader=function(e){return this.getAllResponseHeaders().split("\n").some(function(t){return new RegExp("^"+e+":","i").test(t)})};var registryUI={};registryUI.URL_QUERY_PARAM_REGEX=/[&?]url=/,registryUI.URL_PARAM_REGEX=/^url=/,registryUI.url=function(e){if(!registryUI._url){var t=registryUI.getUrlQueryParam();if(t)try{return registryUI._url=registryUI.decodeURI(t),registryUI._url}catch(e){console.log(e)}registryUI._url=registryUI.getRegistryServer(0)}return registryUI._url},registryUI.getRegistryServer=function(e){try{var t=JSON.parse(localStorage.getItem("registryServer"));if(t instanceof Array)return isNaN(e)?t.map(function(e){return e.trim().replace(/\/*$/,"")}):t[e]}catch(e){}return isNaN(e)?[]:""},registryUI.addServer=function(e){var t=registryUI.getRegistryServer();e=e.trim().replace(/\/*$/,"");var r=t.indexOf(e);r==-1&&(t.push(e),registryUI._url||registryUI.updateHistory(e),localStorage.setItem("registryServer",JSON.stringify(t)))},registryUI.changeServer=function(e){var t=registryUI.getRegistryServer();e=e.trim().replace(/\/*$/,"");var r=t.indexOf(e);r!=-1&&(t.splice(r,1),t=[e].concat(t),registryUI.updateHistory(e),localStorage.setItem("registryServer",JSON.stringify(t)))},registryUI.removeServer=function(e){var t=registryUI.getRegistryServer();e=e.trim().replace(/\/*$/,"");var r=t.indexOf(e);r!=-1&&(t.splice(r,1),localStorage.setItem("registryServer",JSON.stringify(t)),e==registryUI.url()&&(registryUI.updateHistory(registryUI.getRegistryServer(0)),route("")))},registryUI.updateHistory=function(e){history.pushState(null,"",(e?"?url="+registryUI.encodeURI(e):"?")+window.location.hash),registryUI._url=e},registryUI.getUrlQueryParam=function(){var e=window.location.search;if(registryUI.URL_QUERY_PARAM_REGEX.test(e)){var t=e.split(/^\?|&/).find(function(e){return e&&registryUI.URL_PARAM_REGEX.test(e)});return t?t.replace(registryUI.URL_PARAM_REGEX,""):t}},registryUI.encodeURI=function(e){return e.indexOf("&")<0?window.encodeURIComponent(e):btoa(e)},registryUI.decodeURI=function(e){return e.startsWith("http")?window.decodeURIComponent(e):atob(e)},registryUI.isImageRemoveActivated=!0,registryUI.catalog={},registryUI.taglist={},riot.mount("*");

gulpfile.js

@@ -89,7 +89,7 @@ gulp.task('scripts', ['html'], function() {
 });
 
 gulp.task('vendor', ['html'], function() {
-  return gulp.src(['node_modules/riot/riot.min.js', 'node_modules/riotgear-router/dist/rg-router.min.js', 'node_modules/riot-mui/build/js/riot-mui-min.js'])
+  return gulp.src(['node_modules/riot/riot.min.js', 'node_modules/riot-route/dist/route.min.js', 'node_modules/riot-mui/build/js/riot-mui-min.js'])
     .pipe(concat('vendor.js'))
     .pipe(gulp.dest('dist/scripts'));
 });

package.json

@@ -1,6 +1,6 @@
 {
   "name": "docker-registry-ui",
-  "version": "0.3.0",
+  "version": "0.3.1",
   "scripts": {
     "build": "./node_modules/gulp/bin/gulp.js build"
   },
@@ -23,12 +23,12 @@
     "gulp-license": "^1.1.0",
     "gulp-riot": "^1.1.1",
     "gulp-uglify": "^2.1.2",
-    "gulp-useref": "^3.0.0",
+    "gulp-useref": "^3.1.3",
     "pump": "^1.0.2",
-    "riot": "^3.7.0",
+    "riot": "^3.7.4",
     "riot-mui": "^0.1.1",
-    "riotgear-router": "^1.3.1",
-    "uglify-js": "^3.0.28",
+    "riot-route": "^3.1.2",
+    "uglify-js": "^3.1.8",
     "uglify-js-harmony": "^2.7.7"
   }
 }

src/index.html

@@ -34,7 +34,7 @@
   <app></app>
   <!-- build:js scripts/vendor.js -->
   <script src="../node_modules/riot/riot+compiler.min.js"></script>
-  <script src="../node_modules/riotgear-router/dist/rg-router.min.js"></script>
+  <script src="../node_modules/riot-route/dist/route.js"></script>
   <script src="../node_modules/riot-mui/build/js/riot-mui.js"></script>
   <!-- endbuild -->
   <!-- build:js scripts/tags.js -->

src/scripts/script.js

@@ -80,7 +80,7 @@ registryUI.removeServer = function(url) {
   localStorage.setItem('registryServer', JSON.stringify(registryServer));
   if (url == registryUI.url()) {
     registryUI.updateHistory(registryUI.getRegistryServer(0));
-    rg.router.go('home');
+    route('');
   }
 }
 

src/tags/add.tag

@@ -48,7 +48,7 @@
       if (registryUI.addTag.dialog.getAddServer().length > 0) {
         registryUI.addServer(registryUI.addTag.dialog.getAddServer());
       }
-      rg.router.go('home');
+      registryUI.home();
       registryUI.addTag.close();
     };
     registryUI.addTag.close = function () {

src/tags/app.tag

@@ -22,8 +22,8 @@
     </material-navbar>
   </header>
   <main>
-    <catalog if="{!rg.router.current || rg.router.current.name == 'home'}"></catalog>
-    <taglist if="{rg.router.current && rg.router.current.name == 'taglist'}"></taglist>
+    <catalog if="{route.routeName == 'home'}"></catalog>
+    <taglist if="{route.routeName == 'taglist'}"></taglist>
     <change></change>
     <add></add>
     <remove></remove>
@@ -45,32 +45,47 @@
   </footer>
   <script>
 
-    this.mixin('rg.router');
-    this.router.add({name: 'home', url: ''});
-    this.router.add({name: 'taglist', url: '/taglist/:repository/:image'});
-    this.router.on('go', state => {
-      switch (state.name) {
-        case 'taglist':
-          if (registryUI.taglist.display) {
-            registryUI.taglist.loadend = false;
-            registryUI.taglist.display();
-          }
-          break;
-        case 'home':
-          if (registryUI.catalog.display) {
-            registryUI.catalog.loadend = false;
-            registryUI.catalog.display();
-          }
-          break;
-      }
-    });
     registryUI.appTag = this;
+    route.base('#!')
+    route('', function() {
+      route.routeName = 'home';
+      if (registryUI.catalog.display) {
+        registryUI.catalog.loadend = false;
+        registryUI.catalog.display();
+      }
+      registryUI.appTag.update();
+    });
+    route('/taglist/*', function(image) {
+      route.routeName = 'taglist';
+      registryUI.taglist.name = image
+      if (registryUI.taglist.display) {
+        registryUI.taglist.loadend = false;
+        registryUI.taglist.display();
+      }
+      registryUI.appTag.update();
+    });
+    registryUI.home = function() {
+      if(route.routeName == 'home') {
+        registryUI.catalog.display();
+      } else {
+        route('');
+      }
+    };
     registryUI.snackbar = function (message, isError) {
       registryUI.appTag.tags['material-snackbar'].addToast({'message': message, 'isError': isError});
     };
     registryUI.errorSnackbar = function (message) {
       return registryUI.snackbar(message, true);
     }
-    this.router.start();
+    route.parser(null, function(path, filter) {
+      const f = filter
+        .replace(/\?/g, '\\?')
+        .replace(/\*/g, '([^?#]+?)')
+        .replace(/\.\./, '.*')
+      const re = new RegExp('^' + f + '$')
+      const args = path.match(re)
+      if (args) return args.slice(1)
+    });
+    route.start(true);
   </script>
 </app>

src/tags/catalog.tag

@@ -35,8 +35,8 @@
 
   <script>
     registryUI.catalog.instance = this;
-    this.mixin('rg.router');
     registryUI.catalog.display = function () {
+      registryUI.catalog.repositories = [];
       var oReq = new Http();
       oReq.addEventListener('load', function () {
         registryUI.catalog.repositories = [];
@@ -61,10 +61,7 @@
       oReq.send();
     };
     registryUI.catalog.go = function (image) {
-      rg.router.go('taglist', {
-        repository: image.split('/')[0],
-        image: image.split('/')[1]
-      });
+      route('taglist/' + image);
     };
     registryUI.catalog.display();
   </script>

src/tags/change.tag

@@ -51,7 +51,7 @@
       if (registryUI.changeTag.dialog.getServerUrl().length > 0) {
         registryUI.changeServer(registryUI.changeTag.dialog.getServerUrl());
       }
-      rg.router.go('home');
+      registryUI.home();
       registryUI.changeTag.dialog.close();
     };
     registryUI.changeTag.close = function () {

src/tags/taglist.tag

@@ -18,7 +18,7 @@
   <!-- Begin of tag -->
   <material-card ref="taglist-tag" class="taglist">
     <div class="material-card-title-action">
-      <a href="#" onclick="registryUI.taglist.back();">
+      <a href="#!" onclick="registryUI.home();">
         <i class="material-icons">arrow_back</i>
       </a>
       <h2>Tags of { registryUI.url() + '/' + registryUI.taglist.name }</h2>
@@ -48,12 +48,9 @@
   <script>
     registryUI.taglist.instance = this;
     registryUI.taglist.display = function () {
-      if (rg.router.current && rg.router.current.name == 'taglist') {
-        name = rg.router.current.params.repository + (rg.router.current.params.image
-          ? '/' + rg.router.current.params.image
-          : '');
+      registryUI.taglist.tags = [];
+      if (route.routeName == 'taglist') {
         var oReq = new Http();
-        registryUI.taglist.name = name;
         registryUI.taglist.instance.update();
         oReq.addEventListener('load', function () {
           registryUI.taglist.tags = [];
@@ -74,7 +71,7 @@
           registryUI.taglist.loadend = true;
           registryUI.taglist.instance.update();
         });
-        oReq.open('GET', registryUI.url() + '/v2/' + name + '/tags/list');
+        oReq.open('GET', registryUI.url() + '/v2/' + registryUI.taglist.name + '/tags/list');
         oReq.send();
         registryUI.taglist.asc = true;
       }
@@ -92,11 +89,8 @@
       }
       registryUI.taglist.instance.update();
     };
-    registryUI.taglist.back = function () {
-      rg.router.go('home');
-    };
     registryUI.taglist.refresh = function () {
-      rg.router.go(rg.router.current.name, rg.router.current.params);
+      route(registryUI.taglist.name);
     };
   </script>
   <!-- End of tag -->