Skip to content

Commit 009599a

Browse files
bvipulbvipul
authored
Merge pull request #197 from viralsolani/develop
Refactored Menu Module Js
2 parents 23cc26b + 191e8a2 commit 009599a

File tree

4 files changed

+242
-180
lines changed

4 files changed

+242
-180
lines changed

‎public/js/backend/admin.js‎

Lines changed: 238 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,7 @@
22
var Backend = {}; // common variable used in all the files of the backend
33

44
(function (){
5+
56
Backend = {
67

78
Utils: {
@@ -44,6 +45,7 @@ var Backend = {}; // common variable used in all the files of the backend
4445

4546
ajaxrequest: function (url, method, data, csrf, callback) {
4647
var request = new XMLHttpRequest();
48+
var loadingIcon = jQuery(".loading");
4749
if (window.XMLHttpRequest) {
4850
// code for modern browsers
4951
request = new XMLHttpRequest();
@@ -52,6 +54,13 @@ var Backend = {}; // common variable used in all the files of the backend
5254
request = new ActiveXObject("Microsoft.XMLHTTP");
5355
}
5456
request.open(method, url, true);
57+
58+
request.onloadstart = function() {
59+
loadingIcon.show();
60+
};
61+
request.onloadend = function() {
62+
loadingIcon.hide();
63+
};
5564
request.setRequestHeader('X-CSRF-TOKEN', csrf);
5665
request.setRequestHeader('X-Requested-With', 'XMLHttpRequest');
5766
if ("post" === method.toLowerCase() || "patch" === method.toLowerCase()) {
@@ -74,7 +83,6 @@ var Backend = {}; // common variable used in all the files of the backend
7483
jsontoformdata: function (srcjson) {
7584
if (typeof srcjson !== "object")
7685
if (typeof console !== "undefined") {
77-
console.log("\"srcjson\" is not a JSON object");
7886
return null;
7987
}
8088
u = encodeURIComponent;
@@ -96,7 +104,7 @@ var Backend = {}; // common variable used in all the files of the backend
96104
Pages:
97105
{
98106
init: function () {
99-
Backend.tinyMCE.init();
107+
Backend.tinyMCE.init();
100108
},
101109
},
102110

@@ -149,16 +157,16 @@ var Backend = {}; // common variable used in all the files of the backend
149157
Users:
150158
{
151159
selectors: {
152-
select2: $(".select2"),
160+
select2: jQuery(".select2"),
153161
getPremissionURL: "",
154162
showPermission: document.querySelectorAll(".show-permissions")
155163
},
156-
init: function (page) {
164+
init: function (page) {
157165
this.setSelectors();
158-
this.addHandlers(page);
166+
this.addHandlers(page);
159167
},
160168
setSelectors: function () {
161-
this.selectors.select2 = $(".select2");
169+
this.selectors.select2 = jQuery(".select2");
162170
this.selectors.getRoleForPermissions = document.querySelectorAll(".get-role-for-permissions");
163171
this.selectors.getAvailabelPermissions = document.querySelector(".get-available-permissions");
164172
this.selectors.Role3 = document.getElementById("role-3");
@@ -221,7 +229,7 @@ var Backend = {}; // common variable used in all the files of the backend
221229

222230
},
223231
windowloadhandler: function () {
224-
232+
225233
// scripts to be handeled on user create and edit when window is laoaded
226234
Backend.Users.selectors.showPermission.forEach(function (element) {
227235
element.onclick = function (event) {
@@ -376,6 +384,219 @@ var Backend = {}; // common variable used in all the files of the backend
376384
}
377385
},
378386

387+
Menu:
388+
{
389+
selectors: {
390+
menuItemContainer: jQuery("#menu-items"),
391+
menuItemsData: jQuery(".menu-items-field"),
392+
addCustomUrlButton: jQuery(".show-modal"),
393+
modal: jQuery("#showMenuModal"),
394+
document: jQuery("document"),
395+
addCustomUrlForm: "#menu-add-custom-url",
396+
addModuleToMenuButton: ".add-module-to-menu",
397+
removeMenuItemButton : ".remove-menu-item",
398+
editMenuItemButton : ".edit-menu-item",
399+
formUrl: "",
400+
},
401+
402+
methods: {
403+
getNewId : function(str) {
404+
var arr = str.match(/"id":[0-9]+/gi);
405+
if(arr) {
406+
$.each(arr, function(index, item) {
407+
arr[index] = parseInt(item.replace('"id":', ''));
408+
});
409+
return Math.max.apply(Math, arr) + 1;
410+
}
411+
return 1;
412+
},
413+
414+
findItemById : function(item, id) {
415+
if(item.id == id) {
416+
return item;
417+
}
418+
var found = false;
419+
var foundItem;
420+
if(item.children){
421+
$.each(item.children, function(index, childItem){
422+
foundItem = Backend.Menu.methods.findItemById(childItem, id);
423+
if(foundItem)
424+
{
425+
found = true;
426+
return false;
427+
}
428+
});
429+
}
430+
if(found)
431+
{
432+
return foundItem;
433+
}
434+
return null;
435+
},
436+
437+
addMenuItem : function(obj) {
438+
Backend.Menu.selectors.menuItemContainer.nestable('add', {
439+
"id": Backend.Menu.methods.getNewId(Backend.Menu.selectors.menuItemsData.val()),
440+
"content": obj.name,
441+
"name": obj.name,
442+
"url": obj.url,
443+
"url_type" : obj.url_type,
444+
"open_in_new_tab": obj.open_in_new_tab,
445+
"icon": obj.icon,
446+
"view_permission_id": obj.view_permission_id
447+
});
448+
Backend.Menu.selectors.menuItemsData.val(
449+
JSON.stringify(
450+
Backend.Menu.selectors.menuItemContainer.nestable('serialise')
451+
)
452+
);
453+
},
454+
455+
editMenuItem : function(obj) {
456+
var newObject = {
457+
"id": obj.id,
458+
"content": obj.name,
459+
"name": obj.name,
460+
"url": obj.url,
461+
"url_type": obj.url_type,
462+
"open_in_new_tab": obj.open_in_new_tab,
463+
"icon": obj.icon,
464+
"view_permission_id": obj.view_permission_id
465+
};
466+
var menuItems = Backend.Menu.selectors.menuItemContainer.nestable('serialise');
467+
var itemData;
468+
$.each(menuItems, function(index, item){
469+
itemData = Backend.Menu.methods.findItemById(item, id);
470+
if(itemData) { return false; }
471+
});
472+
if(itemData.children) {
473+
newObject.children = itemData.children;
474+
}
475+
476+
Backend.Menu.selectors.menuItemContainer.nestable('replace', newObject);
477+
478+
Backend.Menu.selectors.menuItemsData.val(
479+
JSON.stringify(
480+
Backend.Menu.selectors.menuItemContainer.nestable('serialise')
481+
)
482+
);
483+
}
484+
},
485+
486+
init: function () {
487+
this.addHandlers();
488+
},
489+
490+
addHandlers: function () {
491+
var context = this;
492+
var formName = "_add_custom_url_form";
493+
494+
this.selectors.menuItemContainer.nestable({
495+
callback: function(l, e){
496+
this.selectors.menuItemsData.val(JSON.stringify($(l).nestable('serialise')));
497+
},
498+
json: this.selectors.menuItemsData.val(),
499+
includeContent:true,
500+
scroll: false,
501+
maxDepth: 10
502+
});
503+
504+
this.selectors.addCustomUrlButton.click(function() {
505+
var title = context.selectors.addCustomUrlButton.attr("data-header");
506+
context.selectors.modal.find(".modal-title").html(title);
507+
context.selectors.modal.modal("show");
508+
509+
callback = {
510+
success: function (request) {
511+
if (request.status >= 200 && request.status < 400) {
512+
// Success!
513+
context.selectors.modal.find(".modal-body").html(request.responseText);
514+
// jQuery(document).find(context.selectors.modal).find(".view-permission-block").remove();
515+
jQuery(document).find(context.selectors.addCustomUrlForm).removeClass("hidden");
516+
}
517+
},
518+
error: function (request) {
519+
//Do Something
520+
}
521+
}
522+
Backend.Utils.ajaxrequest(context.selectors.formUrl + "/" + formName, "get", {}, Backend.Utils.csrf, callback);
523+
});
524+
525+
jQuery(document).on("submit", context.selectors.addCustomUrlForm, function(e){
526+
e.preventDefault();
527+
var formData = jQuery(this).serializeArray().reduce(function(obj, item) {
528+
obj[item.name] = item.value;
529+
return obj;
530+
}, {});
531+
if(formData.name.length > 0) {
532+
if(formData.id.length > 0) {
533+
context.methods.editMenuItem(formData);
534+
} else {
535+
context.methods.addMenuItem(formData);
536+
}
537+
context.selectors.modal.modal("hide");
538+
}
539+
});
540+
541+
jQuery(document).on("click", context.selectors.addModuleToMenuButton, function(){
542+
var dataObj = {
543+
id: $(this).attr("data-id"),
544+
name: $(this).attr("data-name"),
545+
url: $(this).attr("data-url"),
546+
url_type: $(this).attr("data-url_type"),
547+
open_in_new_tab: $(this).attr("data-open_in_new_tab"),
548+
view_permission_id: $(this).attr("data-view_permission_id"),
549+
}
550+
context.methods.addMenuItem(dataObj);
551+
});
552+
553+
jQuery(document).on("click", context.selectors.removeMenuItemButton, function() {
554+
context.selectors.menuItemContainer.nestable('remove', jQuery(this).parents(".dd-item").first().attr("data-id"));
555+
Backend.Menu.selectors.menuItemsData.val(
556+
JSON.stringify(
557+
Backend.Menu.selectors.menuItemContainer.nestable('serialise')
558+
)
559+
);
560+
});
561+
562+
jQuery(document).on("click", context.selectors.editMenuItemButton, function() {
563+
id = jQuery(this).parents(".dd-item").first().attr("data-id");
564+
var menuItems = context.selectors.menuItemContainer.nestable('serialise');
565+
var itemData;
566+
$.each(menuItems, function(index, item){
567+
itemData = context.methods.findItemById(item, id);
568+
if(itemData) { return false; }
569+
});
570+
if(itemData.id != undefined && itemData.id == id)
571+
{
572+
callback = {
573+
success: function (request) {
574+
if (request.status >= 200 && request.status < 400) {
575+
// Success!
576+
context.selectors.modal.find(".modal-body").html(request.responseText);
577+
context.selectors.modal.find(".modal-dialog .modal-content .modal-header .modal-title").html("Edit: " + itemData.name);
578+
$(document).find(context.selectors.modal).find(".mi-id").val(itemData.id);
579+
$(document).find(context.selectors.modal).find(".mi-name").val(itemData.name);
580+
$(document).find(context.selectors.modal).find(".mi-url").val(itemData.url);
581+
$(document).find(context.selectors.modal).find(".mi-url_type_"+itemData.url_type).prop("checked", true);
582+
if(itemData.open_in_new_tab == 1) {
583+
$(document).find(context.selectors.modal).find(".mi-open_in_new_tab").prop("checked", true);
584+
}
585+
$(document).find(context.selectors.modal).find(".mi-icon").val(itemData.icon);
586+
$(document).find(context.selectors.modal).find(".mi-view_permission_id").val(itemData.view_permission_id);
587+
$(document).find("#menu-add-custom-url").removeClass("hidden");
588+
context.selectors.modal.modal("show");
589+
}
590+
},
591+
error: function (request) {
592+
//Do Something
593+
}
594+
}
595+
Backend.Utils.ajaxrequest(context.selectors.formUrl + "/" + formName, "get", {}, Backend.Utils.csrf, callback);
596+
}
597+
});
598+
}
599+
},
379600

380601
/**
381602
* Tiny MCE
@@ -441,7 +662,7 @@ var Backend = {}; // common variable used in all the files of the backend
441662

442663
// ! Backend.emailTemplate.addHandlers
443664
addHandlers: function () {
444-
$(".select2").select2();
665+
jQuery(".select2").select2();
445666
// to add placeholder in to active textarea
446667
document.getElementById("addPlaceHolder").onclick = function (event) {
447668
Backend.emailTemplate.addPlaceHolder(event);
@@ -456,15 +677,15 @@ var Backend = {}; // common variable used in all the files of the backend
456677
addPlaceHolder: function (event) {
457678
var placeHolder = document.getElementById('placeHolder').value;
458679
if (placeHolder != '') {
459-
tinymce.activeEditor.execCommand('mceInsertContent', false, "[" + $('#placeHolder :selected').text() + "]");
680+
tinymce.activeEditor.execCommand('mceInsertContent', false, "[" + jQuery('#placeHolder :selected').text() + "]");
460681
}
461682
},
462683

463684
// ! Backend.emailTemplate.showPreview
464685
showPreview: function (event) {
465686
document.querySelector(".modal-body").innerHTML = tinyMCE.get('txtBody').getContent();
466687
//jQuery( ".modal-body" ).html(tinyMCE.get('txtBody').getContent());
467-
$(".model-wrapper").modal('show');
688+
jQuery(".model-wrapper").modal('show');
468689

469690
},
470691
},
@@ -526,9 +747,12 @@ var Backend = {}; // common variable used in all the files of the backend
526747
},
527748

528749
init: function (dataTable) {
529-
750+
530751
this.setSelectors();
531-
this.addHandlers(dataTable);
752+
753+
this.setSelectors.divAlerts.delay(2000).fadeOut(800);
754+
755+
this.addHandlers(dataTable);
532756

533757
},
534758
setSelectors: function () {
@@ -541,6 +765,7 @@ var Backend = {}; // common variable used in all the files of the backend
541765
this.setSelectors.excelButton = document.getElementById("excelButton");
542766
this.setSelectors.pdfButton = document.getElementById("pdfButton");
543767
this.setSelectors.printButton = document.getElementById("printButton");
768+
this.setSelectors.divAlerts = jQuery('div.alert').not('.alert-important');
544769

545770
},
546771
cloneElement: function (element, callback) {
@@ -683,6 +908,7 @@ var Backend = {}; // common variable used in all the files of the backend
683908
}
684909
}
685910
};
911+
686912
})();
687913

688914

‎resources/views/backend/layouts/app.blade.php‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -42,6 +42,7 @@
4242
</script>
4343
</head>
4444
<body class="skin-{{ config('backend.theme') }} {{ config('backend.layout') }}">
45+
<div class="loading" style="display:none"></div>
4546
@include('includes.partials.logged-in-as')
4647

4748
<div class="wrapper">

0 commit comments

Comments
 (0)