summaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
authorclsr <clsr@clsr.net>2016-06-16 02:18:59 +0200
committerclsr <clsr@clsr.net>2016-06-16 02:18:59 +0200
commit77fb1d63635bb61b26296b742d2d57ea40566884 (patch)
tree4f9c035a3b157f06ff13525931c4d865b3f1667b
downloadgomf-web-pomf-77fb1d63635bb61b26296b742d2d57ea40566884.tar.gz
gomf-web-pomf-77fb1d63635bb61b26296b742d2d57ea40566884.zip
Initial commit; forked from pantsu/pomfv0.1.0
-rw-r--r--.gitignore4
-rw-r--r--LICENSE22
-rw-r--r--pages/faq.html48
-rw-r--r--pages/index.html49
-rw-r--r--static/bg.pngbin0 -> 19452 bytes
-rw-r--r--static/favicon.icobin0 -> 4119 bytes
-rw-r--r--static/grill/10.pngbin0 -> 32305 bytes
-rw-r--r--static/grill/2.pngbin0 -> 74594 bytes
-rw-r--r--static/grill/3.pngbin0 -> 60684 bytes
-rw-r--r--static/grill/4.pngbin0 -> 13529 bytes
-rw-r--r--static/grill/5.pngbin0 -> 22713 bytes
-rw-r--r--static/grill/6.pngbin0 -> 29307 bytes
-rw-r--r--static/grill/7.pngbin0 -> 29732 bytes
-rw-r--r--static/grill/8.pngbin0 -> 50050 bytes
-rw-r--r--static/grill/9.pngbin0 -> 32272 bytes
-rw-r--r--static/grill/bg.pngbin0 -> 19452 bytes
-rw-r--r--static/pomf.css417
-rw-r--r--static/pomf.js176
18 files changed, 716 insertions, 0 deletions
diff --git a/.gitignore b/.gitignore
new file mode 100644
index 0000000..bdb1eb9
--- /dev/null
+++ b/.gitignore
@@ -0,0 +1,4 @@
+*.swp
+/gomf
+/*.go
+/*.txt
diff --git a/LICENSE b/LICENSE
new file mode 100644
index 0000000..6cecb6c
--- /dev/null
+++ b/LICENSE
@@ -0,0 +1,22 @@
+Copyright (c) 2013, 2014, 2015 Eric Johansson <neku@pomf.se>
+Copyright (c) 2013, 2014 Peter Lejeck <peter.lejeck@gmail.com>
+Copyright (c) 2015 cenci0 <alchimist94@gmail.com>
+Copyright (c) 2015, 2016 the Pantsu.cat developers <hostmaster@pantsu.cat>
+Copyright (c) 2016 clsr <clsr@clsr.net>
+
+Permission is hereby granted, free of charge, to any person obtaining a copy of
+this software and associated documentation files (the "Software"), to deal in
+the Software without restriction, including without limitation the rights to
+use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of
+the Software, and to permit persons to whom the Software is furnished to do so,
+subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS
+FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR
+COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER
+IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN
+CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
diff --git a/pages/faq.html b/pages/faq.html
new file mode 100644
index 0000000..601f1d6
--- /dev/null
+++ b/pages/faq.html
@@ -0,0 +1,48 @@
+<!DOCTYPE html>
+<html lang="en">
+ <head>
+ <meta charset="utf-8">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <title>{{ .SiteName }} &middot; FAQ</title>
+ <link rel="icon" href="favicon.ico">
+ <link rel="stylesheet" href="/static/pomf.css">
+ </head>
+ <body>
+ <div class="container">
+ <article>
+ <div class="jumbotron">
+ <h1><abbr title="Frequently asked questions">FAQ</abbr></h1>
+ </div>
+ <h2>What is {{ .SiteName }}?</h2>
+ <p><span role="definition"><dfn>{{ .SiteName }}</dfn> is a simple to use free file hosting service.</span> It lets you share your photos, documents, music, videos and more with others online.</p>
+ <h2>What content is allowed?</h2>
+ <p>{{ .SiteName }} welcomes uploading any content, as long as the content is legal and you have the legal right to make the content available on our service.</p>
+ <p>As an exception to this policy to prevent abuse, we do not allow malware on our service. Any malware that could be used to infect other computers may be removed from our service at our discretion.</p>
+ <!--- <h2>Do you keep logs of uploaded content?</h2>
+ <p>We don't collect or log any data of our users in respect for privacy. We only have files uploaded by our users.</p> -->
+ <h2>Can you remove my copyrighted content?</h2>
+ <p>Please submit your copyright takedown notice to <a href="mailto:{{ .Abuse }}">{{ .Abuse }}</a>. We will handle your notice within 24 hours and disable access to infringing content after receiving a notice compliant with the Copyright Act 1968 (Australia).</p>
+ <h2>Can you remove content that is defaming me or otherwise infringing my non-copyright rights?</h2>
+ <p>Pantsu.cat respects takedowns for other content when accompanied with a certified court order. If you are unable to obtain the order, a preliminary injuction or court order is typically also sufficient. Please forward the notice to <a href="{{ .Abuse }}">{{ .Abuse }}</a>.</p>
+ <h2>Can you remove illegal content?</h2>
+ <p>Please contact the appropriate law enforcement agency if you notice illegal content hosted on {{ .SiteName }}. We have not been trained or qualified to investigate and fight crimes and enforce the law, so it's not appropriate to send accusations of illegal activity to us. <strong>You must contact the appropriate law enforcement office.</strong> They may then contact us if appropriate.</p>
+ <p>If you are a law enforcement official and you need our assistance, please contact <a href="mailto:{{ .Abuse }}">{{ .Abuse }}</a>. If you are a law enforcement official from another country, we may voluntarily cooperate if the crime you are investigating would also be illegal here.</p>
+ <h2>I have a question...</h2>
+ <p>Send us an email at <a href="{{ .Contact }}">{{ .Contact }}</a> and let's talk!</p>
+ </article>
+
+
+ <nav>
+ <ul>
+ <li><a href="/">{{ .SiteName }}</a></li>
+ <li><a href="mailto:{{ .Contact }}">Contact</a></li>
+ <li><a href="mailto:{{ .Abuse }}">Report abuse</a></li>
+ {{ range $name, $path := .Pages }}{{ if ne $path "index.html" }}
+ <li><a href="{{ $path }}">{{ $name }}</a></li>
+ {{ end }}{{ end }}
+ </ul>
+ </ul>
+ </nav>
+ </div>
+ </body>
+</html>
diff --git a/pages/index.html b/pages/index.html
new file mode 100644
index 0000000..4509570
--- /dev/null
+++ b/pages/index.html
@@ -0,0 +1,49 @@
+<!DOCTYPE html>
+<html lang="en">
+ <head>
+ <meta charset="utf-8">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <title>{{ .SiteName }} &middot; Kawaii File Hosting</title>
+ <link rel="icon" href="favicon.ico">
+ <link rel="stylesheet" href="/static/pomf.css">
+ <script src="/static/pomf.js"></script>
+ </head>
+ <body>
+ <div class="container">
+ <div class="jumbotron">
+ <h1>Ohayou!</h1>
+ <p class="lead">Max upload size is {{ .MaxSize }}, read the <a href="faq.html">FAQ</a></p>
+
+ <form id="upload-form" enctype="multipart/form-data" method="post" action="upload.php?output=html">
+ <input type="hidden" name="output" value="html">
+ <button style="display: none" id="upload-btn" class="btn" type="button">Select or drop file(s)</button>
+ <input type="file" id="upload-input" name="files[]" multiple data-max-size="{{ .MaxSize }}">
+ <input type="submit" value="Submit">
+ </form>
+
+ {{ with .Result }}
+ <ul id="upload-filelist" {{ if or .Files .Description }}class="{{ if .Description }}error {{ else }}completed{{ end }}"{{ end }}>
+ {{ range .Files }}
+ <li class="file" data-filename="{{ .Name }}">
+ <span class="file-name">{{ .Name }}</span>
+ <span class="file-url"><a href="{{ .Url }}" target="_blank">{{ .Url }}</a></span>
+ </li>
+ {{ end }}
+ </ul>
+ {{ end }}
+
+ </div>
+
+ <nav>
+ <ul>
+ <li><a href="/">{{ .SiteName }}</a></li>
+ <li><a href="mailto:{{ .Contact }}">Contact</a></li>
+ <li><a href="mailto:{{ .Abuse }}">Report abuse</a></li>
+ {{ range $name, $path := .Pages }}{{ if ne $path "index.html" }}
+ <li><a href="{{ $path }}">{{ $name }}</a></li>
+ {{ end }}{{ end }}
+ </ul>
+ </nav>
+ </div>
+ </body>
+</html>
diff --git a/static/bg.png b/static/bg.png
new file mode 100644
index 0000000..2f4febc
--- /dev/null
+++ b/static/bg.png
Binary files differ
diff --git a/static/favicon.ico b/static/favicon.ico
new file mode 100644
index 0000000..b115e11
--- /dev/null
+++ b/static/favicon.ico
Binary files differ
diff --git a/static/grill/10.png b/static/grill/10.png
new file mode 100644
index 0000000..226f062
--- /dev/null
+++ b/static/grill/10.png
Binary files differ
diff --git a/static/grill/2.png b/static/grill/2.png
new file mode 100644
index 0000000..acb0a0b
--- /dev/null
+++ b/static/grill/2.png
Binary files differ
diff --git a/static/grill/3.png b/static/grill/3.png
new file mode 100644
index 0000000..ca9eca5
--- /dev/null
+++ b/static/grill/3.png
Binary files differ
diff --git a/static/grill/4.png b/static/grill/4.png
new file mode 100644
index 0000000..177db67
--- /dev/null
+++ b/static/grill/4.png
Binary files differ
diff --git a/static/grill/5.png b/static/grill/5.png
new file mode 100644
index 0000000..b8dc3fe
--- /dev/null
+++ b/static/grill/5.png
Binary files differ
diff --git a/static/grill/6.png b/static/grill/6.png
new file mode 100644
index 0000000..080335a
--- /dev/null
+++ b/static/grill/6.png
Binary files differ
diff --git a/static/grill/7.png b/static/grill/7.png
new file mode 100644
index 0000000..60f7586
--- /dev/null
+++ b/static/grill/7.png
Binary files differ
diff --git a/static/grill/8.png b/static/grill/8.png
new file mode 100644
index 0000000..cd2415e
--- /dev/null
+++ b/static/grill/8.png
Binary files differ
diff --git a/static/grill/9.png b/static/grill/9.png
new file mode 100644
index 0000000..68b2018
--- /dev/null
+++ b/static/grill/9.png
Binary files differ
diff --git a/static/grill/bg.png b/static/grill/bg.png
new file mode 100644
index 0000000..2f4febc
--- /dev/null
+++ b/static/grill/bg.png
Binary files differ
diff --git a/static/pomf.css b/static/pomf.css
new file mode 100644
index 0000000..7e1816a
--- /dev/null
+++ b/static/pomf.css
@@ -0,0 +1,417 @@
+/**
+ * Copyright (c) 2011, 2012, 2013 Twitter, Inc.
+ * Copyright (c) 2013, 2014 Peter Lejeck <peter.lejeck@gmail.com>
+ *
+ * Permission is hereby granted, free of charge, to any person obtaining a copy
+ * of this software and associated documentation files (the "Software"), to deal
+ * in the Software without restriction, including without limitation the rights
+ * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+ * copies of the Software, and to permit persons to whom the Software is
+ * furnished to do so, subject to the following conditions:
+ *
+ * The above copyright notice and this permission notice shall be included in
+ * all copies or substantial portions of the Software.
+ *
+ * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+ * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+ * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+ * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+ * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+ * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+ * SOFTWARE.
+ */
+
+/**
+ * USE BORDER BOX
+ */
+*,
+*:before,
+*:after {
+ box-sizing: border-box;
+}
+
+/**
+ * PAGE LAYOUT
+ */
+body {
+ background-attachment: fixed, fixed;
+ background-color: #F7F7F7;
+ background-image: url('/grill.php'), url('/static/bg.png');
+ background-position: 85% 100%, top left;
+ background-repeat: no-repeat, repeat;
+ color: #333;
+ font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
+ font-size: 14px;
+ height: 100%;
+ line-height: 20px;
+ margin: 0;
+ padding-top: 20px;
+ padding-bottom: 40px;
+}
+.container {
+ margin: 0 auto;
+ max-width: 700px;
+}
+
+/**
+ * ELEMENTS
+ */
+/* paragraphs */
+p {
+ margin: 0 0 10px;
+}
+/* images */
+input[type=image], img {
+ vertical-align: middle;
+}
+/* links */
+a {
+ color: #0078B4;
+ text-decoration: none;
+ transition: color 0.25s;
+}
+a:hover,
+a:focus,
+a:active {
+ color: #005580;
+}
+a:focus {
+ outline: thin dotted #333;
+}
+
+/**
+ * JUMBOTRON
+ */
+.jumbotron {
+ margin: 60px 0;
+ text-align: center;
+ transition: width 0.5s, height 0.5s, margin 0.5s, padding 0.5s;
+}
+.jumbotron h1 {
+ color: inherit;
+ font-family: inherit;
+ font-size: 72px;
+ font-weight: bold;
+ line-height: 1;
+ margin: 10px 0;
+ cursor: default;
+ text-rendering: optimizelegibility;
+}
+.jumbotron .lead {
+ font-size: 21px;
+ font-weight: 200;
+ line-height: 30px;
+ margin-bottom: 20px;
+ transition: font-size 0.5s;
+}
+.jumbotron .btn {
+ background: rgba(202, 230, 190, 0.75);
+ border: 1px solid #B7D1A0;
+ border-radius: 4px;
+ color: #468847;
+ cursor: pointer;
+ display: inline-block;
+ font-size: 24px;
+ padding: 28px 48px;
+ text-shadow: 0 1px rgba(255, 255, 255, 0.5);
+ transition: background-color 0.25s, width 0.5s, height 0.5s;
+}
+.jumbotron .btn:hover,
+.jumbotron .btn:active,
+.jumbotron .btn:focus,
+.jumbotron .btn.drop {
+ background-color: rgb(188, 228, 170);
+ text-decoration: none;
+}
+#no-file-api {
+ display: none;
+}
+
+/**
+ * BOXES
+ */
+.alert {
+ background-color: #FCF8E3;
+ border: 1px solid #FBEED5;
+ border-radius: 4px;
+ margin-bottom: 20px;
+ padding: 8px 14px;
+ text-shadow: 0px 1px rgba(255, 255, 255, 0.5);
+ transition: width 0.5s, margin 0.5s, padding 0.5s, background-color 0.5s;
+}
+.alert-error {
+ background-color: #F2DEDE;
+ border-color: #EED3D7;
+ color: #AA4342;
+}
+.alert-info {
+ background-color: #D9EDF7;
+ border-color: #BCE8F1;
+ color: #167196;
+}
+
+/**
+ * DONATION BUTTONS
+ */
+span.donate-btns {
+ display: block;
+ text-align: center;
+ margin: 11px 0 3px;
+}
+a.donate-btn {
+ height: 26px;
+ display: inline-block;
+ margin: 2px 5px;
+ background: hsl(0, 0%, 95%);
+ line-height: 16px;
+ padding: 3px 8px 3px 24px;
+ border-radius: 3px;
+ color: hsl(0, 0%, 25%);
+ border: 1px solid hsl(0, 0%, 85%);
+ transition: all .2s;
+}
+a.donate-btn:hover {
+ color: #000;
+ border: 1px solid hsl(0, 0%, 70%);
+ background-color: hsl(0, 0%, 80%);
+}
+.icon {
+ display: block;
+ height: 16px;
+ width: 16px;
+ float: left;
+ margin-left: -20px;
+ margin-top: 1px;
+}
+.icon-paypal {
+ background-image: url('img/paypal.png');
+}
+.icon-bitcoin {
+ background-image: url('img/bitcoin.png');
+}
+.icon-flattr {
+ background-image: url('img/flattr.png');
+}
+
+/**
+ * NAVIGATION LINKS
+ */
+nav > ul,
+nav a {
+ color: #33799B;
+ list-style: none;
+ margin: 0;
+ padding: 0;
+ text-align: center;
+}
+nav > ul > li {
+ display: inline-block;
+ margin: 0;
+ padding: 0;
+ cursor: default;
+}
+nav > ul > li:after {
+ content: "|";
+ margin: 0 8px;
+ opacity: 0.3;
+}
+nav > ul > li:last-child:after {
+ content: "";
+ margin: 0;
+}
+
+/**
+ * UPLOAD FORM
+ */
+#upload-input {
+ display: none;
+}
+
+/**
+ * UPLOAD FILE LIST
+ */
+#upload-filelist {
+ list-style-type: none;
+ margin: 20px 50px;
+ padding: 0;
+ text-align: left;
+}
+.error#upload-filelist {
+ color: #891A18;
+}
+.error#upload-filelist .progress-percent {
+ color: #B94A48;
+}
+.error#upload-filelist .file-progress {
+ display: none;
+}
+#upload-filelist > li {
+ margin-top: 5px;
+ overflow: hidden;
+}
+#upload-filelist > li.total {
+ border-top: 1px solid rgba(0, 0, 0, 0.05);
+ font-weight: bold;
+ padding-top: 5px;
+}
+.file-name {
+ float: left;
+ overflow: hidden;
+ max-width: 70%;
+ text-overflow: ellipsis;
+ white-space: nowrap;
+}
+.file-progress,
+.file-url {
+ display: inline-block;
+ float: right;
+ font-size: 0.9em;
+ margin-left: 8px;
+ vertical-align: middle;
+}
+.file-url a {
+ color: #5C5C5C;
+}
+.file-url a:hover {
+ color: #1C1C1C;
+}
+.progress-percent {
+ float: right;
+}
+
+progress[value] {
+ /* Reset the default appearance */
+ -webkit-appearance: none;
+ -moz-appearance: none;
+ appearance: none;
+
+ border: none;
+
+}
+
+progress[value]::-webkit-progress-bar {
+ background-color: #eee;
+ border-radius: 2ps;
+ box-shadow: 0 2px 5px rgba(0,0,0,0.25) inset;
+}
+
+/* completed rows */
+.completed .file-progress,
+.completed .progress-percent {
+ display: none;
+}
+.completed .file-url {
+ display: block;
+}
+
+/**
+ * PROGRESS BARS
+ */
+.progress-outer {
+ background-color: rgba(255, 255, 255, 0.8);
+ border: 1px solid white;
+ border-radius: 4px;
+ box-shadow: 0 0 0 1px black;
+ color: transparent;
+ display: inline-block;
+ font-size: 0;
+ float: right;
+ height: 8px;
+ margin: 6px 6px 0;
+ overflow: hidden;
+ vertical-align: middle;
+ width: 50px;
+}
+.progress-inner {
+ background-color: black;
+ height: 6px;
+ margin: 0;
+ width: 0;
+}
+
+/**
+ * MEDIA QUERIES
+ */
+@media only screen and (max-device-width: 320px), only screen and (max-width: 400px) {
+ body {
+ padding: 10px 0 0 0;
+ }
+ .jumbotron {
+ margin: 20px 0 30px;
+ }
+ .jumbotron .lead {
+ font-size: 18px;
+ }
+ .jumbotron .btn, .alert, #upload-filelist {
+ border-radius: 0;
+ border-width: 1px 0;
+ width: 100%;
+ margin-left: 0;
+ margin-right: 0;
+ padding-left: 20px;
+ padding-right: 20px;
+ }
+ #upload-filelist {
+ background-color: rgba(255, 255, 255, 0.75);
+ overflow: hidden;
+ }
+ #upload-filelist > li.file {
+ margin-top: 12px;
+ margin-bottom: 12px;
+ }
+ .file-progress {
+ width: 70%;
+ }
+ .file-name, .file-url {
+ width: 100%;
+ max-width: 100%;
+ }
+ .file-url a {
+ text-decoration: underline;
+ margin-left: 15px;
+ }
+ .file-url a:before {
+ content: "http://";
+ }
+ .alert {
+ font-size: 13px;
+ }
+ .alert-error {
+ background-color: rgba(248, 223, 223, 0.75);
+ }
+ nav {
+ background-color: rgba(255, 255, 255, 0.75);
+ border: #FFFFFF;
+ padding: 10px 0;
+ }
+}
+
+
+/*
+The following code is released into public domain.
+It is provided "as is", without warranties or conditions of any kind.
+Anyone is free to modify, redistribute and do anything with this code.
+*/
+/**
+ * NO-JS/JS UPLOAD FORMS
+ */
+
+#upload-input {
+ display: inline-block;
+}
+
+#upload-form .btn {
+ display: none;
+}
+
+.form-js #upload-input {
+ display: none;
+}
+
+.form-js #upload-btn {
+ display: inline-block !important;
+}
+
+.form-js input[type=submit] {
+ display: none;
+}
diff --git a/static/pomf.js b/static/pomf.js
new file mode 100644
index 0000000..dfa047a
--- /dev/null
+++ b/static/pomf.js
@@ -0,0 +1,176 @@
+document.addEventListener('DOMContentLoaded', function() {
+ /**
+ * Copyright (c) 2016 Luminarys <postmaster@gensok.io>
+ *
+ * Permission is hereby granted, free of charge, to any person obtaining a copy
+ * of this software and associated documentation files (the "Software"), to deal
+ * in the Software without restriction, including without limitation the rights
+ * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+ * copies of the Software, and to permit persons to whom the Software is
+ * furnished to do so, subject to the following conditions:
+ *
+ * The above copyright notice and this permission notice shall be included in
+ * all copies or substantial portions of the Software.
+ *
+ * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+ * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+ * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+ * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+ * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+ * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+ * SOFTWARE.
+ */
+
+ function addRow(file) {
+ var row = document.createElement('li');
+
+ var name = document.createElement('span');
+ name.textContent = file.name;
+ name.className = 'file-name';
+
+ var progressIndicator = document.createElement('span');
+ progressIndicator.className = 'progress-percent';
+ progressIndicator.textContent = '0%';
+
+ var progressBar = document.createElement('progress');
+ progressBar.className = 'file-progress';
+ progressBar.setAttribute("max", "100");
+ progressBar.setAttribute("value", "0");
+
+ row.appendChild(name);
+ row.appendChild(progressBar);
+ row.appendChild(progressIndicator);
+
+ document.getElementById('upload-filelist').appendChild(row);
+ return row;
+ }
+
+ function handleUploadProgress(evt) {
+ var xhr = evt.target;
+ var bar = xhr.bar;
+ var percentIndicator = xhr.percent;
+
+ if (evt.lengthComputable) {
+ var progressPercent = Math.floor((evt.loaded / evt.total) * 100);
+ bar.setAttribute("value", progressPercent);
+ percentIndicator.textContent = progressPercent + '%';
+ }
+ }
+
+ function handleUploadComplete(evt) {
+ var xhr = evt.target;
+ var bar = xhr.bar;
+ var row = xhr.row;
+ var percentIndicator = xhr.percent;
+
+ percentIndicator.style.visibility = "hidden";
+ bar.style.visibility = "hidden";
+ row.removeChild(bar);
+ row.removeChild(percentIndicator);
+ var respStatus = xhr.status;
+
+ var url = document.createElement('span');
+ url.className = 'file-url';
+ row.appendChild(url);
+
+ var link = document.createElement('a');
+ if (respStatus === 200) {
+ var response = JSON.parse(xhr.responseText);
+ if (response.success) {
+ link.textContent = response.files[0].url.replace(/.*?:\/\//g, "");
+ link.href = response.files[0].url;
+ url.appendChild(link);
+ } else {
+ bar.innerHTML = 'Error: ' + response.reason;
+ }
+ } else if (respStatus === 413) {
+ link.textContent = 'File Too big!';
+ url.appendChild(link);
+ } else {
+ link.textContent = 'Server error!';
+ url.appendChild(link);
+ }
+ }
+
+ function uploadFile(file, row) {
+ var bar = row.querySelector('.file-progress');
+ var percentIndicator = row.querySelector('.progress-percent');
+ var xhr = new XMLHttpRequest();
+ xhr.open('POST', '/upload.php?output=json');
+
+ xhr["row"] = row;
+ xhr["bar"] = bar;
+ xhr["percent"] = percentIndicator;
+ xhr.upload["bar"] = bar;
+ xhr.upload["percent"] = percentIndicator;
+
+ xhr.addEventListener('load', handleUploadComplete, false);
+ xhr.upload.onprogress = handleUploadProgress;
+
+ var form = new FormData();
+ form.append('files[]', file);
+ xhr.send(form);
+ }
+
+ function stopDefaultEvent(evt) {
+ evt.stopPropagation();
+ evt.preventDefault();
+ }
+
+ function handleDrag(state, element, evt) {
+ stopDefaultEvent(evt);
+ if (state.dragCount == 1) {
+ element.textContent = "Drop it here~";
+ }
+ state.dragCount += 1;
+ }
+
+ function handleDragAway(state, element, evt) {
+ stopDefaultEvent(evt);
+ state.dragCount -= 1;
+ if (state.dragCount == 0) {
+ element.textContent = "Select or drop file(s)";
+ }
+ }
+
+ function handleDragDrop(state, element, evt) {
+ stopDefaultEvent(evt);
+ handleDragAway(state, element, evt);
+ var len = evt.dataTransfer.files.length;
+ for (var i = 0; i < len; i++) {
+ var file = evt.dataTransfer.files[i];
+ var row = addRow(file);
+ uploadFile(file, row);
+ }
+ }
+
+ function uploadFiles(evt) {
+ var len = evt.target.files.length;
+ for (var i = 0; i < len; i++) {
+ var file = evt.target.files[i];
+ var row = addRow(file);
+ uploadFile(file, row);
+ }
+ }
+
+ function selectFiles(target, evt) {
+ stopDefaultEvent(evt);
+ target.click();
+ }
+
+ var state = { dragCount: 0 };
+ var uploadButton = document.getElementById('upload-btn');
+ window.addEventListener('dragenter', handleDrag.bind(this, state, uploadButton), false);
+ window.addEventListener('dragleave', handleDragAway.bind(this, state, uploadButton), false);
+ window.addEventListener('drop', handleDragAway.bind(this, state, uploadButton), false);
+ window.addEventListener('dragover', stopDefaultEvent, false);
+
+ var uploadInput = document.getElementById('upload-input');
+ uploadInput.addEventListener('change', uploadFiles);
+ uploadButton.addEventListener('click', selectFiles.bind(this, uploadInput));
+ uploadButton.addEventListener('drop', handleDragDrop.bind(this, state, uploadButton), false);
+
+
+ // no-js form override
+ document.getElementById('upload-form').className += ' form-js'
+});