PluginProbe
Darkify – Dark Mode & Night Mode for Website & Admin (Dark Theme Included) / 1.4.6
Darkify – Dark Mode & Night Mode for Website & Admin (Dark Theme Included) v1.4.6
2.1.3 2.1.2 2.1.1 2.1.0 2.0.4 2.0.3 2.0.2 2.0.1 2.0.0 1.5.5 1.5.4 1.5.3 1.5.2 1.5.1 1.5.0 trunk 1.0.1 1.1.0 1.2.0 1.2.1 1.2.2 1.2.3 1.2.4 1.2.5 1.3.0 All 57 releases
← All changes | src/Admin/Views/Control.php +133 -200 2.0.01.4.6 View file →
@@ -1,8 +1,8 @@
1 1 <?php
2 2
3 3 /**
4 - * Control class for Control options.
4 + * Views class for Shortcode generator options.
5 5 *
6 6 * @link https://themeatelier.net
7 7 * @since 1.0.0
8 8 *
@@ -12,9 +12,9 @@
12 12 */
13 13
14 14 namespace ThemeAtelier\Darkify\Admin\Views;
15 15
16 -use ThemeAtelier\Darkify\Admin\Schema\SchemaRegistry as Darkify;
16 +use ThemeAtelier\Darkify\Admin\Framework\Classes\Darkify;
17 17
18 18 class Control
19 19 {
20 20 /**
@@ -27,9 +27,9 @@
27 27 {
28 28 Darkify::createSection(
29 29 $prefix,
30 30 array(
31 - 'title' => esc_html__('Controls', 'darkify'),
31 + 'title' => esc_html__('CONTROLS', 'darkify'),
32 32 'icon' => 'icofont-ui-settings',
33 33 'fields' => array(
34 34 array(
35 35 'type' => 'section_tab',
@@ -38,109 +38,63 @@
38 38 array(
39 39 'title' => esc_html__('Frontend', 'darkify'),
40 40 'icon' => 'icofont-computer',
41 41 'fields' => array(
42 - // Intro line with a docs link, rendered plain above the section cards.
43 42 array(
44 - 'type' => 'page_hint',
45 - 'content' => sprintf(
46 - /* translators: %s: documentation link */
47 - __('Decide how and when dark mode turns on for visitors on your public website. %s', 'darkify'),
48 - '<a href="https://darkifywp.com/docs/" target="_blank" rel="noopener noreferrer">' . esc_html__('View documentation', 'darkify') . '</a>'
49 - ),
43 + 'type' => 'heading',
44 + 'content' => esc_html__('Basic Control', 'darkify'),
50 45 ),
51 -
52 - // ===== AVAILABILITY =====
53 46 array(
54 - 'type' => 'heading',
55 - 'title' => esc_html__('Availability', 'darkify'),
56 - 'section_start' => true,
57 - ),
58 - array(
59 47 'id' => 'enable_dark_mode_switch',
60 48 'type' => 'switcher',
61 - 'title' => esc_html__('Frontend Dark Mode', 'darkify'),
62 - 'title_help' => '<div class="darkify-info-label">' .
63 - __('Show the dark mode floating switch on your website frontend. This is the master control for everything below.', 'darkify') .
64 - '</div>' . '' . '',
49 + 'title' => esc_html__('Frontend Dark Mode', 'darkify'),
50 + 'title_help' => '<div class="darkify-info-label">' . __('Show the dark mode floating switch in your Website\'s frontend.', 'darkify') . '</div><a class="tooltip_btn_primary" href="https://darkifywp.com/controls/" target="_blank">' . __('Live Demo', 'darkify') . '</a><a class="tooltip_btn_secondary" href="https://docs.themeatelier.net/docs/darkify-pro/darkify-settings/control/" target="_blank">' . __('Open Docs', 'darkify') . '</a>',
65 51 'text_on' => esc_html__('Enabled', 'darkify'),
66 52 'text_off' => esc_html__('Disabled', 'darkify'),
67 53 'text_width' => 100,
68 54 'default' => true,
69 - // Commit instantly (master toggle governs the whole frontend feature).
70 - 'auto_save' => true,
71 55 ),
72 56 array(
73 57 'id' => 'enable_default_dark_mode',
74 58 'type' => 'switcher',
75 - 'title' => esc_html__('Default Dark Mode', 'darkify'),
76 - 'title_help' =>
77 - '<div class="darkify-info-label">' .
78 - __('Enable dark mode by default on your website.', 'darkify') .
79 - '</div>' .
80 - '' .
81 - '',
82 - 'text_on' => esc_html__('Enabled', 'darkify'),
83 - 'text_off' => esc_html__('Disabled', 'darkify'),
59 + 'title' => esc_html__('Default Dark Mode', 'darkify'),
60 + 'title_help' => '<div class="darkify-info-label">' . __('Automatically turn your website dark by default.', 'darkify') . '</div>',
61 + 'text_on' => esc_html__('Enabled', 'darkify'),
62 + 'text_off' => esc_html__('Disabled', 'darkify'),
84 63 'text_width' => 100,
85 - // Commit instantly (the priority notice depends on it, which would
86 - // otherwise force the manual-Save workflow).
87 - 'auto_save' => true,
64 + // 'title_video' => '<div class="darkify-img-tag">
65 + // <video autoplay loop muted playsinline>
66 + // <source src="https://plugins.svn.wordpress.org/darkify/assets/video/os-aware-darkmode.webm" type="video/webm">
67 + // </video>
68 + // </div><div class="darkify-info-label">Auto Convert Dropdowns to Button</div>',
88 69 ),
89 70 array(
90 71 'id' => 'enable_os_aware',
91 72 'type' => 'switcher',
92 - 'title' => esc_html__('OS Aware Dark Mode', 'darkify'),
93 - 'title_help' =>
94 - '<div class="darkify-info-label">' .
95 - __('Toggle dark mode based on the user’s device or operating system preference.', 'darkify') .
96 - '</div>' .
97 - '' .
98 - '',
99 - 'text_on' => esc_html__('Enabled', 'darkify'),
100 - 'text_off' => esc_html__('Disabled', 'darkify'),
73 + 'title' => esc_html__('OS Aware Dark Mode', 'darkify'),
74 + 'title_video' => '<div class="darkify-img-tag">
75 + <video autoplay loop muted playsinline>
76 + <source src="https://plugins.svn.wordpress.org/darkify/assets/videos/os-aware-darkmode.webm" type="video/webm">
77 + </video>
78 + </div><div class="darkify-info-label">Dark Mode toggling based on OS setting</div>',
79 + 'text_on' => esc_html__('Enabled', 'darkify'),
80 + 'text_off' => esc_html__('Disabled', 'darkify'),
101 81 'text_width' => 100,
102 82 'default' => true,
103 - // Commit instantly (the priority notice depends on it).
104 - 'auto_save' => true,
105 83 ),
106 - // Priority notice: shown only when Default Dark Mode AND OS Aware are both on.
107 84 array(
108 - 'type' => 'submessage',
109 - 'style' => 'info',
110 - 'content' => '<strong>' . esc_html__('OS Aware takes priority.', 'darkify') . '</strong> ' . esc_html__('Both are on, so visitors following the system “dark” setting get dark mode automatically; Default Dark Mode applies only when no system preference is detected.', 'darkify'),
111 - 'dependency' => array('enable_default_dark_mode|enable_os_aware', '==|==', 'true|true'),
112 - ),
113 -
114 - // ===== ACTIVATION =====
115 - array(
116 - 'type' => 'heading',
117 - 'title' => esc_html__('Activation', 'darkify'),
118 - 'section_start' => true,
119 - ),
120 - array(
121 85 'id' => 'enable_keyboard_shortcut',
122 86 'type' => 'switcher',
123 - 'title' => esc_html__('Keyboard Shortcut', 'darkify'),
124 - 'title_help' =>
125 - '<div class="darkify-info-label">' .
126 - __('Let visitors toggle dark mode with a keyboard shortcut.', 'darkify') .
127 - '</div>' .
128 - '' .
129 - '',
130 - 'text_on' => esc_html__('Enabled', 'darkify'),
131 - 'text_off' => esc_html__('Disabled', 'darkify'),
87 + 'title' => esc_html__('Keyboard Shortcut', 'darkify'),
88 + 'title_help' => '<div class="darkify-info-label">' . __('Enable to dark mode by pressing Ctrl+Alt+D on windows keyboard & Ctrl+Opt|Start+D on mac.', 'darkify') . '</div>',
89 + 'text_on' => esc_html__('Enabled', 'darkify'),
90 + 'text_off' => esc_html__('Disabled', 'darkify'),
132 91 'text_width' => 100,
133 92 'default' => true,
134 - // Commit instantly (the shortcut-keys field depends on it).
135 - 'auto_save' => true,
136 93 ),
137 - // Editable shortcut combo (shown when the shortcut is enabled).
138 94 array(
139 - 'id' => 'keyboard_shortcut_keys',
140 - 'type' => 'keyboard_shortcut',
141 - 'default' => 'ctrl+alt+d',
142 - 'dependency' => array('enable_keyboard_shortcut', '==', 'true'),
95 + 'type' => 'heading',
96 + 'title' => esc_html__('Advanced Control', 'darkify'),
143 97 ),
144 98 // Enable Time Based Auto Dark Mode
145 99 array(
146 100 'id' => 'enable_time',
@@ -149,56 +103,113 @@
149 103 array(
150 104 'id' => 'enable_time_based_dark',
151 105 'type' => 'switcher',
152 106 'title' => esc_html__('Time Based Auto Dark Mode', 'darkify'),
153 - 'title_help' =>
154 - '<div class="darkify-info-label">' .
155 - __('Automatically enable dark mode based on the user’s local time.', 'darkify') .
156 - '</div>' .
157 - '' .
158 - '',
159 - 'text_on' => esc_html__('Enabled', 'darkify'),
160 - 'text_off' => esc_html__('Disabled', 'darkify'),
107 + 'title_help' => '<div class="darkify-info-label">' . __('Automatically turn dark mode ON based on users’ localtime.', 'darkify') . '</div>',
108 + 'text_on' => esc_html__('Enabled', 'darkify'),
109 + 'text_off' => esc_html__('Disabled', 'darkify'),
161 110 'text_width' => 100,
162 111 ),
163 112 array(
164 - 'id' => 'enable_time_fields',
165 - 'type' => 'fieldset',
166 - 'class' => 'enable_time_fields',
113 + 'id' => 'time_based_dark_start',
114 + 'type' => 'datetime',
115 + 'title' => esc_html__('Pick a Time', 'darkify'),
116 + 'from_to' => true,
117 + 'text_from' => esc_html__('Form', 'darkify'),
118 + 'text_to' => esc_html__('To', 'darkify'),
119 + 'settings' => array(
120 + 'noCalendar' => true,
121 + 'enableTime' => true,
122 + 'dateFormat' => 'H:i',
123 + 'time_24hr' => false,
124 + ),
167 125 'dependency' => array('enable_time_based_dark', '==', 'true'),
168 - 'title' => esc_html__('Pick a Time', 'darkify'),
169 - 'title_help' =>
170 - '<div class="darkify-info-label">' .
171 - __('Set the exact start and end times when dark mode should be automatically enabled or disabled.', 'darkify') .
172 - '</div>' .
173 - '' .
174 - '',
126 + ),
127 + ),
128 + ),
129 + array(
130 + 'id' => 'hide_on_desktop',
131 + 'type' => 'switcher',
132 + 'title' => esc_html__('Hide Dark Mode Switch On Desktop', 'darkify'),
133 + 'title_help' => '<div class="darkify-info-label">' . __('Hide the Dark Mode Floating Switch if users’ are using desktop or laptop.', 'darkify') . '</div>',
134 + 'text_on' => esc_html__('Yes', 'darkify'),
135 + 'text_off' => esc_html__('No', 'darkify'),
136 + ),
137 + array(
138 + 'id' => 'hide_on_mobile',
139 + 'type' => 'fieldset',
140 + 'fields' => array(
141 + array(
142 + 'id' => 'hide_dark_mode_on_mobile',
143 + 'type' => 'switcher',
144 + 'title' => esc_html__('Hide Dark Mode On Mobile', 'darkify'),
145 + 'title_help' => '<div class="darkify-info-label">' . __('Hide the Dark Mode Floating Switch if users’ are using mobile.', 'darkify') . '</div>',
146 + 'text_on' => esc_html__('Yes', 'darkify'),
147 + 'text_off' => esc_html__('No', 'darkify'),
148 + ),
149 + array(
150 + 'id' => 'type_of_hide_by',
151 + 'type' => 'button_set',
152 + 'title' => esc_html__('Hide By', 'darkify'),
153 + 'options' => array(
154 + 'user_agent' => esc_html__('User Agent', 'darkify'),
155 + 'screen_size' => esc_html__('Screen Size', 'darkify'),
156 + 'both' => esc_html__('Both', 'darkify'),
157 + ),
158 + 'default' => 'both',
159 + 'dependency' => array('hide_dark_mode_on_mobile', '==', 'true'),
160 + ),
161 + ),
162 + ),
163 + array(
164 + 'id' => 'show_in_menu',
165 + 'type' => 'fieldset',
166 + 'fields' => array(
167 + array(
168 + 'id' => 'enable_switch_in_menu',
169 + 'type' => 'switcher',
170 + 'title' => esc_html__('Show Switch In Menu', 'darkify'),
171 + 'title_help' => '<div class="darkify-info-label">' . __('Show the dark mode toggle switch in specific menu.', 'darkify') . '</div>',
172 + 'text_on' => esc_html__('Yes', 'darkify'),
173 + 'text_off' => esc_html__('No', 'darkify'),
174 + ),
175 + array(
176 + 'id' => 'select_menus',
177 + 'type' => 'group',
178 + 'title' => esc_html__('Select Menus', 'darkify'),
179 + 'accordion_title_number' => true,
180 + 'accordion_title_auto' => true,
181 + 'class' => 'select_menus',
182 + 'max' => '1',
183 + 'add_more_text' => __('Want to use switch in unlimited number of menus? <a target="_blank" href="https://darkifywp.com/pricing/?ref=1"><b>Upgrade To Pro!</b></a>', 'darkify'),
175 184 'fields' => array(
176 185 array(
177 - 'id' => 'time_based_dark_start',
178 - 'type' => 'datetime',
179 - 'after' => esc_html__('From', 'darkify'),
180 - 'placeholder' => esc_html__('From', 'darkify'),
181 - 'settings' => array(
182 - 'noCalendar' => true,
183 - 'enableTime' => true,
184 - 'dateFormat' => 'H:i',
185 - 'time_24hr' => false,
186 - ),
186 + 'id' => 'switch_in_menu_location',
187 + 'type' => 'select',
188 + 'class' => 'select_menu_location',
189 + 'title' => esc_html__('Select Menu', 'darkify'),
190 + 'options' => 'menus',
191 + 'empty_message' => esc_html__('You haven\'t created a menu yet. If you\'re using an FSE theme, copy the shortcode below and paste it where you want the switch to appear.', 'darkify'),
187 192 ),
188 193 array(
189 - 'id' => 'time_based_dark_end',
190 - 'type' => 'datetime',
191 - 'after' => esc_html__('To', 'darkify'),
192 - 'placeholder' => esc_html__('To', 'darkify'),
193 - 'settings' => array(
194 - 'noCalendar' => true,
195 - 'enableTime' => true,
196 - 'dateFormat' => 'H:i',
197 - 'time_24hr' => false,
194 + 'id' => 'darkify_menu_shortcode_helper',
195 + 'type' => 'textarea',
196 + 'title' => esc_html__('Shortcode To Add On Menu', 'darkify'),
197 + 'title_help' => '<div class="darkify-info-label">' . __('You can change shortcode options value based on your pereference.', 'darkify') . '</div>',
198 + 'default' => '[darkify switch="1" width="60px" height="60px" icon_size="40px" light_mode_bg="#121116" dark_mode_bg="#ffffff" light_mode_color="#ffffff" dark_mode_color="#121116" border="0px" border_light_color="#121119" border_dark_color="#ffffff" border_radius="7px"]'
199 + ),
200 + array(
201 + 'id' => 'select_menu_position',
202 + 'type' => 'button_set',
203 + 'title' => esc_html__('Select Menu Position', 'darkify'),
204 + 'options' => array(
205 + 'after' => esc_html__('After', 'darkify'),
206 + 'before' => esc_html__('Before', 'darkify'),
198 207 ),
208 + 'default' => 'after',
199 209 ),
200 210 ),
211 + 'dependency' => array('enable_switch_in_menu', '==', 'true'),
201 212 ),
202 213 ),
203 214 ),
204 215 ),
@@ -206,108 +217,30 @@
206 217 array(
207 218 'title' => esc_html__('Admin', 'darkify'),
208 219 'icon' => 'icofont-dashboard-web',
209 220 'fields' => array(
210 - // Intro line with a docs link, rendered plain above the section cards.
221 +
211 222 array(
212 - 'type' => 'page_hint',
213 - 'content' => sprintf(
214 - /* translators: %s: documentation link */
215 - __('Bring dark mode to the WordPress admin dashboard and editors. %s', 'darkify'),
216 - '<a href="https://darkifywp.com/docs/" target="_blank" rel="noopener noreferrer">' . esc_html__('View documentation', 'darkify') . '</a>'
217 - ),
218 - ),
219 - // ===== ADMIN APPEARANCE =====
220 - array(
221 - 'type' => 'heading',
222 - 'title' => esc_html__('Admin Appearance', 'darkify'),
223 - 'section_start' => true,
224 - ),
225 - array(
226 223 'id' => 'enable_admin_panel_dark_mode',
227 224 'type' => 'switcher',
228 - 'title' => esc_html__('Admin Panel Dark Mode', 'darkify'),
229 - 'title_help' =>
230 - '<div class="darkify-info-label">' .
231 - __('Enable dark mode in the WordPress admin dashboard.', 'darkify') .
232 - '</div>' .
233 - '' .
234 - '',
235 - 'text_on' => esc_html__('Enabled', 'darkify'),
236 - 'text_off' => esc_html__('Disabled', 'darkify'),
237 - 'default' => false,
238 - 'text_width' => 100,
239 - // Commit instantly even though other fields depend on it.
240 - 'auto_save' => true,
241 - ),
242 -
243 - array(
244 - 'id' => 'block_editor_dark_mode',
245 - 'type' => 'switcher',
246 - 'title' => esc_html__('Block Editor Dark Mode', 'darkify'),
247 - 'title_help' =>
248 - '<div class="darkify-info-label">' .
249 - __('Enable the dark mode switch in the block editor to toggle between dark and light mode.', 'darkify') .
250 - '</div>' .
251 - '' .
252 - '',
253 - 'text_on' => esc_html__('Enabled', 'darkify'),
254 - 'text_off' => esc_html__('Disabled', 'darkify'),
225 + 'title' => esc_html__('Admin Panel Dark Mode', 'darkify'),
226 + 'title_help' => '<div class="darkify-info-label">' . __('Switch to enable Dark Mode in WordPress Admin Panel.', 'darkify') . '</div><a class="tooltip_btn_primary" href="https://darkifywp.com/controls/" target="_blank">' . __('Live Demo', 'darkify') . '</a><a class="tooltip_btn_secondary" href="https://docs.themeatelier.net/docs/darkify-pro/darkify-settings/controls/#admin_controls" target="_blank">' . __('Open Docs', 'darkify') . '</a>',
255 227 'default' => false,
228 + 'text_on' => esc_html__('Enabled', 'darkify'),
229 + 'text_off' => esc_html__('Disabled', 'darkify'),
256 230 'text_width' => 100,
257 231 ),
258 - array(
259 - 'id' => 'classic_editor_dark_mode',
260 - 'type' => 'switcher',
261 - 'title' => esc_html__('Classic Editor Dark Mode', 'darkify'),
262 - 'title_help' =>
263 - '<div class="darkify-info-label">' .
264 - __('Enable the dark mode switch in the classic editor to toggle between dark and light modes.', 'darkify') .
265 - '</div>' .
266 - '' .
267 - '',
268 - 'text_on' => esc_html__('Enabled', 'darkify'),
269 - 'text_off' => esc_html__('Disabled', 'darkify'),
270 232
271 - 'default' => false,
272 - 'text_width' => 100,
273 - ),
274 -
275 - // ===== SCOPE & CUSTOMIZATION =====
276 233 array(
277 - 'type' => 'heading',
278 - 'title' => esc_html__('Scope & Customization', 'darkify'),
279 - 'section_start' => true,
280 - 'dependency' => array('enable_admin_panel_dark_mode', '==', 'true'),
281 - ),
282 - array(
283 234 'id' => 'disallowed_admin_pages',
284 235 'type' => 'textarea',
285 - 'title' => esc_html__('Disallowed Pages', 'darkify'),
286 - 'title_help' => '<div class="darkify-info-text">' .
287 - __('If an admin page URL looks like http://example.com/wp-admin/admin.php?page=darkify, then "darkify" is the page slug.', 'darkify') .
288 - '</div>' .
289 - '' .
290 - '',
291 - 'placeholder' => esc_html__('Enter comma-separated page slugs. Example: darkify-dashboard, elementor', 'darkify'),
236 + 'title' => esc_html__('Disallowed Pages', 'darkify'),
237 + 'title_help' => '<div class="darkify-info-label">' . __('If the admin page URL is like http://example.com/wp-admin/admin.php?page=darkify then darkify is it\'s page slug.', 'darkify') . '</div>',
238 + 'placeholder' => esc_html__('Enter comma separated page slugs. Example: darkify-dashboard, elementor', 'darkify'),
292 239 'dependency' => array('enable_admin_panel_dark_mode', '==', 'true'),
293 240 'class' => 'only_pro'
294 241 ),
295 - array(
296 - 'id' => 'admin_custom_css',
297 - 'type' => 'code_editor',
298 - 'title' => esc_html__('Admin Dark Mode CSS', 'darkify'),
299 - 'title_help' =>
300 - '<div class="darkify-info-label">' .
301 - __('The CSS code will only be applied when admin dark mode is active.', 'darkify') .
302 - '</div>',
303 - 'settings' => array(
304 - 'theme' => 'mbo',
305 - 'mode' => 'css',
306 - ),
307 - // Only relevant when admin dark mode is active — hide it while off.
308 - 'dependency' => array('enable_admin_panel_dark_mode', '==', 'true'),
309 - ),
242 +
310 243 ),
311 244 ),
312 245 ),
313 246 ),