More generic popup stuff

This commit is contained in:
somebody
2022-10-22 21:38:25 -05:00
parent 8daea61599
commit 948cf71d42
4 changed files with 190 additions and 202 deletions

View File

@@ -807,7 +807,7 @@ function load_popup(data) {
popup_deleteable = data.deleteable;
popup_editable = data.editable;
popup_renameable = data.renameable;
var popup = document.getElementById("popup");
var popup = document.getElementById("file-browser");
var popup_title = document.getElementById("popup_title");
popup_title.textContent = data.popup_title;
if (data.popup_title == "Select Story to Load") {
@@ -850,7 +850,7 @@ function load_popup(data) {
}
popup.classList.remove("hidden");
openPopup("file-browser");
//adjust accept button
if (data.call_back == "") {
@@ -863,7 +863,7 @@ function load_popup(data) {
accept.setAttribute("selected_value", "");
accept.onclick = function () {
socket.emit(this.getAttribute("emit"), this.getAttribute("selected_value"));
document.getElementById("popup").classList.add("hidden");
closePopups();
};
}
@@ -1211,7 +1211,7 @@ function popup_edit_file(data) {
accept.onclick = function () {
var textarea = document.getElementById("filecontents");
socket.emit("popup_change_file", {"file": textarea.getAttribute("filename"), "data": textarea.value});
document.getElementById("popup").classList.add("hidden");
closePopups();
};
var textarea = document.createElement("textarea");
@@ -1266,8 +1266,6 @@ function getModelParameterCount(modelName) {
}
function show_model_menu(data) {
document.getElementById("loadmodelcontainer").classList.remove("hidden");
//clear old options
document.getElementById("modelkey").classList.add("hidden");
document.getElementById("modelkey").value = "";
@@ -1402,6 +1400,7 @@ function show_model_menu(data) {
var accept = document.getElementById("btn_loadmodelaccept");
accept.disabled = true;
openPopup("load-model");
}
function selected_model_info(data) {
@@ -1652,7 +1651,7 @@ function load_model() {
'disk_layers': disk_layers, 'url': document.getElementById("modelurl").value,
'online_model': selected_models};
socket.emit("load_model", message);
document.getElementById("loadmodelcontainer").classList.add("hidden");
closePopups();
}
function world_info_entry_used_in_game(data) {
@@ -2241,9 +2240,7 @@ function world_info_folder(data) {
}
function show_error_message(data) {
error_message_box = document.getElementById('error_message');
error_message_box.classList.remove("hidden");
error_box_data = error_message_box.querySelector("#popup_list_area")
const error_box_data = $el("#error-popup").querySelector("#popup_list_area")
//clear out the error box
while (error_box_data.firstChild) {
error_box_data.removeChild(error_box_data.firstChild);
@@ -2257,6 +2254,7 @@ function show_error_message(data) {
//console.log(item);
$e("div", error_box_data, {'innerHTML': item, 'classes': ['console_text']})
}
openPopup("error-popup");
}
function do_wpp(wpp_area) {
@@ -2309,8 +2307,8 @@ function process_log_message(full_data) {
}
//put log message in log popup
log_popup = document.getElementById('log_popup');
log_popup_data = log_popup.querySelector("#popup_list_area")
const log_popup = document.getElementById('log-popup');
const log_popup_data = log_popup.querySelector("#popup_list_area")
//clear out the error box
for (item of data['html']) {
$e("div", log_popup_data, {'innerHTML': item, 'classes': ['console_text']})
@@ -2384,10 +2382,7 @@ function new_story() {
}
function save_as_story(response) {
if (response == "overwrite?") {
document.getElementById('save-confirm').classList.remove('hidden')
}
if (response === "overwrite?") openPopup("save-confirm");
}
function save_bias(item) {
@@ -2586,7 +2581,7 @@ function edit_game_text() {
function save_preset() {
socket.emit("save_new_preset", {"preset": document.getElementById("new_preset_name").value, "description": document.getElementById("new_preset_description").value});
document.getElementById('save_preset').classList.add('hidden');
closePopups();
}
//--------------------------------------------General UI Functions------------------------------------
@@ -2696,7 +2691,7 @@ function get_caret_position(target) {
}
function show_save_preset() {
document.getElementById("save_preset").classList.remove("hidden");
openPopup("save-preset");
}
function autoResize(element, min_size=200) {
@@ -3670,13 +3665,6 @@ function close_menus() {
document.getElementById("main-grid").classList.remove("story_menu-open");
//close popup menus
document.getElementById('popup').classList.add("hidden");
document.getElementById('loadmodelcontainer').classList.add("hidden");
document.getElementById('save-confirm').classList.add("hidden");
document.getElementById('error_message').classList.add("hidden");
document.getElementById("advanced_theme_editor").classList.add("hidden");
document.getElementById("save_preset").classList.add("hidden");
document.getElementById("log_popup").classList.add("hidden");
closePopups();
//unselect sampler items
@@ -3977,7 +3965,7 @@ async function downloadDebugFile(redact=true) {
}
function configurePrompt(placeholderData) {
showPopup("prompt-config");
openPopup("prompt-config");
const placeholders = document.querySelector("#prompt-config-placeholders");
@@ -4600,7 +4588,7 @@ function open_finder() {
finder_selection_index = -1;
updateFinderMode("ui");
showPopup("finder");
openPopup("finder");
finderInput.focus();
}
@@ -4674,7 +4662,7 @@ function updateTitle() {
}
function openClubImport() {
document.getElementById("import_aidg_club_popup").classList.remove("hidden");
openPopup("aidg-import-popup");
}
//// INIT ////
@@ -4684,7 +4672,7 @@ document.onkeyup = detect_key_up;
document.getElementById("input_text").onkeydown = detect_enter_submit;
/* -- Popups -- */
function showPopup(id) {
function openPopup(id) {
closePopups();
const container = $el("#popup-container");

View File

@@ -1,5 +1,6 @@
<!------------------File Browser--------------->
<div class="popup hidden" id="popup">
<div id="popup-container" class="hidden">
<!------------------File Browser--------------->
<div id="file-browser" class="popup-window popup">
<div class="title" id="popup_title">
Popup Title
</div>
@@ -30,12 +31,12 @@
</div>
<div class="popup_load_cancel" id="popup_load_cancel">
<button class="btn popup_load_cancel_button action_button" id="popup_accept" disabled>Load</button>
<button class="btn popup_load_cancel_button" id="popup_cancel" onclick='document.getElementById("popup").classList.add("hidden");'>Cancel</button>
<button class="btn popup_load_cancel_button" id="popup_cancel" onclick='closePopups();'>Cancel</button>
</div>
</div>
</div>
<!---------------- Model Load Screen ---------------------->
<div class="popup hidden" id="loadmodelcontainer">
<!---------------- Model Load Screen ---------------------->
<div id="load-model" class="popup-window popup" >
<div class="title">
Select A Model To Load
</div>
@@ -63,12 +64,12 @@
<div class="box-label">Use GPU</div>
</div>
<button type="button" class="btn popup_load_cancel_button action_button disabled" onclick="load_model()" id="btn_loadmodelaccept" disabled>Load</button>
<button type="button" class="btn popup_load_cancel_button" onclick='document.getElementById("loadmodelcontainer").classList.add("hidden");' id="btn_loadmodelclose">Cancel</button>
<button type="button" class="btn popup_load_cancel_button" onclick='closePopups();' id="btn_loadmodelclose">Cancel</button>
</div>
</div>
</div>
<!---------------- Story overwrite screen ---------------------->
<div class="popup hidden" id="save-confirm">
<!---------------- Story overwrite screen ---------------------->
<div id="save-confirm" class="popup hidden">
<div class="title">
<div class="popuptitletext">Overwrite</div>
</div>
@@ -76,13 +77,13 @@
The story name you have entered already exists. Would you like to overwrite?
</div>
<div class="popup_load_cancel">
<button type="button" class="btn btn-primary popup_load_cancel_button" onclick='socket.emit("save_story", "overwrite"); document.getElementById("save-confirm").classList.add("hidden");'>Overwrite</button>
<button type="button" class="btn btn-primary popup_load_cancel_button" onclick="document.getElementById('save-confirm').classList.add('hidden');">Cancel</button>
<button type="button" class="btn btn-primary popup_load_cancel_button" onclick='socket.emit("save_story", "overwrite");closePopups();'>Overwrite</button>
<button type="button" class="btn btn-primary popup_load_cancel_button" onclick="closePopups();">Cancel</button>
</div>
</div>
</div>
<!---------------- Save Preset screen ---------------------->
<div class="popup hidden" id="save_preset">
<!---------------- Save Preset screen ---------------------->
<div id="save-preset" class="popup hidden">
<div class="title">
<div class="popuptitletext">Save Preset</div>
</div>
@@ -108,12 +109,12 @@
</div>
<div class="popup_load_cancel">
<button type="button" class="btn btn-primary popup_load_cancel_button" onclick='save_preset()'>Save</button>
<button type="button" class="btn btn-primary popup_load_cancel_button" onclick="document.getElementById('save_preset').classList.add('hidden');">Cancel</button>
<button type="button" class="btn btn-primary popup_load_cancel_button" onclick="closePopups();">Cancel</button>
</div>
</div>
</div>
<!---------------- Import aidg.club Prompt ---------------------->
<div class="popup hidden" id="import_aidg_club_popup">
<!---------------- Import aidg.club Prompt ---------------------->
<div id="aidg-import-popup" class="popup hidden">
<div class="title">
<div class="popuptitletext">Enter the Prompt Number</div>
</div>
@@ -124,13 +125,13 @@
<input autocomplete="off" class="form-control" type="text" placeholder="Prompt Number (4-digit number at the end of aetherroom.club URL)" id="aidgpromptnum">
</div>
<div class="popup_load_cancel">
<button type="button" class="btn btn-primary popup_load_cancel_button" onclick="socket.emit('load_aidg_club', document.getElementById('aidgpromptnum').value); $('.popup').addClass('hidden');">Accept</button>
<button type="button" class="btn btn-primary popup_load_cancel_button" onclick="this.parentElement.parentElement.classList.add('hidden');">Cancel</button>
<button type="button" class="btn btn-primary popup_load_cancel_button" onclick="socket.emit('load_aidg_club', document.getElementById('aidgpromptnum').value);closePopups();">Accept</button>
<button type="button" class="btn btn-primary popup_load_cancel_button" onclick="closePopups();">Cancel</button>
</div>
</div>
</div>
<!---------------- error screen ---------------------->
<div class="popup hidden" id="error_message">
<!---------------- error screen ---------------------->
<div id="error-popup" class="popup hidden">
<div class="title">
<div class="popuptitletext">Error</div>
</div>
@@ -138,12 +139,12 @@
</div>
<div class="popup_load_cancel">
<button type="button" class="btn btn-primary popup_load_cancel_button" onclick="document.getElementById('error_message').classList.add('hidden');">Ok</button>
<button type="button" class="btn btn-primary popup_load_cancel_button" onclick="closePopups();">Ok</button>
</div>
</div>
</div>
<!---------------- log screen ---------------------->
<div class="popup hidden" id="log_popup">
<!---------------- log screen ---------------------->
<div id="log-popup" class="popup hidden">
<div class="title">
<div class="popuptitletext">Log</div>
</div>
@@ -151,11 +152,11 @@
</div>
<div class="popup_load_cancel">
<button type="button" class="btn btn-primary popup_load_cancel_button" onclick="document.getElementById('log_popup').classList.add('hidden');">Ok</button>
<button type="button" class="btn btn-primary popup_load_cancel_button" onclick="closePopups();">Ok</button>
</div>
</div>
<!---------------- Advanced Theme Editor ---------------------->
<div class="popup hidden" id="advanced_theme_editor">
</div>
<!---------------- Advanced Theme Editor ---------------------->
<div id="advanced_theme_editor" class="popup hidden">
<div class="title">
<div class="popuptitletext">Advanced Theme Editor</div>
</div>
@@ -163,11 +164,10 @@
<table border=1 id="advanced_theme_editor_table"></table>
</div>
<div class="popup_load_cancel">
<button type="button" class="btn btn-primary popup_load_cancel_button" onclick="document.getElementById('advanced_theme_editor').classList.add('hidden');">Ok</button>
<button type="button" class="btn btn-primary popup_load_cancel_button" onclick="closePopups();">Ok</button>
</div>
</div>
</div>
<div id="popup-container" class="hidden">
<!---------------- Context Viewer ---------------------->
<div id="context-viewer" class="popup-window">
<div id="context-viewer-header">

View File

@@ -107,7 +107,7 @@
<div id="probabilities">
</div>
<span id="debug-dump" class="cursor" onclick="showPopup('debug-file-prompt');">Download debug dump</span>
<span id="debug-dump" class="cursor" onclick="openPopup('debug-file-prompt');">Download debug dump</span>
<div id="Images">
<button class="settings_button var_sync_alt_system_generating_image" onclick="socket.emit('generate_image', {})">Generate Image</button>
<div id="action image"></div>
@@ -411,7 +411,7 @@
</table>
</div>
</div>
<div class="advanced_theme cursor" onclick='document.getElementById("advanced_theme_editor").classList.remove("hidden");'>
<div class="advanced_theme cursor" onclick='openPopup("advanced_theme_editor");'>
<span>Advanced Theme</h4>
</div>
</div>
@@ -442,6 +442,6 @@
<div id="settings_footer" class="settings_footer">
<span>Execution Time: <span id="Execution Time"></span></span> |
<span>Remaining Time: <span class="var_sync_model_tqdm_rem_time"></span></span> |
<a onclick='socket.emit("get_log", {});document.getElementById("log_popup").classList.remove("hidden");' class='cursor'>Log</a>
<a onclick='socket.emit("get_log", {});openPopup("log-popup");' class='cursor'>Log</a>
</div>
</div>

View File

@@ -110,7 +110,7 @@
</div>
</div>
<div id="token-breakdown-container" class="settings_footer" style="padding-top: 10px;">
<div class="token_breakdown" onclick='socket.emit("update_tokens", document.getElementById("input_text").value);showPopup("context-viewer");'>
<div class="token_breakdown" onclick='socket.emit("update_tokens", document.getElementById("input_text").value);openPopup("context-viewer");'>
<div id="soft_prompt_tokens" style="width:0%; background-color: var(--context_colors_soft_prompt);"></div>
<div id="memory_tokens" style="width:40%; background-color: var(--context_colors_memory);"></div>
<div id="authors_notes_tokens" style="width:10%; background-color: var(--context_colors_authors_notes);"></div>