palumbo · January 26, 2016 19:58
diff --git a/write.html b/write.html
 <html>
 	<head>
 		<title>Write Demo</title>
 		<style> 
 			body { 
 				font-family: sans-serif; 
 				} 
 				
 			#uploadConfirmation { 
 				color: green; 
 			}
 		
 			#confirmationLink { 
 				font-size: 30px; 
 			}
 		</style> 
 		
 		<script> 
 			window.onload = function(){ 
 				document.getElementById('uploadConfirmation').style.display = 'none'; 
 				document.getElementById('confirmationLink').style.display = 'none'; 
 			}	
 		</script> 
 	</head>
 	<body>
 		
 		<h1>Filestack Write Demo</h1>
 		
 		<p>Filestack allows you to overwrite stored files using the <a href="https://www.filestack.com/docs/file-ingestion/javascript-api/write">filepicker.write</a> command. This allows you to change the contents of a text (including HTML) or image file without having to change the change the URL. This page shows you a simple example of how this function works.</p>
 		<p>For this demo, create a blank text file on your Desktop called <code>test.txt</code>. 	
 		<p>Now, let's upload that file using our picker dialog box.<br>  	
 		<button id="upload">Upload File</button></p>
 		
 		<div id="uploadConfirmation"> 
 			File name: <span id="displayName"></span><br>
 			URL: <span id="displayURL"></span><br>
 		</div>

 		<p>Now let's write something to that file. Add text to the box and click the "Write" button.<br>
 			<input type="text" id="text" size="50" /><button onclick="writeToFile();">Write</button> </p>
 		
 		<br>
 		
 			<a id="confirmationLink">Now view your file</a>
 		

 		<script type="text/javascript" src="https://api.filestackapi.com/filestack.js"></script>
 		<script> 
 			
 			filepicker.setKey("A1AJmUYdDTj2Y5wEFtRO7z"); 
 			
 			// SETTING VARIABLES
 			var displayName = document.getElementById('displayName'); 
 			var displayURL = document.getElementById('displayURL'); 
 			var b_url = ""; 
 			var b_name = ""; 
 			
 			
 			// PICKING THE FILE
 			document.getElementById('upload').onclick = function(){ 
 				filepicker.pick(
 					function(Blob){ 
 						b_url = Blob.url; 
 						b_name = Blob.filename; 
 						confirmURL = document.createTextNode(Blob.url); 
 						confirmName = document.createTextNode(Blob.filename); 
 						displayName.appendChild(confirmName); 
 						displayURL.appendChild(confirmURL);  
 					}
 				);
 				document.getElementById('uploadConfirmation').style.display = 'block';  
 			}
 			
 			
 			// WRITING TO THE FILE
 			function writeToFile(){ 
 				var inputText = document.getElementById('text').value; 
 				console.log(inputText); 
 				
 				var blob = { 
 					url: b_url, 
 					filename: Blob.filename, 
 					isWriteable: true, 
 				}; 
 				
 				console.log(b_url); 
 				
 				filepicker.write(
 					blob, 
 					inputText, 
 					function(Blob){ 
 						console.log(JSON.stringify(Blob)); 
 					}
 				);	
 				
 				document.getElementById('confirmationLink').setAttribute('href', b_url); 	
 				document.getElementById('confirmationLink').style.display = 'block'; 	
 				
 			} 
 			
 			
 			
 			
 			
 			</script> 
 			
 			
 			
 	</body>
 </html>
	<html>
	<head>
	<title>Write Demo</title>
	<style>
	body {
	font-family: sans-serif;
	}

	#uploadConfirmation {
	color: green;
	}

	#confirmationLink {
	font-size: 30px;
	}
	</style>

	<script>
	window.onload = function(){
	document.getElementById('uploadConfirmation').style.display = 'none';
	document.getElementById('confirmationLink').style.display = 'none';
	}
	</script>
	</head>
	<body>

	<h1>Filestack Write Demo</h1>

	<p>Filestack allows you to overwrite stored files using the <a href="https://www.filestack.com/docs/file-ingestion/javascript-api/write">filepicker.write</a> command. This allows you to change the contents of a text (including HTML) or image file without having to change the change the URL. This page shows you a simple example of how this function works.</p>
	<p>For this demo, create a blank text file on your Desktop called <code>test.txt</code>.
	<p>Now, let's upload that file using our picker dialog box.<br>
	<button id="upload">Upload File</button></p>

	<div id="uploadConfirmation">
	File name: <span id="displayName"></span><br>
	URL: <span id="displayURL"></span><br>
	</div>

	<p>Now let's write something to that file. Add text to the box and click the "Write" button.<br>
	<input type="text" id="text" size="50" /><button onclick="writeToFile();">Write</button> </p>

	<br>

	<a id="confirmationLink">Now view your file</a>


	<script type="text/javascript" src="https://api.filestackapi.com/filestack.js"></script>
	<script>

	filepicker.setKey("A1AJmUYdDTj2Y5wEFtRO7z");

	// SETTING VARIABLES
	var displayName = document.getElementById('displayName');
	var displayURL = document.getElementById('displayURL');
	var b_url = "";
	var b_name = "";


	// PICKING THE FILE
	document.getElementById('upload').onclick = function(){
	filepicker.pick(
	function(Blob){
	b_url = Blob.url;
	b_name = Blob.filename;
	confirmURL = document.createTextNode(Blob.url);
	confirmName = document.createTextNode(Blob.filename);
	displayName.appendChild(confirmName);
	displayURL.appendChild(confirmURL);
	}
	);
	document.getElementById('uploadConfirmation').style.display = 'block';
	}


	// WRITING TO THE FILE
	function writeToFile(){
	var inputText = document.getElementById('text').value;
	console.log(inputText);

	var blob = {
	url: b_url,
	filename: Blob.filename,
	isWriteable: true,
	};

	console.log(b_url);

	filepicker.write(
	blob,
	inputText,
	function(Blob){
	console.log(JSON.stringify(Blob));
	}
	);

	document.getElementById('confirmationLink').setAttribute('href', b_url);
	document.getElementById('confirmationLink').style.display = 'block';

	}





	</script>



	</body>
	</html>