PluginProbe
MaxButtons – Create buttons / 6.28
MaxButtons – Create buttons v6.28
6.23 6.24 6.25 6.26 6.26.1 6.27 6.28 6.3 6.4 6.5 6.6 6.7 6.8 6.9 7.0 7.1 7.1.1 7.1.2 7.1.3 7.10 7.11 7.13 7.13.1 7.13.2 7.13.3 All 100 releases
← All changes | blocks/responsive.php +306 -110 6.56.28 View file →
@@ -1,5 +1,6 @@
1 1 <?php
2 +namespace MaxButtons;
2 3 defined('ABSPATH') or die('No direct access permitted');
3 4 $blockClass["responsive"] = "responsiveBlock";
4 5 $blockOrder[90][] = "responsive";
5 6
@@ -9,15 +10,13 @@
9 10 protected $fields = array("options" => '',
10 11 "auto_responsive" => array("default" => 0),
11 12 "media_query" => array("default" => array()
12 13 ),
13 -
14 -
15 -
14 +
16 15 );
17 16 // multifields for manual conversion // define +/- the same as normal fields.
18 17 // to find solution in parsing stuff back to button.
19 - protected $multi_fields = array("mq_button_width" => array("default" => 0,
18 + protected $multi_fields = array("mq_button_width" => array("default" => '0',
20 19 "css" => "width",
21 20 "csspseudo" => "responsive",
22 21
23 22 ),
@@ -24,8 +23,17 @@
24 23 "mq_button_width_unit" => array("default" => 'px',
25 24 "css" => "width_unit",
26 25 "csspseudo" => "responsive",
27 26 ),
27 + "mq_button_height" => array("default" => '0',
28 + "css" => "height",
29 + "csspseudo" => "responsive",
30 +
31 + ),
32 + "mq_button_height_unit" => array("default" => 'px',
33 + "css" => "height_unit",
34 + "csspseudo" => "responsive",
35 + ),
28 36 "mq_container_width" => array("default" => 0,
29 37 "css" => "width",
30 38 "csspart" => "mb-container",
31 39 "csspseudo" => "responsive",
@@ -68,10 +76,8 @@
68 76 return $css;
69 77
70 78 $data = $this->data[$this->blockname];
71 79
72 -
73 -
74 80 if (isset($data["auto_responsive"]) && $data["auto_responsive"] == 1)
75 81 { // generate auto_rules for responsive.
76 82 $css["maxbutton"]["responsive"]["phone"][0]["width"] = "90%";
77 83 $css["mb-container"]["responsive"]["phone"][0]["width"] = "90%";
@@ -108,9 +114,9 @@
108 114 else
109 115 {
110 116 foreach($csspart as $j => $part)
111 117 {
112 -
118 + $part = trim($part); // spaces in array
113 119 $css[$part]["responsive"][$query][$i][$css_stat] = $value;
114 120 }
115 121
116 122 /* }
@@ -125,9 +131,8 @@
125 131 $i++;
126 132 endforeach;
127 133
128 134 endforeach;
129 -
130 135 return $css;
131 136 }
132 137
133 138
@@ -208,150 +213,344 @@
208 213 $names_used = array_intersect_key($media_names,$fk);
209 214 $media_query = array_merge($names_used,$media_query);
210 215
211 216 ?>
217 + <script type='text/javascript'>
218 + var responsiveMap = '<?php echo json_encode($this->multi_fields); ?>';
219 + </script>
220 +
212 221 <div class="mb_tab option-container">
213 222 <div class="title"><?php _e('Responsive Settings', 'maxbuttons') ?></div>
214 - <div class="inside">
223 + <div class="inside responsive">
215 224
216 225 <div class="option-design">
217 226 <p class="note"><?php _e("Responsive settings let you decide the behavior of the button on different devices and screen sizes. For instance large buttons on small screens.","maxbuttons") ?></p>
218 - <label for='auto_responsive'><?php _e("Auto Responsive", 'maxbuttons') ?> <?php _e("(Experimental)","maxbuttons") ?></label>
227 + <?php
228 + $auto = new maxField('switch');
229 + $auto->label = __('Auto Responsive (experimental)', 'maxinbound');
230 + $auto->name = 'auto_responsive';
231 + $auto->id = $auto->name;
232 + $auto->value = '1';
233 + $auto->checked = checked($auto_responsive, 1, false);
234 + $auto->output ('start','end');
235 + ?>
219 236
220 - <div class="input checkbox">
221 - <input type='checkbox' id='auto_responsive' name='auto_responsive' value='1' <?php checked(1, $auto_responsive); ?> >
222 - </div>
223 -
224 237 <div class="clear"></div>
225 238 <p class="note"><strong><?php _e("Note:","maxbuttons"); ?> </strong><?php _e(" Auto responsive settings will take a guess only on small screens. To control your responsive settings uncheck this button. This will show more options.","maxbuttons"); ?></p>
226 239 </div>
227 240
228 -
241 +
242 + <div class="option-design new-query">
243 + <label for='new_query'><?php _e('New Query', 'maxbuttons') ?></label>
244 +
245 + <div class="input">
246 + <select name="new_query" id="new_query">
247 + <?php
248 +
249 + foreach ($media_names as $key => $val):
250 + $disabled = isset($media_query[$key]) && $key !== 'custom' ? ' DISABLED ' : '';
251 + ?>
252 + <option value="<?php echo $key ?>" <?php echo $disabled ?> ><?php echo $val ?></option>
253 +
254 +
255 + <?php endforeach; ?>
256 + </select>
257 + <?php //echo maxUtils::selectify("new_query",$media_names,'' ); ?>
258 + <a href='javascript:void(0)' class="button add_media_query"><?php _e("Add","maxbuttons") ?></a>
259 + </div>
260 +
261 +
262 + <div class="clear"></div>
263 + </div> <!-- option design -->
264 +
229 265 <div class='option-design media_queries_options'>
230 266 <?php
231 267 $i = 0 ;
232 268 foreach($media_query as $item => $data):
233 269 foreach ($data as $index => $fields):
234 -
270 +
271 + if (! isset($fields['mq_hide']))
272 + $fields['mq_hide'] = 0;
273 +
274 + $condition = array('target' => 'mq_hide[' . $i . ']', 'values' => 'unchecked');
275 + $show_conditional = htmlentities(json_encode($condition));
276 +
235 277 ?>
236 - <div class='media_query' data-query="<?php echo $item ?>">
237 - <span class='removebutton'><img src="<?php echo MB()->get_plugin_url() ?>/assets/icons/remove.png"></span>
278 + <div class='media_query' data-query="<?php echo $item ?>" data-id="<?php echo $i ?>">
279 + <span class='removebutton dashicons dashicons-no'></span>
238 280
239 281 <input type="hidden" name="media_query[<?php echo $i ?>]" value="<?php echo $item ?>">
240 282 <label class='title'><?php echo $media_names[$item] ?></label>
241 283 <p class='description'><?php echo $media_desc[$item] ?></p>
242 284 <?php
243 - if ($item == "custom") { $custom_class = ''; } else { $custom_class = 'hidden'; }
244 -
245 - ?>
246 - <div class="custom" <?php echo $custom_class ?> >
247 - <div class="label"><?php _e("Min width","maxbuttons") ?></div>
248 - <div class="input"><input type="text" class="tiny" name="mq_custom_minwidth[<?php echo $i ?>]" value="<?php echo $fields["mq_custom_minwidth"] ?>" />px</div>
249 -
250 - <div class="label max"> <?php _e("Max width","maxbuttons"); ?></div>
251 - <div class="input max"><input type="text" class="tiny" name="mq_custom_maxwidth[<?php echo $i ?>]" value="<?php echo $fields["mq_custom_maxwidth"] ?>" />px</div>
285 + if ($item == "custom") { $custom_class = 'option custom'; } else { $custom_class = 'option custom hidden '; }
252 286
253 -
254 - </div>
287 + $min_width = new maxField('number');
288 + $min_width->id = 'mq_custom_minwidth[' . $i . ']';
289 + $min_width->name= $min_width->id;
290 + $min_width->label = __('Min Width', 'maxbuttons');
291 + $min_width->value = $fields['mq_custom_minwidth'];
292 + $min_width->inputclass = 'small';
293 + $min_width->main_class = $custom_class; // hide label
294 + $min_width->output('start', '');
295 +
255 296
256 - <div class='label'><?php _e("Font size","maxbuttons") ?></div>
257 - <div class='input'><input type='text' name='mq_font_size[<?php echo $i ?>]' class='tiny' value="<?php echo $fields["mq_font_size"] ?>"> <?php echo maxUtils::selectify("mq_font_size_unit[$i]",$units,$fields["mq_font_size_unit"]) ?>
258 - </div>
297 + $max_width = new maxField('number');
298 + $max_width->id = 'mq_custom_maxwidth[' . $i . ']';
299 + $max_width->name = $max_width->id;
300 + $max_width->label = __('Max Width','maxbuttons');
301 + $max_width->value = $fields['mq_custom_maxwidth'];
302 + $max_width->inputclass = 'small';
303 + $max_width->mainclass = $custom_class;
304 + $max_width->output('','end');
259 305
260 - <div class='label'><?php _e("Button width", 'maxbuttons') ?></div>
306 +
307 + $font_size = new maxField('number');
308 + $font_size->id = 'mq_font_size[' . $i . ']';
309 + $font_size->name = $font_size->id;
310 + $font_size->value = $fields['mq_font_size'];
311 + $font_size->label = __('Font Size', 'maxbuttons');
312 + $font_size->min = 0;
313 + $font_size->inputclass = 'tiny';
314 + $font_size->start_conditional = $show_conditional;
315 + $font_size->output('start', '');
316 +
317 + $fsize_unit = new maxField('generic');
318 + $fsize_unit->id = 'mq_font_size_unit[' . $i . ']';
319 + $fsize_unit->name = $fsize_unit->id;
320 + $fsize_unit->value = $fields['mq_font_size_unit'];
321 + $fsize_unit->content = maxUtils::selectify($fsize_unit->id, $units, $fsize_unit->value);
322 + // $fsize_unit->conditional = $show_conditional;
323 + $fsize_unit->output('','end');
324 +
325 + // width
326 + $width = new maxField('number');
327 + $width->id = 'mq_button_width[' . $i . ']';
328 + $width->name = $width->id;
329 + $width->value = $fields['mq_button_width'];
330 + $width->label = __('Button Width', 'maxbuttons');
331 + $width->min = 0;
332 + $width->inputclass = 'tiny';
333 + $width->start_conditional = $show_conditional;
334 + $width->output('start','');
335 +
336 + $width_unit = new maxField('generic');
337 + $width_unit->id = 'mq_button_width_unit[' . $i . ']';
338 + $width_unit->name = $width_unit->id;
339 + $width_unit->value = $fields['mq_button_width_unit'];
340 + $width_unit->content = maxUtils::selectify($width_unit->id, $units, $width_unit->value);
341 + // $width_unit->conditional = $show_conditional;
342 + $width_unit->output('','');
343 +
344 + // height
345 + $height = new maxField('number');
346 + $height->id = 'mq_button_height[' . $i . ']';
347 + $height->name = $height->id;
348 + $height->value = $fields['mq_button_height'];
349 + $height->label = __("Button Height", "maxbuttons");
350 + $height->min = 0;
351 + $height->inputclass = 'tiny';
352 + // $height->conditional = $show_conditional;
353 + $height->output('','');
354 +
355 + $height_unit = new maxField('generic');
356 + $height_unit->id = 'mq_button_height_unit[' . $i . ']';
357 + $height_unit->name = $height_unit->id;
358 + $height_unit->value = $fields['mq_button_height_unit'];
359 + $height_unit->content = maxUtils::selectify($height_unit->id, $units, $height_unit->value);
360 + // $height_unit->conditional = $show_conditional;
361 + $height_unit->output('','end');
362 +
363 + $cwidth = new maxField('number');
364 + $cwidth->id = 'mq_container_width[' . $i . ']';
365 + $cwidth->name = $cwidth->id;
366 + $cwidth->label = __('Container Width', 'maxbuttons');
367 + $cwidth->value = $fields['mq_container_width'];
368 + $cwidth->min = '0';
369 + $cwidth->inputclass = 'tiny';
370 + $cwidth->start_conditional = $show_conditional;
371 + $cwidth->output('start', '');
372 +
373 + $cwidth_unit = new maxField('generic');
374 + $cwidth_unit->id = 'mq_container_width_unit[' . $i . ']';
375 + $cwidth_unit->name = $cwidth_unit->id;
376 + $cwidth_unit->value = $fields['mq_container_width_unit'];
377 + $cwidth_unit->content = maxUtils::selectify($cwidth_unit->id, $units, $cwidth_unit->value);
378 + // $cwidth_unit->conditional = $show_conditional;
379 + $cwidth_unit->output('','end');
380 +
381 + $cfloat = new maxField('generic');
382 + $cfloat->id = 'mq_container_float[' . $i . ']';
383 + $cfloat->name = $cfloat->id;
384 + $cfloat->label = __('Container Float','maxbuttons');
385 + $cfloat->value = $fields['mq_container_float'];
386 + $cfloat->content = maxUtils::selectify($cfloat->id, $container_floats, $cfloat->value);
387 + $cfloat->start_conditional = $show_conditional;
388 + $cfloat->output('start','end');
261 389
262 - <div class='input'><input type='text' name="mq_button_width[<?php echo $i ?>]" value="<?php echo $fields["mq_button_width"] ?>" class='tiny'> <?php echo maxUtils::selectify("mq_button_width_unit[$i]",$units,$fields["mq_button_width_unit"]) ?></div>
263 -
264 - <div class='label'><?php _e("Container width", 'maxbuttons'); ?></div>
265 -
266 - <div class='input'><input type='text' name="mq_container_width[<?php echo $i ?>]" value="<?php echo $fields["mq_container_width"] ?>" class='tiny'> <?php echo maxUtils::selectify("mq_container_width_unit[$i]",$units,$fields["mq_container_width_unit"]); ?>
267 - </div>
268 -
269 - <div class='label'><?php _e("Container float", "maxbuttons"); ?></div>
270 - <div class="input"><?php echo maxUtils::selectify("mq_container_float[$i]",$container_floats, $fields["mq_container_float"]) ?></div>
271 -
272 - <?php $mq_hide = (isset($fields["mq_hide"])) ? $fields["mq_hide"] : ''; ?>
273 - <div class="label"><?php _e("Hide button on this view","maxbuttons"); ?></div>
274 - <div class="input">
275 -
276 - <input type="checkbox" name="mq_hide[<?php echo $i ?>]" value="none" <?php checked('none', $mq_hide ) ?> ></div>
277 - </div>
278 -
279 - <?php
390 + $hide = new maxField('switch');
391 + $hide->id = 'mq_hide[' . $i . ']';
392 + $hide->name = $hide->id;
393 + $hide->value = 'none';
394 + $hide->checked = checked($fields['mq_hide'], $hide->value, false);
395 + $hide->label = __('Hide button in this view','maxbuttons');
396 + $hide->output('start','end');
397 +
398 + /*
399 + $preview = new maxField('button');
400 + $preview->id = 'mq_preview[' . $i . ']';
401 + $preview->inputclass = 'responsive_preview';
402 + $preview->button_label = __('Show in preview','maxbuttons');
403 + $preview->output('', 'end');
404 + */
405 +
280 406 $i++;
281 407 //if ($item != 'custom')
282 408 // unset($media_names[$item]); // remove existing queries from new query selection
409 + ?>
410 + </div> <!-- media query -->
411 + <?php
283 412 endforeach;
284 413 endforeach;
285 414
286 415
287 - ?>
288 -
289 - <div class="new_query_space"></div>
290 - <div class="clear"></div>
291 - <div class="option-design new-query">
292 - <label for='new_query'><?php _e('New Query', 'maxbuttons') ?></label>
293 -
294 - <div class="input">
295 - <select name="new_query" id="new_query">
296 - <?php
297 -
298 - foreach ($media_names as $key => $val):
299 - $disabled = isset($media_query[$key]) && $key !== 'custom' ? ' DISABLED ' : '';
300 - ?>
301 - <option value="<?php echo $key ?>" <?php echo $disabled ?> ><?php echo $val ?></option>
302 -
303 -
304 - <?php endforeach; ?>
305 - </select>
306 - <?php //echo maxUtils::selectify("new_query",$media_names,'' ); ?>
307 - <a href='javascript:void(0)' class="button add_media_query"><?php _e("Add","maxbuttons") ?></a>
308 - </div>
309 -
310 -
311 - <div class="clear"></div>
312 - </div>
313 - </div>
416 + ?>
417 + </div> <!-- option -design -->
418 + <div class="new_query_space"></div>
314 419 </div> <!-- inside -->
315 420
316 421 <input type="hidden" name="next_media_index" value="<?php echo $i ?>" >
422 +
317 423 <div class='media_option_prot'>
318 424
319 425 <div class='media_query' data-query=''>
320 - <span class='removebutton'><img src="<?php echo MB()->get_plugin_url() ?>assets/icons/remove.png"></span>
426 + <span class='removebutton dashicons dashicons-no'></span>
321 427
322 428 <input type="hidden" name="media_query[]" value="">
323 429 <label class='title'></label>
324 - <p class='description'>Description here</p>
430 + <p class='description'>&nbsp;</p>
431 + <?php
432 + $custom_class = 'option hidden custom';
433 + $condition = array('target' => 'mq_hide[]', 'values' => 'unchecked');
434 + $show_conditional = htmlentities(json_encode($condition));
435 +
436 + $min_width = new maxField('number');
437 + $min_width->id = 'mq_custom_minwidth[]';
438 + $min_width->name= $min_width->id;
439 + $min_width->label = __('Min Width', 'maxbuttons');
440 + // $min_width->value = $fields['mq_custom_minwidth'];
441 + $min_width->inputclass = 'small';
442 + $min_width->main_class = $custom_class; // hide label
443 + $min_width->output('start', '');
444 +
445 + $max_width = new maxField('number');
446 + $max_width->id = 'mq_custom_maxwidth[]';
447 + $max_width->name = $max_width->id;
448 + $max_width->label = __('Max Width','maxbuttons');
449 + // $max_width->value = $fields['mq_custom_maxwidth'];
450 + $max_width->inputclass = 'small';
451 + $max_width->mainclass = $custom_class;
452 + $max_width->output('','end');
325 453
326 - <div class="custom">
327 - <div class="label"><?php _e("Min width","maxbuttons") ?></div>
328 - <div class="input"><input type="text" class="tiny" name="mq_custom_minwidth[]" value="0" />px</div>
329 -
330 - <div class="label max"> <?php _e("Max width","maxbuttons"); ?></div>
331 - <div class="input max"><input type="text" class="tiny" name="mq_custom_maxwidth[]" value="0" />px</div>
332 454
333 -
334 - </div>
335 - <div class='label'><?php _e("Font size","maxbuttons") ?></div>
336 - <div class='input'><input type='text' name='mq_font_size[]' class='tiny' value="90"> <?php echo maxUtils::selectify("mq_font_size_unit[]",$units,"%") ?>
337 - </div>
338 -
339 - <div class='label'><?php _e("Button width", "maxbuttons") ?></div>
340 - <div class='input'><input type='text' name="mq_button_width[]" value="0" class='tiny'> <?php echo maxUtils::selectify("mq_button_width_unit[]",$units,""); ?></div>
341 - <div class='label'><?php _e("Container width", "maxbuttons"); ?></div>
342 - <div class='input'>
343 - <input type='text' name="mq_container_width[]" value="0" class='tiny'> <?php echo maxUtils::selectify("mq_container_width_unit[]",$units,""); ?>
344 - </div>
455 + $font_size = new maxField('number');
456 + $font_size->id = 'mq_font_size[]';
457 + $font_size->name = $font_size->id;
458 + //$font_size->value = $fields['mq_font_size'];
459 + $font_size->label = __('Font Size', 'maxbuttons');
460 + $font_size->min = 0;
461 + $font_size->inputclass = 'tiny';
462 + $font_size->start_conditional = $show_conditional;
463 + $font_size->output('start', '');
464 +
465 + $fsize_unit = new maxField('generic');
466 + $fsize_unit->id = 'mq_font_size_unit[]';
467 + $fsize_unit->name = $fsize_unit->id;
468 + //$fsize_unit->value = $fields['mq_font_size_unit'];
469 + $fsize_unit->content = maxUtils::selectify($fsize_unit->id, $units, $fsize_unit->value) ;
470 + $fsize_unit->output('','end');
471 +
472 + // width
473 + $width = new maxField('number');
474 + $width->id = 'mq_button_width[]';
475 + $width->name = $width->id;
476 + //$width->value = $fields['mq_button_width'];
477 + $width->label = __('Button Width', 'maxbuttons');
478 + $width->min = 0;
479 + $width->inputclass = 'tiny';
480 + $width->start_conditional = $show_conditional;
481 + $width->output('start','');
482 +
483 + $width_unit = new maxField('generic');
484 + $width_unit->id = 'mq_button_width_unit[]';
485 + $width_unit->name = $width_unit->id;
486 + //$width_unit->value = $fields['mq_button_width_unit'];
487 + $width_unit->content = maxUtils::selectify($width_unit->id, $units, $width_unit->value);
488 + $width_unit->output('','');
489 +
490 + // height
491 + $height = new maxField('number');
492 + $height->id = 'mq_button_height[]';
493 + $height->name = $height->id;
494 + //$height->value = $fields['mq_button_height'];
495 + $height->label = __("Button Height", "maxbuttons");
496 + $height->min = 0;
497 + $height->inputclass = 'tiny';
498 + $height->output('','');
499 +
500 + $height_unit = new maxField('generic');
501 + $height_unit->id = 'mq_button_height_unit[]';
502 + $height_unit->name = $height_unit->id;
503 + // $height_unit->value = $fields['mq_button_height_unit'];
504 + $height_unit->content = maxUtils::selectify($height_unit->id, $units, $height_unit->value) ;
505 + $height_unit->output('','end');
506 +
507 + $cwidth = new maxField('number');
508 + $cwidth->id = 'mq_container_width[]';
509 + $cwidth->name = $cwidth->id;
510 + $cwidth->label = __('Container Width', 'maxbuttons');
511 + //$cwidth->value = $fields['mq_container_width'];
512 + $cwidth->min = '1';
513 + $cwidth->inputclass = 'tiny';
514 + $cwidth->start_conditional = $show_conditional;
515 + $cwidth->output('start', '');
516 +
517 + $cwidth_unit = new maxField('generic');
518 + $cwidth_unit->id = 'mq_container_width_unit[]';
519 + $cwidth_unit->name = $cwidth_unit->id;
520 + //$cwidth_unit->value = $fields['mq_container_width_unit'];
521 + $cwidth_unit->content = maxUtils::selectify($cwidth_unit->id, $units, $cwidth_unit->value);
522 + $cwidth_unit->output('','end');
523 +
524 + $cfloat = new maxField('generic');
525 + $cfloat->id = 'mq_container_float[]';
526 + $cfloat->name = $cfloat->id;
527 + $cfloat->label = __('Container Float','maxbuttons');
528 + // $cfloat->value = $fields['mq_container_float'];
529 + $cfloat->content = maxUtils::selectify($cfloat->id, $container_floats, $cfloat->value);
530 + $cfloat->start_conditional = $show_conditional;
531 + $cfloat->output('start','end');
532 +
533 + if (! isset($fields['mq_hide']))
534 + $fields['mq_hide'] = 0;
535 +
536 + $hide = new maxField('switch');
537 + $hide->id = 'mq_hide[]';
538 + $hide->name = $hide->id;
539 + $hide->value = 'none';
540 + //$hide->checked = checked($fields['mq_hide'], $hide->value, false);
541 + $hide->label = __('Hide button in this view','maxbuttons');
542 + $hide->output('start','end');
543 +
544 + /*$preview = new maxField('button');
545 + $preview->id = 'mq_preview[]';
546 + $preview->button_label = __('Show in preview','maxbuttons');
547 + $preview->output('', 'end');
548 + */
549 + ?>
550 + </div> <!-- /media-query -->
345 551
346 - <div class='label'><?php _e("Container float", "maxbuttons"); ?></div>
347 - <div class="input"><?php echo maxUtils::selectify("mq_container_float[]",$container_floats, "") ?></div>
348 - <div class="label"><?php _e("Hide button on this view","maxbuttons"); ?></div>
349 - <div class="input"><input type="checkbox" name="mq_hide[]" value="none">
350 - </div>
351 - `</div>
352 -
353 - </div>
552 + </div> <!-- /media-query-prot -->
354 553 <div id="media_desc">
355 554 <?php foreach($media_desc as $key => $desc)
356 555 {
357 556 echo "<span id='$key'>$desc</span>";
@@ -361,12 +560,9 @@
361 560 </div>
362 561
363 562
364 563 </div> <!-- container -->
365 -
366 -
367 -
368 -
564 +
369 565 <?php
370 566 }
371 567
372 568 } // class