@@ -39,258 +39,258 @@ |
||
39 | 39 | |
40 | 40 | class Util { |
41 | 41 | |
42 | - private IConfig $config; |
|
43 | - private IAppManager $appManager; |
|
44 | - private IAppData $appData; |
|
45 | - private ImageManager $imageManager; |
|
42 | + private IConfig $config; |
|
43 | + private IAppManager $appManager; |
|
44 | + private IAppData $appData; |
|
45 | + private ImageManager $imageManager; |
|
46 | 46 | |
47 | - public function __construct(IConfig $config, IAppManager $appManager, IAppData $appData, ImageManager $imageManager) { |
|
48 | - $this->config = $config; |
|
49 | - $this->appManager = $appManager; |
|
50 | - $this->appData = $appData; |
|
51 | - $this->imageManager = $imageManager; |
|
52 | - } |
|
47 | + public function __construct(IConfig $config, IAppManager $appManager, IAppData $appData, ImageManager $imageManager) { |
|
48 | + $this->config = $config; |
|
49 | + $this->appManager = $appManager; |
|
50 | + $this->appData = $appData; |
|
51 | + $this->imageManager = $imageManager; |
|
52 | + } |
|
53 | 53 | |
54 | - /** |
|
55 | - * Should we invert the text on this background color? |
|
56 | - * @param string $color rgb color value |
|
57 | - * @return bool |
|
58 | - */ |
|
59 | - public function invertTextColor(string $color): bool { |
|
60 | - return $this->isBrightColor($color); |
|
61 | - } |
|
54 | + /** |
|
55 | + * Should we invert the text on this background color? |
|
56 | + * @param string $color rgb color value |
|
57 | + * @return bool |
|
58 | + */ |
|
59 | + public function invertTextColor(string $color): bool { |
|
60 | + return $this->isBrightColor($color); |
|
61 | + } |
|
62 | 62 | |
63 | - /** |
|
64 | - * Is this color too bright ? |
|
65 | - * @param string $color rgb color value |
|
66 | - * @return bool |
|
67 | - */ |
|
68 | - public function isBrightColor(string $color): bool { |
|
69 | - $l = $this->calculateLuma($color); |
|
70 | - if ($l > 0.6) { |
|
71 | - return true; |
|
72 | - } else { |
|
73 | - return false; |
|
74 | - } |
|
75 | - } |
|
63 | + /** |
|
64 | + * Is this color too bright ? |
|
65 | + * @param string $color rgb color value |
|
66 | + * @return bool |
|
67 | + */ |
|
68 | + public function isBrightColor(string $color): bool { |
|
69 | + $l = $this->calculateLuma($color); |
|
70 | + if ($l > 0.6) { |
|
71 | + return true; |
|
72 | + } else { |
|
73 | + return false; |
|
74 | + } |
|
75 | + } |
|
76 | 76 | |
77 | - /** |
|
78 | - * get color for on-page elements: |
|
79 | - * theme color by default, grey if theme color is to bright |
|
80 | - * @param string $color |
|
81 | - * @param bool $brightBackground |
|
82 | - * @return string |
|
83 | - */ |
|
84 | - public function elementColor($color, bool $brightBackground = true) { |
|
85 | - $luminance = $this->calculateLuminance($color); |
|
77 | + /** |
|
78 | + * get color for on-page elements: |
|
79 | + * theme color by default, grey if theme color is to bright |
|
80 | + * @param string $color |
|
81 | + * @param bool $brightBackground |
|
82 | + * @return string |
|
83 | + */ |
|
84 | + public function elementColor($color, bool $brightBackground = true) { |
|
85 | + $luminance = $this->calculateLuminance($color); |
|
86 | 86 | |
87 | - if ($brightBackground && $luminance > 0.8) { |
|
88 | - // If the color is too bright in bright mode, we fall back to a darker gray |
|
89 | - return '#aaaaaa'; |
|
90 | - } |
|
87 | + if ($brightBackground && $luminance > 0.8) { |
|
88 | + // If the color is too bright in bright mode, we fall back to a darker gray |
|
89 | + return '#aaaaaa'; |
|
90 | + } |
|
91 | 91 | |
92 | - if (!$brightBackground && $luminance < 0.2) { |
|
93 | - // If the color is too dark in dark mode, we fall back to a brighter gray |
|
94 | - return '#8c8c8c'; |
|
95 | - } |
|
92 | + if (!$brightBackground && $luminance < 0.2) { |
|
93 | + // If the color is too dark in dark mode, we fall back to a brighter gray |
|
94 | + return '#8c8c8c'; |
|
95 | + } |
|
96 | 96 | |
97 | - return $color; |
|
98 | - } |
|
97 | + return $color; |
|
98 | + } |
|
99 | 99 | |
100 | - public function mix(string $color1, string $color2, int $factor): string { |
|
101 | - $color = new Color($color1); |
|
102 | - return '#' . $color->mix($color2, $factor); |
|
103 | - } |
|
100 | + public function mix(string $color1, string $color2, int $factor): string { |
|
101 | + $color = new Color($color1); |
|
102 | + return '#' . $color->mix($color2, $factor); |
|
103 | + } |
|
104 | 104 | |
105 | - public function lighten(string $color, int $factor): string { |
|
106 | - $color = new Color($color); |
|
107 | - return '#' . $color->lighten($factor); |
|
108 | - } |
|
105 | + public function lighten(string $color, int $factor): string { |
|
106 | + $color = new Color($color); |
|
107 | + return '#' . $color->lighten($factor); |
|
108 | + } |
|
109 | 109 | |
110 | - public function darken(string $color, int $factor): string { |
|
111 | - $color = new Color($color); |
|
112 | - return '#' . $color->darken($factor); |
|
113 | - } |
|
110 | + public function darken(string $color, int $factor): string { |
|
111 | + $color = new Color($color); |
|
112 | + return '#' . $color->darken($factor); |
|
113 | + } |
|
114 | 114 | |
115 | - /** |
|
116 | - * Convert RGB to HSL |
|
117 | - * |
|
118 | - * Copied from cssphp, copyright Leaf Corcoran, licensed under MIT |
|
119 | - * |
|
120 | - * @param int $red |
|
121 | - * @param int $green |
|
122 | - * @param int $blue |
|
123 | - * |
|
124 | - * @return float[] |
|
125 | - */ |
|
126 | - public function toHSL(int $red, int $green, int $blue): array { |
|
127 | - $color = new Color(Color::rgbToHex(['R' => $red, 'G' => $green, 'B' => $blue])); |
|
128 | - return array_values($color->getHsl()); |
|
129 | - } |
|
115 | + /** |
|
116 | + * Convert RGB to HSL |
|
117 | + * |
|
118 | + * Copied from cssphp, copyright Leaf Corcoran, licensed under MIT |
|
119 | + * |
|
120 | + * @param int $red |
|
121 | + * @param int $green |
|
122 | + * @param int $blue |
|
123 | + * |
|
124 | + * @return float[] |
|
125 | + */ |
|
126 | + public function toHSL(int $red, int $green, int $blue): array { |
|
127 | + $color = new Color(Color::rgbToHex(['R' => $red, 'G' => $green, 'B' => $blue])); |
|
128 | + return array_values($color->getHsl()); |
|
129 | + } |
|
130 | 130 | |
131 | - /** |
|
132 | - * @param string $color rgb color value |
|
133 | - * @return float |
|
134 | - */ |
|
135 | - public function calculateLuminance(string $color): float { |
|
136 | - [$red, $green, $blue] = $this->hexToRGB($color); |
|
137 | - $hsl = $this->toHSL($red, $green, $blue); |
|
138 | - return $hsl[2]; |
|
139 | - } |
|
131 | + /** |
|
132 | + * @param string $color rgb color value |
|
133 | + * @return float |
|
134 | + */ |
|
135 | + public function calculateLuminance(string $color): float { |
|
136 | + [$red, $green, $blue] = $this->hexToRGB($color); |
|
137 | + $hsl = $this->toHSL($red, $green, $blue); |
|
138 | + return $hsl[2]; |
|
139 | + } |
|
140 | 140 | |
141 | - /** |
|
142 | - * @param string $color rgb color value |
|
143 | - * @return float |
|
144 | - */ |
|
145 | - public function calculateLuma(string $color): float { |
|
146 | - [$red, $green, $blue] = $this->hexToRGB($color); |
|
147 | - return (0.2126 * $red + 0.7152 * $green + 0.0722 * $blue) / 255; |
|
148 | - } |
|
141 | + /** |
|
142 | + * @param string $color rgb color value |
|
143 | + * @return float |
|
144 | + */ |
|
145 | + public function calculateLuma(string $color): float { |
|
146 | + [$red, $green, $blue] = $this->hexToRGB($color); |
|
147 | + return (0.2126 * $red + 0.7152 * $green + 0.0722 * $blue) / 255; |
|
148 | + } |
|
149 | 149 | |
150 | - /** |
|
151 | - * @param string $color rgb color value |
|
152 | - * @return int[] |
|
153 | - * @psalm-return array{0: int, 1: int, 2: int} |
|
154 | - */ |
|
155 | - public function hexToRGB(string $color): array { |
|
156 | - $color = new Color($color); |
|
157 | - return array_values($color->getRgb()); |
|
158 | - } |
|
150 | + /** |
|
151 | + * @param string $color rgb color value |
|
152 | + * @return int[] |
|
153 | + * @psalm-return array{0: int, 1: int, 2: int} |
|
154 | + */ |
|
155 | + public function hexToRGB(string $color): array { |
|
156 | + $color = new Color($color); |
|
157 | + return array_values($color->getRgb()); |
|
158 | + } |
|
159 | 159 | |
160 | - /** |
|
161 | - * @param $color |
|
162 | - * @return string base64 encoded radio button svg |
|
163 | - */ |
|
164 | - public function generateRadioButton($color) { |
|
165 | - $radioButtonIcon = '<svg xmlns="http://www.w3.org/2000/svg" height="16" width="16">' . |
|
166 | - '<path d="M8 1a7 7 0 0 0-7 7 7 7 0 0 0 7 7 7 7 0 0 0 7-7 7 7 0 0 0-7-7zm0 1a6 6 0 0 1 6 6 6 6 0 0 1-6 6 6 6 0 0 1-6-6 6 6 0 0 1 6-6zm0 2a4 4 0 1 0 0 8 4 4 0 0 0 0-8z" fill="'.$color.'"/></svg>'; |
|
167 | - return base64_encode($radioButtonIcon); |
|
168 | - } |
|
160 | + /** |
|
161 | + * @param $color |
|
162 | + * @return string base64 encoded radio button svg |
|
163 | + */ |
|
164 | + public function generateRadioButton($color) { |
|
165 | + $radioButtonIcon = '<svg xmlns="http://www.w3.org/2000/svg" height="16" width="16">' . |
|
166 | + '<path d="M8 1a7 7 0 0 0-7 7 7 7 0 0 0 7 7 7 7 0 0 0 7-7 7 7 0 0 0-7-7zm0 1a6 6 0 0 1 6 6 6 6 0 0 1-6 6 6 6 0 0 1-6-6 6 6 0 0 1 6-6zm0 2a4 4 0 1 0 0 8 4 4 0 0 0 0-8z" fill="'.$color.'"/></svg>'; |
|
167 | + return base64_encode($radioButtonIcon); |
|
168 | + } |
|
169 | 169 | |
170 | 170 | |
171 | - /** |
|
172 | - * @param $app string app name |
|
173 | - * @return string|ISimpleFile path to app icon / file of logo |
|
174 | - */ |
|
175 | - public function getAppIcon($app) { |
|
176 | - $app = str_replace(['\0', '/', '\\', '..'], '', $app); |
|
177 | - try { |
|
178 | - $appPath = $this->appManager->getAppPath($app); |
|
179 | - $icon = $appPath . '/img/' . $app . '.svg'; |
|
180 | - if (file_exists($icon)) { |
|
181 | - return $icon; |
|
182 | - } |
|
183 | - $icon = $appPath . '/img/app.svg'; |
|
184 | - if (file_exists($icon)) { |
|
185 | - return $icon; |
|
186 | - } |
|
187 | - } catch (AppPathNotFoundException $e) { |
|
188 | - } |
|
171 | + /** |
|
172 | + * @param $app string app name |
|
173 | + * @return string|ISimpleFile path to app icon / file of logo |
|
174 | + */ |
|
175 | + public function getAppIcon($app) { |
|
176 | + $app = str_replace(['\0', '/', '\\', '..'], '', $app); |
|
177 | + try { |
|
178 | + $appPath = $this->appManager->getAppPath($app); |
|
179 | + $icon = $appPath . '/img/' . $app . '.svg'; |
|
180 | + if (file_exists($icon)) { |
|
181 | + return $icon; |
|
182 | + } |
|
183 | + $icon = $appPath . '/img/app.svg'; |
|
184 | + if (file_exists($icon)) { |
|
185 | + return $icon; |
|
186 | + } |
|
187 | + } catch (AppPathNotFoundException $e) { |
|
188 | + } |
|
189 | 189 | |
190 | - if ($this->config->getAppValue('theming', 'logoMime', '') !== '') { |
|
191 | - $logoFile = null; |
|
192 | - try { |
|
193 | - $folder = $this->appData->getFolder('images'); |
|
194 | - return $folder->getFile('logo'); |
|
195 | - } catch (NotFoundException $e) { |
|
196 | - } |
|
197 | - } |
|
198 | - return \OC::$SERVERROOT . '/core/img/logo/logo.svg'; |
|
199 | - } |
|
190 | + if ($this->config->getAppValue('theming', 'logoMime', '') !== '') { |
|
191 | + $logoFile = null; |
|
192 | + try { |
|
193 | + $folder = $this->appData->getFolder('images'); |
|
194 | + return $folder->getFile('logo'); |
|
195 | + } catch (NotFoundException $e) { |
|
196 | + } |
|
197 | + } |
|
198 | + return \OC::$SERVERROOT . '/core/img/logo/logo.svg'; |
|
199 | + } |
|
200 | 200 | |
201 | - /** |
|
202 | - * @param $app string app name |
|
203 | - * @param $image string relative path to image in app folder |
|
204 | - * @return string|false absolute path to image |
|
205 | - */ |
|
206 | - public function getAppImage($app, $image) { |
|
207 | - $app = str_replace(['\0', '/', '\\', '..'], '', $app); |
|
208 | - $image = str_replace(['\0', '\\', '..'], '', $image); |
|
209 | - if ($app === "core") { |
|
210 | - $icon = \OC::$SERVERROOT . '/core/img/' . $image; |
|
211 | - if (file_exists($icon)) { |
|
212 | - return $icon; |
|
213 | - } |
|
214 | - } |
|
201 | + /** |
|
202 | + * @param $app string app name |
|
203 | + * @param $image string relative path to image in app folder |
|
204 | + * @return string|false absolute path to image |
|
205 | + */ |
|
206 | + public function getAppImage($app, $image) { |
|
207 | + $app = str_replace(['\0', '/', '\\', '..'], '', $app); |
|
208 | + $image = str_replace(['\0', '\\', '..'], '', $image); |
|
209 | + if ($app === "core") { |
|
210 | + $icon = \OC::$SERVERROOT . '/core/img/' . $image; |
|
211 | + if (file_exists($icon)) { |
|
212 | + return $icon; |
|
213 | + } |
|
214 | + } |
|
215 | 215 | |
216 | - try { |
|
217 | - $appPath = $this->appManager->getAppPath($app); |
|
218 | - } catch (AppPathNotFoundException $e) { |
|
219 | - return false; |
|
220 | - } |
|
216 | + try { |
|
217 | + $appPath = $this->appManager->getAppPath($app); |
|
218 | + } catch (AppPathNotFoundException $e) { |
|
219 | + return false; |
|
220 | + } |
|
221 | 221 | |
222 | - $icon = $appPath . '/img/' . $image; |
|
223 | - if (file_exists($icon)) { |
|
224 | - return $icon; |
|
225 | - } |
|
226 | - $icon = $appPath . '/img/' . $image . '.svg'; |
|
227 | - if (file_exists($icon)) { |
|
228 | - return $icon; |
|
229 | - } |
|
230 | - $icon = $appPath . '/img/' . $image . '.png'; |
|
231 | - if (file_exists($icon)) { |
|
232 | - return $icon; |
|
233 | - } |
|
234 | - $icon = $appPath . '/img/' . $image . '.gif'; |
|
235 | - if (file_exists($icon)) { |
|
236 | - return $icon; |
|
237 | - } |
|
238 | - $icon = $appPath . '/img/' . $image . '.jpg'; |
|
239 | - if (file_exists($icon)) { |
|
240 | - return $icon; |
|
241 | - } |
|
222 | + $icon = $appPath . '/img/' . $image; |
|
223 | + if (file_exists($icon)) { |
|
224 | + return $icon; |
|
225 | + } |
|
226 | + $icon = $appPath . '/img/' . $image . '.svg'; |
|
227 | + if (file_exists($icon)) { |
|
228 | + return $icon; |
|
229 | + } |
|
230 | + $icon = $appPath . '/img/' . $image . '.png'; |
|
231 | + if (file_exists($icon)) { |
|
232 | + return $icon; |
|
233 | + } |
|
234 | + $icon = $appPath . '/img/' . $image . '.gif'; |
|
235 | + if (file_exists($icon)) { |
|
236 | + return $icon; |
|
237 | + } |
|
238 | + $icon = $appPath . '/img/' . $image . '.jpg'; |
|
239 | + if (file_exists($icon)) { |
|
240 | + return $icon; |
|
241 | + } |
|
242 | 242 | |
243 | - return false; |
|
244 | - } |
|
243 | + return false; |
|
244 | + } |
|
245 | 245 | |
246 | - /** |
|
247 | - * replace default color with a custom one |
|
248 | - * |
|
249 | - * @param $svg string content of a svg file |
|
250 | - * @param $color string color to match |
|
251 | - * @return string |
|
252 | - */ |
|
253 | - public function colorizeSvg($svg, $color) { |
|
254 | - $svg = preg_replace('/#0082c9/i', $color, $svg); |
|
255 | - return $svg; |
|
256 | - } |
|
246 | + /** |
|
247 | + * replace default color with a custom one |
|
248 | + * |
|
249 | + * @param $svg string content of a svg file |
|
250 | + * @param $color string color to match |
|
251 | + * @return string |
|
252 | + */ |
|
253 | + public function colorizeSvg($svg, $color) { |
|
254 | + $svg = preg_replace('/#0082c9/i', $color, $svg); |
|
255 | + return $svg; |
|
256 | + } |
|
257 | 257 | |
258 | - /** |
|
259 | - * Check if a custom theme is set in the server configuration |
|
260 | - * |
|
261 | - * @return bool |
|
262 | - */ |
|
263 | - public function isAlreadyThemed() { |
|
264 | - $theme = $this->config->getSystemValue('theme', ''); |
|
265 | - if ($theme !== '') { |
|
266 | - return true; |
|
267 | - } |
|
268 | - return false; |
|
269 | - } |
|
258 | + /** |
|
259 | + * Check if a custom theme is set in the server configuration |
|
260 | + * |
|
261 | + * @return bool |
|
262 | + */ |
|
263 | + public function isAlreadyThemed() { |
|
264 | + $theme = $this->config->getSystemValue('theme', ''); |
|
265 | + if ($theme !== '') { |
|
266 | + return true; |
|
267 | + } |
|
268 | + return false; |
|
269 | + } |
|
270 | 270 | |
271 | - public function isBackgroundThemed() { |
|
272 | - $backgroundLogo = $this->config->getAppValue('theming', 'backgroundMime', ''); |
|
273 | - return $backgroundLogo !== '' && $backgroundLogo !== 'backgroundColor'; |
|
274 | - } |
|
271 | + public function isBackgroundThemed() { |
|
272 | + $backgroundLogo = $this->config->getAppValue('theming', 'backgroundMime', ''); |
|
273 | + return $backgroundLogo !== '' && $backgroundLogo !== 'backgroundColor'; |
|
274 | + } |
|
275 | 275 | |
276 | - public function isLogoThemed() { |
|
277 | - return $this->imageManager->hasImage('logo') |
|
278 | - || $this->imageManager->hasImage('logoheader'); |
|
279 | - } |
|
276 | + public function isLogoThemed() { |
|
277 | + return $this->imageManager->hasImage('logo') |
|
278 | + || $this->imageManager->hasImage('logoheader'); |
|
279 | + } |
|
280 | 280 | |
281 | - public function getCacheBuster(): string { |
|
282 | - $userSession = \OC::$server->get(IUserSession::class); |
|
283 | - $userId = ''; |
|
284 | - $user = $userSession->getUser(); |
|
285 | - if (!is_null($user)) { |
|
286 | - $userId = $user->getUID(); |
|
287 | - } |
|
288 | - $userCacheBuster = ''; |
|
289 | - if ($userId) { |
|
290 | - $userCacheBusterValue = (int)$this->config->getUserValue($userId, 'theming', 'userCacheBuster', '0'); |
|
291 | - $userCacheBuster = $userId . '_' . $userCacheBusterValue; |
|
292 | - } |
|
293 | - $systemCacheBuster = $this->config->getAppValue('theming', 'cachebuster', '0'); |
|
294 | - return substr(sha1($userCacheBuster . $systemCacheBuster), 0, 8); |
|
295 | - } |
|
281 | + public function getCacheBuster(): string { |
|
282 | + $userSession = \OC::$server->get(IUserSession::class); |
|
283 | + $userId = ''; |
|
284 | + $user = $userSession->getUser(); |
|
285 | + if (!is_null($user)) { |
|
286 | + $userId = $user->getUID(); |
|
287 | + } |
|
288 | + $userCacheBuster = ''; |
|
289 | + if ($userId) { |
|
290 | + $userCacheBusterValue = (int)$this->config->getUserValue($userId, 'theming', 'userCacheBuster', '0'); |
|
291 | + $userCacheBuster = $userId . '_' . $userCacheBusterValue; |
|
292 | + } |
|
293 | + $systemCacheBuster = $this->config->getAppValue('theming', 'cachebuster', '0'); |
|
294 | + return substr(sha1($userCacheBuster . $systemCacheBuster), 0, 8); |
|
295 | + } |
|
296 | 296 | } |
@@ -30,136 +30,136 @@ |
||
30 | 30 | use OCA\Theming\Service\BackgroundService; |
31 | 31 | |
32 | 32 | trait CommonThemeTrait { |
33 | - public Util $util; |
|
34 | - |
|
35 | - /** |
|
36 | - * Generate primary-related variables |
|
37 | - * This is shared between multiple themes because colorMainBackground and colorMainText |
|
38 | - * will change in between. |
|
39 | - */ |
|
40 | - protected function generatePrimaryVariables(string $colorMainBackground, string $colorMainText): array { |
|
41 | - $isBrightColor = $this->util->isBrightColor($colorMainBackground); |
|
42 | - $colorPrimaryElement = $this->util->elementColor($this->primaryColor, $isBrightColor); |
|
43 | - $colorPrimaryLight = $this->util->mix($colorPrimaryElement, $colorMainBackground, -80); |
|
44 | - $colorPrimaryElementLight = $this->util->mix($colorPrimaryElement, $colorMainBackground, -80); |
|
45 | - |
|
46 | - // primary related colours |
|
47 | - return [ |
|
48 | - // invert filter if primary is too bright |
|
49 | - // to be used for legacy reasons only. Use inline |
|
50 | - // svg with proper css variable instead or material |
|
51 | - // design icons. |
|
52 | - // ⚠️ Using 'no' as a value to make sure we specify an |
|
53 | - // invalid one with no fallback. 'unset' could here fallback to some |
|
54 | - // other theme with media queries |
|
55 | - '--primary-invert-if-bright' => $this->util->invertTextColor($this->primaryColor) ? 'invert(100%)' : 'no', |
|
56 | - |
|
57 | - '--color-primary' => $this->primaryColor, |
|
58 | - '--color-primary-default' => $this->defaultPrimaryColor, |
|
59 | - '--color-primary-text' => $this->util->invertTextColor($this->primaryColor) ? '#000000' : '#ffffff', |
|
60 | - '--color-primary-hover' => $this->util->mix($this->primaryColor, $colorMainBackground, 60), |
|
61 | - '--color-primary-light' => $colorPrimaryLight, |
|
62 | - '--color-primary-light-text' => $this->util->mix($this->primaryColor, $this->util->invertTextColor($colorPrimaryLight) ? '#000000' : '#ffffff', -20), |
|
63 | - '--color-primary-light-hover' => $this->util->mix($colorPrimaryLight, $colorMainText, 90), |
|
64 | - |
|
65 | - // used for buttons, inputs... |
|
66 | - '--color-primary-element' => $colorPrimaryElement, |
|
67 | - '--color-primary-element-hover' => $this->util->mix($colorPrimaryElement, $colorMainBackground, 60), |
|
68 | - '--color-primary-element-text' => $this->util->invertTextColor($colorPrimaryElement) ? '#000000' : '#ffffff', |
|
69 | - |
|
70 | - // used for hover/focus states |
|
71 | - '--color-primary-element-light' => $colorPrimaryElementLight, |
|
72 | - '--color-primary-element-light-hover' => $this->util->mix($colorPrimaryElementLight, $colorMainText, 90), |
|
73 | - '--color-primary-element-light-text' => $this->util->mix($colorPrimaryElement, $this->util->invertTextColor($colorPrimaryElementLight) ? '#000000' : '#ffffff', -20), |
|
74 | - // mostly used for disabled states |
|
75 | - '--color-primary-element-text-dark' => $this->util->darken($this->util->invertTextColor($colorPrimaryElement) ? '#000000' : '#ffffff', 7), |
|
76 | - |
|
77 | - // to use like this: background-image: var(--gradient-primary-background); |
|
78 | - '--gradient-primary-background' => 'linear-gradient(40deg, var(--color-primary) 0%, var(--color-primary-hover) 100%)', |
|
79 | - ]; |
|
80 | - } |
|
81 | - |
|
82 | - /** |
|
83 | - * Generate admin theming background-related variables |
|
84 | - */ |
|
85 | - protected function generateGlobalBackgroundVariables(): array { |
|
86 | - $backgroundDeleted = $this->config->getAppValue(Application::APP_ID, 'backgroundMime', '') === 'backgroundColor'; |
|
87 | - $hasCustomLogoHeader = $this->util->isLogoThemed(); |
|
88 | - $isDefaultPrimaryBright = $this->util->invertTextColor($this->defaultPrimaryColor); |
|
89 | - |
|
90 | - $variables = []; |
|
91 | - |
|
92 | - // Default last fallback values |
|
93 | - $variables['--image-background-default'] = "url('" . $this->themingDefaults->getBackground() . "')"; |
|
94 | - $variables['--color-background-plain'] = $this->defaultPrimaryColor; |
|
95 | - |
|
96 | - // Register image variables only if custom-defined |
|
97 | - foreach (ImageManager::SUPPORTED_IMAGE_KEYS as $image) { |
|
98 | - if ($this->imageManager->hasImage($image)) { |
|
99 | - $imageUrl = $this->imageManager->getImageUrl($image); |
|
100 | - // --image-background is overridden by user theming |
|
101 | - $variables["--image-$image"] = "url('" . $imageUrl . "')"; |
|
102 | - } |
|
103 | - } |
|
104 | - |
|
105 | - // If primary as background has been request or if we have a custom primary colour |
|
106 | - // let's not define the background image |
|
107 | - if ($backgroundDeleted) { |
|
108 | - $variables['--color-background-plain'] = $this->defaultPrimaryColor; |
|
109 | - $variables['--image-background-plain'] = 'yes'; |
|
110 | - $variables['--image-background'] = 'no'; |
|
111 | - // If no background image is set, we need to check against the shown primary colour |
|
112 | - $variables['--background-image-invert-if-bright'] = $isDefaultPrimaryBright ? 'invert(100%)' : 'no'; |
|
113 | - } |
|
114 | - |
|
115 | - if ($hasCustomLogoHeader) { |
|
116 | - $variables['--image-logoheader-custom'] = 'true'; |
|
117 | - } |
|
118 | - |
|
119 | - return $variables; |
|
120 | - } |
|
121 | - |
|
122 | - /** |
|
123 | - * Generate user theming background-related variables |
|
124 | - */ |
|
125 | - protected function generateUserBackgroundVariables(): array { |
|
126 | - $user = $this->userSession->getUser(); |
|
127 | - if ($user !== null |
|
128 | - && !$this->themingDefaults->isUserThemingDisabled() |
|
129 | - && $this->appManager->isEnabledForUser(Application::APP_ID)) { |
|
130 | - $backgroundImage = $this->config->getUserValue($user->getUID(), Application::APP_ID, 'background_image', BackgroundService::BACKGROUND_DEFAULT); |
|
131 | - $currentVersion = (int)$this->config->getUserValue($user->getUID(), Application::APP_ID, 'userCacheBuster', '0'); |
|
132 | - $isPrimaryBright = $this->util->invertTextColor($this->primaryColor); |
|
133 | - |
|
134 | - // The user removed the background |
|
135 | - if ($backgroundImage === BackgroundService::BACKGROUND_DISABLED) { |
|
136 | - return [ |
|
137 | - '--image-background' => 'no', |
|
138 | - '--color-background-plain' => $this->primaryColor, |
|
139 | - // If no background image is set, we need to check against the shown primary colour |
|
140 | - '--background-image-invert-if-bright' => $isPrimaryBright ? 'invert(100%)' : 'no', |
|
141 | - ]; |
|
142 | - } |
|
143 | - |
|
144 | - // The user uploaded a custom background |
|
145 | - if ($backgroundImage === BackgroundService::BACKGROUND_CUSTOM) { |
|
146 | - $cacheBuster = substr(sha1($user->getUID() . '_' . $currentVersion), 0, 8); |
|
147 | - return [ |
|
148 | - '--image-background' => "url('" . $this->urlGenerator->linkToRouteAbsolute('theming.userTheme.getBackground') . "?v=$cacheBuster')", |
|
149 | - '--color-background-plain' => $this->themingDefaults->getColorPrimary(), |
|
150 | - ]; |
|
151 | - } |
|
152 | - |
|
153 | - // The user picked a shipped background |
|
154 | - if (isset(BackgroundService::SHIPPED_BACKGROUNDS[$backgroundImage])) { |
|
155 | - return [ |
|
156 | - '--image-background' => "url('" . $this->urlGenerator->linkTo(Application::APP_ID, "img/background/$backgroundImage") . "')", |
|
157 | - '--color-background-plain' => $this->themingDefaults->getColorPrimary(), |
|
158 | - '--background-image-invert-if-bright' => BackgroundService::SHIPPED_BACKGROUNDS[$backgroundImage]['theming'] ?? null === BackgroundService::THEMING_MODE_DARK ? 'invert(100%)' : 'no', |
|
159 | - ]; |
|
160 | - } |
|
161 | - } |
|
162 | - |
|
163 | - return []; |
|
164 | - } |
|
33 | + public Util $util; |
|
34 | + |
|
35 | + /** |
|
36 | + * Generate primary-related variables |
|
37 | + * This is shared between multiple themes because colorMainBackground and colorMainText |
|
38 | + * will change in between. |
|
39 | + */ |
|
40 | + protected function generatePrimaryVariables(string $colorMainBackground, string $colorMainText): array { |
|
41 | + $isBrightColor = $this->util->isBrightColor($colorMainBackground); |
|
42 | + $colorPrimaryElement = $this->util->elementColor($this->primaryColor, $isBrightColor); |
|
43 | + $colorPrimaryLight = $this->util->mix($colorPrimaryElement, $colorMainBackground, -80); |
|
44 | + $colorPrimaryElementLight = $this->util->mix($colorPrimaryElement, $colorMainBackground, -80); |
|
45 | + |
|
46 | + // primary related colours |
|
47 | + return [ |
|
48 | + // invert filter if primary is too bright |
|
49 | + // to be used for legacy reasons only. Use inline |
|
50 | + // svg with proper css variable instead or material |
|
51 | + // design icons. |
|
52 | + // ⚠️ Using 'no' as a value to make sure we specify an |
|
53 | + // invalid one with no fallback. 'unset' could here fallback to some |
|
54 | + // other theme with media queries |
|
55 | + '--primary-invert-if-bright' => $this->util->invertTextColor($this->primaryColor) ? 'invert(100%)' : 'no', |
|
56 | + |
|
57 | + '--color-primary' => $this->primaryColor, |
|
58 | + '--color-primary-default' => $this->defaultPrimaryColor, |
|
59 | + '--color-primary-text' => $this->util->invertTextColor($this->primaryColor) ? '#000000' : '#ffffff', |
|
60 | + '--color-primary-hover' => $this->util->mix($this->primaryColor, $colorMainBackground, 60), |
|
61 | + '--color-primary-light' => $colorPrimaryLight, |
|
62 | + '--color-primary-light-text' => $this->util->mix($this->primaryColor, $this->util->invertTextColor($colorPrimaryLight) ? '#000000' : '#ffffff', -20), |
|
63 | + '--color-primary-light-hover' => $this->util->mix($colorPrimaryLight, $colorMainText, 90), |
|
64 | + |
|
65 | + // used for buttons, inputs... |
|
66 | + '--color-primary-element' => $colorPrimaryElement, |
|
67 | + '--color-primary-element-hover' => $this->util->mix($colorPrimaryElement, $colorMainBackground, 60), |
|
68 | + '--color-primary-element-text' => $this->util->invertTextColor($colorPrimaryElement) ? '#000000' : '#ffffff', |
|
69 | + |
|
70 | + // used for hover/focus states |
|
71 | + '--color-primary-element-light' => $colorPrimaryElementLight, |
|
72 | + '--color-primary-element-light-hover' => $this->util->mix($colorPrimaryElementLight, $colorMainText, 90), |
|
73 | + '--color-primary-element-light-text' => $this->util->mix($colorPrimaryElement, $this->util->invertTextColor($colorPrimaryElementLight) ? '#000000' : '#ffffff', -20), |
|
74 | + // mostly used for disabled states |
|
75 | + '--color-primary-element-text-dark' => $this->util->darken($this->util->invertTextColor($colorPrimaryElement) ? '#000000' : '#ffffff', 7), |
|
76 | + |
|
77 | + // to use like this: background-image: var(--gradient-primary-background); |
|
78 | + '--gradient-primary-background' => 'linear-gradient(40deg, var(--color-primary) 0%, var(--color-primary-hover) 100%)', |
|
79 | + ]; |
|
80 | + } |
|
81 | + |
|
82 | + /** |
|
83 | + * Generate admin theming background-related variables |
|
84 | + */ |
|
85 | + protected function generateGlobalBackgroundVariables(): array { |
|
86 | + $backgroundDeleted = $this->config->getAppValue(Application::APP_ID, 'backgroundMime', '') === 'backgroundColor'; |
|
87 | + $hasCustomLogoHeader = $this->util->isLogoThemed(); |
|
88 | + $isDefaultPrimaryBright = $this->util->invertTextColor($this->defaultPrimaryColor); |
|
89 | + |
|
90 | + $variables = []; |
|
91 | + |
|
92 | + // Default last fallback values |
|
93 | + $variables['--image-background-default'] = "url('" . $this->themingDefaults->getBackground() . "')"; |
|
94 | + $variables['--color-background-plain'] = $this->defaultPrimaryColor; |
|
95 | + |
|
96 | + // Register image variables only if custom-defined |
|
97 | + foreach (ImageManager::SUPPORTED_IMAGE_KEYS as $image) { |
|
98 | + if ($this->imageManager->hasImage($image)) { |
|
99 | + $imageUrl = $this->imageManager->getImageUrl($image); |
|
100 | + // --image-background is overridden by user theming |
|
101 | + $variables["--image-$image"] = "url('" . $imageUrl . "')"; |
|
102 | + } |
|
103 | + } |
|
104 | + |
|
105 | + // If primary as background has been request or if we have a custom primary colour |
|
106 | + // let's not define the background image |
|
107 | + if ($backgroundDeleted) { |
|
108 | + $variables['--color-background-plain'] = $this->defaultPrimaryColor; |
|
109 | + $variables['--image-background-plain'] = 'yes'; |
|
110 | + $variables['--image-background'] = 'no'; |
|
111 | + // If no background image is set, we need to check against the shown primary colour |
|
112 | + $variables['--background-image-invert-if-bright'] = $isDefaultPrimaryBright ? 'invert(100%)' : 'no'; |
|
113 | + } |
|
114 | + |
|
115 | + if ($hasCustomLogoHeader) { |
|
116 | + $variables['--image-logoheader-custom'] = 'true'; |
|
117 | + } |
|
118 | + |
|
119 | + return $variables; |
|
120 | + } |
|
121 | + |
|
122 | + /** |
|
123 | + * Generate user theming background-related variables |
|
124 | + */ |
|
125 | + protected function generateUserBackgroundVariables(): array { |
|
126 | + $user = $this->userSession->getUser(); |
|
127 | + if ($user !== null |
|
128 | + && !$this->themingDefaults->isUserThemingDisabled() |
|
129 | + && $this->appManager->isEnabledForUser(Application::APP_ID)) { |
|
130 | + $backgroundImage = $this->config->getUserValue($user->getUID(), Application::APP_ID, 'background_image', BackgroundService::BACKGROUND_DEFAULT); |
|
131 | + $currentVersion = (int)$this->config->getUserValue($user->getUID(), Application::APP_ID, 'userCacheBuster', '0'); |
|
132 | + $isPrimaryBright = $this->util->invertTextColor($this->primaryColor); |
|
133 | + |
|
134 | + // The user removed the background |
|
135 | + if ($backgroundImage === BackgroundService::BACKGROUND_DISABLED) { |
|
136 | + return [ |
|
137 | + '--image-background' => 'no', |
|
138 | + '--color-background-plain' => $this->primaryColor, |
|
139 | + // If no background image is set, we need to check against the shown primary colour |
|
140 | + '--background-image-invert-if-bright' => $isPrimaryBright ? 'invert(100%)' : 'no', |
|
141 | + ]; |
|
142 | + } |
|
143 | + |
|
144 | + // The user uploaded a custom background |
|
145 | + if ($backgroundImage === BackgroundService::BACKGROUND_CUSTOM) { |
|
146 | + $cacheBuster = substr(sha1($user->getUID() . '_' . $currentVersion), 0, 8); |
|
147 | + return [ |
|
148 | + '--image-background' => "url('" . $this->urlGenerator->linkToRouteAbsolute('theming.userTheme.getBackground') . "?v=$cacheBuster')", |
|
149 | + '--color-background-plain' => $this->themingDefaults->getColorPrimary(), |
|
150 | + ]; |
|
151 | + } |
|
152 | + |
|
153 | + // The user picked a shipped background |
|
154 | + if (isset(BackgroundService::SHIPPED_BACKGROUNDS[$backgroundImage])) { |
|
155 | + return [ |
|
156 | + '--image-background' => "url('" . $this->urlGenerator->linkTo(Application::APP_ID, "img/background/$backgroundImage") . "')", |
|
157 | + '--color-background-plain' => $this->themingDefaults->getColorPrimary(), |
|
158 | + '--background-image-invert-if-bright' => BackgroundService::SHIPPED_BACKGROUNDS[$backgroundImage]['theming'] ?? null === BackgroundService::THEMING_MODE_DARK ? 'invert(100%)' : 'no', |
|
159 | + ]; |
|
160 | + } |
|
161 | + } |
|
162 | + |
|
163 | + return []; |
|
164 | + } |
|
165 | 165 | } |
@@ -90,7 +90,7 @@ discard block |
||
90 | 90 | $variables = []; |
91 | 91 | |
92 | 92 | // Default last fallback values |
93 | - $variables['--image-background-default'] = "url('" . $this->themingDefaults->getBackground() . "')"; |
|
93 | + $variables['--image-background-default'] = "url('".$this->themingDefaults->getBackground()."')"; |
|
94 | 94 | $variables['--color-background-plain'] = $this->defaultPrimaryColor; |
95 | 95 | |
96 | 96 | // Register image variables only if custom-defined |
@@ -98,7 +98,7 @@ discard block |
||
98 | 98 | if ($this->imageManager->hasImage($image)) { |
99 | 99 | $imageUrl = $this->imageManager->getImageUrl($image); |
100 | 100 | // --image-background is overridden by user theming |
101 | - $variables["--image-$image"] = "url('" . $imageUrl . "')"; |
|
101 | + $variables["--image-$image"] = "url('".$imageUrl."')"; |
|
102 | 102 | } |
103 | 103 | } |
104 | 104 | |
@@ -128,7 +128,7 @@ discard block |
||
128 | 128 | && !$this->themingDefaults->isUserThemingDisabled() |
129 | 129 | && $this->appManager->isEnabledForUser(Application::APP_ID)) { |
130 | 130 | $backgroundImage = $this->config->getUserValue($user->getUID(), Application::APP_ID, 'background_image', BackgroundService::BACKGROUND_DEFAULT); |
131 | - $currentVersion = (int)$this->config->getUserValue($user->getUID(), Application::APP_ID, 'userCacheBuster', '0'); |
|
131 | + $currentVersion = (int) $this->config->getUserValue($user->getUID(), Application::APP_ID, 'userCacheBuster', '0'); |
|
132 | 132 | $isPrimaryBright = $this->util->invertTextColor($this->primaryColor); |
133 | 133 | |
134 | 134 | // The user removed the background |
@@ -143,9 +143,9 @@ discard block |
||
143 | 143 | |
144 | 144 | // The user uploaded a custom background |
145 | 145 | if ($backgroundImage === BackgroundService::BACKGROUND_CUSTOM) { |
146 | - $cacheBuster = substr(sha1($user->getUID() . '_' . $currentVersion), 0, 8); |
|
146 | + $cacheBuster = substr(sha1($user->getUID().'_'.$currentVersion), 0, 8); |
|
147 | 147 | return [ |
148 | - '--image-background' => "url('" . $this->urlGenerator->linkToRouteAbsolute('theming.userTheme.getBackground') . "?v=$cacheBuster')", |
|
148 | + '--image-background' => "url('".$this->urlGenerator->linkToRouteAbsolute('theming.userTheme.getBackground')."?v=$cacheBuster')", |
|
149 | 149 | '--color-background-plain' => $this->themingDefaults->getColorPrimary(), |
150 | 150 | ]; |
151 | 151 | } |
@@ -153,7 +153,7 @@ discard block |
||
153 | 153 | // The user picked a shipped background |
154 | 154 | if (isset(BackgroundService::SHIPPED_BACKGROUNDS[$backgroundImage])) { |
155 | 155 | return [ |
156 | - '--image-background' => "url('" . $this->urlGenerator->linkTo(Application::APP_ID, "img/background/$backgroundImage") . "')", |
|
156 | + '--image-background' => "url('".$this->urlGenerator->linkTo(Application::APP_ID, "img/background/$backgroundImage")."')", |
|
157 | 157 | '--color-background-plain' => $this->themingDefaults->getColorPrimary(), |
158 | 158 | '--background-image-invert-if-bright' => BackgroundService::SHIPPED_BACKGROUNDS[$backgroundImage]['theming'] ?? null === BackgroundService::THEMING_MODE_DARK ? 'invert(100%)' : 'no', |
159 | 159 | ]; |