Merge pull request code-dot-org#685 from code-dot-org/shapeways_disclaimer

Update Shapeways button flow

Author: bcjordan

blockly/src/feedback.js

@@ -507,12 +507,21 @@ exports.createSharingDiv = function(options) {
     });
   }
 
-//  SMS-to-phone feature
+  var sharingShapeways = sharingDiv.querySelector('#sharing-shapeways');
+  if (sharingShapeways) {
+    dom.addClickTouchEvent(sharingShapeways, function() {
+      $('#send-to-phone').hide();
+      $('#shapeways-message').toggle();
+    });
+  }
+
+  //  SMS-to-phone feature
   var sharingPhone = sharingDiv.querySelector('#sharing-phone');
   if (sharingPhone && options.sendToPhone) {
     dom.addClickTouchEvent(sharingPhone, function() {
       var sendToPhone = sharingDiv.querySelector('#send-to-phone');
       if ($(sendToPhone).is(':hidden')) {
+        $('#shapeways-message').hide();
         sendToPhone.setAttribute('style', 'display:inline-block');
         var phone = $(sharingDiv.querySelector("#phone"));
         var submitted = false;

blockly/src/templates/sharing.html.ejs

@@ -49,8 +49,8 @@
         <img src='<%= BlocklyApps.assetUrl("media/phone_purple.png") %>' />
       </a>
     <% } -%>
-    <% if (options.level.shapewaysUrl) { -%>
-      <a href='<%= options.level.shapewaysUrl %>' target="_blank">
+    <% if (options.level.shapewaysUrl && !options.onMainPage && options.sendToPhone) { -%>
+      <a id="sharing-shapeways" href="" onClick="return false;">
         <img src='<%= BlocklyApps.assetUrl("media/shapeways_purple.png") %>' />
       </a>
     <% } -%>
@@ -63,3 +63,10 @@
   <button id="phone-submit" onClick="return false;">Send</button>
   <div id="phone-charges">A text message will be sent via <a href="http://twilio.com">Twilio</a>. Charges may apply to the recipient.</div>
 </div>
+<% if (options.response && options.response.level_source && options.level.shapewaysUrl) { -%>
+  <div id="shapeways-message" class="sharing" style="display: none">
+    <div id="shapeways-message-body">You'll be redirected to Shapeways.com to order and purchase a 3D print.</div>
+    <button id="shapeways-print-go-button" onclick="location.href='<%= options.level.shapewaysUrl %>'">Go to Shapeways</button>
+    <div id="shapeways-message-body-disclaimer">Students under 13 years need a parent or guardian to do 3D printing.</div>
+  </div>
+<% } -%>

blockly/static/shapeways_purple.png

@@ -853,6 +853,26 @@ $modal-image-margin-gap: 10px;
   text-align: center;
 }
 
+#shapeways-print-go-button {
+  margin-bottom: 10px;
+}
+
+#shapeways-message-body {
+  font-size: 15px;
+  margin-bottom: 7px;
+  line-height: 26px;
+}
+
+#shapeways-message-body-disclaimer {
+  font-size: 11px;
+  margin-bottom: -11px;
+}
+
+#shapeways-message {
+  display: block;
+  text-align: center;
+}
+
 .modal-image {
   width: $modal-image-width;
   height: auto;