custom-admin-menu.js
| 1 | (function( $ ) { |
| 2 | 'use strict'; |
| 3 | |
| 4 | $(document).ready( function() { |
| 5 | |
| 6 | // Initialize sortable elements: https://api.jqueryui.com/sortable/ |
| 7 | $('#custom-admin-menu').sortable(); |
| 8 | |
| 9 | // Save custom order into a comma-separated string, triggerred after each drag and drop of menu item |
| 10 | // https://api.jqueryui.com/sortable/#event-update |
| 11 | // https://api.jqueryui.com/sortable/#method-toArray |
| 12 | $('#custom-admin-menu').on( 'sortupdate', function( event, ui) { |
| 13 | let menuOrder = $('#custom-admin-menu').sortable("toArray").toString(); |
| 14 | // console.log( menuOrder ); |
| 15 | |
| 16 | // Set hidden input value |
| 17 | document.getElementById('admin_site_enhancements[custom_menu_order]').value = menuOrder; |
| 18 | |
| 19 | // jQuery.ajax({ |
| 20 | // url: ajaxurl, |
| 21 | // data: { |
| 22 | // 'action': 'save_custom_menu_order', |
| 23 | // 'menu_order': menuOrder |
| 24 | // }, |
| 25 | // success:function(data) { |
| 26 | // var data = data.slice(0,-1); // remove strange trailing zero in string returned by AJAX call |
| 27 | // var dataObj = JSON.parse(data); |
| 28 | // console.log(dataObj.message); |
| 29 | // }, |
| 30 | // error:function(errorThrown) { |
| 31 | // console.log(errorThrown); |
| 32 | // } |
| 33 | // }); |
| 34 | |
| 35 | }); |
| 36 | |
| 37 | // Define a function to delay execution of script by x miliecnods. Ref: https://stackoverflow.com/a/28173606 |
| 38 | // var delay = ( function() { |
| 39 | // var timer = 0; |
| 40 | // return function(callback, ms) { |
| 41 | // clearTimeout (timer); |
| 42 | // timer = setTimeout(callback, ms); |
| 43 | // }; |
| 44 | // })(); |
| 45 | |
| 46 | // If Customize Admin Menu is enabled, save IDs of menu items that will be hidden |
| 47 | if ( document.getElementById('admin_site_enhancements[customize_admin_menu]').checked ) { |
| 48 | |
| 49 | // Prepare constant to store IDs of menu items that will be hidden |
| 50 | if ( document.getElementById('admin_site_enhancements[custom_menu_hidden]').value ) { |
| 51 | |
| 52 | var hiddenMenuItems = document.getElementById('admin_site_enhancements[custom_menu_hidden]').value.split(","); // array |
| 53 | |
| 54 | } else { |
| 55 | |
| 56 | var hiddenMenuItems = []; // array |
| 57 | |
| 58 | } |
| 59 | |
| 60 | console.log(hiddenMenuItems); |
| 61 | |
| 62 | // Detect which menu items are being checked. Ref: https://stackoverflow.com/a/3871602 |
| 63 | Array.from(document.getElementsByClassName('menu-item-checkbox')).forEach(function(item,index,array) { |
| 64 | |
| 65 | item.addEventListener('click', event => { |
| 66 | |
| 67 | if (event.target.checked) { |
| 68 | |
| 69 | // Add ID of menu item to array |
| 70 | // alert(event.target.dataset.menuItemId + ' will be hidden'); |
| 71 | hiddenMenuItems.push(event.target.dataset.menuItemId); |
| 72 | |
| 73 | } else { |
| 74 | |
| 75 | // Remove ID of menu item from array |
| 76 | // alert(event.target.dataset.menuItemId + ' will not be hidden'); |
| 77 | const start = hiddenMenuItems.indexOf(event.target.dataset.menuItemId); |
| 78 | const deleteCount = 1; |
| 79 | hiddenMenuItems.splice(start, deleteCount); |
| 80 | |
| 81 | } |
| 82 | |
| 83 | console.log(hiddenMenuItems.toString()); |
| 84 | |
| 85 | // Set hidden input value |
| 86 | document.getElementById('admin_site_enhancements[custom_menu_hidden]').value = hiddenMenuItems; |
| 87 | |
| 88 | // delay(function() { |
| 89 | |
| 90 | // jQuery.ajax({ |
| 91 | // url: ajaxurl, |
| 92 | // data: { |
| 93 | // 'action': 'save_hidden_menu_items', |
| 94 | // 'hidden_menu_items': hiddenMenuItems.toString() |
| 95 | // }, |
| 96 | // success:function(data) { |
| 97 | // var data = data.slice(0,-1); // remove strange trailing zero in string returned by AJAX call |
| 98 | // var dataObj = JSON.parse(data); |
| 99 | // console.log(dataObj.message ); |
| 100 | // }, |
| 101 | // error:function(errorThrown) { |
| 102 | // console.log(errorThrown); |
| 103 | // } |
| 104 | // }); |
| 105 | |
| 106 | // }, 3000); |
| 107 | |
| 108 | }); |
| 109 | |
| 110 | }); |
| 111 | |
| 112 | } |
| 113 | |
| 114 | }); |
| 115 | |
| 116 | })( jQuery ); |