diff --git a/Makefile b/Makefile
index 92d5aedf..36917508 100644
--- a/Makefile
+++ b/Makefile
@@ -20,6 +20,7 @@ deb ${DEB}:
rm -rf build
# build here to cache results
cargo build --release
+ make -C www
rsync -a debian Cargo.lock Cargo.toml src www target build
cd build; dpkg-buildpackage -b -us -uc
diff --git a/debian/install b/debian/install
index 2f54f235..ed2f20ae 100644
--- a/debian/install
+++ b/debian/install
@@ -1,3 +1,4 @@
target/release/api-test-server /usr/sbin
www/images/logo-128.png /usr/share/javascript/proxmox-backup-server/images/
www/images/proxmox_logo.png /usr/share/javascript/proxmox-backup-server/images/
+www/proxmox-backup-gui.js /usr/share/javascript/proxmox-backup-server/js/
\ No newline at end of file
diff --git a/src/api/server.rs b/src/api/server.rs
index 485d1e7e..15104074 100644
--- a/src/api/server.rs
+++ b/src/api/server.rs
@@ -239,7 +239,7 @@ fn get_index() -> BoxFut {
-
+
diff --git a/www/Application.js b/www/Application.js
new file mode 100644
index 00000000..8639c515
--- /dev/null
+++ b/www/Application.js
@@ -0,0 +1,47 @@
+/*global Proxmox*/
+Ext.define('PBS.Application', {
+ extend: 'Ext.app.Application',
+
+ name: 'PBS',
+ appProperty: 'app',
+
+ stores: [
+ // 'NavigationStore'
+ ],
+
+ layout: 'fit',
+
+ realignWindows: function() {
+ var modalwindows = Ext.ComponentQuery.query('window[modal]');
+ Ext.Array.forEach(modalwindows, function(item) {
+ item.center();
+ });
+ },
+
+ logout: function() {
+ var me = this;
+ //Proxmox.Utils.authClear();
+ //me.changeView('loginview', true);
+ },
+
+ changeView: function(view, skipCheck) {
+ var me = this;
+ //?
+ },
+
+ launch: function() {
+ var me = this;
+ Ext.on('resize', me.realignWindows);
+
+ var provider = new Ext.state.LocalStorageProvider({ prefix: 'ext-pbs-' });
+ Ext.state.Manager.setProvider(provider);
+
+ // fixme: show login window if not loggedin
+
+ me.currentView = Ext.create({
+ xtype: 'mainview'
+ });
+ }
+});
+
+Ext.application('PBS.Application');
diff --git a/www/Logo.js b/www/Logo.js
new file mode 100644
index 00000000..b0dcfa26
--- /dev/null
+++ b/www/Logo.js
@@ -0,0 +1,14 @@
+Ext.define('PBS.image.Logo', {
+ extend: 'Ext.Img',
+ xtype: 'proxmoxlogo',
+
+ height: 30,
+ width: 172,
+ src: '/images/proxmox_logo.png',
+ alt: 'Proxmox',
+ autoEl: {
+ tag: 'a',
+ href: 'https://www.proxmox.com',
+ target: '_blank'
+ }
+});
diff --git a/www/MainView.js b/www/MainView.js
new file mode 100644
index 00000000..97afe487
--- /dev/null
+++ b/www/MainView.js
@@ -0,0 +1,100 @@
+Ext.define('PBS.MainView', {
+ extend: 'Ext.container.Container',
+ xtype: 'mainview',
+
+ title: 'Proxmox Backup Server',
+
+ controller: {
+ xclass: 'Ext.app.ViewController',
+ routes: {
+ ':path:subpath': {
+ action: 'changePath',
+ before: 'beforeChangePath',
+ conditions : {
+ ':path' : '(?:([%a-zA-Z0-9\\-\\_\\s,]+))',
+ ':subpath' : '(?:(?::)([%a-zA-Z0-9\\-\\_\\s,]+))?'
+ }
+ }
+ },
+
+ beforeChangePath: function(path, subpath, action) {
+ var me = this;
+
+ action.resume();
+ },
+
+ changePath: function(path,subpath) {
+ var me = this;
+ var contentpanel = me.lookupReference('contentpanel');
+ var lastpanel = contentpanel.getLayout().getActiveItem();
+
+ },
+
+ init: function(view) {
+ var me = this;
+ console.log("init");
+
+ }
+ },
+
+ plugins: 'viewport',
+
+ layout: { type: 'border' },
+
+ items: [
+ {
+ region: 'north',
+ xtype: 'container',
+ layout: {
+ type: 'hbox',
+ align: 'middle'
+ },
+ margin: '2 5 2 5',
+ height: 38,
+ items: [
+ {
+ xtype: 'proxmoxlogo'
+ },
+ {
+ //xtype: 'versioninfo'
+ html: "version"
+ },
+ {
+ flex: 1
+ },
+ {
+ baseCls: 'x-plain',
+ reference: 'usernameinfo',
+ padding: '0 5',
+ tpl: Ext.String.format(gettext("You are logged in as {0}"), "'{username}'")
+ },
+ {
+ reference: 'logoutButton',
+ xtype: 'button',
+ iconCls: 'fa fa-sign-out',
+ text: gettext('Logout')
+ }
+ ]
+ },
+ {
+ xtype: 'panel',
+ scrollable: 'y',
+ border: false,
+ region: 'west',
+ layout: {
+ type: 'vbox',
+ align: 'stretch'
+ },
+ items: [{ html: "test" }]
+ },
+ {
+ xtype: 'panel',
+ layout: { type: 'card' },
+ region: 'center',
+ border: false,
+ reference: 'contentpanel'
+ }
+ ]
+});
+
+
diff --git a/www/Makefile b/www/Makefile
new file mode 100644
index 00000000..270b1ccb
--- /dev/null
+++ b/www/Makefile
@@ -0,0 +1,16 @@
+JSSRC= \
+ Logo.js \
+ Application.js \
+ MainView.js
+
+all: proxmox-backup-gui.js
+
+proxmox-backup-gui.js: ${JSSRC}
+ cat ${JSSRC} >$@.tmp
+ mv $@.tmp $@
+
+.PHONY: clean
+clean:
+ find . -name '*~' -exec rm {} ';'
+ rm -r proxmox-backup-gui.js
+