NPC Selector from JSON<\/title>\r\n<\/head>\r\n<body>\r\n <p id=\"log\"><\/p>\r\n\r\n <label for=\"npcSelect\">Choose an NPC:<\/label>\r\n <select id=\"npcSelect\">\r\n <option>Loading NPCs\u2026<\/option>\r\n <\/select>\r\n \r\n\r\n \r\n\r\n <button id=\"saveJsonBtn\" >Save to JSON<\/button>\r\n <span id=\"stroetransiantselctedinput\" style=\"visibility:visible\"><\/span>\r\n <script>\r\n function Onclicaudiofileinputbutton(id) {\r\n document.getElementById(\"popupuploadaudiocontainer\").style.visibility = \"visible\";\/\/collapse\r\n document.getElementById(\"stroetransiantselctedinput\").innerHTML = id.id;\r\n }\r\n function playaudiofiletest(audiourl) {\r\n const audio = new Audio(audioUrl);\r\n audio.play();\r\n }\r\n function addtolog(txt) {\r\n console.log(txt);\r\n document.getElementById(\"log\").innerText += JSON.stringify(txt, null, 2) + \"\\n\";\r\n }\r\n\r\n var npcJson = {};\r\n var slectednpc = {};\r\n var mapinputtojsonvalue = [];\r\n\r\n function createwidgetdilugeline(jsondata, reference,index) {\r\n let html = \"\";\r\n var refarayy = {};\r\n for (const key in jsondata) {\r\n if (jsondata.hasOwnProperty(key)) {\r\n const value = jsondata[key];\r\n const inputId = reference + key;\r\n \/\/ If the key is \"audiofile\" you can later add drag\/drop handling here\r\n if (key == \"audiofile\") {\r\n html += `<span>${key}: <input type=\"url\" id=\"${inputId}\" value=\"${value}\" \/> <button onclick=\"Onclicaudiofileinputbutton(${inputId})\">upload sound<\/button><button onclick=\"playaudiofiletest(${value})\">play sound<\/button><\/span><br \/>`;\r\n } else {\r\n html += `${key}: <input type=\"text\" id=\"${inputId}\" value=\"${value}\" \/><br \/>`;\r\n }\r\n refarayy[key] = inputId;\r\n }\r\n }\r\n return {\r\n html: html, reffarray: refarayy\r\n };\r\n }\r\n\r\n function buildnpcdata(jsondata, containerid) {\r\n mapinputtojsonvalue = [];\r\n console.log(jsondata);\r\n const containerEl = document.getElementById(containerid);\r\n let innerhtml = \"\";\r\n \r\n Object.keys(jsondata).forEach((val) => {\r\n innerhtml += \"<h1>\" + val + \"<\/h1>\";\r\n jsondata[val].forEach((val2, i) => {\r\n innerhtml += \"<h3>\" + String(i) + \"<\/h3>\";\r\n var ttjson = createwidgetdilugeline(val2, val + \"_\" + i + \"_\", i);\r\n innerhtml += ttjson.html;\r\n mapinputtojsonvalue.push(ttjson.reffarray);\r\n\r\n });\r\n });\r\n containerEl.innerHTML = innerhtml;\r\n }\r\n\r\n async function populateNPCSelect(url, selectEl, selectedNpc = null) {\r\n try {\r\n const response = await fetch(url, { cache: \"no-store\" });\r\n if (!response.ok) throw new Error(`HTTP error ${response.status}`);\r\n const npcData = await response.json();\r\n npcJson = npcData;\r\n\r\n selectEl.innerHTML = '';\r\n selectEl.appendChild(new Option(\"select NPC\", \"select NPC\"));\r\n\r\n Object.keys(npcData).forEach(npcName => {\r\n const opt = new Option(npcName, npcName);\r\n if (selectedNpc && npcName === selectedNpc) opt.selected = true;\r\n selectEl.appendChild(opt);\r\n });\r\n } catch (err) {\r\n console.error('Error loading NPC JSON:', err);\r\n selectEl.innerHTML = '<option disabled>Error loading NPCs<\/option>';\r\n }\r\n }\r\n\r\n const selectEl = document.getElementById('npcSelect');\r\n populateNPCSelect('https:\/\/endofenthalpyonline.com\/wp-content\/uploads\/GameMettadata\/NPCMettadata.json', selectEl, 'blacksmith');\r\n\r\n selectEl.addEventListener('change', async () => {\r\n const selected = selectEl.value;\r\n if (!npcJson[selected]) return;\r\n\r\n const npcInfo = npcJson[selected];\r\n\r\n try {\r\n const response = await fetch(\"https:\/\/endofenthalpyonline.com\/wp-content\/uploads\/GameMettadata\/dialuge\/\" + npcInfo.dialugefile, { cache: \"no-store\" });\r\n const data = await response.json();\r\n slectednpc = data;\r\n\r\n addtolog(slectednpc);\r\n buildnpcdata(slectednpc, \"npccontianerfulldetais\");\r\n\r\n console.log('Dialogue file:', npcInfo.dialugefile);\r\n console.log('Icon file:', npcInfo.displayiconfile);\r\n\r\n } catch (err) {\r\n console.log(err);\r\n }\r\n });\r\n\r\n \/\/ Save to JSON button\r\n document.getElementById(\"saveJsonBtn\").addEventListener(\"click\", async () => {\r\n try {\r\n \/\/ Get updated values from inputs\r\n console.log(mapinputtojsonvalue);\r\n Object.keys(slectednpc).forEach(key => {\r\n slectednpc[key].forEach((obj, i) => {\r\n for (const k in obj) {\r\n const input = document.getElementById(`${key}_${i}_${k}_`);\r\n if (input) obj[k] = input.value;\r\n }\r\n });\r\n });\r\n mapinputtojsonvalue.forEach((val) => {\r\n Object.keys(val).forEach((val2) => {\/\/\/needs to be per refrence\r\n\r\n\r\n });\r\n\r\n });\r\n const jsonStr = JSON.stringify(slectednpc, null, 2);\r\n console.log(slectednpc);\r\n const filename = npcJson[selectEl.value].dialugefile; \/\/ save to same file\r\n const response = await fetch('\/wp-json\/custom\/v1\/upload', {\r\n method: 'POST',\r\n headers: { 'Content-Type': 'application\/json' },\r\n body: JSON.stringify({\r\n api_key: 'fdsdg34$$Fdgfdst2',\r\n file: btoa(jsonStr), \/\/ convert to base64\r\n filename: filename,\r\n dir: 'GameMettadata\/dialuge\/'\r\n })\r\n });\r\n\r\n const result = await response.json();\r\n if (result.success) {\r\n alert(\"Saved successfully! URL: \" + result.url);\r\n } else {\r\n alert(\"Error saving: \" + result.error);\r\n }\r\n\r\n } catch (err) {\r\n console.error(err);\r\n alert(\"Failed to save JSON.\");\r\n }\r\n });\r\n <\/script>\r\n<\/body>\r\n<\/html>\r\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-c9bd09d e-flex e-con-boxed e-con e-child\" data-id=\"c9bd09d\" data-element_type=\"container\" id=\"npccontianerfulldetais\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-cd99eaf e-flex e-con-boxed e-con e-child\" data-id=\"cd99eaf\" data-element_type=\"container\" id=\"popupuploadaudiocontainer\" data-settings=\"{"position":"fixed"}\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t<div class=\"elementor-element elementor-element-ce58d18 e-con-full e-flex e-con e-child\" data-id=\"ce58d18\" data-element_type=\"container\" data-settings=\"{"background_background":"classic"}\">\n\t\t\t\t<div class=\"elementor-element elementor-element-b3fd576 elementor-widget elementor-widget-heading\" data-id=\"b3fd576\" data-element_type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">upload audiofile<\/h2>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-d05fe94 elementor-widget elementor-widget-html\" data-id=\"d05fe94\" data-element_type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<!DOCTYPE html>\r\n<html lang=\"en\">\r\n<head>\r\n <meta charset=\"UTF-8\">\r\n <title>Audio Upload & Preview<\/title>\r\n <style>\r\n #audio-drop-zone {\r\n width: 300px;\r\n height: 100px;\r\n border: 2px dashed #aaa;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n cursor: pointer;\r\n transition: background 0.3s;\r\n }\r\n\r\n #audio-drop-zone.dragover {\r\n background: #e0e0e0;\r\n }\r\n\r\n #audio-upload-result {\r\n margin-top: 10px;\r\n font-family: Arial, sans-serif;\r\n }\r\n <\/style>\r\n<\/head>\r\n<body>\r\n\r\n <div id=\"audio-upload-container\">\r\n <label for=\"audioFileInput\">Upload Audio File:<\/label>\r\n <input type=\"file\" id=\"audioFileInput\" accept=\"audio\/*\" style=\"display:none\" \/>\r\n <div id=\"audio-drop-zone\">\r\n Drag & Drop Audio Here or Click\r\n <\/div>\r\n <p id=\"audio-upload-result\"><\/p>\r\n <\/div>\r\n\r\n <script>\r\n (() => {\r\n const dropZone = document.getElementById('audio-drop-zone');\r\n const fileInput = document.getElementById('audioFileInput');\r\n const resultEl = document.getElementById('audio-upload-result');\r\n const selectedNpc = 'Frosty'; \/\/ \ud83d\udc48 Example value \u2014 set dynamically in your app\r\n\r\n \/\/ \ud83d\uddb1\ufe0f Click to open file selector\r\n dropZone.addEventListener('click', () => fileInput.click());\r\n\r\n \/\/ \ud83c\udfa7 Drag & drop events\r\n dropZone.addEventListener('dragover', e => {\r\n e.preventDefault();\r\n dropZone.classList.add('dragover');\r\n });\r\n dropZone.addEventListener('dragleave', e => {\r\n e.preventDefault();\r\n dropZone.classList.remove('dragover');\r\n });\r\n dropZone.addEventListener('drop', e => {\r\n e.preventDefault();\r\n dropZone.classList.remove('dragover');\r\n const file = e.dataTransfer?.files?.[0];\r\n if (file) uploadFile(file);\r\n const popup = document.getElementById(\"popupuploadaudiocontainer\");\r\n if (popup) popup.style.visibility = \"collapse\";\r\n });\r\n\r\n \/\/ \ud83c\udfb5 File input change\r\n fileInput.addEventListener('change', () => {\r\n const file = fileInput.files?.[0];\r\n if (file) uploadFile(file);\r\n });\r\n function trysetinput(url) {\r\n try {\r\n var transientid = document.getElementById(\"stroetransiantselctedinput\").innerHTML;\r\n console.log(\"transient\");\r\n console.log(transientid);\r\n var el = document.getElementById(transientid);\r\n console.log(el);\r\n if (el) {\r\n el.value = url;\r\n }\r\n } catch (err) {\r\n console.log(err);\r\n }\r\n\r\n }\r\n \/\/ \ud83d\udce4 Upload function\r\n async function uploadFile(file) {\r\n if (!file) return;\r\n const reader = new FileReader();\r\n\r\n reader.onload = async function () {\r\n const base64File = reader.result.split(',')[1]; \/\/ strip \"data:...;base64,\" prefix\r\n\r\n try {\r\n const response = await fetch('\/wp-json\/custom\/v1\/upload', {\r\n method: 'POST',\r\n headers: { 'Content-Type': 'application\/json' },\r\n body: JSON.stringify({\r\n api_key: 'fdsdg34$$Fdgfdst2',\r\n file: base64File,\r\n filename: file.name,\r\n dir: `GameMettadata\/dialuge\/${selectedNpc}`\r\n })\r\n });\r\n\r\n const data = await response.json();\r\n if (data.success) {\r\n resultEl.innerHTML = `\r\n \u2705 Uploaded!<br>\r\n File URL: <a href=\"${data.url}\" target=\"_blank\">${data.url}<\/a><br><br>\r\n <audio controls src=\"${data.url}\"><\/audio>\r\n `;\r\n trysetinput(data.url);\r\n console.log('Server URL:', data.url);\r\n } else {\r\n resultEl.textContent = 'Upload failed: ' + data.error;\r\n }\r\n } catch (err) {\r\n console.error(err);\r\n resultEl.textContent = 'Upload error';\r\n }\r\n };\r\n reader.readAsDataURL(file);\r\n }\r\n\r\n \/\/ \u2705 Safe helper (prevents tagName null errors)\r\n function getAllChildrenOfType(parent, tagName) {\r\n const result = [];\r\n if (!parent || !parent.children) return result;\r\n\r\n for (const child of parent.children) {\r\n if (child && child.tagName && child.tagName.toLowerCase() === tagName.toLowerCase()) {\r\n result.push(child);\r\n }\r\n result.push(...getAllChildrenOfType(child, tagName));\r\n }\r\n return result;\r\n }\r\n\r\n })();\r\n <\/script>\r\n\r\n<\/body>\r\n<\/html>\r\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-e5cf0e3 elementor-widget elementor-widget-html\" data-id=\"e5cf0e3\" data-element_type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<script>\r\n function closepoupaudiowindow(){\r\n document.getElementById('popupuploadaudiocontainer').style.visibility = 'collapse';\r\n }\r\n<\/script>\r\n\r\n<button onclick=\"closepoupaudiowindow();\"> close<\/button> \t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>npc: NPC Selector from JSON Choose an NPC: Loading NPCs\u2026 Save to JSON upload audiofile Audio Upload & Preview Upload Audio File: Drag & Drop Audio Here or Click close<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_header_footer","meta":{"_acf_changed":false,"om_disable_all_campaigns":false,"_monsterinsights_skip_tracking":false,"_monsterinsights_sitenote_active":false,"_monsterinsights_sitenote_note":"","_monsterinsights_sitenote_category":0,"footnotes":""},"class_list":["post-1401","page","type-page","status-publish","hentry"],"acf":[],"_links":{"self":[{"href":"https:\/\/endofenthalpyonline.com\/index.php\/wp-json\/wp\/v2\/pages\/1401","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/endofenthalpyonline.com\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/endofenthalpyonline.com\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/endofenthalpyonline.com\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/endofenthalpyonline.com\/index.php\/wp-json\/wp\/v2\/comments?post=1401"}],"version-history":[{"count":211,"href":"https:\/\/endofenthalpyonline.com\/index.php\/wp-json\/wp\/v2\/pages\/1401\/revisions"}],"predecessor-version":[{"id":1618,"href":"https:\/\/endofenthalpyonline.com\/index.php\/wp-json\/wp\/v2\/pages\/1401\/revisions\/1618"}],"wp:attachment":[{"href":"https:\/\/endofenthalpyonline.com\/index.php\/wp-json\/wp\/v2\/media?parent=1401"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}