settings-admin.js 7.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250
  1. /**
  2. * @author Björn Schießle <bjoern@schiessle.org>
  3. *
  4. * @copyright Copyright (c) 2016, Bjoern Schiessle
  5. * @license AGPL-3.0
  6. *
  7. * This code is free software: you can redistribute it and/or modify
  8. * it under the terms of the GNU Affero General Public License as
  9. * published by the Free Software Foundation, either version 3 of the
  10. * License, or (at your opinion) any later version.
  11. *
  12. * This program is distributed in the hope that it will be useful,
  13. * but WITHOUT ANY WARRANTY; without even the implied warranty of
  14. * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
  15. * GNU Affero General Public License for more details.
  16. *
  17. * You should have received a copy of the GNU Affero General Public License
  18. * along with this program. If not, see <http://www.gnu.org/licenses/>
  19. *
  20. */
  21. function startLoading() {
  22. OC.msg.startSaving('#theming_settings_msg');
  23. $('#theming_settings_loading').show();
  24. }
  25. function setThemingValue(setting, value) {
  26. startLoading();
  27. $.post(
  28. OC.generateUrl('/apps/theming/ajax/updateStylesheet'), {'setting' : setting, 'value' : value}
  29. ).done(function(response) {
  30. hideUndoButton(setting, value);
  31. preview(setting, value, response.data.serverCssUrl);
  32. }).fail(function(response) {
  33. OC.msg.finishedSaving('#theming_settings_msg', response.responseJSON);
  34. $('#theming_settings_loading').hide();
  35. });
  36. }
  37. function preview(setting, value, serverCssUrl) {
  38. OC.msg.startAction('#theming_settings_msg', t('theming', 'Loading preview…'));
  39. var stylesheetsLoaded = 1;
  40. var reloadStylesheets = function(cssFile) {
  41. var queryString = '?reload=' + new Date().getTime();
  42. var url = cssFile + queryString;
  43. var old = $('link[href*="' + cssFile + '"]');
  44. var stylesheet = $("<link/>", {
  45. rel: "stylesheet",
  46. type: "text/css",
  47. href: url
  48. });
  49. stylesheet.load(function () {
  50. $(old).remove();
  51. stylesheetsLoaded--;
  52. if(stylesheetsLoaded === 0) {
  53. $('#theming_settings_loading').hide();
  54. var response = { status: 'success', data: {message: t('theming', 'Saved')}};
  55. OC.msg.finishedSaving('#theming_settings_msg', response);
  56. }
  57. });
  58. stylesheet.appendTo("head");
  59. };
  60. if (serverCssUrl !== undefined) {
  61. stylesheetsLoaded++;
  62. reloadStylesheets(serverCssUrl);
  63. }
  64. reloadStylesheets(OC.generateUrl('/apps/theming/styles'));
  65. if (setting === 'name') {
  66. window.document.title = t('core', 'Admin') + " - " + value;
  67. }
  68. hideUndoButton(setting, value);
  69. }
  70. function hideUndoButton(setting, value) {
  71. var themingDefaults = {
  72. name: 'Nextcloud',
  73. slogan: t('lib', 'a safe home for all your data'),
  74. url: 'https://nextcloud.com',
  75. color: '#0082c9',
  76. logoMime: '',
  77. backgroundMime: '',
  78. imprintUrl: '',
  79. privacyUrl: ''
  80. };
  81. if (value === themingDefaults[setting] || value === '') {
  82. $('.theme-undo[data-setting=' + setting + ']').hide();
  83. } else {
  84. $('.theme-undo[data-setting=' + setting + ']').show();
  85. }
  86. if(setting === 'backgroundMime' && value !== 'backgroundColor') {
  87. $('.theme-remove-bg').show();
  88. }
  89. if(setting === 'backgroundMime' && value === 'backgroundColor') {
  90. $('.theme-remove-bg').hide();
  91. $('.theme-undo[data-setting=backgroundMime]').show();
  92. }
  93. }
  94. $(document).ready(function () {
  95. $('#theming [data-toggle="tooltip"]').tooltip();
  96. // manually instantiate jscolor to work around new Function call which violates strict CSP
  97. var colorElement = $('#theming-color')[0];
  98. var jscolor = new window.jscolor(colorElement, {hash: true});
  99. $('#theming .theme-undo').each(function() {
  100. var setting = $(this).data('setting');
  101. var value = $('#theming-'+setting).val();
  102. hideUndoButton(setting, value);
  103. });
  104. $('.fileupload').fileupload({
  105. pasteZone: null,
  106. dropZone: null,
  107. done: function (e, response) {
  108. var $form = $(e.target).closest('form');
  109. var key = $form.data('image-key');
  110. preview(key + 'Mime', response.result.data.name, response.result.data.serverCssUrl);
  111. $form.find('.image-preview').css('backgroundImage', response.result.data.url + '?v=' + new Date().getTime());
  112. OC.msg.finishedSaving('#theming_settings_msg', response.result);
  113. $form.find('label.button').addClass('icon-upload').removeClass('icon-loading-small');
  114. $form.find('.theme-undo').show();
  115. },
  116. submit: function(e, response) {
  117. var $form = $(e.target).closest('form');
  118. var key = $form.data('image-key');
  119. startLoading();
  120. $form.find('label.button').removeClass('icon-upload').addClass('icon-loading-small');
  121. },
  122. fail: function (e, response){
  123. var $form = $(e.target).closest('form');
  124. OC.msg.finishedError('#theming_settings_msg', response._response.jqXHR.responseJSON.data.message);
  125. $form.find('label.button').addClass('icon-upload').removeClass('icon-loading-small');
  126. $('#theming_settings_loading').hide();
  127. }
  128. });
  129. // clicking preview should also trigger file upload dialog
  130. $('#theming-preview-logo').on('click', function(e) {
  131. e.stopPropagation();
  132. $('#uploadlogo').click();
  133. });
  134. $('#theming-preview').on('click', function() {
  135. $('#upload-login-background').click();
  136. });
  137. function checkName () {
  138. var length = $('#theming-name').val().length;
  139. try {
  140. if (length > 0) {
  141. return true;
  142. } else {
  143. throw t('theming', 'Name cannot be empty');
  144. }
  145. } catch (error) {
  146. $('#theming-name').attr('title', error);
  147. $('#theming-name').tooltip({placement: 'top', trigger: 'manual'});
  148. $('#theming-name').tooltip('fixTitle');
  149. $('#theming-name').tooltip('show');
  150. $('#theming-name').addClass('error');
  151. }
  152. return false;
  153. }
  154. $('#theming-name').keyup(function() {
  155. if (checkName()) {
  156. $('#theming-name').tooltip('hide');
  157. $('#theming-name').removeClass('error');
  158. }
  159. });
  160. $('#theming-name').change(function(e) {
  161. var el = $(this);
  162. });
  163. function onChange(e) {
  164. var el = $(this);
  165. var setting = el.parent().find('div[data-setting]').data('setting');
  166. var value = $(this).val();
  167. if(setting === 'color') {
  168. if (value.indexOf('#') !== 0) {
  169. value = '#' + value;
  170. }
  171. }
  172. if(setting === 'name') {
  173. if(checkName()){
  174. $.when(el.focusout()).then(function() {
  175. setThemingValue('name', value);
  176. });
  177. if (e.keyCode == 13) {
  178. setThemingValue('name', value);
  179. }
  180. }
  181. }
  182. $.when(el.focusout()).then(function() {
  183. setThemingValue(setting, value);
  184. });
  185. if (e.keyCode == 13) {
  186. setThemingValue(setting, value);
  187. }
  188. };
  189. $('#theming input[type="text"]').change(onChange);
  190. $('#theming input[type="url"]').change(onChange);
  191. $('.theme-undo').click(function (e) {
  192. var setting = $(this).data('setting');
  193. var $form = $(this).closest('form');
  194. var image = $form.data('image-key');
  195. startLoading();
  196. $('.theme-undo[data-setting=' + setting + ']').hide();
  197. $.post(
  198. OC.generateUrl('/apps/theming/ajax/undoChanges'), {'setting' : setting}
  199. ).done(function(response) {
  200. if (setting === 'color') {
  201. var colorPicker = document.getElementById('theming-color');
  202. colorPicker.style.backgroundColor = response.data.value;
  203. colorPicker.value = response.data.value.slice(1).toUpperCase();
  204. } else if (!image) {
  205. var input = document.getElementById('theming-'+setting);
  206. input.value = response.data.value;
  207. }
  208. preview(setting, response.data.value, response.data.serverCssUrl);
  209. });
  210. });
  211. $('.theme-remove-bg').click(function() {
  212. startLoading();
  213. $.post(
  214. OC.generateUrl('/apps/theming/ajax/updateStylesheet'), {'setting' : 'backgroundMime', 'value' : 'backgroundColor'}
  215. ).done(function(response) {
  216. preview('backgroundMime', 'backgroundColor', response.data.serverCssUrl);
  217. }).fail(function(response) {
  218. OC.msg.finishedSaving('#theming_settings_msg', response);
  219. $('#theming_settings_loading').hide();
  220. });
  221. });
  222. });