Added file select option for raster images in server_open extension. Also added Uploading file dialog box for server-based uploads

git-svn-id: http://svg-edit.googlecode.com/svn/trunk@1624 eee81c28-f429-11dd-99c0-75d572ba1ddd

editor/extensions/ext-server_open.js

@@ -12,6 +12,8 @@ svgEditor.addExtension("server_open", {
 		// Do nothing if client support is found
 		if(window.FileReader) return;
 	
+		var cancelled = false;
+	
 		// Change these to appropriate script file
 		var open_svg_action = 'extensions/fileopen.php?type=load_svg';
 		var import_svg_action = 'extensions/fileopen.php?type=import_svg';
@@ -19,7 +21,16 @@ svgEditor.addExtension("server_open", {
 		
 		// Set up function for PHP uploader to use
 		svgEditor.processFile = function(str64, type) {
-			var xmlstr = svgCanvas.Utils.decode64(str64);
+			if(cancelled) {
+				cancelled = false;
+				return;
+			}
+		
+			$('#dialog_box').hide();
+		
+			if(type != 'import_img') {
+				var xmlstr = svgCanvas.Utils.decode64(str64);
+			}
 			
 			switch ( type ) {
 				case 'load_svg':
@@ -31,6 +42,9 @@ svgEditor.addExtension("server_open", {
 					svgCanvas.importSvgString(xmlstr);
 					svgEditor.updateCanvas();					
 					break;
+				case 'import_img':
+					svgCanvas.setGoodImage(str64);
+					break;
 			}
 		}
 	
@@ -55,6 +69,18 @@ svgEditor.addExtension("server_open", {
 			form.empty();
 			var inp = $('<input type="file" name="svg_file">').appendTo(form);
 			
+			
+			function submit() {
+				// This submits the form, which returns the file data using svgEditor.uploadSVG
+				form.submit();
+				
+				rebuildInput(form);
+				$.process_cancel("Uploading...", function() {
+					cancelled = true;
+					$('#dialog_box').hide();
+				});
+			}
+			
 			if(form[0] == open_svg_form[0]) {
 				inp.change(function() {
 					// This takes care of the "are you sure" dialog box
@@ -63,17 +89,13 @@ svgEditor.addExtension("server_open", {
 							rebuildInput(form);
 							return;
 						}
-						// This submits the form, which returns the file data using svgEditor.uploadSVG
+						submit();
-						form.submit();
-						
-						rebuildInput(form);
 					});
 				});
 			} else {
 				inp.change(function() {
 					// This submits the form, which returns the file data using svgEditor.uploadSVG
-					form.submit();
+					submit();
-					rebuildInput(form);
 				});
 			}
 		}
@@ -89,6 +111,7 @@ svgEditor.addExtension("server_open", {
 		// Add forms to buttons
 		$("#tool_open").show().prepend(open_svg_form);
 		$("#tool_import").show().prepend(import_svg_form);
+		$("#tool_image").prepend(import_img_form);
 	}
 });
 

editor/extensions/fileopen.php

@@ -2,8 +2,21 @@
 <?php
 	// Very minimal PHP file, all we do is Base64 encode the uploaded file and
 	// return it to the editor
-	$output = file_get_contents($_FILES['svg_file']['tmp_name']);
+	
+	$file = $_FILES['svg_file']['tmp_name'];
+	
+	$output = file_get_contents($file);
+	
+	$type = $_REQUEST['type'];
+	
+	$prefix = '';
+	
+	// Make Data URL prefix for import image
+	if($type == 'import_img') {
+		$info = getimagesize($file);
+		$prefix = 'data:' . $info['mime'] . ';base64,';
+	}
 ?>
 <script>
-window.top.window.svgEditor.processFile("<?php echo base64_encode($output); ?>", "<?php echo $_REQUEST['type'] ?>");
+window.top.window.svgEditor.processFile("<?php echo $prefix . base64_encode($output); ?>", "<?php echo $type ?>");
 </script>  

editor/svg-editor.css

@@ -602,8 +602,13 @@ span.zoom_tool {
 	overflow: hidden;
 }
 
-#tool_open input, #tool_import input {
+#tool_image {
-	height: 100%;
+	overflow: hidden;
+}
+
+#tool_open input, 
+#tool_import input,
+#tool_image input {
 	position: absolute;
 	opacity: 0;
 	font-size: 10em;

editor/svg-editor.js

@@ -446,6 +446,10 @@
 						input.val(defText || '');
 						input.bind('keydown', 'return', function() {ok.click();});
 					}
+					
+					if(type == 'process') {
+						ok.hide();
+					}
 		
 					box.show();
 					
@@ -460,6 +464,7 @@
 				
 				$.alert = function(msg, cb) { dbox('alert', msg, cb);};
 				$.confirm = function(msg, cb) {	dbox('confirm', msg, cb);};
+				$.process_cancel = function(msg, cb) {	dbox('process', msg, cb);};
 				$.prompt = function(msg, txt, cb) { dbox('prompt', msg, cb, txt);};
 			}());
 			
@@ -1175,7 +1180,12 @@
 					
 					if(svgCanvas.addedNew) {
 						if(elname == 'image') {
-							promptImgURL();
+							var xlinkNS = "http://www.w3.org/1999/xlink";
+							var href = elem.getAttributeNS(xlinkNS, "href");
+							// Prompt for URL if not a data URL
+							if(href.indexOf('data:') !== 0) {
+								promptImgURL();
+							}
 						} else if(elname == 'text') {
 							// TODO: Do something here for new text
 						}

editor/svgcanvas.js

@@ -7496,6 +7496,11 @@ this.embedImage = function(val, callback) {
 	}).attr('src',val);
 }
 
+// Function: setGoodImage
+// Sets a given URL to be a "last good image" URL
+this.setGoodImage = function(val) {
+	last_good_img_url = val;
+}
 
 this.open = function() {
 	// Nothing by default, handled by optional widget/extension