| 1 |
<?php |
| 2 |
|
| 3 |
namespace ResponsiveMenu\Form; |
| 4 |
use ResponsiveMenu\Models\Option; |
| 5 |
use ResponsiveMenu\Form\FormComponent; |
| 6 |
|
| 7 |
class MenuOrdering implements FormComponent { |
| 8 |
|
| 9 |
public function render(Option $option) { |
| 10 |
|
| 11 |
$required = ['title' => '', 'menu' => '', 'search' => '', 'additional content' => '']; |
| 12 |
$current_options = (array) json_decode($option->getValue()); |
| 13 |
$all_options = array_merge($current_options, $required); |
| 14 |
|
| 15 |
$output = '<ul id="menu-sortable">'; |
| 16 |
foreach($all_options as $name => $val): |
| 17 |
$current_value = isset($current_options[$name]) ? $current_options[$name] : ''; |
| 18 |
$on_class = $current_value == 'on' ? 'menu-order-option-switch-on' : ''; |
| 19 |
|
| 20 |
$output .= '<li class="draggable">' |
| 21 |
. ucwords($name) |
| 22 |
. '<input type="text" class="orderable-item" value="'.$current_value.'" name="menu['.$option->getName().']['.$name.']" />' |
| 23 |
. '<div class="menu-order-option-switch ' . $on_class . '"></div>' |
| 24 |
. '</li>'; |
| 25 |
endforeach; |
| 26 |
$output .= '</ul>'; |
| 27 |
|
| 28 |
$output .= '<script> |
| 29 |
jQuery(document).ready(function($) { |
| 30 |
$(document).on("click", ".menu-order-option-switch", function() { |
| 31 |
if($(this).siblings("input.orderable-item").val() != "on") { |
| 32 |
$(this).siblings("input.orderable-item").val("on"); |
| 33 |
$(this).addClass("menu-order-option-switch-on"); |
| 34 |
} else { |
| 35 |
$(this).siblings("input.orderable-item").val(""); |
| 36 |
$(this).removeClass("menu-order-option-switch-on"); |
| 37 |
} |
| 38 |
}); |
| 39 |
$( "#menu-sortable" ).sortable({ |
| 40 |
revert: true |
| 41 |
}); |
| 42 |
$( "#sortable, .draggable" ).disableSelection(); |
| 43 |
}); |
| 44 |
</script>'; |
| 45 |
return $output; |
| 46 |
} |
| 47 |
|
| 48 |
} |
| 49 |
|
