" }],
]);
// build GUI for chosen enable/disable of standard buttons
let standardbuttons = '';
config_std.forEach((val, key) => {
standardbuttons += ``;
});
// reformat the stored custom buttons to match the standard
let config_custom = new Map();
custommap.forEach((val, key) => {
val = JSON.parse(val); // turn the string into an array of 4x2 each
let newval = {}; // turn the array into an object
val.forEach((v) => {
newval[v[0]] = v[1];
});
config_custom.set(key, newval);
});
// build GUI for stored custom buttons
let custombuttons = '';
config_custom.forEach((val) => {
custombuttons += `
`;
});
// template for a blank row to add a custom button (is cloned before inserting into DOM)
let newcustombutton = `
`;
$(cfg).html(``);
// attach it to the DOM so that selections work (but only if #main exists, else it might be a Retry Later error page)
if ($("#main").length == 1) $("body").append(cfg);
// turn checkboxes and radiobuttons into pretty buttons
$( "#cmtFmtDialog input[type='checkbox'], #cmtFmtDialog input[type='radio']" ).checkboxradio({ icon: false });
// optimizing the size of the GUI in case it's a mobile device
let dialogwidth = parseInt($("body").css("width")); // parseInt ignores letters (px)
dialogwidth = dialogwidth > 550 ? 550 : dialogwidth * 0.9;
// initialize the dialog (but don't open it)
$( "#cmtFmtDialog" ).dialog({
appendTo: "#main",
modal: true,
title: 'Comment Formatting Buttons',
draggable: true,
resizable: false,
autoOpen: false,
width: dialogwidth,
position: {my:"center", at: "center top"},
buttons: {
Reset: deleteConfig,
Save: storeConfig,
Cancel: function() { $( "#cmtFmtDialog" ).dialog( "close" ); }
}
});
// event triggers if form is submitted with the key
$( "#cmtFmtDialog form" ).on("submit", (e) => {
e.preventDefault();
storeConfig();
});
// putting event triggers on buttons that will delete custom rows
function evRemoveRow(el) {
$(el).on("click", (e) => {
e.cancelBubble = true;
e.preventDefault();
$(e.target).parent().remove(); // delete whole div
});
}
// run it immediately on the stored custom buttons
evRemoveRow($( "#cmtFmtDialog button.remove" ));
// putting event trigger on button that will add blank custom rows
$( "#cmtFmtDialog button.add" ).on("click", (e) => {
e.cancelBubble = true;
e.preventDefault();
// add a new blank row and attach the remove event again
$(e.target).parent().before( $(newcustombutton).clone() );
evRemoveRow($( "#cmtFmtDialog button.remove:last-of-type" ));
});
function deleteConfig() {
// deselects all buttons, empties all fields in the form
$('#cmtFmtDialog form').trigger("reset");
$('#cmtFmtDialog button.remove').trigger("click");
// deletes the localStorage
localStorage.removeItem('cmtfmtstandard');
localStorage.removeItem('cmtfmtcustom');
$( "#cmtFmtDialog" ).dialog( "close" );
}
function storeConfig() {
// build a Map() for enabled standard buttons => button -> true/false
let storestd = new Map();
$( "#cmtFmtDialog #stdbutton [name]" ).each(function() { storestd.set( $(this).prop('name'), String($(this).prop('checked')) ); });
localStorage.setItem('cmtfmtstandard', JSON.stringify(Array.from(storestd.entries())));
// build a Map() for the custom buttons => custom# -> { icon: X, text: X, ins_pre: X, ins_app: X }
let storecustom = new Map();
$( "#cmtFmtDialog #custombutton div:has(input)" ).each((i, div) => {
let parts = new Map();
$(div).find('[name]').each(function() { parts.set( $(this).prop('name'), $(this).prop('value') ); });
storecustom.set('custom'+i, JSON.stringify(Array.from(parts.entries())));
});
localStorage.setItem('cmtfmtcustom', JSON.stringify(Array.from(storecustom.entries())));
$( "#cmtFmtDialog" ).dialog( "close" );
}
/* CREATING THE LINK TO OPEN THE CONFIGURATION DIALOG */
// if no other script has created it yet, write out a "Userscripts" option to the main navigation
if ($('#scriptconfig').length == 0) {
$('#header ul.primary.navigation li.dropdown').last()
.after(`