Mercurial Hosting > freedit

changeset 33:4fdc4ec0050b

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
upload with uploadcare
author Franklin Schmidt <fschmidt@gmail.com>
date Mon, 01 Aug 2022 22:50:16 -0600
parents 72a1b77b4548
children c8d47981c74f
files src/edit.js.luan src/lib/Shared.luan src/site.css src/site.js src/test/upload.html src/test/upload.js.luan src/thread.html.luan src/upload_bbcode.js.luan
diffstat 8 files changed, 145 insertions(+), 14 deletions(-) [+]
line wrap: on
line diff
diff -r 72a1b77b4548 -r 4fdc4ec0050b src/edit.js.luan
--- a/src/edit.js.luan	Fri Jul 29 13:57:20 2022 -0600
+++ b/src/edit.js.luan	Mon Aug 01 22:50:16 2022 -0600
@@ -14,11 +14,11 @@
 	post = Post.get_by_id(post) or error()
 	Io.stdout = Http.response.text_writer()
 %>
-let postDiv = document.querySelector('[post="<%=post.id%>"]');
-postDiv.querySelector('[output]').style.display = 'none';
-postDiv.querySelector('[edit]').innerHTML = document.querySelector('[hidden][edit]').innerHTML;
-let textarea = postDiv.querySelector('textarea');
-textarea.innerHTML = <%= json_string(html_encode(post.content)) %>;
-textarea.focus();
+	let postDiv = document.querySelector('[post="<%=post.id%>"]');
+	postDiv.querySelector('[output]').style.display = 'none';
+	postDiv.querySelector('[edit]').innerHTML = document.querySelector('[hidden][edit]').innerHTML;
+	let textarea = postDiv.querySelector('textarea');
+	textarea.innerHTML = <%= json_string(html_encode(post.content)) %>;
+	textarea.focus();
 <%
 end
diff -r 72a1b77b4548 -r 4fdc4ec0050b src/lib/Shared.luan
--- a/src/lib/Shared.luan	Fri Jul 29 13:57:20 2022 -0600
+++ b/src/lib/Shared.luan	Mon Aug 01 22:50:16 2022 -0600
@@ -96,4 +96,20 @@
 	end
 end
 
+function Shared.get_url_from_file(file)
+	local url = "https://upload.uploadcare.com/base/"
+	local options = {
+		method = "POST"
+		enctype = "multipart/form-data"
+		parameters = {
+			UPLOADCARE_PUB_KEY = "fe3d30f3088a50941d45"
+			file = file
+		}
+	}
+	local response = uri(url,options).read_text()
+	response = json_parse(response)
+	local code = response.file or error()
+	return "https://ucarecdn.com/"..code.."/"..file.filename
+end
+
 return Shared
diff -r 72a1b77b4548 -r 4fdc4ec0050b src/site.css
--- a/src/site.css	Fri Jul 29 13:57:20 2022 -0600
+++ b/src/site.css	Mon Aug 01 22:50:16 2022 -0600
@@ -38,3 +38,27 @@
 [hidden] {
 	display: none;
 }
+
+span[inline_button] {
+	padding: 3px 7px;
+	background-color: #EDEDED;
+	font: inherit;
+	color: inherit;
+	border: 1px solid #BABABA;
+	text-decoration: none;
+	border-radius: 4px;
+}
+
+input[type="file"] {
+	appearance: none;
+	-webkit-appearance: none;
+	outline: none;
+	border: none;
+	padding: 0;
+	margin: 0;
+	width: 0;
+}
+
+label[clickable] {
+	cursor: pointer;
+}
diff -r 72a1b77b4548 -r 4fdc4ec0050b src/site.js
--- a/src/site.js	Fri Jul 29 13:57:20 2022 -0600
+++ b/src/site.js	Mon Aug 01 22:50:16 2022 -0600
@@ -3,7 +3,8 @@
 	let request = new XMLHttpRequest();
 	let method = postData ? 'POST' : 'GET';
 	request.open( method, url );
-	if( postData )
+	let isMultipart = postData instanceof File;
+	if( postData && !isMultipart )
 		request.setRequestHeader( 'Content-Type', 'application/x-www-form-urlencoded' );
 	request.onload = function() {
 		if( request.status !== 200 ) {
@@ -14,7 +15,13 @@
 		}
 		eval( request.responseText );
 	};
-	request.send(postData);
+	if(isMultipart) {
+		let formData = new FormData();
+		formData.append( 'file', postData );
+		request.send(formData);
+	} else {
+		request.send(postData);
+	}
 }
 
 window.onerror = function(msg, url, line, col, error) {
diff -r 72a1b77b4548 -r 4fdc4ec0050b src/test/upload.html
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/src/test/upload.html	Mon Aug 01 22:50:16 2022 -0600
@@ -0,0 +1,31 @@
+<!doctype html>
+<html>
+	<head>
+		<meta name="viewport" content="width=device-width, initial-scale=1">
+		<style>
+			@import "/site.css";
+		</style>
+		<script src="/site.js"></script>
+		<script>
+			function gotFile(input) {
+				let file = input.files[0];
+				//console.log(file);
+				//console.log(file instanceof File);
+				ajax("upload.js",file);
+			}
+		</script>
+	</head>
+	<body>
+		<div content>
+			<p>top</p>
+			<p>
+				<label clickable
+					><input type=file xaccept="image/*" onchange="gotFile(this)"
+					><span inline_button>Upload File</span>
+				</label>
+			</p>
+			<p><a></a></p>
+			<p>bottom</p>
+		</div>
+	</body>
+</html>
diff -r 72a1b77b4548 -r 4fdc4ec0050b src/test/upload.js.luan
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/src/test/upload.js.luan	Mon Aug 01 22:50:16 2022 -0600
@@ -0,0 +1,24 @@
+local Luan = require "luan:Luan.luan"
+local error = Luan.error
+local stringify = Luan.stringify or error()
+local Io = require "luan:Io.luan"
+local Http = require "luan:http/Http.luan"
+local Shared = require "site:/lib/Shared.luan"
+local get_url_from_file = Shared.get_url_from_file or error()
+local Logging = require "luan:logging/Logging.luan"
+local logger = Logging.logger "test/upload.js"
+
+
+return function()
+	local file = Http.request.parameters.file or error()
+	--logger.info(stringify(file));
+	local url = get_url_from_file(file)
+	--logger.info("url = "..url)
+	Io.stdout = Http.response.text_writer()
+%>
+	let url = '<%=url%>';
+	let a = document.querySelector('a');
+	a.textContent = url;
+	a.setAttribute('href',url);
+<%
+end
diff -r 72a1b77b4548 -r 4fdc4ec0050b src/thread.html.luan
--- a/src/thread.html.luan	Fri Jul 29 13:57:20 2022 -0600
+++ b/src/thread.html.luan	Mon Aug 01 22:50:16 2022 -0600
@@ -9,6 +9,7 @@
 local head = Shared.head or error()
 local header = Shared.header or error()
 local footer = Shared.footer or error()
+local get_url_from_file = Shared.get_url_from_file or error()
 local Forum = require "site:/lib/Forum.luan"
 local forum_title = Forum.title or error()
 local Db = require "site:/lib/Db.luan"
@@ -84,11 +85,11 @@
 				ajax("save_edit.js",postData);
 			}
 
-			function upload(src) {
-				let postDiv = getPostDiv(src);
-				let textarea = postDiv.querySelector('textarea');
-				textarea.focus();
-				textarea.setRangeText('xyz',textarea.selectionStart,textarea.selectionEnd,'select');
+			function upload(input) {
+				let postDiv = getPostDiv(input);
+				let post = postDiv.getAttribute('post');
+				let file = input.files[0];
+				ajax("/upload_bbcode.js?post="+post,file);
 			}
 
 			function deletePost(span) {
@@ -149,7 +150,10 @@
 		<div hidden edit>
 			<textarea></textarea>
 			<p>
-				<button onclick="upload(this)">upload</button>
+				<label clickable
+					><input type=file onchange="upload(this)"
+					><span inline_button>upload</span>
+				</label>
 				<button onclick="saveEdit(this)">save</button>
 				<button onclick="cancelEdit(this)">cancel</button>
 			</p>
diff -r 72a1b77b4548 -r 4fdc4ec0050b src/upload_bbcode.js.luan
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/src/upload_bbcode.js.luan	Mon Aug 01 22:50:16 2022 -0600
@@ -0,0 +1,25 @@
+local Luan = require "luan:Luan.luan"
+local error = Luan.error
+local stringify = Luan.stringify or error()
+local Io = require "luan:Io.luan"
+local Http = require "luan:http/Http.luan"
+local Shared = require "site:/lib/Shared.luan"
+local get_url_from_file = Shared.get_url_from_file or error()
+local Logging = require "luan:logging/Logging.luan"
+local logger = Logging.logger "test/upload.js"
+
+
+return function()
+	local post = Http.request.parameters.post or error()
+	local file = Http.request.parameters.file or error()
+	--logger.info(stringify(file));
+	local url = get_url_from_file(file)
+	--logger.info("url = "..url)
+	Io.stdout = Http.response.text_writer()
+%>
+	let postDiv = document.querySelector('[post="<%=post%>"]');
+	let textarea = postDiv.querySelector('textarea');
+	textarea.focus();
+	textarea.setRangeText('<%=url%>',textarea.selectionStart,textarea.selectionEnd,'select');
+<%
+end