[gulp] Add static version in gulp

dist/scripts/script-static.js

@@ -0,0 +1,18 @@
+/*!
+ * docker-registry-ui
+ * 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/>.
+ */
+function Http(){this.oReq=new XMLHttpRequest,this._events={}}Http.prototype.addEventListener=function(t,e){this._events[t]=e;var i=this;switch(t){case"loadend":i.oReq.addEventListener("loadend",function(){if(401==this.status){var t=new XMLHttpRequest;for(key in this.http._events)t.addEventListener(key,this.http._events[key]);t.withCredentials=!0,t.open(this.http._method,this.http._url),t.send()}else e.bind(this)()});break;default:i.oReq.addEventListener(t,function(){e.bind(this)()})}},Http.prototype.open=function(t,e){this._method=t,this._url=e,this.oReq.open(t,e)},Http.prototype.send=function(){this.oReq.http=this,this.oReq.send()};var registryUI={};registryUI.url=function(){return"${URL}"},registryUI.catalog={},registryUI.taglist={},riot.mount("catalog"),riot.mount("taglist"),riot.mount("app");

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._events={}}Http.prototype.addEventListener=function(t,e){switch(this._events[t]=e,t){case"loadend":this.oReq.addEventListener("loadend",function(){if(401==this.status){var t=new XMLHttpRequest;for(key in this.http._events)t.addEventListener(key,this.http._events[key]);t.withCredentials=!0,t.open(this.http._method,this.http._url),t.send()}else e.bind(this.oReq)});break;default:this.oReq.addEventListener(t,function(){e.bind(this.oReq)})}},Http.prototype.open=function(t,e){this._method=t,this._url=e,this.oReq.open(t,e)},Http.prototype.send=function(){this.oReq.http=this,this.oReq.send()};var registryUI={};registryUI.url=function(){return registryUI.getRegistryServer(0)},registryUI.getRegistryServer=function(t){try{var e=JSON.parse(localStorage.getItem("registryServer"));if(e instanceof Array)return isNaN(t)?e.map(function(t){return t.trim().replace(/\/*$/,"")}):e[t]}catch(r){}return isNaN(t)?[]:""},registryUI.addServer=function(t){var e=registryUI.getRegistryServer();t=t.trim().replace(/\/*$/,"");var r=e.indexOf(t);r==-1&&(e.push(t),localStorage.setItem("registryServer",JSON.stringify(e)))},registryUI.changeServer=function(t){var e=registryUI.getRegistryServer();t=t.trim().replace(/\/*$/,"");var r=e.indexOf(t);r!=-1&&(e.splice(r,1),e=[t].concat(e),localStorage.setItem("registryServer",JSON.stringify(e)))},registryUI.removeServer=function(t){var e=registryUI.getRegistryServer();t=t.trim().replace(/\/*$/,"");var r=e.indexOf(t);r!=-1&&(e.splice(r,1),localStorage.setItem("registryServer",JSON.stringify(e)))},registryUI.catalog={},registryUI.taglist={},riot.mount("add"),riot.mount("change"),riot.mount("remove"),riot.mount("menu"),riot.mount("app");
+function Http(){this.oReq=new XMLHttpRequest,this._events={}}Http.prototype.addEventListener=function(t,e){this._events[t]=e;var r=this;switch(t){case"loadend":r.oReq.addEventListener("loadend",function(){if(401==this.status){var t=new XMLHttpRequest;for(key in this.http._events)t.addEventListener(key,this.http._events[key]);t.withCredentials=!0,t.open(this.http._method,this.http._url),t.send()}else e.bind(this)()});break;default:r.oReq.addEventListener(t,function(){e.bind(this)()})}},Http.prototype.open=function(t,e){this._method=t,this._url=e,this.oReq.open(t,e)},Http.prototype.send=function(){this.oReq.http=this,this.oReq.send()};var registryUI={};registryUI.url=function(){return registryUI.getRegistryServer(0)},registryUI.getRegistryServer=function(t){try{var e=JSON.parse(localStorage.getItem("registryServer"));if(e instanceof Array)return isNaN(t)?e.map(function(t){return t.trim().replace(/\/*$/,"")}):e[t]}catch(r){}return isNaN(t)?[]:""},registryUI.addServer=function(t){var e=registryUI.getRegistryServer();t=t.trim().replace(/\/*$/,"");var r=e.indexOf(t);r==-1&&(e.push(t),localStorage.setItem("registryServer",JSON.stringify(e)))},registryUI.changeServer=function(t){var e=registryUI.getRegistryServer();t=t.trim().replace(/\/*$/,"");var r=e.indexOf(t);r!=-1&&(e.splice(r,1),e=[t].concat(e),localStorage.setItem("registryServer",JSON.stringify(e)))},registryUI.removeServer=function(t){var e=registryUI.getRegistryServer();t=t.trim().replace(/\/*$/,"");var r=e.indexOf(t);r!=-1&&(e.splice(r,1),localStorage.setItem("registryServer",JSON.stringify(e)))},registryUI.catalog={},registryUI.taglist={},riot.mount("add"),riot.mount("change"),riot.mount("remove"),riot.mount("menu"),riot.mount("app");

dist/scripts/tags-static.js

@@ -0,0 +1,152 @@
+/*!
+ * docker-registry-ui
+ * 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/>.
+ */
+
+riot.tag2('catalog', '<div id="catalog-tag" class="catalog"> <div class="section-centerd mdl-card mdl-shadow--2dp mdl-cell--6-col"> <div class="mdl-card__title"> <h2 class="mdl-card__title-text">Repositories of {registryUI.url()}</h2> </div> <div id="catalog-spinner" hide="{registryUI.catalog.loadend}" class="mdl-spinner mdl-js-spinner is-active section-centerd"></div> <ul class="mdl-list"> <li class="mdl-list__item mdl-menu__item" style="opacity: 1;" each="{item in registryUI.catalog.repositories}" onclick="registryUI.catalog.go(\'{item}\');"> <span class="mdl-list__item-primary-content"> <i class="material-icons mdl-list__item-icon">send</i> {item} </span> </li> </ul> </div> <div id="error-snackbar" aria-live="assertive" aria-atomic="true" aria-relevant="text" class="mdl-js-snackbar mdl-snackbar"> <div class="mdl-snackbar__text"></div> <button class="mdl-snackbar__action" type="button"></button> </div> </div>', '', '', function(opts) {
+    registryUI.catalog.instance = this;
+    this.mixin('rg.router');
+    registryUI.catalog.display = function () {
+      var oReq = new Http();
+      registryUI.catalog.createSnackbar = function (msg) {
+        var snackbar = document.querySelector('#error-snackbar');
+        registryUI.catalog.error = msg;
+        var data = {
+          message: registryUI.catalog.error,
+          timeout: 100000,
+          actionHandler: function () {
+            snackbar.classList.remove('mdl-snackbar--active');
+          },
+          actionText: 'Undo'
+        };
+        snackbar.MaterialSnackbar.showSnackbar(data);
+      };
+      oReq.addEventListener('load', function () {
+        if (this.status == 200) {
+          registryUI.catalog.repositories = JSON.parse(this.responseText).repositories.sort();
+        } else if (this.status == 404) {
+          registryUI.catalog.createSnackbar('Server not found');
+        } else {
+          registryUI.catalog.createSnackbar(this.responseText);
+        }
+      });
+      oReq.addEventListener('error', function () {
+        registryUI.catalog.createSnackbar('An error occured');
+      });
+      oReq.addEventListener('loadend', function () {
+        registryUI.catalog.loadend = true;
+        registryUI.catalog.instance.update();
+      });
+      oReq.open('GET', registryUI.url() + '/v2/_catalog');
+      oReq.send();
+    };
+    this.on('updated', function () {
+      componentHandler.upgradeElements(this['catalog-tag']);
+    });
+    registryUI.catalog.go = function (image) {
+      rg.router.go('taglist', {
+        repository: image.split('/')[0],
+        image: image.split('/')[1]
+      });
+    };
+    registryUI.catalog.display();
+});
+
+
+riot.tag2('app', '<catalog if="{!rg.router.current || rg.router.current.name == \'home\'}"></catalog> <taglist if="{rg.router.current.name == \'taglist\'}"></taglist>', '', '', function(opts) {
+
+    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.display();
+          }
+          break;
+        case 'home':
+          if (registryUI.catalog.display) {
+            registryUI.catalog.display();
+          }
+          break;
+      }
+    })
+    this.router.start();
+});
+
+
+riot.tag2('taglist', '<div id="taglist-tag" class="taglist"> <div class="section-centerd mdl-card mdl-shadow--2dp mdl-cell--6-col"> <div class="mdl-card__title"> <a href="#" onclick="registryUI.taglist.back();"> <i class="material-icons mdl-list__item-icon">arrow_back</i> </a> <h2 class="mdl-card__title-text">Tags of {registryUI.url() + \'/\' + registryUI.taglist.name}</h2> </div> <div id="taglist-spinner" hide="{registryUI.taglist.loadend}" class="mdl-spinner mdl-js-spinner section-centerd"></div> <table class="mdl-data-table mdl-js-data-table full-table" style="border: none;"> <thead> <tr> <th class="mdl-data-table__cell--non-numeric">Repository</th> <th class="mdl-data-table__header--sorted-ascending" onclick="registryUI.taglist.reverse(this);">Tag</th> </tr> </thead> <tbody> <tr each="{item in registryUI.taglist.tags}"> <td class="mdl-data-table__cell--non-numeric">{registryUI.taglist.name}</td> <td>{item}</td> </tr> </tbody> </table> </div> <div id="error-snackbar" aria-live="assertive" aria-atomic="true" aria-relevant="text" class="mdl-js-snackbar mdl-snackbar"> <div class="mdl-snackbar__text"></div> <button class="mdl-snackbar__action" type="button"></button> </div> </div>', '', '', function(opts) {
+    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
+          : '');
+        var oReq = new Http();
+        registryUI.taglist.name = name;
+        registryUI.taglist.createSnackbar = function (msg) {
+          var snackbar = document.querySelector('#error-snackbar');
+          registryUI.taglist.error = msg;
+          var data = {
+            message: registryUI.taglist.error,
+            timeout: 100000,
+            actionHandler: function () {
+              snackbar.classList.remove('mdl-snackbar--active');
+            },
+            actionText: 'Undo'
+          };
+          snackbar.MaterialSnackbar.showSnackbar(data);
+        };
+        oReq.addEventListener('load', function () {
+          if (this.status == 200) {
+            registryUI.taglist.tags = JSON.parse(this.responseText).tags.sort();
+          } else if (this.status == 404) {
+            registryUI.taglist.createSnackbar('Server not found');
+          } else {
+            registryUI.taglist.createSnackbar(this.responseText);
+          }
+        });
+        oReq.addEventListener('error', function () {
+          registryUI.taglist.createSnackbar('An error occured');
+        });
+        oReq.addEventListener('loadend', function () {
+          registryUI.taglist.loadend = true;
+          registryUI.taglist.instance.update();
+        });
+        oReq.open('GET', registryUI.url() + '/v2/' + name + '/tags/list');
+        oReq.send();
+      }
+    };
+    registryUI.taglist.display();
+    registryUI.taglist.instance.update();
+    this.on('updated', function () {
+      componentHandler.upgradeElements(this['taglist-tag']);
+    });
+
+    registryUI.taglist.reverse = function (th) {
+      if (th.className == 'mdl-data-table__header--sorted-ascending') {
+        th.className = 'mdl-data-table__header--sorted-descending';
+      } else {
+        th.className = 'mdl-data-table__header--sorted-ascending';
+      }
+      registryUI.taglist.tags.reverse();
+      registryUI.taglist.instance.update();
+    };
+    registryUI.taglist.back = function () {
+      rg.router.go('home');
+    };
+});

gulpfile.js

@@ -43,8 +43,34 @@ gulp.task('riot-tag', ['html'], function() {
     .pipe(gulp.dest('dist/scripts'));
 });
 
+gulp.task('riot-static-tag', ['html'], function() {
+  return gulp.src(['src/tags/catalog.tag', 'src/tags/app.tag', 'src/tags/taglist.tag'])
+    .pipe(concat('tags-static.js'))
+    .pipe(riot())
+    .pipe(license('agpl3', {
+      tiny: false,
+      project: 'docker-registry-ui',
+      year: '2016',
+      organization: 'Jones Magloire @Joxit'
+    }))
+    .pipe(gulp.dest('dist/scripts'));
+});
+
+gulp.task('scripts-static', ['html'], function() {
+  return gulp.src(['src/scripts/http.js', 'src/scripts/static.js'])
+    .pipe(concat('script-static.js'))
+    .pipe(uglify())
+    .pipe(license('agpl3', {
+      tiny: false,
+      project: 'docker-registry-ui',
+      year: '2016',
+      organization: 'Jones Magloire @Joxit'
+    }))
+    .pipe(gulp.dest('dist/scripts'));
+});
+
 gulp.task('scripts', ['html'], function() {
-  return gulp.src(['src/scripts/http.js','src/scripts/script.js'])
+  return gulp.src(['src/scripts/http.js', 'src/scripts/script.js'])
     .pipe(concat('script.js'))
     .pipe(uglify())
     .pipe(license('agpl3', {
@@ -59,7 +85,9 @@ gulp.task('scripts', ['html'], function() {
 gulp.task('styles', ['html'], function() {
   return gulp.src(['src/*.css'])
     .pipe(concat('style.css'))
-    .pipe(cleanCSS({compatibility: 'ie8'}))
+    .pipe(cleanCSS({
+      compatibility: 'ie8'
+    }))
     .pipe(license('agpl3', {
       tiny: false,
       project: 'docker-registry-ui',
@@ -75,7 +103,7 @@ gulp.task('fonts', function() {
     .pipe(gulp.dest('dist/fonts'));
 });
 
-gulp.task('sources', ['riot-tag', 'scripts', 'styles'], function() {
+gulp.task('sources', ['riot-tag', 'riot-static-tag', 'scripts', 'scripts-static', 'styles'], function() {
   gulp.start();
 });
 

static/add.tag

@@ -1,19 +0,0 @@
-<!--
- 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>
-
-</add>

static/change.tag

@@ -1,19 +0,0 @@
-<!--
- 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>
-
-</change>

static/menu.tag

@@ -1,19 +0,0 @@
-<!--
- 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/>.
--->
-<menu>
-
-</menu>