diff src/bbcode/bbcode.js @ 52:9f8ebc757814

add convert urls
author Franklin Schmidt <fschmidt@gmail.com>
date Wed, 23 Nov 2022 23:29:16 -0700
parents 78b2d6995244
children cac477dd1f82
line wrap: on
line diff
--- a/src/bbcode/bbcode.js	Tue Nov 22 22:57:43 2022 -0700
+++ b/src/bbcode/bbcode.js	Wed Nov 23 23:29:16 2022 -0700
@@ -70,6 +70,8 @@
 				<button type=button ol title="Numbered list"><img src="/bbcode/icons/format_list_numbered.svg"></button>
 				<button type=button code_block title="Code block"><img src="/bbcode/icons/code_blocks.svg"></button>
 				<button type=button code_inline title="Inline code"><img src="/bbcode/icons/code.svg"></button>
+				<button type=button convert_urls checked title="Convert URLs"><img src="/bbcode/icons/media_link.svg"></button>
+				<input type=hidden name=convert_urls value=true>
 				<button type=button more checked title="More..."><img src="/bbcode/icons/more_horiz.svg"></button>
 				<input type=file>
 				<button type=button upload title="Upload File"><img src="/bbcode/icons/file_upload.svg"></button>
@@ -92,10 +94,14 @@
 	div.innerHTML = html;
 
 	let enabledInPreview = [];
+	let convertUrls = true;
 
 	if(save) {
 		let button = div.querySelector('button[save]');
-		button.onclick = save;
+		button.onclick = function(event) {
+			event.convertUrls = convertUrls;
+			save(event);
+		};
 		enabledInPreview.push(button);
 	}
 	if(cancel) {
@@ -114,25 +120,33 @@
 	textarea.oninput = fixTextarea;
 	fixTextarea();
 
+	function toggle(button) {
+		let checked = button.getAttribute('checked') !== null;
+		checked = !checked;  // toggle
+		if( checked ) {
+			button.setAttribute('checked','');
+		} else {
+			button.removeAttribute('checked');
+		}
+		return checked;
+	}
+
 	let moreButton = div.querySelector('button[more]');
 	function more() {
-		let button = moreButton;
-		let checked = button.getAttribute('checked') !== null;
-		let buttons = button.parentNode.querySelectorAll('button');
+		let checked = toggle(moreButton);
+		let buttons = moreButton.parentNode.querySelectorAll('button');
 		if( checked ) {
-			button.removeAttribute('checked');
 			for( let b of buttons ) {
-				if( b === button )
+				if( b === moreButton )
+					break;
+				b.removeAttribute('hidden');
+			}
+		} else {
+			for( let b of buttons ) {
+				if( b === moreButton )
 					break;
 				b.setAttribute('hidden','');
 			}
-		} else {
-			button.setAttribute('checked','');
-			for( let b of buttons ) {
-				if( b === button )
-					break;
-				b.removeAttribute('hidden');
-			}
 		}
 	};
 	moreButton.onclick = more;
@@ -140,38 +154,43 @@
 	enabledInPreview.push(moreButton);
 
 	let divPreview = div.querySelector('div[preview]');
-	function contextPreview(html) {
+	function contextPreview(bbcode,html) {
+		textarea.value = bbcode;
 		divPreview.innerHTML = html;
 	}
 	let previewButton = div.querySelector('button[preview]');
 	function preview() {
-		let button = previewButton;
-		let checked = button.getAttribute('checked') !== null;
-		let buttons = button.parentNode.querySelectorAll('button');
+		let checked = toggle(previewButton);
+		let buttons = previewButton.parentNode.querySelectorAll('button');
 		if( checked ) {
-			button.removeAttribute('checked');
+			for( let b of buttons ) {
+				if( !enabledInPreview.includes(b) )
+					b.disabled = true;
+			}
+			textarea.style.display = 'none';
+			divPreview.style.display = 'block';
+			let url = '/bbcode/preview.js?text=' + encodeURIComponent(textarea.value) + '&convert_urls=' + convertUrls;
+			ajax( url, null, {preview: contextPreview} );
+		} else {
 			for( let b of buttons ) {
 					b.disabled = false;
 			}
 			textarea.style.display = 'initial';
 			divPreview.style.display = 'none';
 			textarea.focus();
-		} else {
-			window.enabledInPreview = enabledInPreview;
-			button.setAttribute('checked','');
-			for( let b of buttons ) {
-				if( !enabledInPreview.includes(b) )
-					b.disabled = true;
-			}
-			textarea.style.display = 'none';
-			divPreview.style.display = 'block';
-			let url = '/bbcode/preview.js?text=' + encodeURIComponent(textarea.value);
-			ajax( url, null, {preview: contextPreview} );
 		}
 	}
 	previewButton.onclick = preview;
 	enabledInPreview.push(previewButton);
 
+	let convertUrlsButton = div.querySelector('button[convert_urls]');
+	let convertUrlsInput = div.querySelector('input[name="convert_urls"]');
+	function toggleConvertUrls() {
+		convertUrls = toggle(convertUrlsButton);
+		convertUrlsInput.value = convertUrls;
+	}
+	convertUrlsButton.onclick = toggleConvertUrls;
+
 	function add(tag,openTag,closeTag) {
 		let button = div.querySelector('button['+tag+']');
 		button.onclick = function() {