|
123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294 |
- (function() {
-
- window.setView = setView;
-
- var root = $$("#root");
-
- var views = {
- login: viewLogin,
- main: viewMain,
- edit: viewEdit
- }
-
- function setView(name, args) {
- if (args)
- location.hash = name+"/"+args.join("/");
- else
- location.hash = name+"/";
- }
-
- function viewLogin(root) {
- var msg;
- var pwd;
- elem("form", {}, [
- msg = elem("div", {
- className: "msg",
- innerHTML: "Log In"
- }),
-
- pwd = elem("input", {
- type: "password",
- placeholder: "Password"
- }),
-
- elem("button", {
- innerHTML: "Log In"
- })
- ]).on("submit", evt => {
- evt.preventDefault();
-
- apiLogin(pwd.value, success => {
- if (success)
- setView("main");
- else
- msg.innerHTML = "Incorrect password."
- });
- }).appendTo(root);
- }
-
- function viewMain(root) {
-
- // New slide button
- elem("button", {
- className: "newSlide",
- innerHTML: "New Slide"
- }).on("click", () => {
- api("slide_create", {}, (err, id) => {
- if (err)
- return error(err);
-
- setView("edit", [id]);
- });
- }).appendTo(root);
-
- var slidesEl = elem("div", {
- className: "slides"
- }).appendTo(root);
-
- // Get a list of the slides
- api("list_slides", {}, (err, slides) => {
- if (err)
- return error(err);
-
- slides.forEach(function(s) {
-
- // Create a div for each slide
- var el = elem("a", {
- className: "slide",
- href: "#edit/"+s
- }, [
- elem("div", {
- className: "name",
- innerText: s
- }),
-
- elem("iframe", {
- className: "preview",
- src: "/"+s+"/"
- }),
-
- elem("div", {
- className: "overlay"
- })
- ]).appendTo(slidesEl);
-
- // Add 'disabled' to the class if it's disabled
- api("slide_meta", { slide: s }, (err, res) => {
- if (err)
- return error(err);
-
- if (res.disabled)
- el.addClass("disabled");
- });
- });
- });
- }
-
- function viewEdit(root, slide) {
- if (!slide) {
- error("No slide provided.");
- setView("main");
- return;
- }
-
- var fileListEl;
- var htmlTextEl;
- var previewEl;
- var metaDisabledEl;
-
- function populateFileList() {
- api("slide_file_list", { slide: slide }, (err, res) => {
- fileListEl.clear();
- if (err)
- return error(err);
-
- res.files.forEach(f => {
- elem("div", { className: "file" }, [
- elem("span", {
- className: "name",
- innerText: f
- }),
-
- elem("span", { className: "controls" }, [
- elem("button", {
- className: "rename",
- innerText: "Rename"
- }).on("click", () => {
- var nwname = prompt("New name?", f);
- if (!nwname)
- return;
-
- api("slide_file_rename", {
- slide: slide,
- from: f,
- to: nwname
- }, populateFileList);
- }),
-
- elem("button", {
- className: "delete",
- innerText: "Delete"
- }).on("click", () => {
- if (!confirm("Are you sure you want to delete "+f+"?"))
- return;
-
- api("slide_file_delete", {
- slide: slide,
- file: f
- }, populateFileList);
- })
- ])
- ]).appendTo(fileListEl);
- });
- });
- }
-
- function populateMeta() {
- api("slide_get_meta", { slide: slide }, (err, obj) => {
- if (err)
- return error(err);
-
- metaDisabledEl.checked = !!obj.disabled;
- });
- }
-
- elem("div", { id: "slide" }, [
- elem("div", { id: "topBar" }, [
- elem("a", {
- href: "#main",
- innerText: "Back"
- }),
-
- elem("span", {
- className: "name",
- innerText: slide
- })
- ]),
-
- elem("div", {
- id: "formatTips",
- innerHTML: $$("#formatTipsTmpl").innerHTML
- }),
-
- fileListEl = elem("div", { id: "fileList" }),
-
- elem("div", { id: "controls" }, [
- uploadEl({
- slide: slide
- }, populateFileList),
-
- elem("button", {
- className: "delete",
- innerHTML: "Delete"
- }).on("click", () => {
- if (!confirm("Are you sure you want to delete slide "+slide+"?"))
- return;
-
- api("slide_delete", { slide: slide }, err => {
- if (err)
- return error(err);
-
- setView("main");
- });
- }),
-
- elem("label", { innerHTML: "Disabled" }, [
- metaDisabledEl = elem("input", {
- type: "checkbox"
- }).on("change", (evt, el) => {
- api("slide_set_meta", {
- slide: slide,
- key: "disabled",
- val: JSON.stringify(!!el.checked)
- }, populateMeta);
- })
- ]),
- ]),
-
- htmlTextEl = elem("textarea", {
- id: "html"
- }).on("keydown", debounce(() => {
- api("slide_content_update", {
- slide: slide,
- text: htmlTextEl.value
- }, err => {
- if (err)
- error(err);
-
- previewEl.src = previewEl.src;
- });
- })),
-
- previewEl = elem("iframe", {
- id: "preview",
- src: "/"+slide+"/"
- })
- ]).appendTo(root);
-
- populateFileList();
- populateMeta();
-
- api("slide_meta", { slide: slide }, (err, res) => {
- if (err) {
- error(err);
- setView("main");
- }
-
- //metaDisabledEl.checked = !!res.disabled;
- });
-
- api("slide_content", { slide: slide }, (err, html) => {
- if (err)
- return error(err);
-
- htmlTextEl.innerHTML = html.text;
- });
-
- }
-
- function route() {
- var name, args;
- if (location.hash.substring(1)) {
- args = location.hash.substring(1).split("/");
- name = args[0];
- args.splice(0, 1);
- if (!views[name])
- name = "login"
- } else {
- name = "login";
- }
-
- args = args || [];
- args.splice(0, 0, root);
- root.clear();
- root.className = name;
-
- views[name].apply(null, args);
-
- window.scrollTo(0, 0);
- }
-
- route();
-
- window.onhashchange = route;
- })();
|