From a7f603264a41783968810ce845863062b908e6ff Mon Sep 17 00:00:00 2001
From: Paul Ye <oatto.paul@gmail.com>
Date: Sun, 23 Aug 2020 13:06:56 +0200
Subject: [PATCH 1/3] Remove some globally exposed methods.

---
 web/js/codeworld.js        | 6 +-----
 web/js/codeworld_shared.js | 2 +-
 web/js/funblocks.js        | 2 +-
 3 files changed, 3 insertions(+), 7 deletions(-)

diff --git a/web/js/codeworld.js b/web/js/codeworld.js
index 74c7708b1..e2b9e55fd 100644
--- a/web/js/codeworld.js
+++ b/web/js/codeworld.js
@@ -70,7 +70,7 @@ function attachEventListeners() {
 
   $('#startRecButton').on('click', captureStart);
   $('#stopRecButton').on('click', stopRecording);
-  $('#shareButton').on('click', share);
+  $('#shareButton').on('click', () => share(compile));
   $('#inspectButton').on('click', inspect);
 
   $('#runButton').on('click', compile);
@@ -1277,7 +1277,3 @@ function downloadProject() {
     document.body.removeChild(elem);
   }
 }
-
-// TEMP: required by setCode in codeworld_shared.js
-window.compile = compile;
-window.stopRun = stopRun;
diff --git a/web/js/codeworld_shared.js b/web/js/codeworld_shared.js
index 046a478eb..803113969 100644
--- a/web/js/codeworld_shared.js
+++ b/web/js/codeworld_shared.js
@@ -1174,7 +1174,7 @@ function loadProject(name, path, buildMode, successFunc) {
   });
 }
 
-function share() {
+function share(compile) {
   let offerSource = true;
 
   function go() {
diff --git a/web/js/funblocks.js b/web/js/funblocks.js
index 73bcfae00..410d9681e 100644
--- a/web/js/funblocks.js
+++ b/web/js/funblocks.js
@@ -66,7 +66,7 @@ function attachEventListeners() {
   $('#deleteButton').on('click', deleteProject);
   $('#docButton').on('click', help);
   $('#shareFolderButton').on('click', () => shareFolder_(window.projectEnv));
-  $('#shareButton').on('click', share);
+  $('#shareButton').on('click', () => share(compile));
 
   $('#runner').on('load', toggleObsoleteCodeAlert);
 }

From fa1a79c36b0c4fa3610151b4ee7c7625f8d9f212 Mon Sep 17 00:00:00 2001
From: Paul Ye <oatto.paul@gmail.com>
Date: Sun, 6 Sep 2020 15:27:06 +0200
Subject: [PATCH 2/3] Add partialRight utility function

---
 web/js/utils/functional.js | 4 ++++
 1 file changed, 4 insertions(+)
 create mode 100644 web/js/utils/functional.js

diff --git a/web/js/utils/functional.js b/web/js/utils/functional.js
new file mode 100644
index 000000000..4ae0f9045
--- /dev/null
+++ b/web/js/utils/functional.js
@@ -0,0 +1,4 @@
+const partialRight = (fn, presetArgs) => (...laterArgs) =>
+  fn(...laterArgs, ...presetArgs);
+
+export { partialRight };

From feb4b74e65587b698835b6a8e96480b83fec18e3 Mon Sep 17 00:00:00 2001
From: Paul Ye <oatto.paul@gmail.com>
Date: Thu, 27 Aug 2020 10:02:56 +0200
Subject: [PATCH 3/3] Always show share button + warn about potential errors

---
 web/blocks.html            |  26 +++----
 web/css/codeworld.css      |  11 ++-
 web/env.html               |  28 +++----
 web/js/codeworld.js        |  10 ++-
 web/js/codeworld_shared.js | 152 +++++++++++++++++++++++--------------
 web/js/funblocks.js        |   6 +-
 6 files changed, 142 insertions(+), 91 deletions(-)

diff --git a/web/blocks.html b/web/blocks.html
index 580eb44eb..92719dcb1 100644
--- a/web/blocks.html
+++ b/web/blocks.html
@@ -43,13 +43,13 @@
             <a id="newButton" class="cw-button red">
               <i class="mdi mdi-18px mdi-plus"></i>&nbsp; New
             </a>
-            <a id="saveButton" class="cw-button blue" style="display: none;">
+            <a id="saveButton" class="cw-button blue" style="display: none">
               <i class="mdi mdi-18px mdi-cloud-upload"></i>&nbsp; Save
             </a>
             <a id="saveAsButton" class="cw-button blue">
               <i class="mdi mdi-18px mdi-dots-horizontal"></i>&nbsp; Save As
             </a>
-            <a id="deleteButton" class="cw-button red" style="display: none;">
+            <a id="deleteButton" class="cw-button red" style="display: none">
               <i class="mdi mdi-18px mdi-delete"></i>&nbsp; Delete
             </a>
           </div>
@@ -59,10 +59,10 @@
         <div
           class="dropbox ui-layout-center"
           id="blocklyDiv"
-          style="height: 84%; width: 100%;"
+          style="height: 84%; width: 100%"
         ></div>
 
-        <div id="result" style="display: none;" class="ui-layout-east">
+        <div id="result" style="display: none" class="ui-layout-east">
           <div
             id="obsolete-code-alert"
             class="obsolete-code-alert-fadeout"
@@ -72,19 +72,19 @@
             class="dropbox"
             width="500"
             height="500"
-            style="display: none;"
+            style="display: none"
           ></iframe>
 
           <pre
             id="message"
             class="dropbox"
-            style="width: 100%; min-height: 100px; padding: 5px; display: none;"
+            style="width: 100%; min-height: 100px; padding: 5px; display: none"
           ></pre>
 
           <span
             ><a
               type="button"
-              style="margin-top: 5px;"
+              style="margin-top: 5px"
               id="editButton"
               target="_blank"
               class="cw-button blue"
@@ -95,7 +95,7 @@
           <pre
             id="genCode"
             class="dropbox cm-s-default CodeMirror"
-            style="width: 100%; height: 100%; padding: 10px;"
+            style="width: 100%; height: 100%; padding: 10px"
           ></pre>
         </div>
       </div>
@@ -105,13 +105,13 @@
             id="navButton"
             class="cw-button blue"
             onclick="window.mainLayout.toggle('west')"
-            style="display: none;"
+            style="display: none"
             ><i class="mdi mdi-18px mdi-menu"></i
           ></a>
           <a id="signin" class="cw-button blue"
             ><i class="mdi mdi-18px mdi-login"></i>&nbsp; Sign In</a
           >
-          <a id="signout" class="cw-button blue" style="display: none;"
+          <a id="signout" class="cw-button blue" style="display: none"
             ><i class="mdi mdi-18px mdi-logout"></i>&nbsp; Sign Out</a
           >
           <a id="docButton" class="cw-button blue"
@@ -130,11 +130,11 @@
           <a
             id="shareFolderButton"
             class="cw-button yellow"
-            style="display: none;"
+            style="display: none"
             ><i class="mdi mdi-18px mdi-folder-outline"></i>&nbsp; Share
             Folder</a
           >
-          <a id="shareButton" class="cw-button yellow" style="display: none;"
+          <a id="shareButton" class="cw-button yellow"
             ><i class="mdi mdi-18px mdi-share"></i>&nbsp; Share</a
           >
           <a id="btnStop" class="cw-button red"
@@ -233,7 +233,7 @@
       src="mirrored/cdn.jsdelivr.net/npm/promise-polyfill@7.1.0/dist/promise.min.js"
     ></script>
 
-    <xml id="toolbox" style="display: none;">
+    <xml id="toolbox" style="display: none">
       <category name="Programs">
         <block type="cwDrawingOf"></block>
         <block type="cwActivityOf"></block>
diff --git a/web/css/codeworld.css b/web/css/codeworld.css
index ff783aaac..cc40fd4ad 100644
--- a/web/css/codeworld.css
+++ b/web/css/codeworld.css
@@ -259,6 +259,10 @@ body {
 }
 
 .cw-button {
+  display: grid;
+  grid-auto-flow: column;
+  align-items: center;
+  justify-content: left;
   border-radius: 4px;
   cursor: pointer;
   text-align: left;
@@ -268,13 +272,18 @@ body {
   margin: 3px 3px 0px 3px;
   padding: 6px 6px 6px 6px;
   text-decoration: none;
-  display: inline-block;
   font-weight: bold;
   color: var(--cw-button-color);
   white-space: nowrap;
   overflow: hidden;
 }
 
+.cw-button.cw-button--disabled {
+  color: rgba(255, 255, 255, 0.8);
+  background-color: rgba(0, 0, 0, 0.3) !important;
+  pointer-events: none;
+}
+
 #toolbar .cw-button {
   margin-bottom: 3px;
   margin-top: 0px;
diff --git a/web/env.html b/web/env.html
index 53e7f84eb..1fcf7685b 100644
--- a/web/env.html
+++ b/web/env.html
@@ -51,20 +51,16 @@
             <a id="newButton" class="cw-button red">
               <i class="mdi mdi-18px mdi-plus"></i>&nbsp; New
             </a>
-            <a id="saveButton" class="cw-button blue" style="display: none;">
+            <a id="saveButton" class="cw-button blue" style="display: none">
               <i class="mdi mdi-18px mdi-cloud-upload"></i>&nbsp; Save
             </a>
             <a id="saveAsButton" class="cw-button blue">
               <i class="mdi mdi-18px mdi-dots-horizontal"></i>&nbsp; Save As
             </a>
-            <a id="deleteButton" class="cw-button red" style="display: none;">
+            <a id="deleteButton" class="cw-button red" style="display: none">
               <i class="mdi mdi-18px mdi-delete"></i>&nbsp; Delete
             </a>
-            <a
-              id="downloadButton"
-              class="cw-button blue"
-              style="display: none;"
-            >
+            <a id="downloadButton" class="cw-button blue" style="display: none">
               <i class="mdi mdi-18px mdi-download"></i>&nbsp; Download
             </a>
           </div>
@@ -75,7 +71,7 @@
           <textarea id="editor" placeholder="Type your code here..."></textarea>
         </form>
 
-        <div id="result" style="display: none;" class="ui-layout-east">
+        <div id="result" style="display: none" class="ui-layout-east">
           <div class="runner-box">
             <div id="obsolete-code-alert" class="obsolete-code-alert-fadeout">
               Changes detected. Press 'Run' button to compile your current code.
@@ -95,13 +91,13 @@
             id="navButton"
             class="cw-button blue"
             onclick="window.mainLayout.toggle('west')"
-            style="display: none;"
+            style="display: none"
             ><i class="mdi mdi-18px mdi-menu"></i
           ></a>
           <a id="signin" class="cw-button blue"
             ><i class="mdi mdi-18px mdi-login"></i>&nbsp; Sign In</a
           >
-          <a id="signout" class="cw-button blue" style="display: none;"
+          <a id="signout" class="cw-button blue" style="display: none"
             ><i class="mdi mdi-18px mdi-logout"></i>&nbsp; Sign Out</a
           >
           <a id="docButton" class="cw-button blue"
@@ -127,32 +123,32 @@
           <a
             id="shareFolderButton"
             class="cw-button yellow"
-            style="display: none;"
+            style="display: none"
             ><i class="mdi mdi-18px mdi-folder-outline"></i>&nbsp; Share
             Folder</a
           >
           <span
             ><i
               class="mdi mdi-24px mdi-record"
-              style="display: none;"
+              style="display: none"
               id="recordIcon"
             >
               <!--Recording Icon--></i
             ></span
           >
-          <a id="startRecButton" style="display: none;" class="cw-button red"
+          <a id="startRecButton" style="display: none" class="cw-button red"
             ><i class="mdi mdi-18px mdi-record"></i>&nbsp; Start Recording</a
           >
-          <a id="stopRecButton" style="display: none;" class="cw-button yellow"
+          <a id="stopRecButton" style="display: none" class="cw-button yellow"
             ><i class="mdi mdi-18px mdi-stop"></i>&nbsp; Stop Recording</a
           >
-          <a id="shareButton" class="cw-button yellow" style="display: none;"
+          <a id="shareButton" class="cw-button yellow cw-button--disabled"
             ><i class="mdi mdi-18px mdi-share"></i>&nbsp; Share</a
           >
           <a
             id="inspectButton"
             class="inspect-button cw-button cyan"
-            style="display: none;"
+            style="display: none"
             ><i class="mdi mdi-18px mdi-magnify"></i>&nbsp; Inspect</a
           >
           <a id="stopButton" class="cw-button red"
diff --git a/web/js/codeworld.js b/web/js/codeworld.js
index e2b9e55fd..77e19afe2 100644
--- a/web/js/codeworld.js
+++ b/web/js/codeworld.js
@@ -70,7 +70,7 @@ function attachEventListeners() {
 
   $('#startRecButton').on('click', captureStart);
   $('#stopRecButton').on('click', stopRecording);
-  $('#shareButton').on('click', () => share(compile));
+  $('#shareButton').on('click', share);
   $('#inspectButton').on('click', inspect);
 
   $('#runButton').on('click', compile);
@@ -491,6 +491,14 @@ function initCodeworld() {
     }
     window.reparseTimeoutId = setTimeout(parseSymbolsFromCurrentCode, 1500);
 
+    const shareButton = document.getElementById('shareButton');
+
+    if (doc.getValue()) {
+      shareButton.classList.remove('cw-button--disabled');
+    } else {
+      shareButton.classList.add('cw-button--disabled');
+    }
+
     updateDocumentTitle(isEditorClean);
     updateProjectChangeMark(isEditorClean);
 
diff --git a/web/js/codeworld_shared.js b/web/js/codeworld_shared.js
index 803113969..92f436925 100644
--- a/web/js/codeworld_shared.js
+++ b/web/js/codeworld_shared.js
@@ -17,6 +17,7 @@
 import * as Alert from './utils/alert.js';
 import * as Auth from './utils/auth.js';
 import * as DirTree from './utils/directoryTree.js';
+import { partialRight } from './utils/functional.js';
 import * as Html from './utils/html.js';
 import { sendHttp } from './utils/network.js';
 
@@ -1174,76 +1175,119 @@ function loadProject(name, path, buildMode, successFunc) {
   });
 }
 
-function share(compile) {
+function share() {
+  const { hash } = window.location;
+  const { deployHash } = window;
+
+  const data = new FormData();
+  data.append('source', window.codeworldEditor.getValue());
+  data.append('mode', window.buildMode);
+
+  const messages = {
+    includeCode: 'Copy this link to share your program and code with others!',
+    noCode: 'Copy this link to share your program (but not code) with others!',
+    errorsDetected:
+      '<i>Please keep in mind that you are about to share code that contains errors. You can see what those errors are by actually running the program.</i><br><br>',
+  };
+
+  function constructMessage(message, withErrors) {
+    return `${withErrors ? messages.errorsDetected : ''}${message}`;
+  }
+
   let offerSource = true;
 
-  function go() {
+  function showDialog(hash, deployHash) {
+    const { origin } = window.location;
+
     let url;
-    let msg;
+    let message;
     let showConfirm;
     let confirmText;
+    let withErrors = false;
 
-    if (!window.deployHash) {
-      url = window.location.href;
-      msg = 'Copy this link to share your program and code with others!';
-      showConfirm = false;
-    } else if (offerSource) {
-      url = window.location.href;
-      msg = 'Copy this link to share your program and code with others!';
-      showConfirm = true;
-      confirmText = 'Share Without Code';
-    } else {
-      const a = document.createElement('a');
-      a.href = `run.html?mode=${window.buildMode}&dhash=${window.deployHash}`;
-
-      url = a.href;
-      msg = 'Copy this link to share your program (but not code) with others!';
-      showConfirm = true;
-      confirmText = 'Share With Code';
-    }
+    sendHttp('POST', 'errorCheck', data, ({ status }) => {
+      if (status === 400) {
+        withErrors = true;
+      }
 
-    sweetAlert({
-      title: Alert.title('Share', 'mdi-share'),
-      html: msg,
-      input: 'text',
-      inputValue: url,
-      showConfirmButton: showConfirm,
-      confirmButtonText: confirmText,
-      closeOnConfirm: false,
-      showCancelButton: true,
-      cancelButtonText: 'Done',
-      animation: 'slide-from-bottom',
-    }).then((result) => {
-      if (result && result.value) {
-        offerSource = !offerSource;
-        go();
+      const constructErrorAwareMessage = partialRight(constructMessage, [
+        withErrors,
+      ]);
+
+      if (!deployHash) {
+        url = `${origin}/#${hash}`;
+        message = constructErrorAwareMessage(messages.includeCode);
+        showConfirm = false;
+      } else if (offerSource) {
+        url = `${origin}/#${hash}`;
+        message = constructErrorAwareMessage(messages.includeCode);
+        showConfirm = true;
+        confirmText = 'Share Without Code';
+      } else {
+        url = `${origin}/run.html?mode=${window.buildMode}&dhash=${deployHash}`;
+        message = constructErrorAwareMessage(messages.noCode);
+        showConfirm = true;
+        confirmText = 'Share With Code';
       }
-    });
-  }
 
-  if (window.runningGeneration) {
-    if (!window.codeworldEditor.getDoc().isClean(window.runningGeneration)) {
       sweetAlert({
-        type: 'warning',
-        text:
-          'You have changed your code since running the program. ' +
-          ' Rebuild so that you can share your latest code?',
-        confirmButtonText: 'Yes, Rebuild',
-        cancelButtonText: 'No, Share Old Program',
-        showConfirmButton: true,
+        title: Alert.title('Share', 'mdi-share'),
+        html: message,
+        input: 'text',
+        inputValue: url,
+        showConfirmButton: showConfirm,
+        confirmButtonText: confirmText,
+        closeOnConfirm: false,
         showCancelButton: true,
+        cancelButtonText: 'Done',
+        animation: 'slide-from-bottom',
       }).then((result) => {
         if (result && result.value) {
-          compile();
-        } else {
-          go();
+          offerSource = !offerSource;
+          showDialog(hash, deployHash);
         }
       });
-      return;
-    }
+    });
   }
 
-  go();
+  function storeCode(callback) {
+    sendHttp('POST', 'compile', data, (request) => {
+      let hash;
+      let deployHash;
+
+      if (request.status < 500) {
+        if (request.responseText.length === 23) {
+          hash = request.responseText;
+          deployHash = null;
+        } else {
+          try {
+            const obj = JSON.parse(request.responseText);
+            hash = obj.hash;
+            deployHash = obj.dhash;
+          } catch (e) {
+            hash = '';
+          }
+        }
+      }
+
+      if (!hash) {
+        sweetAlert({
+          title: Alert.title('Could not share'),
+          text: 'Sharing is currently unavailable. Please try again later.',
+          type: 'error',
+        });
+        return;
+      }
+
+      callback(hash, deployHash);
+    });
+  }
+
+  if (hash && deployHash) {
+    showDialog(hash, deployHash);
+  } else {
+    storeCode(showDialog);
+  }
 }
 
 function shareFolder_(mode) {
@@ -1885,10 +1929,8 @@ function run(hash, dhash, msg, error, generation) {
 
   if (hash) {
     window.location.hash = `#${hash}`;
-    document.getElementById('shareButton').style.display = '';
   } else {
     window.location.hash = '';
-    document.getElementById('shareButton').style.display = 'none';
   }
 
   if (dhash) {
diff --git a/web/js/funblocks.js b/web/js/funblocks.js
index 410d9681e..6a5950ec8 100644
--- a/web/js/funblocks.js
+++ b/web/js/funblocks.js
@@ -66,7 +66,7 @@ function attachEventListeners() {
   $('#deleteButton').on('click', deleteProject);
   $('#docButton').on('click', help);
   $('#shareFolderButton').on('click', () => shareFolder_(window.projectEnv));
-  $('#shareButton').on('click', () => share(compile));
+  $('#shareButton').on('click', share);
 
   $('#runner').on('load', toggleObsoleteCodeAlert);
 }
@@ -259,14 +259,10 @@ function run(xmlHash, codeHash, msg, error, dhash) {
   if (hash) {
     window.location.hash = `#${xmlHash}`;
 
-    document.getElementById('shareButton').style.display = '';
-
     $shareFolderButton.hide();
   } else {
     window.location.hash = '';
 
-    document.getElementById('shareButton').style.display = 'none';
-
     $shareFolderButton.show();
   }