add support for skfiddle width/height options

experimental/webtry/res/js/webtry.js

 /**
  * Common JS that talks XHR back to the server and runs the code and receives
  * the results.
  */
 
 
 /**
  * All the functionality is wrapped up in this anonymous closure, but we need
  * to be told if we are on the workspace page or a normal try page, so the
  * workspaceName is passed into the closure, it must be set in the global
  * namespace. If workspaceName is the empty string then we know we aren't
  * running on a workspace page.
  *
  * If we are on a workspace page we also look for a 'history_'
  * variable in the global namespace which contains the list of tries
  * that are included in this workspace. That variable is used to
  * populate the history list.
  */
 (function() {
     function onLoad() {
       var run             = document.getElementById('run');
       var permalink       = document.getElementById('permalink');
       var embed           = document.getElementById('embed');
       var embedButton     = document.getElementById('embedButton');
       var code            = document.getElementById('code');
       var output          = document.getElementById('output');
       var stdout          = document.getElementById('stdout');
       var img             = document.getElementById('img');
+      var imageWidth      = document.getElementById('image-width');
+      var imageHeight     = document.getElementById('image-height');
       var tryHistory      = document.getElementById('tryHistory');
       var parser          = new DOMParser();
       var tryTemplate     = document.getElementById('tryTemplate');
       var sourcesTemplate = document.getElementById('sourcesTemplate');
 
       var enableSource   = document.getElementById('enableSource');
       var selectedSource = document.getElementById('selectedSource');
       var sourceCode     = document.getElementById('sourceCode');
       var chooseSource   = document.getElementById('chooseSource');
       var chooseList     = document.getElementById('chooseList');
@@ skipping 165 matching lines @@
         // The response is JSON of the form:
         // {
         //   "hash": "unique id for a try",
         //   "code": "source code for try"
         // }
         endWait();
         body = JSON.parse(e.target.response);
         code.value = body.code;
         editor.setValue(body.code);
         img.src = '/i/'+body.hash+'.png';
+        imageWidth.value = body.width;
+        imageHeight.value = body.height;
         sourceSelectByID(body.source);
         if (permalink) {
           permalink.href = '/c/' + body.hash;
           permalink.style.display='inline-block';
         }
       }
 
 
       /**
        * Add the given try image to the history of a workspace.
@@ skipping 14 matching lines @@
       function codeComplete(e) {
         // The response is JSON of the form:
         // {
         //   "message": "you had an error...",
         //   "img": "<base64 encoded image but only on success>"
         // }
         //
         // The img is optional and only appears if there is a valid
         // image to display.
         endWait();
-        console.log(e.target.response);
         body = JSON.parse(e.target.response);
         output.textContent = body.message;
         if (body.message) {
           output.style.display = 'block';
         }
         if (stdout) {
           stdout.textContent = body.stdout;
           if (body.stdout) {
             stdout.style.display = 'block';
           }
@@ skipping 24 matching lines @@
 
       function onSubmitCode() {
         beginWait();
         clearOutput();
         var req = new XMLHttpRequest();
         req.addEventListener('load', codeComplete);
         req.addEventListener('error', xhrError);
         req.overrideMimeType('application/json');
         req.open('POST', '/', true);
         req.setRequestHeader('content-type', 'application/json');
-        req.send(JSON.stringify({'code': editor.getValue(), 'name': workspaceName, 'source': sourceId}));
+        req.send(JSON.stringify({'code': editor.getValue(), 'width': parseInt(imageWidth.value), 'height': parseInt(imageHeight.value), 'name': workspaceName, 'source': sourceId}));
       }
       run.addEventListener('click', onSubmitCode);
 
 
       function onEmbedClick() {
         embed.style.display='inline';
       }
 
       if (embedButton) {
         embedButton.addEventListener('click', onEmbedClick);
@@ skipping 10 matching lines @@
     }
 
     // If loaded via HTML Imports then DOMContentLoaded will be long done.
     if (document.readyState != "loading") {
       onLoad();
     } else {
       this.addEventListener('load', onLoad);
     }
 
 })();