☰

NGAO_HTML_Elements_creation

Neverwinter Gateway Advanced Outsourcing - HTML Elements creation

ეს სკრიპტი არ უნდა იყოს პირდაპირ დაინსტალირებული. ეს ბიბლიოთეკაა, სხვა სკრიპტებისთვის უნდა ჩართეთ მეტა-დირექტივაში // @require https://update.greatest.deepsurf.us/scripts/9674/50216/NGAO_HTML_Elements_creation.js. 

  1.     function addSettings() { 
  2.         if ($("#settingsButton").length)
  3.             return;
  4.         // Add the required CSS
  5.         AddCss("\
  6. #settingsButton{border-bottom: 1px solid rgb(102, 102, 102); border-right: 1px solid rgb(102, 102, 102); background: none repeat scroll 0% 0% rgb(238, 238, 238); display: block; position: fixed; overflow: auto; right: 0px; top: 0px; padding: 3px; z-index: 1000;}\
  7. #pauseButton{border-bottom: 1px solid rgb(102, 102, 102); border-right: 1px solid rgb(102, 102, 102); background: none repeat scroll 0% 0% rgb(238, 238, 238); display: block; position: fixed; overflow: auto; right: 23px; top: 0px; padding: 3px; z-index: 1000;}\
  8. /* MAC-NW -- Put Panel at a higher layer than status window */ #settingsPanel{border-bottom: 1px solid rgb(102, 102, 102); border-right: 1px solid rgb(102, 102, 102); background: none repeat scroll 0% 0% rgb(238, 238, 238); color: rgb(0, 0, 0); position: fixed; overflow: auto; right: 0px; top: 0px; width: 750px;max-height:800px;font: 12px sans-serif; text-align: left; display: block; z-index: 1001;}\
  9. #settings_title{font-weight: bolder; background: none repeat scroll 0% 0% rgb(204, 204, 204); border-bottom: 1px solid rgb(102, 102, 102); padding: 3px;}\
  10. #settingsPanelButtonContainer {background: none repeat scroll 0% 0% rgb(204, 204, 204); border-top: 1px solid rgb(102, 102, 102);padding: 3px;text-align:center} \
  11. #settingsPanel label.purple {font-weight:bold;color:#7C37F6}\
  12. #settingsPanel label.blue {font-weight:bold;color:#007EFF}\
  13. #settingsPanel label.green {font-weight:bold;color:#8AFF00}\
  14. #settingsPanel label.white {font-weight:bold;color:#FFFFFF}\
  15. #charPanel {width:98%;max-height:400px;overflow:auto;display:block;padding:3px;}\
  16. #charPanel div div ul li { display: inline-block; width: 48%; }\
  17. .inventory-container {float: left; clear: none; width: 270px; margin-right: 20px;}\
  18. #prinfopane {position: fixed; top: 5px; left: 200px; display: block; z-index: 1000;}\
  19. .prh3 {padding: 5px; height: auto!important; width: auto!important; background-color: rgba(0, 0, 0, 0.7);}\
  20. .custom-radio{width:16px;height:16px;display:inline-block;position:relative;z-index:1;top:3px;background-color:#fff;margin:0 4px 0 2px;}\
  21. .custom-radio:hover{background-color:black;} .custom-radio.selected{background-color:red;} .custom-radio-selected-text{color:darkred;font-weight:500;}\
  22. .custom-radio input[type='radio']{margin:1px;position:absolute;z-index:2;cursor:pointer;outline:none;opacity:0;_nofocusline:expression(this.hideFocus=true);-ms-filter:progid:DXImageTransform.Microsoft.Alpha(Opacity=0);filter:alpha(opacity=0);-khtml-opacity:0;-moz-opacity:0}\
  23. #settingsPanel input[type='button'].button-green,#settingsPanel input[type='button'].button-red,#settingsPanel input[type='button'].button-yellow,#settingsPanel input[type='button'].button-blue{color:#eff;border-radius:4px;text-shadow:0 1px 1px rgba(0,0,0,0.2);font-size:110%;font-weight:bold;}\
  24. .pure-button{display:inline-block;*display:inline;zoom:1;line-height:normal;white-space:nowrap;vertical-align:baseline;text-align:center;cursor:pointer;-webkit-user-drag:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.pure-button::-moz-focus-inner{padding:0;border:0}.pure-button{font-family:inherit;font-size:100%;*font-size:90%;*overflow:visible;padding:.5em 1em;color:#444;color:rgba(0,0,0,.8);*color:#444;border:1px solid #999;border:0 rgba(0,0,0,0);background-color:#E6E6E6;text-decoration:none;border-radius:2px}.pure-button-hover,.pure-button:hover,.pure-button:focus{filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#00000000', endColorstr='#1a000000', GradientType=0);background-image:-webkit-gradient(linear,0 0,0 100%,from(transparent),color-stop(40%,rgba(0,0,0,.05)),to(rgba(0,0,0,.1)));background-image:-webkit-linear-gradient(transparent,rgba(0,0,0,.05) 40%,rgba(0,0,0,.1));background-image:-moz-linear-gradient(top,rgba(0,0,0,.05) 0,rgba(0,0,0,.1));background-image:-o-linear-gradient(transparent,rgba(0,0,0,.05) 40%,rgba(0,0,0,.1));background-image:linear-gradient(transparent,rgba(0,0,0,.05) 40%,rgba(0,0,0,.1))}.pure-button:focus{outline:0}.pure-button-active,.pure-button:active{box-shadow:0 0 0 1px rgba(0,0,0,.15) inset,0 0 6px rgba(0,0,0,.2) inset}.pure-button[disabled],.pure-button-disabled,.pure-button-disabled:hover,.pure-button-disabled:focus,.pure-button-disabled:active{border:0;background-image:none;filter:progid:DXImageTransform.Microsoft.gradient(enabled=false);filter:alpha(opacity=40);-khtml-opacity:.4;-moz-opacity:.4;opacity:.4;cursor:not-allowed;box-shadow:none}.pure-button-hidden{display:none}.pure-button::-moz-focus-inner{padding:0;border:0}.pure-button-primary,.pure-button-selected,a.pure-button-primary,a.pure-button-selected{background-color:#0078e7;color:#fff}\
  25. #settingsPanel input[type='button'].button-green{background:#1cb841; margin: 2px 20px 2px 2px;}\
  26. #settingsPanel input[type='button'].button-red{background:#ca3c3c; margin: 2px 2px 2px 2px;}\
  27. #settingsPanel input[type='button'].button-yellow{background:#df7514; margin: 2px 2px 2px 2px;}\
  28. #settingsPanel input[type='button'].button-blue{background:#42b8dd; margin: 2px 2px 2px 2px;}\
  29. ");
  30.  
  31.         // Add settings panel to page body
  32.         $("body").append(
  33.             '<div id="settingsPanel">\
  34.     <div id="settings_title">\
  35.     <img src=' + image_prefs + ' style="float: left; vertical-align: text-bottom;"\>\
  36. <img id="settings_close" src=' + image_close + ' title="Click to hide preferences" style="float: right; vertical-align: text-bottom; cursor: pointer; display: block;"\>\
  37. <span style="margin:3px">Settings</span>\
  38. </div>\
  39. <form style="margin: 0px; padding: 0px">\
  40. <ul style="list-style: none outside none; max-height: 500px; overflow: auto; margin: 3px; padding: 0px;">\
  41. </ul>\
  42. </form>\
  43. </div>'
  44.         );
  45.  
  46.         // Add each setting input
  47.         var settingsList = $("#settingsPanel form ul");
  48.         for (var i = 0; i < settingnames.length; i++) {
  49.             var id = 'settings_' + settingnames[i].name;
  50.             var indent = (countLeadingSpaces(settingnames[i].title) >= 1) ? 1 : 0;
  51.             /*if ((settingnames[i].type == 'text' && settingnames[i-1].type == 'checkbox') || (settingnames[i-1] && settingnames[i].type == 'checkbox' && settingnames[i-1].type == 'text'))
  52.              settingsList.append('<li style="margin-left:0em; width: 48%; display: inline-block;"/>&nbsp;</li>')*/
  53.             var border = "";
  54.             if (settingnames[i].border)
  55.                 border = "border-top: #000 solid 1px;"
  56.             switch (settingnames[i].type) {
  57.                 case "checkbox":
  58.                     var _checkWidth = "48%";
  59.                     if (i < 9)
  60.                         _checkWidth = "31%";
  61.                     if (settingnames[i].border)
  62.                         _checkWidth = "98%";
  63.                     settingsList.append('<li title="' + settingnames[i].tooltip + '" style="' + border + 'padding-left:' + indent + 'em; width: ' + _checkWidth + '; display: inline-block;"><input style="margin:4px" name="' + id + '" id="' + id + '" type="checkbox" /><label class="' + settingnames[i].class + '" for="' + id + '">' + settingnames[i].title + '</label></li>')
  64.                     $('#' + id).prop('checked', settings[settingnames[i].name]);
  65.                     break;
  66.                 case "text":
  67.                     if (settingnames[i].border)
  68.                         _inputkWidth = "95%; padding: 10px";
  69.                     else
  70.                         _inputkWidth = "46%";
  71.                     settingsList.append('<li title="' + settingnames[i].tooltip + '" style="' + border + 'padding-left:' + indent + 'em; margin-top:1em; width: ' + _inputkWidth + '; display: inline-block;"<label class="' + settingnames[i].class + '" for="' + id + '">' + settingnames[i].title + '</label><input style="margin:4px; padding: 2px; min-width: 80%;" name="' + id + '" id="' + id + '" type="text" /></li>')
  72.                     $('#' + id).val(settings[settingnames[i].name]);
  73.                     break;
  74.                 case "password":
  75.                     settingsList.append('<li title="' + settingnames[i].tooltip + '" style="' + border + 'padding-left:' + indent + 'em; margin-top:1em; width: 46%; display: inline-block;"' + settingnames[i].class + '" for="' + id + '">' + settingnames[i].title + '</label><input style="margin:4px; padding: 2px; min-width: 80%;" name="' + id + '" id="' + id + '" type="password" /></li>')
  76.                     $('#' + id).val(settings[settingnames[i].name]);
  77.                     break;
  78.                 case "select":
  79.                     settingsList.append('<li title="' + settingnames[i].tooltip + '" style="' + border + 'padding-left:' + indent + 'em; width: 48%; display: inline-block;"' + settingnames[i].class + '" style="padding-left:4px" for="' + id + '">' + settingnames[i].title + '</label><select style="margin:4px" name="' + id + '" id="' + id + '" /></li>')
  80.                     var options = settingnames[i].opts;
  81.                     var select = $('#' + id);
  82.                     for (var j = 0; j < options.length; j++) {
  83.                         if (settings[settingnames[i].name] == options[j].path)
  84.                             select.append('<option value="' + options[j].path + '" selected="selected">' + options[j].name + '</option>');
  85.                         else
  86.                             select.append('<option value="' + options[j].path + '">' + options[j].name + '</option>');
  87.                     }
  88.                     break;
  89.                 case "label":
  90.                     settingsList.append('<li title="' + settingnames[i].tooltip + '" style="' + border + 'margin-left:' + indent + 'em;><label class="' + settingnames[i].class + '">' + settingnames[i].title + '</label></li>')
  91.                     break;
  92.             }
  93.         }
  94.  
  95.         // Add character settings for each char
  96.         var addText = '\
  97. <script type="text/javascript">\
  98. <!--\
  99. function click_position(obj)\
  100. {\
  101. change_position(obj.value)\
  102. }\
  103. \
  104. function customRadio(radioName) {\
  105. var radioButton = $( \'input[name="\'+ radioName +\'"]\');\
  106. $(radioButton).each(function(){\
  107. $(this).wrap( "<span class=\'custom-radio\'></span>" );\
  108. if($(this).is(\':checked\')){\
  109. $(this).parent().addClass("selected");\
  110. $(this).parent().parent().addClass("custom-radio-selected-text");\
  111. }\
  112. });\
  113. $(radioButton).click(function(){\
  114. if($(this).is(\':checked\')){\
  115. $(this).parent().addClass("selected");\
  116. $(this).parent().parent().addClass("custom-radio-selected-text");\
  117. }\
  118. $(radioButton).not(this).each(function(){\
  119. $(this).parent().removeClass("selected");\
  120. $(this).parent().parent().removeClass("custom-radio-selected-text");\
  121. });\
  122. });\
  123. }\
  124. function change_position(val)\
  125. {\
  126. for (var i = 0; i < ' + settings["charcount"] + '; i++)\
  127. {\
  128. document.getElementById("charContainer"+i).style.display="none";\
  129. }\
  130. document.getElementById("charContainer"+val).style.display="block";\
  131. }\
  132. //-->\
  133. </script>\
  134. <div id="charPanel">\
  135. <div style="width:30%;float:left;max-height:400px;overflow:auto;">\
  136. ';
  137.         for (var i = 0; i < settings["charcount"]; i++) {
  138.             addText += '\
  139. <div><label for="value_' + i + '" style="display:block;padding-top:2px;"><input autocomplete="off" type="radio" name="radio_position" onclick="click_position(this)" id="value_' + i + '" value="' + i + '" />' + settings["nw_charname" + i] + '</label></div>\
  140. ';
  141.         }
  142.         addText += '\
  143. </div>\
  144. <div style="width:69%;float:right;">\
  145. ';
  146.         for (var i = 0; i < settings["charcount"]; i++) {
  147.             addText += '\
  148. <div id="charContainer' + i + '" style="display:none">\
  149. <ul style="list-style: none outside none; max-height: 500px; overflow: auto;">\
  150. ';
  151.             var k = 0 + (i * charSettings.length / settings["charcount"]);
  152.             var id = 'settings_' + charSettings[k].name;
  153.             addText += '<li title="' + charSettings[k].tooltip + '"><input style="margin:4px; padding: 2px;" name="' + id + '" id="' + id + '" type="text" /></li>';
  154.             for (var j = 1; j < (charSettings.length / settings["charcount"]); j++) {
  155.                 k = j + (i * charSettings.length / settings["charcount"]);
  156.                 if (charSettings[k].type == 'void') {
  157.                     continue;
  158.                 }
  159.                 id = 'settings_' + charSettings[k].name;
  160.                 addText += '<li title="' + charSettings[k].tooltip + '"><input maxlength="2" size="1" style="margin:4px; padding: 2px;" name="' + id + '" id="' + id + '" type="text" /><label class="' + charSettings[k].class + '" for="' + id + '">' + charSettings[k].title + '</label></li>';
  161.             }
  162.             addText += '</ul>\
  163. </div>';
  164.         }
  165.         addText += '\
  166. </div>\
  167. </div>\
  168. ';
  169.         $("#settingsPanel form").append(addText);
  170.  
  171.         // Add values to character input fields
  172.         for (var i = 0; i < charSettings.length; i++) {
  173.             var id = 'settings_' + charSettings[i].name;
  174.             $('#' + id).val(settings[charSettings[i].name]);
  175.         }
  176.  
  177.         // Add save/cancel buttons to panel
  178.         $("#settingsPanel form").append('\
  179. <div id="settingsPanelButtonContainer">\
  180. <input id="settings_save" class="button-blue pure-button" type="button" value="Save and Apply">\
  181. <input id="settings_close" class="button-yellow pure-button" type="button" value="Close">\
  182. <input id="settings_sca" class="button-red pure-button" type="button" value="Cycle SCA">\
  183. <input id="log_error" class="button-green pure-button" type="button" value="Log Error">\
  184. <input id="settings_wipe" class="button-white pure-button" type="button" value="RESET all">\
  185. </div>');
  186.  
  187.         // Add open settings button to page
  188.         $("body").append('<div id="settingsButton"><img src="' + image_prefs + '" title="Click to show preferences" style="cursor: pointer; display: block;"></div>');
  189.  
  190.         // Add pause button to page
  191.         $("body").append('<div id="pauseButton"><img src="' + (settings["paused"] ? image_play : image_pause) + '" title="Click to ' + (settings["paused"] ? "resume" : "pause") + ' task script" style="cursor: pointer; display: block;"></div>');
  192.  
  193.         // Add info pane
  194.         $("body").append("<div id='prinfopane' class='header-newrelease'>");
  195.  
  196.         // Add the javascript
  197.         $("#settingsPanel").hide();
  198.         $("#settingsButton").click(function () {
  199.             $("#settingsButton").hide();
  200.             $("#pauseButton").hide();
  201.             $("#settingsPanel").show();
  202.         });
  203.         $("#settings_close,settings_cancel").click(function () {
  204.             $("#settingsButton").show();
  205.             $("#pauseButton").show();
  206.             $("#settingsPanel").hide();
  207.         });
  208.         $("#pauseButton").click(PauseSettings);
  209.  
  210.         // Use setTimeout to workaround permission issues when calling GM functions from main window
  211.         $("#settings_save").click(function () {
  212.             setTimeout(function () {
  213.                 SaveSettings();
  214.             }, 0)
  215.         });
  216.         $("#settings_sca").click(function () {
  217.             $("#settings_close").trigger("click");
  218.             unsafeWindow.location.hash = unsafeWindow.location.hash.replace(/\)\/.+/, ')' + "/adventures");
  219.             processSwordCoastDailies();
  220.         });
  221.         $("#log_error").click(function () {
  222.             setTimeout(function () {
  223.                 var epic = GM_getValue("Epic_error", 0);
  224.                 var un_def_err = GM_getValue("Undefine_error", 0)
  225.                 console.log("Button Epic fails[" + epic +"] & undefine [" + un_def_err + "].");
  226.             }, 0)
  227.         });
  228.         $("#settings_wipe").click(function() {
  229.             setTimeout(function () {
  230.                 // Delete all saved settings, EXCEPT password/username
  231.                 var keys = GM_listValues();
  232.                 for (i = 0; i < keys.length; i++) {
  233.                     var key = keys[i];
  234.                     if (!key.match(/(username|password)/)) {
  235.                         //console.log("do delete these", key);
  236.                         GM_deleteValue(key);}
  237.                 }
  238.             }, 0)
  239.             unsafeWindow.location.href = current_Gateway;
  240.             return;
  241.         });
  242.  
  243.         customRadio("radio_position");
  244.  
  245.         $('#update-content-inventory-bags-0 .bag-header').waitUntilExists(function () {
  246.             if ($('#update-content-inventory-bags-0 .bag-header div').length && !$('#update-content-inventory-bags-0 .bag-header div.autovendor').length) {
  247.                 $('#update-content-inventory-bags-0 .bag-header').append('<div class="input-field button light autovendor"><div class="input-bg-left"></div><div class="input-bg-mid"></div><div class="input-bg-right"></div><button id="nwprofs-autovendor">Auto Vendor</button></div>');
  248.                 $("button#nwprofs-autovendor").on("click", vendorJunk);
  249.             }
  250.         });
  251.     }