test dessin_edit

mondumas/templates/dossier/dessin_edit.pt

@@ -0,0 +1,60 @@
+<metal:block use-macro="main_template">
+<div metal:fill-slot="content">
+
+	<div class="alert alert-danger" tal:condition="message" tal:content="message" />
+
+    <div class="row">
+		<form id="dessin_edit-form" action="${url}" method="post">
+			<div class="form-group">
+				<a href="${request.application_url}/dossier_view/${nodossier}" class="btn btn-default" role="button">
+				<span class="glyphicon glyphicon-chevron-left"></span>&nbsp;Annuler</a>
+				<button  class="btn btn-primary" type="submit" name="form.submitted">
+				<span class="glyphicon glyphicon-ok"></span>&nbsp;Enregistrer</button>
+			</div>
+			<!-- this will be the input used to pass the drawingboard content to the server -->
+			<input type="hidden" name="image" value="">
+		  
+		 </form>
+    </div> <!-- row -->
+    <div style="row">
+		<div id="dessin"></div>
+    </div> <!-- row -->
+
+	<!--    Drawingboard  -->   
+	<link href="${request.static_url('mondumas:static/dist/drawingboard/drawingboard.min.css')}" rel="stylesheet" media="all">
+	<script src="${request.static_url('mondumas:static/dist/drawingboard/drawingboard.min.js')}"></script>
+<script>
+	var simpleBoard = new DrawingBoard.Board('dessin', {
+	background: 'none',
+	size: 10,
+	controls: [
+		'Color',
+		{ Size: { type: 'dropdown' } },
+		{ Navigation: { } },
+		],
+	size: 1,
+	webStorage: 'session',
+	enlargeYourContainer: true
+	});
+$(document).ready(function() {
+	$('#dessin_edit-form').on('submit', function(e) {
+	  //get drawingboard content
+	  var img = simpleBoard.getImg();
+	  
+	  //we keep drawingboard content only if it's not the 'blank canvas'
+	  var imgInput = (simpleBoard.blankCanvas == img) ? '' : img;
+	  // alert("imgInput : " + imgInput);
+	  
+	  //put the drawingboard content in the form field to send it to the server
+	  $(this).find('input[name=image]').val( imgInput );
+	
+	  //we can also assume that everything goes well server-side
+	  //and directly clear webstorage here so that the drawing isn't shown again after form submission
+	  //but the best would be to do when the server answers that everything went well
+	  simpleBoard.clearWebStorage();
+	});
+});
+</script>
+
+</div><!-- content -->
+</metal:block>