diff options
-rw-r--r-- | apps/theming/css/settings-admin.css | 15 | ||||
-rw-r--r-- | apps/theming/js/settings-admin.js | 19 | ||||
-rw-r--r-- | apps/theming/lib/Settings/Admin.php | 4 | ||||
-rw-r--r-- | apps/theming/templates/settings-admin.php | 5 | ||||
-rw-r--r-- | apps/theming/tests/Settings/AdminTest.php | 8 |
5 files changed, 46 insertions, 5 deletions
diff --git a/apps/theming/css/settings-admin.css b/apps/theming/css/settings-admin.css index 53214b245c6..4139b2f46a3 100644 --- a/apps/theming/css/settings-admin.css +++ b/apps/theming/css/settings-admin.css @@ -32,3 +32,18 @@ div#theming_settings_msg { margin-left: 10px; } + +#theming-preview { + width: 230px; + height: 140px; + background-size: cover; + background-position: center center; + text-align: center; + margin-left: 93px; +} + +#theming-preview img { + max-width: 20%; + max-height: 20%; + margin-top: 20px; +} diff --git a/apps/theming/js/settings-admin.js b/apps/theming/js/settings-admin.js index 01ff9123842..a18874941e8 100644 --- a/apps/theming/js/settings-admin.js +++ b/apps/theming/js/settings-admin.js @@ -68,7 +68,7 @@ function preview(setting, value) { textColor = "#ffffff"; icon = 'caret'; } - if (luminance>0.8) { + if (luminance > 0.8) { elementColor = '#555555'; } @@ -87,16 +87,27 @@ function preview(setting, value) { 'background-image: url(\'data:image/svg+xml;base64,' + generateRadioButton(elementColor) + '\'); }' ); } + + var timestamp = new Date().getTime(); if (setting === 'logoMime') { - console.log(setting); var logos = document.getElementsByClassName('logo-icon'); - var timestamp = new Date().getTime(); + var previewImageLogo = document.getElementById('theming-preview-logo'); if (value !== '') { logos[0].style.backgroundImage = "url('" + OC.generateUrl('/apps/theming/logo') + "?v" + timestamp + "')"; logos[0].style.backgroundSize = "contain"; + previewImageLogo.src = OC.generateUrl('/apps/theming/logo') + "?v" + timestamp; } else { - logos[0].style.backgroundImage = "url('" + OC.getRootPath() + '/core/img/logo-icon.svg?v' + timestamp +"')"; + logos[0].style.backgroundImage = "url('" + OC.getRootPath() + '/core/img/logo-icon.svg?v' + timestamp + "')"; logos[0].style.backgroundSize = "contain"; + previewImageLogo.src = OC.getRootPath() + '/core/img/logo-icon.svg?v' + timestamp; + } + } + if (setting === 'backgroundMime') { + var previewImage = document.getElementById('theming-preview'); + if (value !== '') { + previewImage.style.backgroundImage = "url('" + OC.generateUrl('/apps/theming/loginbackground') + "?v" + timestamp + "')"; + } else { + previewImage.style.backgroundImage = "url('" + OC.getRootPath() + '/core/img/background.jpg?v' + timestamp + "')"; } } } diff --git a/apps/theming/lib/Settings/Admin.php b/apps/theming/lib/Settings/Admin.php index 1f79449e658..afd74ced217 100644 --- a/apps/theming/lib/Settings/Admin.php +++ b/apps/theming/lib/Settings/Admin.php @@ -71,6 +71,10 @@ class Admin implements ISettings { 'url' => $this->themingDefaults->getBaseUrl(), 'slogan' => $this->themingDefaults->getSlogan(), 'color' => $this->themingDefaults->getMailHeaderColor(), + 'logo' => $this->themingDefaults->getLogo(), + 'logoMime' => $this->config->getAppValue('theming', 'logoMime', ''), + 'background' => $this->themingDefaults->getBackground(), + 'backgroundMime' => $this->config->getAppValue('theming', 'backgroundMime', ''), 'uploadLogoRoute' => $path, ]; diff --git a/apps/theming/templates/settings-admin.php b/apps/theming/templates/settings-admin.php index 50c4a8fb5ec..66288d37656 100644 --- a/apps/theming/templates/settings-admin.php +++ b/apps/theming/templates/settings-admin.php @@ -73,6 +73,9 @@ style('theming', 'settings-admin'); <label for="upload-login-background" class="button icon-upload svg" id="upload-login-background" title="<?php p($l->t("Upload new login background")) ?>"></label> <span data-setting="backgroundMime" data-toggle="tooltip" data-original-title="<?php p($l->t('reset to default')); ?>" class="theme-undo icon icon-history"></span> </form> - </p> + </p> + <div id="theming-preview" style="background-color:<?php p($_['color']);?>; background-image:url(<?php p($_['background']); ?>);"> + <img src="<?php p($_['logo']); ?>" id="theming-preview-logo" /> + </div> <?php } ?> </div> diff --git a/apps/theming/tests/Settings/AdminTest.php b/apps/theming/tests/Settings/AdminTest.php index 18c2064e8ce..73339cf86b7 100644 --- a/apps/theming/tests/Settings/AdminTest.php +++ b/apps/theming/tests/Settings/AdminTest.php @@ -93,6 +93,10 @@ class AdminTest extends TestCase { 'slogan' => 'MySlogan', 'color' => '#fff', 'uploadLogoRoute' => '/my/route', + 'logo' => null, + 'logoMime' => null, + 'background' => null, + 'backgroundMime' => null, ]; $expected = new TemplateResponse('theming', 'settings-admin', $params, ''); @@ -139,6 +143,10 @@ class AdminTest extends TestCase { 'slogan' => 'MySlogan', 'color' => '#fff', 'uploadLogoRoute' => '/my/route', + 'logo' => null, + 'logoMime' => null, + 'background' => null, + 'backgroundMime' => null, ]; $expected = new TemplateResponse('theming', 'settings-admin', $params, ''); |