diff --git a/dist/js/main.js b/dist/js/main.js index 2f6eae4..cc2df6c 100644 --- a/dist/js/main.js +++ b/dist/js/main.js @@ -1,4 +1,12 @@ (function(){ + // Global state variable + let state = { + file: { + files: [], + file_counter: 0, + } + }; + Element.prototype.insertAfter = function(element) { element.parentNode.insertBefore(this, element.nextSibling); }; @@ -238,6 +246,40 @@ rightbar_frame.height = rbar_frame_win.document.body.scrollHeight; } + function construct_file_upload(file) + { + let container = document.createElement("div"); + container.className = "file-upload"; + let content = document.createElement("div"); + let info = document.createElement("span"); + info.className = "upload-info"; + content.className = "upload-content"; + container.appendChild(content); + container.appendChild(info); + return container; + } + + function evt_file_upload(e) + { + let file_upload_dom = this.closest("form").querySelector(".file-uploads-container"); + file_upload_dom.className = "file-uploads-container"; + const files = [...this.files]; + + // let reader = new FileReader(); + + // reader.onload = (() => { + // return (e) => { + // // do shit + // } + // })(files[0]); + + // Create file upload + for (let file of files) + { + file_upload_dom.appendChild(construct_file_upload(files)); + } + } + // Main (when loaded) document.addEventListener('DOMContentLoaded', () => { let reply_btn = document.getElementsByClassName("reply-btn"); @@ -262,5 +304,9 @@ // File upload let file_input = document.querySelector("input[type=file]"); + if (file_input) + { + file_input.addEventListener('change', evt_file_upload); + } }); })(); diff --git a/dist/treebird.css b/dist/treebird.css index 8e3f3aa..155e462 100644 --- a/dist/treebird.css +++ b/dist/treebird.css @@ -2068,6 +2068,22 @@ input[type=checkbox].hidden:not(:checked) + .list-edit-content text-shadow: 0px 1px 0px rgba(0, 0, 0, 0.2); } +.file-uploads-container +{ + margin-top: 8px; +} + +.file-uploads-container .file-upload +{ + display: inline-block; + height: 130px; + margin-left: 4px; + width: 200px; + background: linear-gradient(#fff, #f7f7f7); + border: 1px solid #cacaca; + border-radius: 8px; +} + /****************************** * Scrobbles * ******************************/ diff --git a/static/post.tmpl b/static/post.tmpl index 5f918e2..2425ed1 100644 --- a/static/post.tmpl +++ b/static/post.tmpl @@ -58,5 +58,6 @@ +