A notice is now shown when the menu is updated.

Re-added the missing padding above notices in the Control Panel for Nox.
Moved the inline menu item JS to it's own JS file.

Added the panel.themes_menus_items_order_updated phrase.
This commit is contained in:
Azareal 2019-04-29 08:17:08 +10:00
parent 2cce7ce306
commit fd68578ed1
5 changed files with 62 additions and 51 deletions

View File

@ -949,6 +949,7 @@
"panel_themes_menus_items_edit_button_aria":"Edit menu item",
"panel_themes_menus_items_delete_button_aria":"Delete menu item",
"panel_themes_menus_items_update_button":"Update Order",
"panel.themes_menus_items_order_updated":"The menu has been successfully updated",
"panel_themes_menus_edit_head":"Menu Editor",
"panel_themes_menus_create_head":"Create Menu Item",

View File

@ -0,0 +1,56 @@
(() => {
addInitHook("end_init", () => {
// TODO: Move this into a JS file to reduce the number of possible problems
var menuItems = {};
let items = document.getElementsByClassName("panel_menu_item");
for(let i = 0; item = items[i]; i++) menuItems[i] = item.getAttribute("data-miid");
Sortable.create(document.getElementById("panel_menu_item_holder"), {
sort: true,
onEnd: (evt) => {
console.log("pre menuItems: ", menuItems)
console.log("evt: ", evt)
let oldMiid = menuItems[evt.newIndex];
menuItems[evt.oldIndex] = oldMiid;
let newMiid = evt.item.getAttribute("data-miid");
console.log("newMiid: ", newMiid);
menuItems[evt.newIndex] = newMiid;
console.log("post menuItems: ", menuItems);
}
});
document.getElementById("panel_menu_items_order_button").addEventListener("click", () => {
let req = new XMLHttpRequest();
if(!req) {
console.log("Failed to create request");
return false;
}
req.onreadystatechange = () => {
try {
if(req.readyState!==XMLHttpRequest.DONE) return;
// TODO: Signal the error with a notice
if(req.status===200) {
let resp = JSON.parse(req.responseText);
console.log("resp: ", resp);
// TODO: Should we move other notices into TmplPhrases like this one?
pushNotice(phraseBox["panel"]["panel.themes_menus_items_order_updated"]);
if(resp.success==1) return;
}
} catch(ex) {
console.error("exception: ", ex)
}
console.trace();
}
// ? - Is encodeURIComponent the right function for this?
let spl = document.location.pathname.split("/");
req.open("POST","/panel/themes/menus/item/order/edit/submit/"+parseInt(spl[spl.length-1],10)+"?session=" + encodeURIComponent(me.User.Session));
req.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
let items = "";
for(let i = 0; item = menuItems[i];i++) items += item+",";
if(items.length > 0) items = items.slice(0,-1);
req.send("js=1&items={"+items+"}");
});
});
})();

View File

@ -99,6 +99,7 @@ func ThemesMenusEdit(w http.ResponseWriter, r *http.Request, user c.User, smid s
return c.NoPermissions(w, r, user)
}
basePage.Header.AddScript("Sortable-1.4.0/Sortable.min.js")
basePage.Header.AddScriptAsync("panel_menu_items.js")
mid, err := strconv.Atoi(smid)
if err != nil {

View File

@ -80,54 +80,4 @@
</form>
</main>
</div>
<script type="text/javascript">
// TODO: Move this into a JS file to reduce the number of possible problems
var menuItems = {};
let items = document.getElementsByClassName("panel_menu_item");
for(let i = 0; item = items[i]; i++) menuItems[i] = item.getAttribute("data-miid");
Sortable.create(document.getElementById("panel_menu_item_holder"), {
sort: true,
onEnd: (evt) => {
console.log("pre menuItems: ", menuItems)
console.log("evt: ", evt)
let oldMiid = menuItems[evt.newIndex];
menuItems[evt.oldIndex] = oldMiid;
let newMiid = evt.item.getAttribute("data-miid");
console.log("newMiid: ", newMiid);
menuItems[evt.newIndex] = newMiid;
console.log("post menuItems: ", menuItems);
}
});
document.getElementById("panel_menu_items_order_button").addEventListener("click", () => {
let req = new XMLHttpRequest();
if(!req) {
console.log("Failed to create request");
return false;
}
req.onreadystatechange = () => {
try {
if(req.readyState!==XMLHttpRequest.DONE) return;
// TODO: Signal the error with a notice
if(req.status===200) {
let resp = JSON.parse(req.responseText);
console.log("resp: ", resp);
// TODO: Have a successfully updated notice
if(resp.success==1) return;
}
} catch(ex) {
console.error("exception: ", ex)
}
console.trace();
}
// ? - Is encodeURIComponent the right function for this?
req.open("POST","/panel/themes/menus/item/order/edit/submit/{{.MenuID}}?session=" + encodeURIComponent(me.User.Session));
req.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
let items = "";
for(let i = 0; item = menuItems[i];i++) items += item+",";
if(items.length > 0) items = items.slice(0,-1);
req.send("js=1&amp;items={"+items+"}");
});
</script>
{{template "footer.html" . }}

View File

@ -92,6 +92,9 @@
.colstack_head + .colstack_head.colstack_sub_head:not(:first-child) {
margin-top: 2px;
}
.alert {
margin-top: 18px;
}
.rowitem {
display: flex;
}