From aa2cf82a034d48e67d7dc697379ff59a733a530f Mon Sep 17 00:00:00 2001
From: Hauke D <haukex@zero-g.net>
Date: Tue, 9 Oct 2018 17:37:40 +0200
Subject: [PATCH] Added "add", "delete", and "rename" of files

---
 web/democode/demo.html       |  8 ++++----
 web/democode/perleditor.css  |  8 +++++++-
 web/democode/perleditor.html | 39 ++++++++++++++++++++++++++++++++----
 3 files changed, 46 insertions(+), 9 deletions(-)

diff --git a/web/democode/demo.html b/web/democode/demo.html
index 83a3fea..ba718aa 100644
--- a/web/democode/demo.html
+++ b/web/democode/demo.html
@@ -34,10 +34,10 @@ If not, see http://perldoc.perl.org/index-licence.html
 <iframe name="perlrunner" sandbox="allow-scripts"
 	src="perlrunner.html" style="display:none;"></iframe>
 
-<iframe id="perl1" sandbox="allow-scripts"
-	style="border:1px solid black;width:100%;height:8em;"></iframe>
-<iframe id="perl2" sandbox="allow-scripts"
-	style="border:1px solid black;width:100%;height:40em;"></iframe>
+<iframe id="perl1" sandbox="allow-scripts allow-modals"
+	style="border:1px solid black;width:100%;max-width:50em;height:8em;"></iframe>
+<iframe id="perl2" sandbox="allow-scripts allow-modals"
+	style="border:1px solid black;width:100%;max-width:50em;height:40em;"></iframe>
 <script>
 document.getElementById('perl1').src =
 	"perleditor.html#" + encodeURIComponent(JSON.stringify( {
diff --git a/web/democode/perleditor.css b/web/democode/perleditor.css
index 97ea52a..6e770e7 100644
--- a/web/democode/perleditor.css
+++ b/web/democode/perleditor.css
@@ -2,7 +2,7 @@
 body {
 	margin: 0.4em;
 }
-.text {
+.text,.fakelink {
 	font-family: Calibri, Ubuntu, "Droid Sans", Tahoma, Arial, Helvetica, sans-serif;
 }
 pre,textarea,code,.code,.filename,.CodeMirror {
@@ -20,6 +20,12 @@ pre {
 	max-height: 12em;
 }
 
+.fakelink {
+	color: darkblue;
+	cursor: pointer;
+	font-size: 0.9em;
+}
+
 #runnerstate {
 	margin-top: 0.1em;
 	margin-bottom: 0.3em;
diff --git a/web/democode/perleditor.html b/web/democode/perleditor.html
index d9fd4f3..c9fea0f 100644
--- a/web/democode/perleditor.html
+++ b/web/democode/perleditor.html
@@ -165,6 +165,12 @@ function fetchUrl(url,cm) { // fetch the contents of a URL into a CodeMirror ins
 		});
 }
 
+function fileRename () {
+	var div = $(this);
+	var newname = prompt("Please choose a new filename:",div.text());
+	if (newname) div.text(newname);
+}
+
 function setupOutputFile (fn, text) {
 	var found = $('div.outputs>.filename')
 		.filter(function(){ return $(this).text() == fn });
@@ -175,7 +181,13 @@ function setupOutputFile (fn, text) {
 	}
 	else {
 		var div = $('<div/>',{class:"codewithfn outputs"});
-		div.append( $('<div/>',{class:"filename",text:fn}) );
+		//TODO: the "delete" and "rename" functions should probably be styled better
+		$('<div/>',{class:"fakelink",style:"float:right;",text:"delete"})
+			.appendTo(div).click(function () {
+				if (confirm("Are you sure you want to remove this file?"))
+					div.remove() });
+		div.append( $('<div/>',{class:"filename",text:fn}).click(fileRename) );
+		div.append( $('<div/>',{style:"clear:both;"}) );
 		var ta = $('<textarea/>').appendTo(div);
 		$('#outputhere').before(div);
 		cm = makeCM(ta,1,1);
@@ -203,7 +215,12 @@ function setupInputFile (inp) {
 		}
 	}
 	var div = $('<div/>',{class:"codewithfn inputs"});
-	div.append( $('<div/>',{class:"filename",text:fn}) );
+	$('<div/>',{class:"fakelink",style:"float:right;",text:"delete"})
+		.appendTo(div).click(function () {
+			if (confirm("Are you sure you want to remove this file?"))
+				div.remove() });
+	div.append( $('<div/>',{class:"filename",text:fn}).click(fileRename) );
+	div.append( $('<div/>',{style:"clear:both;"}) );
 	var ta = $('<textarea/>').appendTo(div);
 	$('#inputhere').before(div);
 	var cm = makeCM(ta,1,0);
@@ -245,6 +262,16 @@ $(function () {
 	var hashdata = window.location.hash.substr(1);
 	var hash = hashdata.length>0 ? JSON.parse(decodeURIComponent(hashdata)) : {};
 	
+	$('#addinput').click(function () {
+		var fn = prompt("Please choose a filename for the new input file:");
+		if (fn) setupInputFile( {fn:fn} );
+	});
+	$('#addoutput').click(function () {
+		var fn = prompt("Please choose a filename for the new output file:");
+		if (fn) setupOutputFile( fn );
+	});
+	$('#script>.filename').click(fileRename);
+	
 	// script
 	if ( hash["script"] || hash["script_url"] ) {
 		var scriptdiv = $('#script');
@@ -317,7 +344,9 @@ $(function () {
 </head>
 <body>
 
-<div id="inputhere" style="display:none;"></div>
+<div id="inputhere" style="text-align:right;">
+	<span id="addinput" class="fakelink">Add Input File</span>
+</div>
 
 <div id="script" class="codewithfn" style="display:none;">
 	<div class="filename">script.pl</div>
@@ -347,7 +376,9 @@ $(function () {
 	<textarea></textarea>
 </div>
 
-<div id="outputhere" style="display:none;"></div>
+<div id="outputhere" style="text-align:right;">
+	<span id="addoutput" class="fakelink">Add Output File</span>
+</div>
 
 </body>
 </html>