diff --git a/Duplicati/Server/webroot/images/ajax-loader-big.gif b/Duplicati/Server/webroot/images/ajax-loader-big.gif new file mode 100644 index 000000000..0ca7ada96 Binary files /dev/null and b/Duplicati/Server/webroot/images/ajax-loader-big.gif differ diff --git a/Duplicati/Server/webroot/images/ajax-loader-small.gif b/Duplicati/Server/webroot/images/ajax-loader-small.gif new file mode 100644 index 000000000..3288d1035 Binary files /dev/null and b/Duplicati/Server/webroot/images/ajax-loader-small.gif differ diff --git a/Duplicati/Server/webroot/images/clock.png b/Duplicati/Server/webroot/images/clock.png new file mode 100644 index 000000000..31fe66f30 Binary files /dev/null and b/Duplicati/Server/webroot/images/clock.png differ diff --git a/Duplicati/Server/webroot/images/donate.png b/Duplicati/Server/webroot/images/donate.png new file mode 100644 index 000000000..c8fd3ad3b Binary files /dev/null and b/Duplicati/Server/webroot/images/donate.png differ diff --git a/Duplicati/Server/webroot/images/hourglass.png b/Duplicati/Server/webroot/images/hourglass.png new file mode 100644 index 000000000..f47a214de Binary files /dev/null and b/Duplicati/Server/webroot/images/hourglass.png differ diff --git a/Duplicati/Server/webroot/images/pause.png b/Duplicati/Server/webroot/images/pause.png new file mode 100644 index 000000000..07586f6e7 Binary files /dev/null and b/Duplicati/Server/webroot/images/pause.png differ diff --git a/Duplicati/Server/webroot/images/plus.png b/Duplicati/Server/webroot/images/plus.png new file mode 100644 index 000000000..d679851db Binary files /dev/null and b/Duplicati/Server/webroot/images/plus.png differ diff --git a/Duplicati/Server/webroot/images/settings.png b/Duplicati/Server/webroot/images/settings.png new file mode 100644 index 000000000..c49e34148 Binary files /dev/null and b/Duplicati/Server/webroot/images/settings.png differ diff --git a/Duplicati/Server/webroot/images/small-close.png b/Duplicati/Server/webroot/images/small-close.png new file mode 100644 index 000000000..aa60299eb Binary files /dev/null and b/Duplicati/Server/webroot/images/small-close.png differ diff --git a/Duplicati/Server/webroot/index.html b/Duplicati/Server/webroot/index.html new file mode 100644 index 000000000..553d30dce --- /dev/null +++ b/Duplicati/Server/webroot/index.html @@ -0,0 +1,168 @@ + + + + + +Backup + + + + + + + + + + + + + + + + +
+
DUPLICATI
+ + + + +
+ +
+ Version 2.0.1 is available +
+ +
+
+
+
+ Loading backups ... +
+
+
+ +
+
+
+
+
My Music to Backify.com
+
    +
  • Source
  • +
  • 12.56 GB
  • +
+
    +
  • Backup
  • +
  • 14.31 GB
  • +
+ +
+
+
+
512 files remanining
+
+
+
+ +
+
+
My Photos to SkyDrive
+
    +
  • Source
  • +
  • 12.56 GB
  • +
+
    +
  • Backup
  • +
  • 14.31 GB
  • +
+ +
+
+
+
+
#1 in queue
+
+
+
+ +
+
+
My Videos to Amazon S3
+
    +
  • Source
  • +
  • 12.56 GB
  • +
+
    +
  • Backup
  • +
  • 14.31 GB
  • +
+ +
+
+
+
+
2013-11-02 5.00pm
+
+
+
+ +
+
+
Add new backup
+
+
+
+ + + diff --git a/Duplicati/Server/webroot/scripts/app.js b/Duplicati/Server/webroot/scripts/app.js new file mode 100644 index 000000000..d95b33370 --- /dev/null +++ b/Duplicati/Server/webroot/scripts/app.js @@ -0,0 +1,78 @@ +/* + * Primary app code + */ + +// Global app settings + +APP_DATA = null; +APP_EVENTS= {}; + +$(document).ready(function() { + + // Flag as loaded in case we have plugins + APP_DATA = {}; + + var PRIVATE_DATA = {}; + + $('#main-appname').text(APP_CONFIG.branded_name); + + if ((APP_CONFIG.branded_subtitle || '').length > 0) { + var subdiv = $('
'); + subdiv.text(APP_CONFIG.branded_subtitle); + $('#main-appname').append(subdiv); + $('#main-appname').addClass('has-subtitle'); + } + + $('#main-list-container').empty(); + $('#main-list-loader').show(); + + PRIVATE_DATA.refresh_server_settings = function(callback) { + $.ajax({ + url: APP_CONFIG.server_url, + data: { action: 'system-info' } + }) + .done(function(data) { + PRIVATE_DATA.server_config = data; + $('#main-list-loader').hide(); + if (callback != null) + callback(PRIVATE_DATA.server_config); + }) + .fail(function(data, status) { + }); + }; + + PRIVATE_DATA.refresh_server_settings(); + + APP_DATA.getServerConfig = function(callback) { + if (PRIVATE_DATA.server_config == null) { + PRIVATE_DATA.refresh_server_settings(callback); + } else { + callback(PRIVATE_DATA.server_config); + } + }; + + + $('#main-settings').click(function() { + var pos = $('#main-settings').position(); + var barheight = $('#main-topbar').outerHeight(); + var menuwidth = $('#main-control-menu').outerWidth(); + var buttonwidth = $('#main-settings').outerWidth(); + + $('#main-control-menu').css({ + position: 'absolute', + top: barheight + 'px', + right: ($(document).outerWidth() - (pos.left + buttonwidth)) + 'px' + }); + $('#main-control-menu').toggle(); + }); + + $('#main-donate').click(function() { + + }); + + $('#main-control').click(function() { + }); + + + +}); \ No newline at end of file diff --git a/Duplicati/Server/webroot/scripts/config.js b/Duplicati/Server/webroot/scripts/config.js new file mode 100644 index 000000000..323b313be --- /dev/null +++ b/Duplicati/Server/webroot/scripts/config.js @@ -0,0 +1,9 @@ +/* + * The basic client config + */ + +APP_CONFIG = { + server_url: '/control.cgi', + branded_name: 'Duplicati', + branded_subtitle: '' +}; \ No newline at end of file diff --git a/Duplicati/Server/webroot/stylesheets/common.css b/Duplicati/Server/webroot/stylesheets/common.css index 47aa86d62..39d58f8c3 100644 --- a/Duplicati/Server/webroot/stylesheets/common.css +++ b/Duplicati/Server/webroot/stylesheets/common.css @@ -1 +1,77 @@ -/* Placeholder for customization */ \ No newline at end of file +/* + * Common style config + */ + +body { + border: 0px none; + margin: 0px; + padding: 0px; + font-family: Arial; + min-width: 320px; +} + +.action-link, .action-links li { + text-decoration: underline; + color: #56acbb; + font-size: 0.9em; + cursor: pointer; +} + +.hint-text { + color: #9b9b9b; + font-size: 0.9em; +} + +.hint-text-caption { + font-weight: bold; + color: #9b9b9b; + font-size: 0.9em; +} + +.caption-text { + color: #68845f; + font-weight: bold; + font-size: 1.1em; +} + +.progressbar-background { + background-color: #b1bead; +} + +.menu { + background-color: #ffffff; + position: absolute; + display: none; + list-style: none; + border: 1px solid #9b9b9b; + margin: 0px; + padding: 0px; + border-radius: 3px; + z-index: 10000; + opacity: 0.9; +} + +.menu li { + padding: 5px 10px 5px 10px; + background-color: #ffffff; + cursor: pointer; +} + +.menu li.menu-sep { + border-top: 1px solid; + padding: 0px 10px 0px 10px; +} + +.large-loader-icon { + width: 66px; + height: 66px; + background-repeat: no-repeat; + background-image: url('../images/ajax-loader-big.gif'); +} + +.small-loader-icon { + width: 32px; + height: 32px; + background-repeat: no-repeat; + background-image: url('../images/ajax-loader-small.gif'); +} \ No newline at end of file diff --git a/Duplicati/Server/webroot/stylesheets/customized.css b/Duplicati/Server/webroot/stylesheets/customized.css index 85483e7e2..7ad59af06 100644 --- a/Duplicati/Server/webroot/stylesheets/customized.css +++ b/Duplicati/Server/webroot/stylesheets/customized.css @@ -1,15 +1,8 @@ -/* Placeholder for customization */ - - -.x-grid-tree-node-expanded .x-tree-icon-drive, -.x-tree-icon-drive { - width:16px; - background-image:url('/icons/drive.gif') -} - - -.x-grid-tree-node-expanded .x-tree-icon-locked, -.x-tree-icon-locked { - width:16px; - background-image:url('/icons/folder_locked_red.gif') -} \ No newline at end of file +/* Placeholder for customization */ + +/* Uncomment if using a subtitle on the app name */ +/* +#main-appname { + padding-top: 5px; +} +*/ \ No newline at end of file diff --git a/Duplicati/Server/webroot/stylesheets/main.css b/Duplicati/Server/webroot/stylesheets/main.css new file mode 100644 index 000000000..0c3f9d305 --- /dev/null +++ b/Duplicati/Server/webroot/stylesheets/main.css @@ -0,0 +1,285 @@ +/* + * CSS config for the main window + */ + +#main-topbar { + position: absolute; + left: 0px; + right: 0px; + height: 46px; + background-color: #3a5e30; + color: #9dab98; + vertical-align: middle; +} + +#main-bottombar { + position: absolute; + left: 0px; + right: 0px; + bottom: 0px; + background-color: #4c7641; + color: #d4dcd2; + vertical-align: middle; + height: 46px; +} + +#main-bottombar a { + vertical-align: middle; + color: #d4dcd2; + display: inline-block; + padding: 10px 10px 10px 20px; +} + + +#main-list { + position: absolute; + top: 46px; + bottom: 46px; + left: 0px; + right: 0px; + padding-left: 20px; + overflow: auto; + margin: 0 auto; +} + +#main-list-container { + max-width: 620px; + margin-left: auto; + margin-right: auto; + overflow: auto; +} + +#main-list-loader { + position: absolute; + top: 0px; + bottom: 0px; + left: 0px; + right: 0px; + padding-left: 20px; + overflow: auto; + margin: 0 auto; + background-color: rgba(0, 0, 0, 0.5); +} + +#main-list-loader-content { + position: absolute; + top: 0; + right: 0; + bottom: 0; + left: 0; + margin: auto; + width: 250px; + height: 100px; +} + +#main-list-loader-icon { + margin: auto; +} + +#main-list-loader-text { + padding-top: 5px; + text-align: center; +} + +#main-appname { + padding: 10px 10px 10px 20px; + font-weight: bold; + font-size: 1.4em; + display: inline-block; + text-transform: uppercase; +} + +#main-appname.has-subtitle { + padding-top: 5px; +} + +#main-appname-subtitle { + font-size: 0.5em; + font-weight: normal; + font-style: italic; +} + +#main-newbackup { + background-color: #3a5e30; + color: white; + padding: 6px 12px 6px 12px; + cursor: pointer; + border-radius: 3px; + display: inline-block; + clear: both; + float: left; + margin-top: 40px; + margin-bottom: 40px; +} + +#main-control-menu { + margin-right: 10px; +} + +.main-shortcuts { + float: right; + padding-top: 8px; + padding-right: 8px; + margin: 0px; + padding-left: 0px; +} + +.main-shortcuts li { + padding-left: 8px; + padding-right: 4px; + cursor: pointer; + background-color: #3a5e30; +} + +.main-backup-entry { + padding: 40px 40px 10px 0px; + clear: both; + margin-left: auto; + margin-right: auto; +} + +.main-backup-entry .action-links { + display: block; + margin-top: 10px; + padding-left: 0px; +} + +.main-backup-entry .hint-text, .main-shortcuts { + display: table-row; +} + +.main-backup-entry .action-links li, .main-backup-entry .hint-text li, .main-shortcuts li { + display: table-cell; +} + +.main-backup-entry .action-links li { + display: table-cell; + border-right: 1px solid #56acbb; + padding-left: 5px; + padding-right: 5px; +} + +.main-backup-entry .action-links .last { + border-right: 0px none; + padding-right: 0px; +} + +.main-backup-entry .action-links .first { + padding-left: 0px; +} + +.main-backup-entry .hint-text-caption { + padding-right: 5px; +} + +.main-backup-entry .caption-text { + margin-bottom: 10px; + overflow: hidden; + text-overflow: ellipsis; + width: 300px; + white-space: nowrap; +} + +.main-icon-plus { + width: 23px; + height: 23px; + display: block; + background-repeat: no-repeat; + background-image: url('../images/plus.png'); +} + +.main-icon-clock { + width: 23px; + height: 23px; + background-repeat: no-repeat; + background-image: url('../images/clock.png'); +} + +.main-icon-donate { + width: 28px; + height: 28px; + background-repeat: no-repeat; + background-image: url('../images/donate.png'); +} + +.main-icon-hourglass { + width: 18px; + height: 24px; + background-repeat: no-repeat; + background-image: url('../images/hourglass.png'); +} + +.main-icon-pause { + width: 28px; + height: 28px; + background-repeat: no-repeat; + background-image: url('../images/pause.png'); +} + +.main-icon-settings { + width: 28px; + height: 28px; + background-repeat: no-repeat; + background-image: url('../images/settings.png'); +} + +.main-icon-small-close { + width: 19px; + height: 19px; + background-repeat: no-repeat; + background-image: url('../images/small-close'); +} + +#main-newbackup .main-icon-plus { + display: inline-block; +} + +.main-button-add-text { + display: inline-block; + vertical-align: top; + padding-left: 10px; + padding-top: 4px; +} + +.progress-area { + background-color: #c8d1c5; + color: #8f968e; + border-radius: 3px; + display: block; + padding: 6px 12px 6px 12px; + display: block; +} + +.in-progress { + color: #ecf0eb; + min-height: 23px; +} + +.main-progress-cell { + width: 100%; +} + +.progress-area .main-icon-hourglass, .progress-area .main-icon-clock { + display: inline-block; + margin-right: 8px; +} + +.main-progress-text { + display: inline-block; + vertical-align: top; + padding-top: 4px; + white-space: nowrap; +} + +.backup-details { + float: left; + width: 300px; +} + +.backup-progress { + float: left; + padding-top: 20px; + padding-bottom: 20px; + min-width: 250px; + white-space: nowrap; +}