{
  "name": "File Manager",
  "icon": `<span class="material-symbols-outlined">folder</span>`,
  "desc": "The GopalOS file manager. This application is usually included with GopalOS.",
  "id": "file-manager",
  "globalID": "GopalOS.System.FileManager",
  "defaultRelease": "stable",
  "releases": {
    "stable": {
      "version": "v4.3.0",
      "app-files": {
        "file-manager": {
          type: "pgm",
          content: function() {
            if (document.getElementById("app_file-manager_window")) {
              document.getElementById("app_file-manager_window").style.display = "block";
            }
            else {
              document.getElementById("windows").insertAdjacentHTML("beforeend", getFile("/apps/file-manager/window"));
              getFile("/apps/file-manager/load")();
            }
            focusWin(document.getElementById("app_file-manager_window"));
            regTbarIcon("/apps/file-manager/file-manager", "app_file-manager_window", getFile("/apps/file-manager/icon"));
            refreshWindows();
          }
        },
        "icon": {
          type: "var",
          content: `<span class="matsymb">folder</span>`
        },
        "load": {
          type: "js",
          content: function() {
            document.getElementById("app_file-manager_content").innerHTML = "";
            document.getElementById("app_file-manager_bar").value = getFile("/apps/file-manager/working-dir");
            if (!getDir("/home/appdata/file-manager")) {
              createRef("/home/appdata/file-manager", "dir", {});
              createRef("/home/appdata/file-manager/view", "var", "list");
            }
            else {}
            const wdir = getDir(getFile("/apps/file-manager/working-dir"));
            const view = getFile("/home/appdata/file-manager/view");
            for (let i of Object.keys(wdir).sort((a, b) => a.toLowerCase().localeCompare(b.toLowerCase()))) {
              if (wdir[i].type == "dir") {
                document.getElementById("app_file-manager_content").insertAdjacentHTML("beforeend", `<div class="${view == "list" ? "app_file-manager_item" : `app_file-manager_${view}`}" onclick="getFile('/apps/file-manager/handler')(this.getElementsByTagName('span')[0].innerHTML);"><img src="${getIcon("dir")}" class="app_file-manager_item-icon"><span>${i}</span>/${view == "details" ? "<span style=\"float: right; color: #AAA; margin-right: 5px; \">Folder</span>" : ""}</div>`);
              }
              else {}
            }
            for (let i of Object.keys(wdir).sort((a, b) => a.toLowerCase().localeCompare(b.toLowerCase()))) {
              if (wdir[i].type == "dir") {}
              else {
                document.getElementById("app_file-manager_content").insertAdjacentHTML("beforeend", `<div class="${view == "list" ? "app_file-manager_item" : `app_file-manager_${view}`}" onclick="getFile('/apps/file-manager/handler')(this.getElementsByTagName('span')[0].innerHTML);"><img src="${getIcon(wdir[i].type)}" class="app_file-manager_item-icon"><span>${i}.${wdir[i].type ? wdir[i].type : "file"}</span>${view == "details" ? "<span style=\"float: right; color: #AAA; margin-right: 5px; \">" + getType(wdir[i].type) + (wdir[i].type == "var" ? ` (${getVarType(wdir[i].content)})` : "") + "</span>" : ""}</div>`);
              }
            }
            if (Object.keys(wdir).length == 0) {
              document.getElementById("app_file-manager_content").insertAdjacentHTML("beforeend", `<div class="${view == "list" ? "app_file-manager_item" : `app_file-manager_${view}`}" style="border: none; padding-left: 10px;"><span>(This folder is empty.)</span></div>`);
            }
            else {}
            if (getFile("/apps/file-manager/working-dir") == "/") {}
            else {
              document.getElementById("app_file-manager_content").insertAdjacentHTML("afterbegin", `<div class="${view == "list" ? "app_file-manager_item" : `app_file-manager_${view}`}" onclick="getFile('/apps/file-manager/parent-dir')();"><img src="${getIcon("parent-dir")}" class="app_file-manager_item-icon"><span>../</span>${view == "details" ? "<span style=\"float: right; color: #AAA; margin-right: 5px; \">Up one level</span>" : ""}</div>`);
            }
            document.getElementById("app_file-manager_listview").classList.remove("popup-menu-item-selected");
            document.getElementById("app_file-manager_detailsview").classList.remove("popup-menu-item-selected");
            document.getElementById("app_file-manager_tileview").classList.remove("popup-menu-item-selected");
            document.getElementById(`app_file-manager_${view}view`).classList.add("popup-menu-item-selected");
            createRef("/home/appdata/file-manager", "dir", {
              "view": {
                type: "var",
                content: "list"
              }
            });
          }
        },
        "window": {
          type: "html",
          content: `<div class="window" id="app_file-manager_window" style="top: 100px; left: 100px;">
<div class="window-title">File Manager</div>
<div class="window-controls">
  <div class="window-control window-control-minimize"><span>&#x1F5D5;</span></div>
  <div class="window-control window-control-maximize"><span>&#x1F5D6;</span></div>
  <div class="window-control window-control-close"><span>&#x274C;&#xFE0E;</span></div>
</div>
<div class="window-content">
  <input type="text" id="app_file-manager_bar" onblur="this.value = getFile('/apps/file-manager/working-dir');" value="/" readonly>
  <div id="app_file-manager_addfile" class="popup-btn square-btn" data-popup-id="app_file-manager_newfile">&#x00B7;&#x00B7;&#x00B7;</div>
  <div id="app_file-manager_newfile" class="popup-menu" data-popup-origin-id="app_file-manager_addfile" style="position: absolute; right: 39px; top: 35px;">
    <div class="popup-menu-item" onclick="getFile('/apps/file-manager/create-file')();">New File&hellip;</div>
    <div class="popup-menu-item" onclick="getFile('/apps/file-manager/create-folder')();">New Folder&hellip;</div>
    <div class="popup-menu-item" onclick="getFile('/apps/file-manager/load')();">Refresh</div>
    <hr>
    <div class="popup-menu-item" id="app_file-manager_tileview" onclick="writeRef('/home/appdata/file-manager/view', 'tile'); document.getElementById('app_file-manager_listview').classList.remove('popup-menu-item-selected'); document.getElementById('app_file-manager_detailsview').classList.remove('popup-menu-item-selected'); this.classList.add('popup-menu-item-selected'); getFile('/apps/file-manager/load')();">Tile view</div>
    <div class="popup-menu-item popup-menu-item-selected" id="app_file-manager_listview" onclick="writeRef('/home/appdata/file-manager/view', 'list'); document.getElementById('app_file-manager_detailsview').classList.remove('popup-menu-item-selected'); document.getElementById('app_file-manager_tileview').classList.remove('popup-menu-item-selected'); this.classList.add('popup-menu-item-selected'); getFile('/apps/file-manager/load')();">List view</div>
    <div class="popup-menu-item" id="app_file-manager_detailsview" onclick="writeRef('/home/appdata/file-manager/view', 'details'); document.getElementById('app_file-manager_listview').classList.remove('popup-menu-item-selected'); document.getElementById('app_file-manager_tileview').classList.remove('popup-menu-item-selected'); this.classList.add('popup-menu-item-selected'); getFile('/apps/file-manager/load')();">Details view</div>
    <hr>
    <div class="popup-menu-item" onclick="getFile(prompt('Enter absolute path to program (e.g. /apps/settings/settings.pgm):'))();">Run program...</div>
    <div class="popup-menu-item" onclick="getFile('/apps/settings/settings')();">Settings</div>
  </div>
  <div id="app_file-manager_reload" class="square-btn" onclick="getFile('/apps/file-manager/load')();">&#x21BB;</div>
  <div id="app_file-manager_sidebar">
    <div class="app_file-manager_sidebar-heading">Personal Files</div>
    <div onclick="writeRef('/apps/file-manager/working-dir', '/home/documents'); getFile('/apps/file-manager/load')();">&#x1F5CE;&nbsp;Documents</div>
    <div onclick="writeRef('/apps/file-manager/working-dir', '/home/pictures'); getFile('/apps/file-manager/load')();">&#x1F5CE;&nbsp;Pictures</div>
    <div class="app_file-manager_sidebar-heading">System & App Files</div>
    <div onclick="writeRef('/apps/file-manager/working-dir', '/system'); getFile('/apps/file-manager/load')();">&#x1F5CE;&nbsp;System Dir</div>
    <div onclick="writeRef('/apps/file-manager/working-dir', '/home/appdata'); getFile('/apps/file-manager/load')();">&#x1F5CE;&nbsp;App Data</div>
  </div>
  <div id="app_file-manager_content"></div>
</div>
<style>
#app_file-manager_bar {
  width: calc(100% - 85px);
  height: 30px;
  border-radius: 0;
  padding: 5px;
  font: 15px var(--system-font-mono);
}
#app_file-manager_content {
  width: calc(100% - 151px);
  height: calc(100% - 44px);
  margin-left: 151px;
  overflow: auto;
}
#app_file-manager_sidebar {
  width: 150px;
  background: #FFF;
  border-right: 1px solid #AAA;
  height: calc(100% - 44px);
  float: left;
}
#app_file-manager_sidebar div:not(.app_file-manager_sidebar-heading) {
  width: 140px;
  height: 30px;
  font: 15px var(--system-font-main);
  background: #FFF;
  line-height: 30px;
  padding-left: 10px;
}
#app_file-manager_sidebar div:not(.app_file-manager_sidebar-heading):hover {
  background: #EEE;
}
#app_file-manager_sidebar div:not(.app_file-manager_sidebar-heading):active {
  background: #CCC;
}
.app_file-manager_sidebar-heading {
  width: 140px;
  height: 30px;
  font: bold 15px var(--system-font-main);
  background: #FFF;
  line-height: 30px;
  padding-left: 10px;
}
.app_file-manager_item {
  background: #FFF;
  color: #000;
  border-bottom: 1px solid #EEE;
  padding: 10px;
  font: 20px var(--system-font-mono);
  cursor: default;
}
.app_file-manager_item:hover {
  background: #EEE;
}
.app_file-manager_item:active {
  background: #CCC;
}
.app_file-manager_tile {
  display: inline-block;
  background: #FFF;
  color: #000;
  border: 1px solid #EEE;
  min-width: 100px;
  min-height: 100px;
  padding: 10px;
  margin: 10px;
  font: 20px var(--system-font-mono);
  text-align: center;
  cursor: default;
}
.app_file-manager_tile:hover {
  background: #EEE;
}
.app_file-manager_tile:active {
  background: #CCC;
}
.app_file-manager_details {
  font: 14px var(--system-font-mono);
  height: 30px;
  line-height: 30px;
  border-bottom: 1px solid #EEE;
}
.app_file-manager_details:hover {
  background: #EEE;
}
.app_file-manager_details:active {
  background: #CCC;
}
.app_file-manager_item-icon {
  width: 20px;
  height: 20px;
  transform: translate(0, 5px);
  margin-right: 10px;
}
.app_file-manager_tile .app_file-manager_item-icon {
  display: block;
  margin-top: 20px;
  width: 50px;
  height: 50px;
  transform: translate(50%);
}
.app_file-manager_details .app_file-manager_item-icon {
  width: 16px;
  height: 16px;
  transform: translate(5px, 3px);
}
.dark-theme #app_file-manager_window .window-content {
  background: #333;
  color: #FFF;
}
.dark-theme .app_file-manager_item {
  background: #333;
  color: #FFF;
  border-bottom: 1px solid #444;
}
.dark-theme .app_file-manager_item:hover {
  background: #444;
}
.dark-theme .app_file-manager_item:active {
  background: #808080;
}
.dark-theme .app_file-manager_tile {
  background: #333;
  color: #FFF;
  border: 1px solid #444;
}
.dark-theme .app_file-manager_tile:hover {
  background: #444;
}
.dark-theme .app_file-manager_tile:active {
  background: #808080;
}
.dark-theme .app_file-manager_details {
  border-bottom: 1px solid #444;
}
.dark-theme .app_file-manager_details:hover {
  background: #444;
}
.dark-theme .app_file-manager_details:active {
  background: #808080;
}
.dark-theme #app_file-manager_sidebar, .dark-theme .app_file-manager_sidebar-heading, .dark-theme #app_file-manager_sidebar div {
  background: #333;
  color: #FFF;
}
.dark-theme #app_file-manager_sidebar div:not(.app_file-manager_sidebar-heading):hover {
  background: #444;
}
.dark-theme #app_file-manager_sidebar div:not(.app_file-manager_sidebar-heading):active {
  background: #808080;
}
</style>
</div>`
        },
        "handler": {
          type: "js", 
          content: function(file, absolute = false) {
            if (getFile("/apps/file-manager/working-dir") == "/") {
              if (getDir(`/${file.replace(/\//, "")}`)) {
                writeRef("/apps/file-manager/working-dir", `${getFile("/apps/file-manager/working-dir")}${file.replace(/\//, "")}`);
                getFile("/apps/file-manager/load")();
              }
              else {}
            }
            else {}
            if (file == "/") {
              writeRef("/apps/file-manager/working-dir", "/");
              getFile("/apps/file-manager/load")();
            }
            else if (absolute == true && g.fs.exists(file) && getDir(file)) {
              writeRef("/apps/file-manager/working-dir", file);
              getFile("/apps/file-manager/load")();
            }
            else if (getFile(`${getFile("/apps/file-manager/working-dir")}/${file.replace(/\//, "")}`, true)?.type == "var") {
              msgbox(`Value:<br><br>${getDir(`${getFile("/apps/file-manager/working-dir")}/${file.replace(/\//, "")}`)}`);
            }
            else if (getFile(`${getFile("/apps/file-manager/working-dir")}/${file.replace(/\//, "")}`, true)?.type == "json") {
              if (getFile("/apps/text-editor/text-editor")) {
                getFile("/apps/text-editor/open")(`${getFile("/apps/file-manager/working-dir")}/${file.replace(/\//, "")}`);
              }
              else {
                msgbox(`Value:<br><br><div style="font: 15px var(--system-font-mono); white-space: pre;">${escapeHTML(JSON.stringify(getFile(`${getFile("/apps/file-manager/working-dir")}/${file.replace(/\//, "")}`), null, 2))}</div>`);
              }
            }
            else if (getFile("/system/text-filetypes").includes(getFile(`${getFile("/apps/file-manager/working-dir")}/${file.replace(/\//, "")}`, true)?.type)) {
              if (getFile("/apps/text-editor/text-editor")) {
                getFile("/apps/text-editor/open")(`${getFile("/apps/file-manager/working-dir")}/${file.replace(/\//, "")}`);
              }
              else {
                msgbox(`Value:<br><br><div style="font: 15px var(--system-font-mono); white-space: pre-wrap;">${getFile(`${getFile("/apps/file-manager/working-dir")}/${file.replace(/\//, "")}`)}</div>`);
              }
            }
            // TODO: can possibly remove below two cases
            else if (getFile(`${getFile("/apps/file-manager/working-dir")}/${file.replace(/\//, "")}`, true)?.type == "css") {
              msgbox(`Value:<br><br><div style="font: 15px var(--system-font-mono); white-space: pre-wrap;">${getFile(`${getFile("/apps/file-manager/working-dir")}/${file.replace(/\//, "")}`)}</div>`);
            }
            else if (["js", "ajs"].includes(getFile(`${getFile("/apps/file-manager/working-dir")}/${file.replace(/\//, "")}`, true)?.type)) {
              if (getFile("/apps/text-editor/text-editor")) {
                getFile("/apps/text-editor/open")(`${getFile("/apps/file-manager/working-dir")}/${file.replace(/\//, "")}`);
              }
              else {
                msgbox(`JavaScript content:<br><br><div style="font: 15px var(--system-font-mono); white-space: pre;">${escapeHTML(getFile(`${getFile("/apps/file-manager/working-dir")}/${file.replace(/\//, "")}`).toString())}</div>`);
              }
            }
            else if (getFile(`${getFile("/apps/file-manager/working-dir")}/${file.replace(/\//, "")}`, true)?.type == "bin") {
              msgbox(`Value (hexadecimal):<br><br><div style="font: 15px var(--system-font-mono); white-space: pre-wrap;">${[...getFile(`${getFile("/apps/file-manager/working-dir")}/${file.replace(/\//, "")}`)].map(b => b.toString(16).padStart(2, "0").toUpperCase()).join(" ")}</div>`);
            }
            else if (getFile(`${getFile("/apps/file-manager/working-dir")}/${file.replace(/\//, "")}`, true)?.type == "html") {
              if (getFile("/apps/text-editor/text-editor")) {
                getFile("/apps/text-editor/open")(`${getFile("/apps/file-manager/working-dir")}/${file.replace(/\//, "")}`);
              }
              else {
                msgbox(`HTML code:<br><br><div style="font: 15px var(--system-font-mono); white-space: pre;">${escapeHTML(getFile(`${getFile("/apps/file-manager/working-dir")}/${file.replace(/\//, "")}`).toString())}</div>`);
              }
            }
            else if (getFile(`${getFile("/apps/file-manager/working-dir")}/${file.replace(/\//, "")}`, true)?.type == "pgm") {
              getFile(`${getFile("/apps/file-manager/working-dir")}/${file.replace(/\//, "")}`)();
            }
            else if (getFile("/apps/file-manager/working-dir") != "/") {
              if (getDir(`${getFile("/apps/file-manager/working-dir")}/${file.replace(/\//, "")}`)) {
                writeRef("/apps/file-manager/working-dir", `${getFile("/apps/file-manager/working-dir")}/${file.replace(/\//, "")}`);
                getFile("/apps/file-manager/load")();
              }
              else {}
            }
            /*if (!getFile("/apps/file-manager/supported-filetypes").includes(getFile(`${getFile("/apps/file-manager/working-dir")}/${file.replace(/\//, "")}`, true).type) && getFile("/apps/file-manager/working-dir") != "/") {
              msgbox("<b>File type not supported</b><br>GopalOS cannot open this file.", "Error");
            }
            else {}*/
            document.getElementById("app_file-manager_bar").value = getFile("/apps/file-manager/working-dir");
          }
        },
        "parent-dir": {
          type: "js",
          content: function() {
            if (getFile("/apps/file-manager/working-dir").replace(/\/[^/]*$/, "") == "") {
              getFile("/apps/file-manager/handler")("/");
            }
            else {
              getFile("/apps/file-manager/handler")(getFile("/apps/file-manager/working-dir").replace(/\/[^/]*$/, ""), true);
            }
          }
        },
        "working-dir": {
          type: "var",
          content: "/"
        },
        "supported-filetypes": {
          type: "var",
          content: [
            "pgm",
            "js",
            "json",
            "txt",
            "var",
            "bin"
          ]
        },
        "view": {
          type: "var",
          content: "list"
        },
        "create-file": {
          type: "js",
          content: function() {
            let name = prompt("Enter file name and extension separated by a period (e.g. my-text-file.txt):\n\nWARNING: Do not use spaces, periods, or slashes. To prevent critical system errors, please stick to letters, numbers, hyphens, and underscores. It is recommended (but not required) that you use an all-lowercase name (however the extension MUST be lowercase).");
            if (!name || name.trim() == "") {}
            else if (["apps", "home", "system"].includes(name)) {msgbox("ERROR: Reserved name.", "File Manager");}
            else {
              g.fs.createFile(`${getFile("/apps/file-manager/working-dir")}/${name}`);
              getFile("/apps/file-manager/load")();
            }
          }
        },
        "create-folder": {
          type: "js",
          content: function() {
            let name = prompt("Enter folder name:\n\nWARNING: Do not use spaces, periods, or slashes. To prevent critical system errors, please stick to letters, numbers, hyphens, and underscores. It is recommended (but not required) that you use an all-lowercase name.");
            if (!name || name.trim() == "") {}
            else if (["apps", "home", "system"].includes(name)) {msgbox("ERROR: Reserved name.", "File Manager");}
            else {
              g.fs.createDir(`${getFile("/apps/file-manager/working-dir")}/${name}`);
              getFile("/apps/file-manager/load")();
            }
          }
        }
      }
    },
    "v4.2.1 (old)": {
      "version": "v4.2.1",
      "notice": "Does not support file/folder names with periods.",
      "app-files": {
        "file-manager": {
          type: "pgm",
          content: function() {
            if (document.getElementById("app_file-manager_window")) {
              document.getElementById("app_file-manager_window").style.display = "block";
            }
            else {
              document.getElementById("windows").insertAdjacentHTML("beforeend", getRef("/apps/file-manager/window"));
              getRef("/apps/file-manager/load")();
            }
            focusWin(document.getElementById("app_file-manager_window"));
            regTbarIcon("/apps/file-manager/file-manager", "app_file-manager_window", getRef("/apps/file-manager/icon"));
            refreshWindows();
          }
        },
        "icon": {
          type: "var",
          content: `<span class="material-symbols-outlined">apps</span>`
        },
        "load": {
          type: "js",
          content: function() {
            document.getElementById("app_file-manager_content").innerHTML = "";
            document.getElementById("app_file-manager_bar").value = getRef("/apps/file-manager/working-dir");
            if (!getRef("/home/appdata/file-manager")) {
              createRef("/home/appdata/file-manager", "dir", {});
              createRef("/home/appdata/file-manager/view", "var", "list");
            }
            else {}
            for (let i of Object.keys(getRef(getRef("/apps/file-manager/working-dir"))).sort((a, b) => a.toLowerCase().localeCompare(b.toLowerCase()))) {
              if (getRef(getRef("/apps/file-manager/working-dir"))[i].type == "dir") {
                document.getElementById("app_file-manager_content").insertAdjacentHTML("beforeend", `<div class="${getRef("/home/appdata/file-manager/view") == "list" ? "app_file-manager_item" : `app_file-manager_${getRef("/home/appdata/file-manager/view")}`}" onclick="getRef('/apps/file-manager/handler')(this.getElementsByTagName('span')[0].innerHTML);"><img src="${getIcon("dir")}" class="app_file-manager_item-icon"><span>${i}</span>/${getRef("/home/appdata/file-manager/view") == "details" ? "<span style=\"float: right; color: #AAA; margin-right: 5px; \">Folder</span>" : ""}</div>`);
              }
              else {}
            }
            for (let i of Object.keys(getRef(getRef("/apps/file-manager/working-dir"))).sort((a, b) => a.toLowerCase().localeCompare(b.toLowerCase()))) {
              if (getRef(getRef("/apps/file-manager/working-dir"))[i].type == "dir") {}
              else {
                document.getElementById("app_file-manager_content").insertAdjacentHTML("beforeend", `<div class="${getRef("/home/appdata/file-manager/view") == "list" ? "app_file-manager_item" : `app_file-manager_${getRef("/home/appdata/file-manager/view")}`}" onclick="getRef('/apps/file-manager/handler')(this.getElementsByTagName('span')[0].innerHTML);"><img src="${getIcon(getRef(getRef("/apps/file-manager/working-dir"))[i].type)}" class="app_file-manager_item-icon"><span>${i}.${getRef(getRef("/apps/file-manager/working-dir"))[i].type ? getRef(getRef("/apps/file-manager/working-dir"))[i].type : "file"}</span>${getRef("/home/appdata/file-manager/view") == "details" ? "<span style=\"float: right; color: #AAA; margin-right: 5px; \">" + getType(getRef(getRef("/apps/file-manager/working-dir"))[i].type) + (getRef(getRef("/apps/file-manager/working-dir"))[i].type == "var" ? ` (${getVarType(getRef(getRef("/apps/file-manager/working-dir"))[i].content)})` : "") + "</span>" : ""}</div>`);
              }
            }
            if (Object.keys(getRef(getRef("/apps/file-manager/working-dir"))).length == 0) {
              document.getElementById("app_file-manager_content").insertAdjacentHTML("beforeend", `<div class="${getRef("/home/appdata/file-manager/view") == "list" ? "app_file-manager_item" : `app_file-manager_${getRef("/home/appdata/file-manager/view")}`}" style="border: none; padding-left: 10px;"><span>(This folder is empty.)</span></div>`);
            }
            else {}
            if (getRef("/apps/file-manager/working-dir") == "/") {}
            else {
              document.getElementById("app_file-manager_content").insertAdjacentHTML("afterbegin", `<div class="${getRef("/home/appdata/file-manager/view") == "list" ? "app_file-manager_item" : `app_file-manager_${getRef("/home/appdata/file-manager/view")}`}" onclick="getRef('/apps/file-manager/parent-dir')();"><img src="${getIcon("parent-dir")}" class="app_file-manager_item-icon"><span>../</span>${getRef("/home/appdata/file-manager/view") == "details" ? "<span style=\"float: right; color: #AAA; margin-right: 5px; \">Up one level</span>" : ""}</div>`);
            }
            document.getElementById("app_file-manager_listview").classList.remove("popup-menu-item-selected");
            document.getElementById("app_file-manager_detailsview").classList.remove("popup-menu-item-selected");
            document.getElementById("app_file-manager_tileview").classList.remove("popup-menu-item-selected");
            document.getElementById(`app_file-manager_${getRef("/home/appdata/file-manager/view")}view`).classList.add("popup-menu-item-selected");
            createRef("/home/appdata/file-manager", "dir", {
              "view": {
                type: "var",
                content: "list"
              }
            });
          }
        },
        "window": {
          type: "html",
          content: `<div class="window" id="app_file-manager_window" style="top: 100px; left: 100px;">
<div class="window-title">File Manager</div>
<div class="window-controls">
  <div class="window-control window-control-minimize"><span>&#x1F5D5;</span></div>
  <div class="window-control window-control-maximize"><span>&#x1F5D6;</span></div>
  <div class="window-control window-control-close"><span>&#x274C;&#xFE0E;</span></div>
</div>
<div class="window-content">
  <input type="text" id="app_file-manager_bar" onblur="this.value = getRef('/apps/file-manager/working-dir');" value="/" readonly>
  <div id="app_file-manager_addfile" class="popup-btn square-btn" data-popup-id="app_file-manager_newfile">&#x00B7;&#x00B7;&#x00B7;</div>
  <div id="app_file-manager_newfile" class="popup-menu" data-popup-origin-id="app_file-manager_addfile" style="position: absolute; right: 39px; top: 35px;">
    <div class="popup-menu-item" onclick="getRef('/apps/file-manager/create-file')();">New File...</div>
    <div class="popup-menu-item" onclick="getRef('/apps/file-manager/create-folder')();">New Folder...</div>
    <div class="popup-menu-item" onclick="getRef('/apps/file-manager/load')();">Refresh</div>
    <hr>
    <div class="popup-menu-item" id="app_file-manager_tileview" onclick="writeRef('/home/appdata/file-manager/view', 'tile'); document.getElementById('app_file-manager_listview').classList.remove('popup-menu-item-selected'); document.getElementById('app_file-manager_detailsview').classList.remove('popup-menu-item-selected'); this.classList.add('popup-menu-item-selected'); getRef('/apps/file-manager/load')();">Tile view</div>
    <div class="popup-menu-item popup-menu-item-selected" id="app_file-manager_listview" onclick="writeRef('/home/appdata/file-manager/view', 'list'); document.getElementById('app_file-manager_detailsview').classList.remove('popup-menu-item-selected'); document.getElementById('app_file-manager_tileview').classList.remove('popup-menu-item-selected'); this.classList.add('popup-menu-item-selected'); getRef('/apps/file-manager/load')();">List view</div>
    <div class="popup-menu-item" id="app_file-manager_detailsview" onclick="writeRef('/home/appdata/file-manager/view', 'details'); document.getElementById('app_file-manager_listview').classList.remove('popup-menu-item-selected'); document.getElementById('app_file-manager_tileview').classList.remove('popup-menu-item-selected'); this.classList.add('popup-menu-item-selected'); getRef('/apps/file-manager/load')();">Details view</div>
    <hr>
    <div class="popup-menu-item" onclick="getRef(prompt('Enter absolute path to program (e.g. /apps/settings/settings.pgm):'))();">Run program...</div>
    <div class="popup-menu-item" onclick="getRef('/apps/settings/settings')();">Settings</div>
  </div>
  <div id="app_file-manager_reload" class="square-btn" onclick="getRef('/apps/file-manager/load')();">&#x21BB;</div>
  <div id="app_file-manager_sidebar">
    <div class="app_file-manager_sidebar-heading">Personal Files</div>
    <div onclick="writeRef('/apps/file-manager/working-dir', '/home/documents'); getRef('/apps/file-manager/load')();">&#x1F5CE;&nbsp;Documents</div>
    <div onclick="writeRef('/apps/file-manager/working-dir', '/home/pictures'); getRef('/apps/file-manager/load')();">&#x1F5CE;&nbsp;Pictures</div>
    <div class="app_file-manager_sidebar-heading">System & App Files</div>
    <div onclick="writeRef('/apps/file-manager/working-dir', '/system'); getRef('/apps/file-manager/load')();">&#x1F5CE;&nbsp;System Dir</div>
    <div onclick="writeRef('/apps/file-manager/working-dir', '/home/appdata'); getRef('/apps/file-manager/load')();">&#x1F5CE;&nbsp;App Data</div>
  </div>
  <div id="app_file-manager_content"></div>
</div>
<style>
#app_file-manager_bar {
  width: calc(100% - 85px);
  height: 30px;
  border-radius: 0;
  padding: 5px;
  font: 15px "Consolas", monospace;
}
#app_file-manager_content {
  width: calc(100% - 151px);
  height: calc(100% - 44px);
  margin-left: 151px;
  overflow: auto;
}
#app_file-manager_sidebar {
  width: 150px;
  background: #FFF;
  border-right: 1px solid #AAA;
  height: calc(100% - 44px);
  float: left;
}
#app_file-manager_sidebar div:not(.app_file-manager_sidebar-heading) {
  width: 140px;
  height: 30px;
  font: 15px "Segoe UI", "Arial", sans-serif;
  background: #FFF;
  line-height: 30px;
  padding-left: 10px;
}
#app_file-manager_sidebar div:not(.app_file-manager_sidebar-heading):hover {
  background: #EEE;
}
#app_file-manager_sidebar div:not(.app_file-manager_sidebar-heading):active {
  background: #CCC;
}
.app_file-manager_sidebar-heading {
  width: 140px;
  height: 30px;
  font: bold 15px "Segoe UI", "Arial", sans-serif;
  background: #FFF;
  line-height: 30px;
  padding-left: 10px;
}
.app_file-manager_item {
  background: #FFF;
  color: #000;
  border-bottom: 1px solid #EEE;
  padding: 10px;
  font: 20px "Consolas", monospace;
  cursor: default;
}
.app_file-manager_item:hover {
  background: #EEE;
}
.app_file-manager_item:active {
  background: #CCC;
}
.app_file-manager_tile {
  display: inline-block;
  background: #FFF;
  color: #000;
  border: 1px solid #EEE;
  min-width: 100px;
  min-height: 100px;
  padding: 10px;
  margin: 10px;
  font: 20px "Consolas", monospace;
  text-align: center;
  cursor: default;
}
.app_file-manager_tile:hover {
  background: #EEE;
}
.app_file-manager_tile:active {
  background: #CCC;
}
.app_file-manager_details {
  font: 14px "Consolas", monospace;
  height: 30px;
  line-height: 30px;
  border-bottom: 1px solid #EEE;
}
.app_file-manager_details:hover {
  background: #EEE;
}
.app_file-manager_details:active {
  background: #CCC;
}
.app_file-manager_item-icon {
  width: 20px;
  height: 20px;
  transform: translate(0, 5px);
  margin-right: 10px;
}
.app_file-manager_tile .app_file-manager_item-icon {
  display: block;
  margin-top: 20px;
  width: 50px;
  height: 50px;
  transform: translate(50%);
}
.app_file-manager_details .app_file-manager_item-icon {
  width: 16px;
  height: 16px;
  transform: translate(5px, 3px);
}
.dark-theme #app_file-manager_window .window-content {
  background: #333;
  color: #FFF;
}
.dark-theme .app_file-manager_item {
  background: #333;
  color: #FFF;
  border-bottom: 1px solid #444;
}
.dark-theme .app_file-manager_item:hover {
  background: #444;
}
.dark-theme .app_file-manager_item:active {
  background: #808080;
}
.dark-theme .app_file-manager_tile {
  background: #333;
  color: #FFF;
  border: 1px solid #444;
}
.dark-theme .app_file-manager_tile:hover {
  background: #444;
}
.dark-theme .app_file-manager_tile:active {
  background: #808080;
}
.dark-theme .app_file-manager_details {
  border-bottom: 1px solid #444;
}
.dark-theme .app_file-manager_details:hover {
  background: #444;
}
.dark-theme .app_file-manager_details:active {
  background: #808080;
}
.dark-theme #app_file-manager_sidebar, .dark-theme .app_file-manager_sidebar-heading, .dark-theme #app_file-manager_sidebar div {
  background: #333;
  color: #FFF;
}
.dark-theme #app_file-manager_sidebar div:not(.app_file-manager_sidebar-heading):hover {
  background: #444;
}
.dark-theme #app_file-manager_sidebar div:not(.app_file-manager_sidebar-heading):active {
  background: #808080;
}
</style>
</div>`
        },
        "handler": {
          type: "js", 
          content: function(file, absolute = false) {
            /*console.group("Handled file");
            console.info(file, absolute);
            console.info(`${getRef("/apps/file-manager/working-dir")}/${file.replace(/\//, "")}`);
            console.info(getRef(`${getRef("/apps/file-manager/working-dir")}/${file.replace(/\//, "")}`, true));
            console.info(getRef(`${getRef("/apps/file-manager/working-dir")}/${file.replace(/\//, "")}`, true).type);
            console.info(getRef(`${getRef("/apps/file-manager/working-dir")}/${file.replace(/\//, "")}`, true) && getRef(`${getRef("/apps/file-manager/working-dir")}/${file.replace(/\//, "")}`, true).type == "var");
            console.groupEnd();*/
            if (getRef("/apps/file-manager/working-dir") == "/") {
              if (getRef(`/${file.replace(/\//, "")}`, true) && getRef(`/${file.replace(/\//, "")}`, true).type == "dir") {
                writeRef("/apps/file-manager/working-dir", `${getRef("/apps/file-manager/working-dir")}${file.replace(/\//, "")}`);
                getRef("/apps/file-manager/load")();
              }
              else {}
            }
            else {}
            if (file == "/") {
              writeRef("/apps/file-manager/working-dir", "/");
              getRef("/apps/file-manager/load")();
            }
            else if (absolute == true && getRef(file, true) && getRef(file, true).type == "dir") {
              writeRef("/apps/file-manager/working-dir", file);
              getRef("/apps/file-manager/load")();
            }
            else if (getRef(`${getRef("/apps/file-manager/working-dir")}/${file.replace(/\//, "")}`, true) && getRef(`${getRef("/apps/file-manager/working-dir")}/${file.replace(/\//, "")}`, true).type == "var") {
              msgbox(`Value:<br><br>${getRef(`${getRef("/apps/file-manager/working-dir")}/${file.replace(/\//, "")}`)}`);
            }
            else if (getRef(`${getRef("/apps/file-manager/working-dir")}/${file.replace(/\//, "")}`, true) && getRef(`${getRef("/apps/file-manager/working-dir")}/${file.replace(/\//, "")}`, true).type == "json") {
              if (getRef("/apps/text-editor/text-editor")) {
                getRef("/apps/text-editor/open")(`${getRef("/apps/file-manager/working-dir")}/${file.replace(/\//, "")}`);
              }
              else {
                msgbox(`Value:<br><br><div style="font: 15px 'Consolas', monospace; white-space: pre;">${escapeHTML(JSON.stringify(getRef(`${getRef("/apps/file-manager/working-dir")}/${file.replace(/\//, "")}`), null, 2))}</div>`);
              }
            }
            else if (getRef("/system/text-filetypes").includes(getRef(`${getRef("/apps/file-manager/working-dir")}/${file.replace(/\//, "")}`, true) && getRef(`${getRef("/apps/file-manager/working-dir")}/${file.replace(/\//, "")}`, true).type)) {
              if (getRef("/apps/text-editor/text-editor")) {
                getRef("/apps/text-editor/open")(`${getRef("/apps/file-manager/working-dir")}/${file.replace(/\//, "")}`);
              }
              else {
                msgbox(`Value:<br><br><div style="font: 15px 'Consolas', monospace; white-space: pre-wrap;">${getRef(`${getRef("/apps/file-manager/working-dir")}/${file.replace(/\//, "")}`)}</div>`);
              }
            }
            // TODO: can possibly remove below two cases
            else if (getRef(`${getRef("/apps/file-manager/working-dir")}/${file.replace(/\//, "")}`, true) && getRef(`${getRef("/apps/file-manager/working-dir")}/${file.replace(/\//, "")}`, true).type == "css") {
              msgbox(`Value:<br><br><div style="font: 15px 'Consolas', monospace; white-space: pre-wrap;">${getRef(`${getRef("/apps/file-manager/working-dir")}/${file.replace(/\//, "")}`)}</div>`);
            }
            else if (["js", "ajs"].includes(getRef(`${getRef("/apps/file-manager/working-dir")}/${file.replace(/\//, "")}`, true) && getRef(`${getRef("/apps/file-manager/working-dir")}/${file.replace(/\//, "")}`, true).type)) {
              if (getRef("/apps/text-editor/text-editor")) {
                getRef("/apps/text-editor/open")(`${getRef("/apps/file-manager/working-dir")}/${file.replace(/\//, "")}`);
              }
              else {
                msgbox(`JavaScript content:<br><br><div style="font: 15px 'Consolas', monospace; white-space: pre;">${escapeHTML(getRef(`${getRef("/apps/file-manager/working-dir")}/${file.replace(/\//, "")}`).toString())}</div>`);
              }
            }
            else if (getRef(`${getRef("/apps/file-manager/working-dir")}/${file.replace(/\//, "")}`, true) && getRef(`${getRef("/apps/file-manager/working-dir")}/${file.replace(/\//, "")}`, true).type == "bin") {
              msgbox(`Value (hexadecimal):<br><br><div style="font: 15px 'Consolas', monospace; white-space: pre-wrap;">${[...getRef(`${getRef("/apps/file-manager/working-dir")}/${file.replace(/\//, "")}`)].map(b => b.toString(16).padStart(2, "0").toUpperCase()).join(" ")}</div>`);
            }
            else if (getRef(`${getRef("/apps/file-manager/working-dir")}/${file.replace(/\//, "")}`, true) && getRef(`${getRef("/apps/file-manager/working-dir")}/${file.replace(/\//, "")}`, true).type == "html") {
              if (getRef("/apps/text-editor/text-editor")) {
                getRef("/apps/text-editor/open")(`${getRef("/apps/file-manager/working-dir")}/${file.replace(/\//, "")}`);
              }
              else {
                msgbox(`HTML code:<br><br><div style="font: 15px 'Consolas', monospace; white-space: pre;">${escapeHTML(getRef(`${getRef("/apps/file-manager/working-dir")}/${file.replace(/\//, "")}`).toString())}</div>`);
              }
            }
            else if (getRef(`${getRef("/apps/file-manager/working-dir")}/${file.replace(/\//, "")}`, true) && getRef(`${getRef("/apps/file-manager/working-dir")}/${file.replace(/\//, "")}`, true).type == "pgm") {
              getRef(`${getRef("/apps/file-manager/working-dir")}/${file.replace(/\//, "")}`)();
            }
            else if (getRef("/apps/file-manager/working-dir") != "/") {
              if (getRef(`${getRef("/apps/file-manager/working-dir")}/${file.replace(/\//, "")}`, true) && getRef(`${getRef("/apps/file-manager/working-dir")}/${file.replace(/\//, "")}`, true).type == "dir") {
                writeRef("/apps/file-manager/working-dir", `${getRef("/apps/file-manager/working-dir")}/${file.replace(/\//, "")}`);
                getRef("/apps/file-manager/load")();
              }
              else {}
            }
            /*if (!getRef("/apps/file-manager/supported-filetypes").includes(getRef(`${getRef("/apps/file-manager/working-dir")}/${file.replace(/\//, "")}`, true).type) && getRef("/apps/file-manager/working-dir") != "/") {
              msgbox("<b>File type not supported</b><br>GopalOS cannot open this file.", "Error");
            }
            else {}*/
            document.getElementById("app_file-manager_bar").value = getRef("/apps/file-manager/working-dir");
          }
        },
        "parent-dir": {
          type: "js",
          content: function() {
            if (getRef("/apps/file-manager/working-dir").replace(/\/[^/]*$/, "") == "") {
              getRef("/apps/file-manager/handler")("/");
            }
            else {
              getRef("/apps/file-manager/handler")(getRef("/apps/file-manager/working-dir").replace(/\/[^/]*$/, ""), true);
            }
          }
        },
        "working-dir": {
          type: "var",
          content: "/"
        },
        "supported-filetypes": {
          type: "var",
          content: [
            "pgm",
            "js",
            "json",
            "txt",
            "var",
            "bin"
          ]
        },
        "view": {
          type: "var",
          content: "list"
        },
        "create-file": {
          type: "js",
          content: function() {
            let name = prompt("Enter file name and extension separated by a period (e.g. my-text-file.txt):\n\nWARNING: Do not use spaces, periods, or slashes. To prevent critical system errors, please stick to letters, numbers, hyphens, and underscores. It is recommended (but not required) that you use an all-lowercase name (however the extension MUST be lowercase).");
            if (!name || name.trim() == "") {}
            else if (["apps", "home", "system"].includes(name)) {msgbox("ERROR: Reserved name.", "File Manager");}
            else {
              let nameArr = name.split(".");
              createRef(`${getRef("/apps/file-manager/working-dir")}/${nameArr[0]}`, nameArr[1]);
              getRef("/apps/file-manager/load")();
            }
          }
        },
        "create-folder": {
          type: "js",
          content: function() {
            let name = prompt("Enter folder name:\n\nWARNING: Do not use spaces, periods, or slashes. To prevent critical system errors, please stick to letters, numbers, hyphens, and underscores. It is recommended (but not required) that you use an all-lowercase name.");
            if (!name || name.trim() == "") {}
            else if (["apps", "home", "system"].includes(name)) {msgbox("ERROR: Reserved name.", "File Manager");}
            else {
              createRef(`${getRef("/apps/file-manager/working-dir")}/${name}`, "dir");
              getRef("/apps/file-manager/load")();
            }
          }
        }
      }
    },
    "v4.1.4 (very old)": {
      "version": "v4.1.4",
      "notice": "This is an unsupported version and will be removed soon.",
      "app-files": {
        "file-manager": {
          type: "pgm",
          content: function() {
            if (document.getElementById("app_file-manager_window")) {
              document.getElementById("app_file-manager_window").style.display = "block";
            }
            else {
              document.getElementById("windows").insertAdjacentHTML("beforeend", getRef("/apps/file-manager/window"));
              getRef("/apps/file-manager/load")();
            }
            focusWin(document.getElementById("app_file-manager_window"));
            regTbarIcon("/apps/file-manager/file-manager", "app_file-manager_window", getRef("/apps/file-manager/icon"));
            refreshWindows();
          }
        },
        "icon": {
          type: "var",
          content: "\u{1F4C1}\uFE0E"
        },
        "load": {
          type: "js",
          content: function() {
            document.getElementById("app_file-manager_content").innerHTML = "";
            document.getElementById("app_file-manager_bar").value = getRef("/apps/file-manager/working-dir");
            for (let i of Object.keys(getRef(getRef("/apps/file-manager/working-dir"))).sort()) {
              if (getRef(getRef("/apps/file-manager/working-dir"))[i].type == "dir") {
                document.getElementById("app_file-manager_content").insertAdjacentHTML("beforeend", `<div class="${getRef("/home/appdata/file-manager/view") == "list" ? "app_file-manager_item" : `app_file-manager_${getRef("/home/appdata/file-manager/view")}`}" onclick="getRef('/apps/file-manager/handler')(this.getElementsByTagName('span')[0].innerHTML);"><img src="${getIcon(getRef(getRef("/apps/file-manager/working-dir"))[i].type)}" class="app_file-manager_item-icon"><span>${i}.${getRef(getRef("/apps/file-manager/working-dir"))[i].type ? getRef(getRef("/apps/file-manager/working-dir"))[i].type : "file"}</span>${getRef("/home/appdata/file-manager/view") == "details" ? "<span style=\"float: right; color: #AAA; margin-right: 5px; \">" + getType(getRef(getRef("/apps/file-manager/working-dir"))[i].type) + (getRef(getRef("/apps/file-manager/working-dir"))[i].type == "var" ? ` (${getVarType(getRef(getRef("/apps/file-manager/working-dir"))[i].content)})` : "") + "</span>" : ""}</div>`);
              }
              else {}
            }
            for (let i of Object.keys(getRef(getRef("/apps/file-manager/working-dir"))).sort()) {
              if (getRef(getRef("/apps/file-manager/working-dir"))[i].type == "dir") {}
              else {
                document.getElementById("app_file-manager_content").insertAdjacentHTML("beforeend", `<div class="${getRef("/home/appdata/file-manager/view") == "list" ? "app_file-manager_item" : `app_file-manager_${getRef("/home/appdata/file-manager/view")}`}" onclick="getRef('/apps/file-manager/handler')(this.getElementsByTagName('span')[0].innerHTML);"><img src="${getIcon(getRef(getRef("/apps/file-manager/working-dir"))[i].type)}" class="app_file-manager_item-icon"><span>${i}.${getRef(getRef("/apps/file-manager/working-dir"))[i].type ? getRef(getRef("/apps/file-manager/working-dir"))[i].type : "file"}</span>${getRef("/home/appdata/file-manager/view") == "details" ? "<span style=\"float: right; color: #AAA; margin-right: 5px; \">" + getType(getRef(getRef("/apps/file-manager/working-dir"))[i].type) + "</span>" : ""}</div>`);
              }
            }
            if (getRef("/apps/file-manager/working-dir") == "/") {}
            else {
              document.getElementById("app_file-manager_content").insertAdjacentHTML("afterbegin", `<div class="${getRef("/home/appdata/file-manager/view") == "list" ? "app_file-manager_item" : `app_file-manager_${getRef("/home/appdata/file-manager/view")}`}" onclick="getRef('/apps/file-manager/parent-dir')();"><img src="${getIcon("parent-dir")}" class="app_file-manager_item-icon"><span>../</span>${getRef("/home/appdata/file-manager/view") == "details" ? "<span style=\"float: right; color: #AAA; margin-right: 5px; \">Up one level</span>" : ""}</div>`);
            }
            document.getElementById("app_file-manager_listview").classList.remove("popup-menu-item-selected");
            document.getElementById("app_file-manager_detailsview").classList.remove("popup-menu-item-selected");
            document.getElementById("app_file-manager_tileview").classList.remove("popup-menu-item-selected");
            document.getElementById(`app_file-manager_${getRef("/home/appdata/file-manager/view")}view`).classList.add("popup-menu-item-selected");
            createRef("/home/appdata/text-editor", "dir", {
              "options": {
                type: "json",
                content: {
                  "allowPGMEditing": false
                }
              }
            });
          }
        },
        "window": {
          type: "html",
          content: `<div class="window" id="app_file-manager_window" style="top: 100px; left: 100px;">
<div class="window-title">File Manager</div>
<div class="window-controls">
  <div class="window-control window-control-minimize"><span>&#x1F5D5;</span></div>
  <div class="window-control window-control-maximize"><span>&#x1F5D6;</span></div>
  <div class="window-control window-control-close"><span>&#x274C;&#xFE0E;</span></div>
</div>
<div class="window-content">
  <input type="text" id="app_file-manager_bar" onblur="this.value = getRef('/apps/file-manager/working-dir');" value="/" readonly>
  <div id="app_file-manager_addfile" class="popup-btn" data-popup-id="app_file-manager_newfile">&#x00B7;&#x00B7;&#x00B7;</div>
  <div id="app_file-manager_newfile" class="popup-menu" data-popup-origin-id="app_file-manager_addfile" style="position: absolute; right: 39px; top: 35px;">
    <div class="popup-menu-item" onclick="getRef('/apps/file-manager/create-file')();">New File...</div>
    <div class="popup-menu-item" onclick="getRef('/apps/file-manager/create-folder')();">New Folder...</div>
    <div class="popup-menu-item" onclick="getRef('/apps/file-manager/load')();">Refresh</div>
    <hr>
    <div class="popup-menu-item" id="app_file-manager_tileview" onclick="writeRef('/home/appdata/file-manager/view', 'tile'); document.getElementById('app_file-manager_listview').classList.remove('popup-menu-item-selected'); document.getElementById('app_file-manager_detailsview').classList.remove('popup-menu-item-selected'); this.classList.add('popup-menu-item-selected'); getRef('/apps/file-manager/load')();">Tile view</div>
    <div class="popup-menu-item popup-menu-item-selected" id="app_file-manager_listview" onclick="writeRef('/home/appdata/file-manager/view', 'list'); document.getElementById('app_file-manager_detailsview').classList.remove('popup-menu-item-selected'); document.getElementById('app_file-manager_tileview').classList.remove('popup-menu-item-selected'); this.classList.add('popup-menu-item-selected'); getRef('/apps/file-manager/load')();">List view</div>
    <div class="popup-menu-item" id="app_file-manager_detailsview" onclick="writeRef('/home/appdata/file-manager/view', 'details'); document.getElementById('app_file-manager_listview').classList.remove('popup-menu-item-selected'); document.getElementById('app_file-manager_tileview').classList.remove('popup-menu-item-selected'); this.classList.add('popup-menu-item-selected'); getRef('/apps/file-manager/load')();">Details view</div>
    <hr>
    <div class="popup-menu-item" onclick="getRef(prompt('Enter absolute path to program (e.g. /apps/settings/settings.pgm):'))();">Run program...</div>
    <div class="popup-menu-item" onclick="getRef('/apps/settings/settings')();">Settings</div>
  </div>
  <div id="app_file-manager_reload" onclick="getRef('/apps/file-manager/load')();">&#x21BB;</div>
  <div id="app_file-manager_sidebar">
    <div class="app_file-manager_sidebar-heading">Personal Files</div>
    <div onclick="writeRef('/apps/file-manager/working-dir', '/home/documents'); getRef('/apps/file-manager/load')();">&#x1F5CE;&nbsp;Documents</div>
    <div onclick="writeRef('/apps/file-manager/working-dir', '/home/pictures'); getRef('/apps/file-manager/load')();">&#x1F5CE;&nbsp;Pictures</div>
    <div class="app_file-manager_sidebar-heading">System & App Files</div>
    <div onclick="writeRef('/apps/file-manager/working-dir', '/system'); getRef('/apps/file-manager/load')();">&#x1F5CE;&nbsp;System Dir</div>
    <div onclick="writeRef('/apps/file-manager/working-dir', '/home/appdata'); getRef('/apps/file-manager/load')();">&#x1F5CE;&nbsp;App Data</div>
  </div>
  <div id="app_file-manager_content"></div>
</div>
<style>
#app_file-manager_bar {
  width: calc(100% - 85px);
  height: 30px;
  border-radius: 0;
  padding: 5px;
  font: 15px "Consolas", monospace;
}
#app_file-manager_reload, #app_file-manager_addfile {
  background: #EEE;
  border: none;
  border-radius: 2px;
  font: 20px "Segoe UI", "Arial", sans-serif !important;
  line-height: 28px;
  font-weight: bold;
  text-align: center;
  display: inline-block;
  width: 30px;
  height: 30px;
  cursor: pointer;
}
#app_file-manager_reload:hover, #app_file-manager_addfile:hover {
  background: #DDD;
}
#app_file-manager_reload:active, #app_file-manager_addfile:active {
  background: #CCC;
}
#app_file-manager_content {
  width: calc(100% - 151px);
  height: calc(100% - 44px);
  margin-left: 151px;
  overflow: auto;
}
#app_file-manager_sidebar {
  width: 150px;
  background: #FFF;
  border-right: 1px solid #AAA;
  height: calc(100% - 44px);
  float: left;
}
#app_file-manager_sidebar div:not(.app_file-manager_sidebar-heading) {
  width: 140px;
  height: 30px;
  font: 15px "Segoe UI", "Arial", sans-serif;
  background: #FFF;
  line-height: 30px;
  padding-left: 10px;
}
#app_file-manager_sidebar div:not(.app_file-manager_sidebar-heading):hover {
  background: #EEE;
}
#app_file-manager_sidebar div:not(.app_file-manager_sidebar-heading):active {
  background: #CCC;
}
.app_file-manager_sidebar-heading {
  width: 140px;
  height: 30px;
  font: bold 15px "Segoe UI", "Arial", sans-serif;
  background: #FFF;
  line-height: 30px;
  padding-left: 10px;
}
.app_file-manager_item {
  background: #FFF;
  color: #000;
  border-bottom: 1px solid #EEE;
  padding: 10px;
  font: 20px "Consolas", monospace;
  cursor: default;
}
.app_file-manager_item:hover {
  background: #EEE;
}
.app_file-manager_item:active {
  background: #CCC;
}
.app_file-manager_tile {
  display: inline-block;
  background: #FFF;
  color: #000;
  border: 1px solid #EEE;
  min-width: 100px;
  min-height: 100px;
  padding: 10px;
  margin: 10px;
  font: 20px "Consolas", monospace;
  text-align: center;
  cursor: default;
}
.app_file-manager_tile:hover {
  background: #EEE;
}
.app_file-manager_tile:active {
  background: #CCC;
}
.app_file-manager_details {
  font: 16px "Consolas", monospace;
  height: 25px;
  line-height: 25px;
}
.app_file-manager_details:hover {
  background: #EEE;
}
.app_file-manager_details:active {
  background: #CCC;
}
.app_file-manager_item-icon {
  width: 20px;
  height: 20px;
  transform: translate(0, 5px);
  margin-right: 10px;
}
.app_file-manager_tile .app_file-manager_item-icon {
  display: block;
  margin-top: 20px;
  width: 50px;
  height: 50px;
  transform: translate(50%);
}
.app_file-manager_details .app_file-manager_item-icon {
  width: 16px;
  height: 16px;
  transform: translate(5px, 3px);
}
.dark-theme #app_file-manager_window .window-content {
  background: #333;
  color: #FFF;
}
.dark-theme #app_file-manager_reload, .dark-theme #app_file-manager_addfile {
  background: #555;
}
.dark-theme #app_file-manager_reload:hover, .dark-theme #app_file-manager_addfile:hover {
  background: #808080;
}
.dark-theme #app_file-manager_reload:active, .dark-theme #app_file-manager_addfile:active {
  background: #AAA;
}
.dark-theme .app_file-manager_item {
  background: #333;
  color: #FFF;
  border-bottom: 1px solid #808080;
}
.dark-theme .app_file-manager_item:hover {
  background: #444;
}
.dark-theme .app_file-manager_item:active {
  background: #808080;
}
.dark-theme .app_file-manager_tile {
  background: #333;
  color: #FFF;
  border: 1px solid #808080;
}
.dark-theme .app_file-manager_tile:hover {
  background: #444;
}
.dark-theme .app_file-manager_tile:active {
  background: #808080;
}
.dark-theme .app_file-manager_details:hover {
  background: #444;
}
.dark-theme .app_file-manager_details:active {
  background: #808080;
}
.dark-theme #app_file-manager_sidebar, .dark-theme .app_file-manager_sidebar-heading, .dark-theme #app_file-manager_sidebar div {
  background: #333;
  color: #FFF;
}
.dark-theme #app_file-manager_sidebar div:not(.app_file-manager_sidebar-heading):hover {
  background: #444;
}
.dark-theme #app_file-manager_sidebar div:not(.app_file-manager_sidebar-heading):active {
  background: #808080;
}
</style>
</div>`
        },
        "handler": {
          type: "js", 
          content: function(file, absolute = false) {
            /*console.group("Handled file");
            console.info(file, absolute);
            console.info(`${getRef("/apps/file-manager/working-dir")}/${file.replace(/\//, "")}`);
            console.info(getRef(`${getRef("/apps/file-manager/working-dir")}/${file.replace(/\//, "")}`, true));
            console.info(getRef(`${getRef("/apps/file-manager/working-dir")}/${file.replace(/\//, "")}`, true).type);
            console.info(getRef(`${getRef("/apps/file-manager/working-dir")}/${file.replace(/\//, "")}`, true) && getRef(`${getRef("/apps/file-manager/working-dir")}/${file.replace(/\//, "")}`, true).type == "var");
            console.groupEnd();*/
            if (getRef("/apps/file-manager/working-dir") == "/") {
              if (getRef(`/${file.replace(/\//, "")}`, true) && getRef(`/${file.replace(/\//, "")}`, true).type == "dir") {
                writeRef("/apps/file-manager/working-dir", `${getRef("/apps/file-manager/working-dir")}${file.replace(/\//, "")}`);
                getRef("/apps/file-manager/load")();
              }
              else {}
            }
            else {}
            if (file == "/") {
              writeRef("/apps/file-manager/working-dir", "/");
              getRef("/apps/file-manager/load")();
            }
            else if (absolute == true && getRef(file, true) && getRef(file, true).type == "dir") {
              writeRef("/apps/file-manager/working-dir", file);
              getRef("/apps/file-manager/load")();
            }
            else if (getRef(`${getRef("/apps/file-manager/working-dir")}/${file.replace(/\//, "")}`, true) && getRef(`${getRef("/apps/file-manager/working-dir")}/${file.replace(/\//, "")}`, true).type == "var") {
              msgbox(`Value:<br><br>${getRef(`${getRef("/apps/file-manager/working-dir")}/${file.replace(/\//, "")}`)}`);
            }
            else if (getRef(`${getRef("/apps/file-manager/working-dir")}/${file.replace(/\//, "")}`, true) && getRef(`${getRef("/apps/file-manager/working-dir")}/${file.replace(/\//, "")}`, true).type == "json") {
              msgbox(`Value:<br><br><div style="font: 15px 'Consolas', monospace; white-space: pre;">${escapeHTML(JSON.stringify(getRef(`${getRef("/apps/file-manager/working-dir")}/${file.replace(/\//, "")}`), null, 2))}</div>`);
            }
            else if (getRef(`${getRef("/apps/file-manager/working-dir")}/${file.replace(/\//, "")}`, true) && getRef(`${getRef("/apps/file-manager/working-dir")}/${file.replace(/\//, "")}`, true).type == "txt") {
              msgbox(`Value:<br><br><div style="font: 15px 'Consolas', monospace; white-space: pre-wrap;">${getRef(`${getRef("/apps/file-manager/working-dir")}/${file.replace(/\//, "")}`)}</div>`);
            }
            else if (getRef(`${getRef("/apps/file-manager/working-dir")}/${file.replace(/\//, "")}`, true) && getRef(`${getRef("/apps/file-manager/working-dir")}/${file.replace(/\//, "")}`, true).type == "css") {
              msgbox(`Value:<br><br><div style="font: 15px 'Consolas', monospace; white-space: pre-wrap;">${getRef(`${getRef("/apps/file-manager/working-dir")}/${file.replace(/\//, "")}`)}</div>`);
            }
            else if (getRef(`${getRef("/apps/file-manager/working-dir")}/${file.replace(/\//, "")}`, true) && getRef(`${getRef("/apps/file-manager/working-dir")}/${file.replace(/\//, "")}`, true).type == "js") {
              msgbox(`JavaScript content:<br><br><div style="font: 15px 'Consolas', monospace; white-space: pre;">${escapeHTML(getRef(`${getRef("/apps/file-manager/working-dir")}/${file.replace(/\//, "")}`).toString())}</div>`);
            }
            else if (getRef(`${getRef("/apps/file-manager/working-dir")}/${file.replace(/\//, "")}`, true) && getRef(`${getRef("/apps/file-manager/working-dir")}/${file.replace(/\//, "")}`, true).type == "html") {
              msgbox(`HTML code:<br><br><div style="font: 15px 'Consolas', monospace; white-space: pre;">${escapeHTML(getRef(`${getRef("/apps/file-manager/working-dir")}/${file.replace(/\//, "")}`).toString())}</div>`);
            }
            else if (getRef(`${getRef("/apps/file-manager/working-dir")}/${file.replace(/\//, "")}`, true) && getRef(`${getRef("/apps/file-manager/working-dir")}/${file.replace(/\//, "")}`, true).type == "pgm") {
              getRef(`${getRef("/apps/file-manager/working-dir")}/${file.replace(/\//, "")}`)();
            }
            else if (getRef("/apps/file-manager/working-dir") != "/") {
              if (getRef(`${getRef("/apps/file-manager/working-dir")}/${file.replace(/\//, "")}`, true) && getRef(`${getRef("/apps/file-manager/working-dir")}/${file.replace(/\//, "")}`, true).type == "dir") {
                writeRef("/apps/file-manager/working-dir", `${getRef("/apps/file-manager/working-dir")}/${file.replace(/\//, "")}`);
                getRef("/apps/file-manager/load")();
              }
              else {}
            }
            /*if (!getRef("/apps/file-manager/supported-filetypes").includes(getRef(`${getRef("/apps/file-manager/working-dir")}/${file.replace(/\//, "")}`, true).type) && getRef("/apps/file-manager/working-dir") != "/") {
              msgbox("<b>File type not supported</b><br>GopalOS cannot open this file.", "Error");
            }
            else {}*/
            document.getElementById("app_file-manager_bar").value = getRef("/apps/file-manager/working-dir");
          }
        },
        "parent-dir": {
          type: "js",
          content: function() {
            if (getRef("/apps/file-manager/working-dir").replace(/\/[^/]*$/, "") == "") {
              getRef("/apps/file-manager/handler")("/");
            }
            else {
              getRef("/apps/file-manager/handler")(getRef("/apps/file-manager/working-dir").replace(/\/[^/]*$/, ""), true);/*TODO*/
            }
          }
        },
        "working-dir": {
          type: "var",
          content: "/"
        },
        "supported-filetypes": {
          type: "var",
          content: [
            "pgm",
            "js",
            "json",
            "txt",
            "var"
          ]
        },
        "create-file": {
          type: "js",
          content: function() {
            let name = prompt("Enter file name and extension separated by a period (e.g. my-text-file.txt):\n\nWARNING: Do not use spaces, periods, or slashes. To prevent critical system errors, please stick to letters, numbers, hyphens, and underscores. It is HIGHLY RECOMMENDED (but not required) that you use an all-lowercase name (however the extension MUST be lowercase).");
            if (!name || name.trim() == "") {}
            else if (["apps", "home", "system"].includes(name)) {msgbox("ERROR: Reserved name.", "File Manager");}
            else {
              let nameArr = name.split(".");
              createRef(`${getRef("/apps/file-manager/working-dir")}/${nameArr[0]}`, nameArr[1]);
              getRef("/apps/file-manager/load")();
            }
          }
        },
        "create-folder": {
          type: "js",
          content: function() {
            let name = prompt("Enter folder name:\n\nWARNING: Do not use spaces, periods, or slashes. To prevent critical system errors, please stick to letters, numbers, hyphens, and underscores. It is HIGHLY RECOMMENDED (but not required) that you use an all-lowercase name.");
            if (!name || name.trim() == "") {}
            else if (["apps", "home", "system"].includes(name)) {msgbox("ERROR: Reserved name.", "File Manager");}
            else {
              createRef(`${getRef("/apps/file-manager/working-dir")}/${name}`, "dir");
              getRef("/apps/file-manager/load")();
            }
          }
        }
      }
    }
  }
}