From ce8b71ff9464669ad324ee814ee8c93f447da02b Mon Sep 17 00:00:00 2001
From: "Anthony J. Thibault" <tony@highfidelity.io>
Date: Tue, 25 Apr 2017 15:05:52 -0700
Subject: [PATCH 01/36] viveMotionCapture.js: can now disable puck control,
 with a second controller squeeze

---
 scripts/developer/tests/viveMotionCapture.js | 130 +++++++++----------
 1 file changed, 65 insertions(+), 65 deletions(-)

diff --git a/scripts/developer/tests/viveMotionCapture.js b/scripts/developer/tests/viveMotionCapture.js
index 6cb0f92b9b..5496b475be 100644
--- a/scripts/developer/tests/viveMotionCapture.js
+++ b/scripts/developer/tests/viveMotionCapture.js
@@ -8,7 +8,7 @@ var TRACKED_OBJECT_POSES = [
     "TrackedObject12", "TrackedObject13", "TrackedObject14", "TrackedObject15"
 ];
 
-var calibrated = false;
+var triggerPressHandled = false;
 var rightTriggerPressed = false;
 var leftTriggerPressed = false;
 
@@ -43,21 +43,6 @@ var SENSOR_CONFIG_NAMES = [
     "Auto"
 ];
 
-var ANIM_VARS = [
-    "leftFootType",
-    "leftFootPosition",
-    "leftFootRotation",
-    "rightFootType",
-    "rightFootPosition",
-    "rightFootRotation",
-    "hipsType",
-    "hipsPosition",
-    "hipsRotation",
-    "spine2Type",
-    "spine2Position",
-    "spine2Rotation"
-];
-
 var sensorConfig = AUTO;
 
 var Y_180 = {x: 0, y: 1, z: 0, w: 0};
@@ -86,7 +71,7 @@ function computeDefaultToReferenceXform() {
 
         return defaultToReferenceXform;
     } else {
-        return new Xform.ident();
+        return Xform.ident();
     }
 }
 
@@ -200,71 +185,86 @@ function computeIKTargetXform(jointInfo) {
 
 function update(dt) {
     if (rightTriggerPressed && leftTriggerPressed) {
-        if (!calibrated) {
-            calibrate();
-            calibrated = true;
-
+        if (!triggerPressHandled) {
+            triggerPressHandled = true;
             if (handlerId) {
-                MyAvatar.removeAnimationStateHandler(handlerId);
-            }
+                print("AJT: UN-CALIBRATE!");
 
-            handlerId = MyAvatar.addAnimationStateHandler(function (props) {
-
-                var result = {}, xform;
-                if (rightFoot) {
-                    xform = computeIKTargetXform(rightFoot);
-                    result.rightFootType = ikTypes.RotationAndPosition;
-                    result.rightFootPosition = xform.pos;
-                    result.rightFootRotation = xform.rot;
-                } else {
-                    result.rightFootType = props.rightFootType;
-                    result.rightFootPosition = props.rightFootPosition;
-                    result.rightFootRotation = props.rightFootRotation;
+                // go back to normal, vive pucks will be ignored.
+                leftFoot = undefined;
+                rightFoot = undefined;
+                hips = undefined;
+                spine2 = undefined;
+                if (handlerId) {
+                    print("AJT: un-hooking animation state handler");
+                    MyAvatar.removeAnimationStateHandler(handlerId);
+                    handlerId = undefined;
                 }
+            } else {
+                print("AJT: CALIBRATE!");
+                calibrate();
+
+                var animVars = [];
 
                 if (leftFoot) {
-                    xform = computeIKTargetXform(leftFoot);
-                    result.leftFootType = ikTypes.RotationAndPosition;
-                    result.leftFootPosition = xform.pos;
-                    result.leftFootRotation = xform.rot;
-                } else {
-                    result.leftFootType = props.leftFootType;
-                    result.leftFootPosition = props.leftFootPosition;
-                    result.leftFootRotation = props.leftFootRotation;
+                    animVars.push("leftFootType");
+                    animVars.push("leftFootPosition");
+                    animVars.push("leftFootRotation");
+                }
+                if (rightFoot) {
+                    animVars.push("rightFootType");
+                    animVars.push("rightFootPosition");
+                    animVars.push("rightFootRotation");
                 }
-
                 if (hips) {
-                    xform = computeIKTargetXform(hips);
-                    result.hipsType = ikTypes.RotationAndPosition;
-                    result.hipsPosition = xform.pos;
-                    result.hipsRotation = xform.rot;
-                } else {
-                    result.hipsType = props.hipsType;
-                    result.hipsPosition = props.hipsPosition;
-                    result.hipsRotation = props.hipsRotation;
+                    animVars.push("hipsType");
+                    animVars.push("hipsPosition");
+                    animVars.push("hipsRotation");
                 }
-
                 if (spine2) {
-                    xform = computeIKTargetXform(spine2);
-                    result.spine2Type = ikTypes.RotationAndPosition;
-                    result.spine2Position = xform.pos;
-                    result.spine2Rotation = xform.rot;
-                } else {
-                    result.spine2Type = ikTypes.Off;
+                    animVars.push("spine2Type");
+                    animVars.push("spine2Position");
+                    animVars.push("spine2Rotation");
                 }
 
-                return result;
-            }, ANIM_VARS);
-
+                // hook up new anim state handler that maps vive pucks to ik system.
+                handlerId = MyAvatar.addAnimationStateHandler(function (props) {
+                    var result = {}, xform;
+                    if (rightFoot) {
+                        xform = computeIKTargetXform(rightFoot);
+                        result.rightFootType = ikTypes.RotationAndPosition;
+                        result.rightFootPosition = xform.pos;
+                        result.rightFootRotation = xform.rot;
+                    }
+                    if (leftFoot) {
+                        xform = computeIKTargetXform(leftFoot);
+                        result.leftFootType = ikTypes.RotationAndPosition;
+                        result.leftFootPosition = xform.pos;
+                        result.leftFootRotation = xform.rot;
+                    }
+                    if (hips) {
+                        xform = computeIKTargetXform(hips);
+                        result.hipsType = ikTypes.RotationAndPosition;
+                        result.hipsPosition = xform.pos;
+                        result.hipsRotation = xform.rot;
+                    }
+                    if (spine2) {
+                        xform = computeIKTargetXform(spine2);
+                        result.spine2Type = ikTypes.RotationAndPosition;
+                        result.spine2Position = xform.pos;
+                        result.spine2Rotation = xform.rot;
+                    }
+                    return result;
+                }, animVars);
+            }
         }
     } else {
-        calibrated = false;
+        triggerPressHandled = false;
     }
 
     var drawMarkers = false;
     if (drawMarkers) {
         var RED = {x: 1, y: 0, z: 0, w: 1};
-        var GREEN = {x: 0, y: 1, z: 0, w: 1};
         var BLUE = {x: 0, y: 0, z: 1, w: 1};
 
         if (leftFoot) {
@@ -304,4 +304,4 @@ Script.scriptEnding.connect(function () {
     Controller.disableMapping(MAPPING_NAME);
     Script.update.disconnect(update);
 });
-var TRIGGER_OFF_VALUE = 0.1;
+

From 0860352caacf4c7b60ddb491673516954c363f75 Mon Sep 17 00:00:00 2001
From: Zach Fox <fox@highfidelity.io>
Date: Tue, 18 Apr 2017 14:44:24 -0700
Subject: [PATCH 02/36] Checkpoint before switching to crash duty

---
 scripts/system/html/SnapshotReview.html    |  36 ++----
 scripts/system/html/css/SnapshotReview.css | 140 +++++++++++++--------
 scripts/system/html/css/hifi-style.css     |  90 +++++++++++++
 scripts/system/html/js/SnapshotReview.js   |   6 +
 scripts/system/snapshot.js                 |   5 +
 5 files changed, 200 insertions(+), 77 deletions(-)
 create mode 100644 scripts/system/html/css/hifi-style.css

diff --git a/scripts/system/html/SnapshotReview.html b/scripts/system/html/SnapshotReview.html
index 145cfb16a9..2a68217976 100644
--- a/scripts/system/html/SnapshotReview.html
+++ b/scripts/system/html/SnapshotReview.html
@@ -1,7 +1,7 @@
 <html>
 <head>
     <title>Share</title>
-    <link rel="stylesheet" type="text/css" href="css/edit-style.css">
+    <link rel="stylesheet" type="text/css" href="css/hifi-style.css">
     <link rel="stylesheet" type="text/css" href="css/SnapshotReview.css">
     <script type="text/javascript" src="js/eventBridgeLoader.js"></script>
     <script type="text/javascript" src="js/SnapshotReview.js"></script>
@@ -10,6 +10,9 @@
 <body>
     <div class="snapsection title">
         <label>Snap</label>
+
+        <label id="settingsLabel" for="snapshotSettings">Settings</label>
+        <input type="button" class="hifi-glyph naked" id="snapshotSettings" value="@" onclick="snapshotSettings()" />
     </div>
     <hr />
     <div id="snapshot-pane">
@@ -17,29 +20,16 @@
         </div>
     </div>
     <div id="snapshot-controls">
-        <div class="snapsection" id="snap-buttons">
-            <div id="sharing">
-                <div class="button">
-                    <span class="compound-button">
-                        <input type="button" class="blue" id="share" value="Share in Feed" onclick="shareSelected()" />
-                        <span class="glyph"></span>
-                    </span>
-                </div>
-            </div>
-            <div class="button">
-                <input type="button" class="black" id="close" value="Don't Share" onclick="doNotShare()" />
-            </div>
+        <div id="snap-settings">
+            <label>CAMERA CAPTURES</label><br />
+            <form action="">
+                <input type="radio" name="cameraCaptures" id="stillAndGif" value="stillAndGif" />
+                <label for="stillAndGif">Still + GIF</label><br />
+                <input type="radio" name="cameraCaptures" id="stillOnly" value="stillOnly" />
+                <label for="stillOnly">Still Only</label>
+            </form>
         </div>
-        <hr />
-        <div class="snapsection" id="snap-settings">
-            <span class="setting">
-                <input type="button" class="glyph naked" id="snapshotSettings" value="@" onclick="snapshotSettings()" />
-                <label for="snapshotSettings">Settings</label>
-            </span>
-            <span class="setting checkbox">
-                <input id="openFeed" type="checkbox" checked />
-                <label for="openFeed">Open feed after</label>
-            </span>
+        <div id="snap-button" onclick="takeSnapshot()">
         </div>
     </div>
 </body>
diff --git a/scripts/system/html/css/SnapshotReview.css b/scripts/system/html/css/SnapshotReview.css
index 34b690a021..058fe141dd 100644
--- a/scripts/system/html/css/SnapshotReview.css
+++ b/scripts/system/html/css/SnapshotReview.css
@@ -9,40 +9,66 @@
 */
 
 body {
-    padding-top: 0;
-    padding-bottom: 14px;
+    padding: 0;
 }
 
+/*
+// START styling of top bar and its contents
+*/
 .snapsection {
-    padding-top: 14px;
-    text-align: center;
+    padding-top: 12px;
 }
 
 .snapsection.title {
     padding-top: 0;
     text-align: left;
+    height: 24px;
+    clear: both;
 }
 
 .title label {
-    font-size: 18px;
     position: relative;
-    top: 12px;
+    top: 10px;
+    font-size: 18px;
+    float: left;
 }
 
+#snapshotSettings {
+    position: relative;
+    top: 4px;
+    float: right;
+}
+#settingsLabel {
+    position: relative;
+    float: right;
+    top: 12px;
+    font-family: Raleway-SemiBold;
+    font-size: 14px;
+}
+.hifi-glyph {
+    font-size: 30px;
+}
+input[type=button].naked {
+    color: #afafaf;
+    background: none;
+}
+input[type=button].naked:hover {
+    color: #ffffff;
+}
+input[type=button].naked:active {
+    color: #afafaf;
+}
+/*
+// END styling of top bar and its contents
+*/
+
+/*
+// START styling of snapshot pane and its contents
+*/
 #snapshot-pane {
-    width: 100%;
-    height: 100%;
-    position: absolute;
-    top: 0;
-    left: 0;
-    box-sizing: border-box;
-    padding-top: 56px;
-    padding-bottom: 175px;
 }
 
 #snapshot-images {
-    height: 100%;
-    width: 100%;
     position: relative;
 }
 
@@ -77,23 +103,59 @@ body {
 #snapshot-images img.multiple {
     padding-left: 28px;
 }
+/*
+// END styling of snapshot pane and its contents
+*/
 
+/*
+// START styling of snapshot controls (bottom panel) and its contents
+*/
 #snapshot-controls {
     width: 100%;
     position: absolute;
     left: 0;
     bottom: 14px;
+    margin-bottom: 14px;
+    overflow: hidden;
+}
+#snap-settings {
+    float: left;
+    margin-left: 10px;
+}
+#snap-settings label {
+    margin-bottom: 50px;
+}
+#snap-settings form input {
+    margin-bottom: 50px;
 }
 
+#snap-button {
+    width: 65px;
+    height: 65px;
+    border-radius: 50%;
+    background: #EA4C5F;
+    border: 3px solid white;
+    margin-left: auto;
+    margin-right: auto;
+}
+#snap-button:hover {
+    background: #C62147;
+}
+#snap-button:active {
+    background: #EA4C5F;
+}
+/*
+// END styling of snapshot controls (bottom panel) and its contents
+*/
+
+/*
+// START misc styling
+*/
 .prompt {
     font-family: Raleway-SemiBold;
     font-size: 14px;
 }
 
-div.button {
-    padding-top: 21px;
-}
-
 .compound-button {
     position: relative;
     height: auto;
@@ -103,7 +165,7 @@ div.button {
     padding-left: 40px;
 }
 
-.compound-button .glyph {
+.compound-button {
     display: inline-block;
     position: absolute;
     left: 12px;
@@ -114,36 +176,6 @@ div.button {
     background-repeat: no-repeat;
     background-size: 23px 23px;
 }
-
-.setting {
-    display: inline-table;
-    height: 28px;
-}
-
-.setting label {
-    display: table-cell;
-    vertical-align: middle;
-    font-family: Raleway-SemiBold;
-    font-size: 14px;
-}
-
-.setting + .setting {
-    margin-left: 18px;
-}
-
-input[type=button].naked {
-    font-size: 40px;
-    line-height: 40px;
-    width: 30px;
-    padding: 0;
-    margin: 0 0 -6px 0;
-    position: relative;
-    top: -6px;
-    left: -8px;
-    background: none;
-}
-
-input[type=button].naked:hover {
-    color: #00b4ef;
-    background: none;
-}
+/*
+// END misc styling
+*/
diff --git a/scripts/system/html/css/hifi-style.css b/scripts/system/html/css/hifi-style.css
new file mode 100644
index 0000000000..52d4c72b23
--- /dev/null
+++ b/scripts/system/html/css/hifi-style.css
@@ -0,0 +1,90 @@
+/*
+//  hifi-style.css
+//
+//  Created by Zach Fox on 2017-04-18
+//  Copyright 2017 High Fidelity, Inc.
+//
+//  Distributed under the Apache License, Version 2.0.
+//  See the accompanying file LICENSE or http://www.apache.org/licenses/LICENSE-2.0.html
+*/
+
+@font-face {
+    font-family: Raleway-Regular;
+    src: url(../../../../resources/fonts/Raleway-Regular.ttf),  /* Windows production */
+         url(../../../../fonts/Raleway-Regular.ttf),  /* OSX production */
+         url(../../../../interface/resources/fonts/Raleway-Regular.ttf);  /* Development, running script in /HiFi/examples */
+}
+
+@font-face {
+    font-family: Raleway-Light;
+    src: url(../../../../resources/fonts/Raleway-Light.ttf),
+         url(../../../../fonts/Raleway-Light.ttf),
+         url(../../../../interface/resources/fonts/Raleway-Light.ttf);
+}
+
+@font-face {
+    font-family: Raleway-Bold;
+    src: url(../../../../resources/fonts/Raleway-Bold.ttf),
+         url(../../../../fonts/Raleway-Bold.ttf),
+         url(../../../../interface/resources/fonts/Raleway-Bold.ttf);
+}
+
+@font-face {
+    font-family: Raleway-SemiBold;
+    src: url(../../../../resources/fonts/Raleway-SemiBold.ttf),
+         url(../../../../fonts/Raleway-SemiBold.ttf),
+         url(../../../../interface/resources/fonts/Raleway-SemiBold.ttf);
+}
+
+@font-face {
+    font-family: FiraSans-SemiBold;
+    src: url(../../../../resources/fonts/FiraSans-SemiBold.ttf),
+         url(../../../../fonts/FiraSans-SemiBold.ttf),
+         url(../../../../interface/resources/fonts/FiraSans-SemiBold.ttf);
+}
+
+@font-face {
+    font-family: AnonymousPro-Regular;
+    src: url(../../../../resources/fonts/AnonymousPro-Regular.ttf),
+         url(../../../../fonts/AnonymousPro-Regular.ttf),
+         url(../../../../interface/resources/fonts/AnonymousPro-Regular.ttf);
+}
+
+@font-face {
+    font-family: HiFi-Glyphs;
+    src: url(../../../../resources/fonts/hifi-glyphs.ttf),
+         url(../../../../fonts/hifi-glyphs.ttf),
+         url(../../../../interface/resources/fonts/hifi-glyphs.ttf);
+}
+
+body {
+    color: #afafaf;
+    background-color: #404040;
+    font-family: Raleway-Regular;
+    font-size: 15px;
+
+    -webkit-touch-callout: none;
+    -webkit-user-select: none;
+    -khtml-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
+
+    overflow-x: hidden;
+    overflow-y: auto;
+}
+
+hr {
+    border: none;
+    background: #404040 url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAQAAAAECAYAAACp8Z5+AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsQAAA7EAZUrDhsAAAAjSURBVBhXY1RVVf3PgARYjIyMoEwIYHRwcEBRwQSloYCBAQCwjgPMiI7W2QAAAABJRU5ErkJggg==) repeat-x top left;
+    width: 100%;
+    margin: 21px -21px 0 -21px;
+    padding: 14px 21px 0 21px;
+}
+
+.hifi-glyph {
+    font-family: HiFi-Glyphs;
+    border: none;
+    //margin: -10px;
+    padding: 0;
+}
diff --git a/scripts/system/html/js/SnapshotReview.js b/scripts/system/html/js/SnapshotReview.js
index f140c54e09..7fec372c94 100644
--- a/scripts/system/html/js/SnapshotReview.js
+++ b/scripts/system/html/js/SnapshotReview.js
@@ -124,3 +124,9 @@ function snapshotSettings() {
         action: "openSettings"
     }));
 }
+function takeSnapshot() {
+    EventBridge.emitWebEvent(JSON.stringify({
+        type: "snapshot",
+        action: "takeSnapshot"
+    }));
+}
diff --git a/scripts/system/snapshot.js b/scripts/system/snapshot.js
index 6039bc09c1..47abf41021 100644
--- a/scripts/system/snapshot.js
+++ b/scripts/system/snapshot.js
@@ -75,6 +75,11 @@ function onMessage(message) {
                 tablet.loadQMLOnTop("TabletGeneralPreferences.qml");
             }
             break;
+        case 'takeSnapshot':
+            // In settings, first store the paths to the last snapshot
+            //
+            onClicked();
+            break;
         case 'setOpenFeedFalse':
             Settings.setValue('openFeedAfterShare', false);
             break;

From 7acdc866440db2c95744de2210d256796d6aa582 Mon Sep 17 00:00:00 2001
From: Zach Fox <fox@highfidelity.io>
Date: Wed, 19 Apr 2017 13:55:47 -0700
Subject: [PATCH 03/36] Progress

---
 scripts/system/html/SnapshotReview.html    |   2 +-
 scripts/system/html/css/SnapshotReview.css |  33 +------
 scripts/system/html/js/SnapshotReview.js   | 102 +++++++++++----------
 scripts/system/snapshot.js                 |   7 ++
 4 files changed, 67 insertions(+), 77 deletions(-)

diff --git a/scripts/system/html/SnapshotReview.html b/scripts/system/html/SnapshotReview.html
index 2a68217976..1dff573014 100644
--- a/scripts/system/html/SnapshotReview.html
+++ b/scripts/system/html/SnapshotReview.html
@@ -23,7 +23,7 @@
         <div id="snap-settings">
             <label>CAMERA CAPTURES</label><br />
             <form action="">
-                <input type="radio" name="cameraCaptures" id="stillAndGif" value="stillAndGif" />
+                <input type="radio" name="cameraCaptures" id="stillAndGif" value="stillAndGif" checked="checked" />
                 <label for="stillAndGif">Still + GIF</label><br />
                 <input type="radio" name="cameraCaptures" id="stillOnly" value="stillOnly" />
                 <label for="stillOnly">Still Only</label>
diff --git a/scripts/system/html/css/SnapshotReview.css b/scripts/system/html/css/SnapshotReview.css
index 058fe141dd..3985253a03 100644
--- a/scripts/system/html/css/SnapshotReview.css
+++ b/scripts/system/html/css/SnapshotReview.css
@@ -10,6 +10,7 @@
 
 body {
     padding: 0;
+    margin: 0;
 }
 
 /*
@@ -17,6 +18,7 @@ body {
 */
 .snapsection {
     padding-top: 12px;
+    margin: 8px;
 }
 
 .snapsection.title {
@@ -66,43 +68,18 @@ input[type=button].naked:active {
 // START styling of snapshot pane and its contents
 */
 #snapshot-pane {
+    height: 510px;
 }
 
 #snapshot-images {
     position: relative;
 }
 
-#snapshot-images > div {
-    position: relative;
-    text-align: center;
-}
-
 #snapshot-images img {
     max-width: 100%;
     max-height: 100%;
-    position: absolute;
-    top: 50%;
-    left: 50%;
-    transform: translate(-50%, -50%);
     vertical-align: middle;
 }
-
-#snapshot-images div.property {
-    margin-top: 0;
-    position: absolute;
-    top: 50%;
-    left: 7px;
-    transform: translate(0%, -50%);
-}
-
-#snapshot-images img {
-    box-sizing: border-box;
-    padding: 0 7px 0 7px;
-}
-
-#snapshot-images img.multiple {
-    padding-left: 28px;
-}
 /*
 // END styling of snapshot pane and its contents
 */
@@ -123,10 +100,10 @@ input[type=button].naked:active {
     margin-left: 10px;
 }
 #snap-settings label {
-    margin-bottom: 50px;
+    height: 50px;
 }
 #snap-settings form input {
-    margin-bottom: 50px;
+    margin-bottom: 10px;
 }
 
 #snap-button {
diff --git a/scripts/system/html/js/SnapshotReview.js b/scripts/system/html/js/SnapshotReview.js
index 7fec372c94..4b95507309 100644
--- a/scripts/system/html/js/SnapshotReview.js
+++ b/scripts/system/html/js/SnapshotReview.js
@@ -10,43 +10,44 @@
 //  See the accompanying file LICENSE or http://www.apache.org/licenses/LICENSE-2.0.html
 //
 
-var paths = [], idCounter = 0, imageCount;
+var paths = [], idCounter = 0, imageCount = 1;
 function addImage(data) {
     if (!data.localPath) {
         return;
     }
-    var div = document.createElement("DIV"),
-        input = document.createElement("INPUT"),
-        label = document.createElement("LABEL"),
-        img = document.createElement("IMG"),
-        div2 = document.createElement("DIV"),
-        id = "p" + idCounter++;
-        img.id = id + "img";
-    function toggle() { data.share = input.checked; }
+    var div = document.createElement("DIV");
+    var id = "p" + idCounter++;
+    var img = document.createElement("IMG");
+    img.id = "img" + id;
     div.style.height = "" + Math.floor(100 / imageCount) + "%";
     if (imageCount > 1) {
         img.setAttribute("class", "multiple");
     }
     img.src = data.localPath;
     div.appendChild(img);
-    if (imageCount > 1) { // I'd rather use css, but the included stylesheet is quite particular.
-        // Our stylesheet(?) requires input.id to match label.for. Otherwise input doesn't display the check state.
-        label.setAttribute('for', id); // cannot do label.for =
-        input.id = id;
-        input.type = "checkbox";
-        input.checked = false;
-        data.share = input.checked;
-        input.addEventListener('change', toggle);
-        div2.setAttribute("class", "property checkbox");
-        div2.appendChild(input);
-        div2.appendChild(label);
-        div.appendChild(div2);
-    } else {
-        data.share = true;
-    }
     document.getElementById("snapshot-images").appendChild(div);
     paths.push(data);
 }
+function handleCaptureSetting(setting) {
+    var stillAndGif = document.getElementById('stillAndGif');
+    var stillOnly = document.getElementById('stillOnly');
+    stillAndGif.checked = setting;
+    stillOnly.checked = !setting;
+
+    stillAndGif.onclick = function () {
+        EventBridge.emitWebEvent(JSON.stringify({
+            type: "captureSettings",
+            action: true
+        }));
+    }
+    stillOnly.onclick = function () {
+        EventBridge.emitWebEvent(JSON.stringify({
+            type: "captureSettings",
+            action: false
+        }));
+    }
+
+}
 function handleShareButtons(messageOptions) {
     var openFeed = document.getElementById('openFeed');
     openFeed.checked = messageOptions.openFeedAfterShare;
@@ -66,36 +67,41 @@ function handleShareButtons(messageOptions) {
 window.onload = function () {
     // Something like the following will allow testing in a browser.
     //addImage({localPath: 'c:/Users/howar/OneDrive/Pictures/hifi-snap-by--on-2016-07-27_12-58-43.jpg'});
-    //addImage({ localPath: 'http://lorempixel.com/1512/1680' });
+    addImage({ localPath: 'http://lorempixel.com/1512/1680' });
     openEventBridge(function () {
         // Set up a handler for receiving the data, and tell the .js we are ready to receive it.
         EventBridge.scriptEventReceived.connect(function (message) {
+
             message = JSON.parse(message);
-            if (message.type !== "snapshot") {
-                return;
-            }
 
-            // The last element of the message contents list contains a bunch of options,
-            // including whether or not we can share stuff
-            // The other elements of the list contain image paths.
-            var messageOptions = message.action.pop();
-            handleShareButtons(messageOptions);
+            switch (message.type) {
+                case 'snapshot':
+                    // The last element of the message contents list contains a bunch of options,
+                    // including whether or not we can share stuff
+                    // The other elements of the list contain image paths.
+                    var messageOptions = message.action.pop();
+                    handleShareButtons(messageOptions);
 
-            if (messageOptions.containsGif) {
-                if (messageOptions.processingGif) {
-                    imageCount = message.action.length + 1; // "+1" for the GIF that'll finish processing soon
-                    message.action.unshift({ localPath: messageOptions.loadingGifPath });
-                    message.action.forEach(addImage);
-                    document.getElementById('p0').disabled = true;
-                } else {
-                    var gifPath = message.action[0].localPath;
-                    document.getElementById('p0').disabled = false;
-                    document.getElementById('p0img').src = gifPath;
-                    paths[0].localPath = gifPath;
-                }
-            } else {
-                imageCount = message.action.length;
-                message.action.forEach(addImage);
+                    if (messageOptions.containsGif) {
+                        if (messageOptions.processingGif) {
+                            imageCount = message.action.length + 1; // "+1" for the GIF that'll finish processing soon
+                            message.action.unshift({ localPath: messageOptions.loadingGifPath });
+                            message.action.forEach(addImage);
+                        } else {
+                            var gifPath = message.action[0].localPath;
+                            document.getElementById('imgp0').src = gifPath;
+                            paths[0].localPath = gifPath;
+                        }
+                    } else {
+                        imageCount = message.action.length;
+                        message.action.forEach(addImage);
+                    }
+                    break;
+                case 'snapshotSettings':
+                    handleCaptureSetting(message.action);
+                    break;
+                default:
+                    return;
             }
         });
         EventBridge.emitWebEvent(JSON.stringify({
diff --git a/scripts/system/snapshot.js b/scripts/system/snapshot.js
index 47abf41021..266f90c704 100644
--- a/scripts/system/snapshot.js
+++ b/scripts/system/snapshot.js
@@ -61,6 +61,10 @@ function onMessage(message) {
     var needsLogin = false;
     switch (message.action) {
         case 'ready':  // Send it.
+            tablet.emitScriptEvent(JSON.stringify({
+                type: "snapshotSettings",
+                action: Settings.getValue("alsoTakeAnimatedSnapshot", true)
+            }));
             tablet.emitScriptEvent(JSON.stringify({
                 type: "snapshot",
                 action: readyData
@@ -75,6 +79,9 @@ function onMessage(message) {
                 tablet.loadQMLOnTop("TabletGeneralPreferences.qml");
             }
             break;
+        case 'captureSettings':
+            Settings.setValue("alsoTakeAnimatedSnapshot", message.action);
+            break;
         case 'takeSnapshot':
             // In settings, first store the paths to the last snapshot
             //

From a4f428a6e666239d5e6728ab637b2ad4bbcf9855 Mon Sep 17 00:00:00 2001
From: Zach Fox <fox@highfidelity.io>
Date: Wed, 19 Apr 2017 15:27:10 -0700
Subject: [PATCH 04/36] Lots of progress

---
 scripts/system/html/js/SnapshotReview.js | 41 ++++++++++++++++++++++--
 1 file changed, 39 insertions(+), 2 deletions(-)

diff --git a/scripts/system/html/js/SnapshotReview.js b/scripts/system/html/js/SnapshotReview.js
index 4b95507309..10d5b0eb92 100644
--- a/scripts/system/html/js/SnapshotReview.js
+++ b/scripts/system/html/js/SnapshotReview.js
@@ -19,15 +19,47 @@ function addImage(data) {
     var id = "p" + idCounter++;
     var img = document.createElement("IMG");
     img.id = "img" + id;
+    div.style.width = "100%";
     div.style.height = "" + Math.floor(100 / imageCount) + "%";
+    div.style.display = "flex";
+    div.style.justifyContent = "center";
+    div.style.alignItems = "center";
+    div.style.marginBottom = "5px";
+    div.style.position = "relative";
     if (imageCount > 1) {
         img.setAttribute("class", "multiple");
     }
     img.src = data.localPath;
     div.appendChild(img);
+    div.appendChild(createShareOverlayDiv());
     document.getElementById("snapshot-images").appendChild(div);
     paths.push(data);
 }
+function createShareOverlayDiv() {
+    var div = document.createElement("DIV");
+    div.style.position = "absolute";
+    div.style.display = "flex";
+    div.style.alignItems = "flex-end";
+    div.style.top = "0px";
+    div.style.left = "0px";
+    div.style.width = "100%";
+    div.style.height = "100%";
+
+    var shareBar = document.createElement("div");
+    shareBar.style.backgroundColor = "black";
+    shareBar.style.opacity = "0.5";
+    shareBar.style.width = "100%";
+    shareBar.style.height = "50px";
+    div.appendChild(shareBar);
+
+    var shareOverlay = document.createElement("div");
+    shareOverlay.style.display = "none";
+    shareOverlay.style.backgroundColor = "black";
+    shareOverlay.style.opacity = "0.5";
+    div.appendChild(shareOverlay);
+
+    return div;
+}
 function handleCaptureSetting(setting) {
     var stillAndGif = document.getElementById('stillAndGif');
     var stillOnly = document.getElementById('stillOnly');
@@ -65,9 +97,14 @@ function handleShareButtons(messageOptions) {
     }
 }
 window.onload = function () {
-    // Something like the following will allow testing in a browser.
-    //addImage({localPath: 'c:/Users/howar/OneDrive/Pictures/hifi-snap-by--on-2016-07-27_12-58-43.jpg'});
+    // TESTING FUNCTIONS START
+    // Uncomment and modify the lines below to test SnapshotReview in a browser.
+    imageCount = 2;
     addImage({ localPath: 'http://lorempixel.com/1512/1680' });
+    addImage({ localPath: 'http://lorempixel.com/553/255' });
+    //addImage({localPath: 'c:/Users/howar/OneDrive/Pictures/hifi-snap-by--on-2016-07-27_12-58-43.jpg'});
+    // TESTING FUNCTIONS END
+
     openEventBridge(function () {
         // Set up a handler for receiving the data, and tell the .js we are ready to receive it.
         EventBridge.scriptEventReceived.connect(function (message) {

From 0b4cd41d7558c13b67ebadfb346c81f4a82752ad Mon Sep 17 00:00:00 2001
From: Zach Fox <fox@highfidelity.io>
Date: Wed, 19 Apr 2017 16:44:16 -0700
Subject: [PATCH 05/36] More and more progress!

---
 scripts/system/html/css/SnapshotReview.css | 38 ++++++++++++++++++++++
 scripts/system/html/js/SnapshotReview.js   | 33 ++++++++++++++-----
 2 files changed, 62 insertions(+), 9 deletions(-)

diff --git a/scripts/system/html/css/SnapshotReview.css b/scripts/system/html/css/SnapshotReview.css
index 3985253a03..636edd9756 100644
--- a/scripts/system/html/css/SnapshotReview.css
+++ b/scripts/system/html/css/SnapshotReview.css
@@ -80,6 +80,44 @@ input[type=button].naked:active {
     max-height: 100%;
     vertical-align: middle;
 }
+
+.gifLabel {
+    font-family: Raleway-SemiBold;
+    font-size: 18px;
+    color: white;
+    float: left;
+    text-shadow: 2px 2px 3px #000000;
+    margin-left: 20px;
+}
+.shareButtonDiv {
+    display: flex;
+    align-items: center;
+    font-family: Raleway-SemiBold;
+    font-size: 14px;
+    color: white;
+    float: right;
+    text-shadow: 2px 2px 3px #000000;
+    width: 100px;
+    height: 100%;
+    margin-right: 10px;
+}
+.shareButtonLabel {
+    vertical-align: middle;
+}
+.shareButton {
+    background-color: white;
+    width: 40px;
+    height: 40px;
+    border-radius: 50%;
+    border-width: 0;
+    margin-left: 5px;
+}
+.shareButton:hover {
+    background-color: #afafaf;
+}
+.shareButton:active {
+    background-color: white;
+}
 /*
 // END styling of snapshot pane and its contents
 */
diff --git a/scripts/system/html/js/SnapshotReview.js b/scripts/system/html/js/SnapshotReview.js
index 10d5b0eb92..b0c53be502 100644
--- a/scripts/system/html/js/SnapshotReview.js
+++ b/scripts/system/html/js/SnapshotReview.js
@@ -18,7 +18,7 @@ function addImage(data) {
     var div = document.createElement("DIV");
     var id = "p" + idCounter++;
     var img = document.createElement("IMG");
-    img.id = "img" + id;
+    img.id = id + "img";
     div.style.width = "100%";
     div.style.height = "" + Math.floor(100 / imageCount) + "%";
     div.style.display = "flex";
@@ -31,11 +31,16 @@ function addImage(data) {
     }
     img.src = data.localPath;
     div.appendChild(img);
-    div.appendChild(createShareOverlayDiv());
     document.getElementById("snapshot-images").appendChild(div);
+    div.appendChild(createShareOverlayDiv(id, img.src.split('.').pop().toLowerCase() === "gif"));
+    img.onload = function () {
+        var shareBar = document.getElementById(id + "shareBar");
+        shareBar.style.width = img.clientWidth;
+        shareBar.style.display = "inline";
+    }
     paths.push(data);
 }
-function createShareOverlayDiv() {
+function createShareOverlayDiv(parentID, isGif) {
     var div = document.createElement("DIV");
     div.style.position = "absolute";
     div.style.display = "flex";
@@ -46,14 +51,24 @@ function createShareOverlayDiv() {
     div.style.height = "100%";
 
     var shareBar = document.createElement("div");
-    shareBar.style.backgroundColor = "black";
-    shareBar.style.opacity = "0.5";
+    shareBar.id = parentID + "shareBar"
+    shareBar.style.display = "none";
     shareBar.style.width = "100%";
-    shareBar.style.height = "50px";
+    shareBar.style.height = "60px";
+    shareBar.style.lineHeight = "60px";
+    shareBar.style.clear = "both";
+    shareBar.style.marginLeft = "auto";
+    shareBar.style.marginRight = "auto";
+    shareBar.innerHTML = isGif ? '<span class="gifLabel">GIF</span>' : "";
+    var shareButtonID = parentID + "shareButton";
+    shareBar.innerHTML += '<div class="shareButtonDiv">' +
+            '<label class="shareButtonLabel" for="' + shareButtonID + '">SHARE</label>' +
+            '<input type="button" class="shareButton" id="' + shareButtonID + '" onclick="" />' +
+        '</div>'
     div.appendChild(shareBar);
 
     var shareOverlay = document.createElement("div");
-    shareOverlay.style.display = "none";
+    shareOverlay.style.visibilty = "hidden";
     shareOverlay.style.backgroundColor = "black";
     shareOverlay.style.opacity = "0.5";
     div.appendChild(shareOverlay);
@@ -100,7 +115,7 @@ window.onload = function () {
     // TESTING FUNCTIONS START
     // Uncomment and modify the lines below to test SnapshotReview in a browser.
     imageCount = 2;
-    addImage({ localPath: 'http://lorempixel.com/1512/1680' });
+    addImage({ localPath: 'D:/Dropbox/Screenshots/High Fidelity Snapshots/2017-01-27 50 Avatars!/!!!.gif' });
     addImage({ localPath: 'http://lorempixel.com/553/255' });
     //addImage({localPath: 'c:/Users/howar/OneDrive/Pictures/hifi-snap-by--on-2016-07-27_12-58-43.jpg'});
     // TESTING FUNCTIONS END
@@ -126,7 +141,7 @@ window.onload = function () {
                             message.action.forEach(addImage);
                         } else {
                             var gifPath = message.action[0].localPath;
-                            document.getElementById('imgp0').src = gifPath;
+                            document.getElementById('p0img').src = gifPath;
                             paths[0].localPath = gifPath;
                         }
                     } else {

From 4270086a2250bc89cfbe9b65987a2bb1a1109251 Mon Sep 17 00:00:00 2001
From: Zach Fox <fox@highfidelity.io>
Date: Wed, 19 Apr 2017 17:47:12 -0700
Subject: [PATCH 06/36] Support 1 and 2 images

---
 scripts/system/html/css/SnapshotReview.css | 13 ++++--
 scripts/system/html/js/SnapshotReview.js   | 52 +++++++++++++++-------
 2 files changed, 46 insertions(+), 19 deletions(-)

diff --git a/scripts/system/html/css/SnapshotReview.css b/scripts/system/html/css/SnapshotReview.css
index 636edd9756..9cbc129ab6 100644
--- a/scripts/system/html/css/SnapshotReview.css
+++ b/scripts/system/html/css/SnapshotReview.css
@@ -17,6 +17,8 @@ body {
 // START styling of top bar and its contents
 */
 .snapsection {
+    padding-left: 8px;
+    padding-right: 8px;
     padding-top: 12px;
     margin: 8px;
 }
@@ -68,17 +70,20 @@ input[type=button].naked:active {
 // START styling of snapshot pane and its contents
 */
 #snapshot-pane {
+    width: 100%;
     height: 510px;
+    display: flex;
+    justify-content: center;
+    align-items: center;
 }
 
 #snapshot-images {
-    position: relative;
+    width: 100%;
 }
 
 #snapshot-images img {
     max-width: 100%;
     max-height: 100%;
-    vertical-align: middle;
 }
 
 .gifLabel {
@@ -126,11 +131,13 @@ input[type=button].naked:active {
 // START styling of snapshot controls (bottom panel) and its contents
 */
 #snapshot-controls {
+    padding-left: 8px;
+    padding-right: 8px;
     width: 100%;
     position: absolute;
     left: 0;
     bottom: 14px;
-    margin-bottom: 14px;
+    margin-bottom: 4px;
     overflow: hidden;
 }
 #snap-settings {
diff --git a/scripts/system/html/js/SnapshotReview.js b/scripts/system/html/js/SnapshotReview.js
index b0c53be502..3ebff3f687 100644
--- a/scripts/system/html/js/SnapshotReview.js
+++ b/scripts/system/html/js/SnapshotReview.js
@@ -18,13 +18,13 @@ function addImage(data) {
     var div = document.createElement("DIV");
     var id = "p" + idCounter++;
     var img = document.createElement("IMG");
+    div.id = id;
     img.id = id + "img";
     div.style.width = "100%";
     div.style.height = "" + Math.floor(100 / imageCount) + "%";
     div.style.display = "flex";
     div.style.justifyContent = "center";
     div.style.alignItems = "center";
-    div.style.marginBottom = "5px";
     div.style.position = "relative";
     if (imageCount > 1) {
         img.setAttribute("class", "multiple");
@@ -32,23 +32,26 @@ function addImage(data) {
     img.src = data.localPath;
     div.appendChild(img);
     document.getElementById("snapshot-images").appendChild(div);
-    div.appendChild(createShareOverlayDiv(id, img.src.split('.').pop().toLowerCase() === "gif"));
+    div.appendChild(createShareOverlay(id, img.src.split('.').pop().toLowerCase() === "gif"));
     img.onload = function () {
         var shareBar = document.getElementById(id + "shareBar");
         shareBar.style.width = img.clientWidth;
         shareBar.style.display = "inline";
+
+        document.getElementById(id).style.height = img.clientHeight;
     }
     paths.push(data);
 }
-function createShareOverlayDiv(parentID, isGif) {
-    var div = document.createElement("DIV");
-    div.style.position = "absolute";
-    div.style.display = "flex";
-    div.style.alignItems = "flex-end";
-    div.style.top = "0px";
-    div.style.left = "0px";
-    div.style.width = "100%";
-    div.style.height = "100%";
+function createShareOverlay(parentID, isGif) {
+    var shareOverlayContainer = document.createElement("DIV");
+    shareOverlayContainer.id = parentID + "shareOverlayContainer";
+    shareOverlayContainer.style.position = "absolute";
+    shareOverlayContainer.style.top = "0px";
+    shareOverlayContainer.style.left = "0px";
+    shareOverlayContainer.style.display = "flex";
+    shareOverlayContainer.style.alignItems = "flex-end";
+    shareOverlayContainer.style.width = "100%";
+    shareOverlayContainer.style.height = "100%";
 
     var shareBar = document.createElement("div");
     shareBar.id = parentID + "shareBar"
@@ -63,18 +66,35 @@ function createShareOverlayDiv(parentID, isGif) {
     var shareButtonID = parentID + "shareButton";
     shareBar.innerHTML += '<div class="shareButtonDiv">' +
             '<label class="shareButtonLabel" for="' + shareButtonID + '">SHARE</label>' +
-            '<input type="button" class="shareButton" id="' + shareButtonID + '" onclick="" />' +
+            '<input type="button" class="shareButton" id="' + shareButtonID + '" onclick="selectImageToShare(' + parentID + ')" />' +
         '</div>'
-    div.appendChild(shareBar);
+    shareOverlayContainer.appendChild(shareBar);
 
     var shareOverlay = document.createElement("div");
-    shareOverlay.style.visibilty = "hidden";
+    shareOverlay.id = parentID + "shareOverlay";
+    shareOverlay.style.display = "none";
     shareOverlay.style.backgroundColor = "black";
     shareOverlay.style.opacity = "0.5";
-    div.appendChild(shareOverlay);
+    shareOverlay.style.width = "100%";
+    shareOverlay.style.height = "100%";
+    shareOverlayContainer.appendChild(shareOverlay);
 
-    return div;
+    return shareOverlayContainer;
 }
+function selectImageToShare(selectedID) {
+    selectedID = selectedID.id; // Why is this necessary?
+    var shareOverlayContainer = document.getElementById(selectedID + "shareOverlayContainer");
+    var shareBar = document.getElementById(selectedID + "shareBar");
+    var shareOverlay = document.getElementById(selectedID + "shareOverlay");
+
+    shareOverlayContainer.style.outline = "4px solid #00b4ef";
+    shareOverlayContainer.style.outlineOffset = "-4px";
+
+    shareBar.style.display = "none";
+
+    shareOverlay.style.display = "inline";
+}
+
 function handleCaptureSetting(setting) {
     var stillAndGif = document.getElementById('stillAndGif');
     var stillOnly = document.getElementById('stillOnly');

From 2880b22f9fa28ecfadf5e47d39d60faede33af81 Mon Sep 17 00:00:00 2001
From: Zach Fox <fox@highfidelity.io>
Date: Thu, 20 Apr 2017 14:00:28 -0700
Subject: [PATCH 07/36] External share buttons!

---
 scripts/system/html/SnapshotReview.html    | 19 +++++++-
 scripts/system/html/css/SnapshotReview.css | 33 +++++++++++++
 scripts/system/html/js/SnapshotReview.js   | 54 ++++++++++++++++++++--
 3 files changed, 101 insertions(+), 5 deletions(-)

diff --git a/scripts/system/html/SnapshotReview.html b/scripts/system/html/SnapshotReview.html
index 1dff573014..3d8387890a 100644
--- a/scripts/system/html/SnapshotReview.html
+++ b/scripts/system/html/SnapshotReview.html
@@ -5,12 +5,29 @@
     <link rel="stylesheet" type="text/css" href="css/SnapshotReview.css">
     <script type="text/javascript" src="js/eventBridgeLoader.js"></script>
     <script type="text/javascript" src="js/SnapshotReview.js"></script>
+    <script>
+        window.twttr = (function (d, s, id) {
+            var js, fjs = d.getElementsByTagName(s)[0],
+              t = window.twttr || {};
+            if (d.getElementById(id)) return t;
+            js = d.createElement(s);
+            js.id = id;
+            js.src = "https://platform.twitter.com/widgets.js";
+            fjs.parentNode.insertBefore(js, fjs);
+
+            t._e = [];
+            t.ready = function (f) {
+                t._e.push(f);
+            };
+
+            return t;
+        }(document, "script", "twitter-wjs"));
+    </script>
 </head>
 
 <body>
     <div class="snapsection title">
         <label>Snap</label>
-
         <label id="settingsLabel" for="snapshotSettings">Settings</label>
         <input type="button" class="hifi-glyph naked" id="snapshotSettings" value="@" onclick="snapshotSettings()" />
     </div>
diff --git a/scripts/system/html/css/SnapshotReview.css b/scripts/system/html/css/SnapshotReview.css
index 9cbc129ab6..a0602b2575 100644
--- a/scripts/system/html/css/SnapshotReview.css
+++ b/scripts/system/html/css/SnapshotReview.css
@@ -123,6 +123,39 @@ input[type=button].naked:active {
 .shareButton:active {
     background-color: white;
 }
+
+/*
+// START styling of share overlay
+*/
+.shareOverlayDiv {
+    text-align: center;
+}
+.shareControls {
+    text-align: left;
+    display: flex;
+    justify-content: center;
+    flex-direction: row;
+    align-items: flex-start;
+    height: 50px;
+}
+.shareOverlayLabel {
+    line-height: 75px;
+}
+.hifiShareControls {
+    text-align: left;
+    width: 40%;
+    margin-left: 10%;
+}
+.externalShareControls {
+    text-align: left;
+    width: 40%;
+    margin-right: 10%;
+}
+.cancelShare {
+}
+/*
+// END styling of share overlay
+*/
 /*
 // END styling of snapshot pane and its contents
 */
diff --git a/scripts/system/html/js/SnapshotReview.js b/scripts/system/html/js/SnapshotReview.js
index 3ebff3f687..21affd772b 100644
--- a/scripts/system/html/js/SnapshotReview.js
+++ b/scripts/system/html/js/SnapshotReview.js
@@ -70,14 +70,44 @@ function createShareOverlay(parentID, isGif) {
         '</div>'
     shareOverlayContainer.appendChild(shareBar);
 
+    var shareOverlayBackground = document.createElement("div");
+    shareOverlayBackground.id = parentID + "shareOverlayBackground";
+    shareOverlayBackground.style.display = "none";
+    shareOverlayBackground.style.position = "absolute";
+    shareOverlayBackground.style.zIndex = "1";
+    shareOverlayBackground.style.top = "0px";
+    shareOverlayBackground.style.left = "0px";
+    shareOverlayBackground.style.backgroundColor = "black";
+    shareOverlayBackground.style.opacity = "0.5";
+    shareOverlayBackground.style.width = "100%";
+    shareOverlayBackground.style.height = "100%";
+    shareOverlayContainer.appendChild(shareOverlayBackground);
+
     var shareOverlay = document.createElement("div");
     shareOverlay.id = parentID + "shareOverlay";
+    shareOverlay.className = "shareOverlayDiv";
     shareOverlay.style.display = "none";
-    shareOverlay.style.backgroundColor = "black";
-    shareOverlay.style.opacity = "0.5";
     shareOverlay.style.width = "100%";
     shareOverlay.style.height = "100%";
+    shareOverlay.style.zIndex = "2";
+    var shareWithEveryoneButtonID = parentID + "shareWithEveryoneButton";
+    var inviteConnectionsCheckboxID = parentID + "inviteConnectionsCheckbox";
+    shareOverlay.innerHTML = '<label class="shareOverlayLabel">SHARE</label>' +
+        '<br/>' +
+        '<div class="shareControls">' +
+            '<div class="hifiShareControls">' +
+                '<input type="button" class="shareWithEveryone" id="' + shareWithEveryoneButtonID + '" value="SHARE WITH EVERYONE" onclick="" /><br>' +
+                '<input type="checkbox" class="inviteConnections" id="' + inviteConnectionsCheckboxID + '" checked="checked" />' +
+                '<label class="shareButtonLabel" for="' + inviteConnectionsCheckboxID + '">Invite My Connections</label><br>' +
+                '<input type="button" class="cancelShare" value="CANCEL" onclick="cancelSharing(' + parentID + ')" />' +
+            '</div>' +
+            '<div class="externalShareControls">' +
+                '<iframe src="https://www.facebook.com/plugins/share_button.php?href=http%3A%2F%2Fhighfidelity.io&layout=button_count&size=small&mobile_iframe=false&width=84&height=20&appId" width="84" height="20" style="border:none;overflow:hidden" scrolling="no" frameborder="0" allowTransparency="true"></iframe>' +
+                '<a class="twitter-share-button" href="https://twitter.com/intent/tweet">Tweet</a>' +
+            '</div>' +
+        '</div>';
     shareOverlayContainer.appendChild(shareOverlay);
+    twttr.widgets.load(shareOverlay);
 
     return shareOverlayContainer;
 }
@@ -85,15 +115,31 @@ function selectImageToShare(selectedID) {
     selectedID = selectedID.id; // Why is this necessary?
     var shareOverlayContainer = document.getElementById(selectedID + "shareOverlayContainer");
     var shareBar = document.getElementById(selectedID + "shareBar");
+    var shareOverlayBackground = document.getElementById(selectedID + "shareOverlayBackground");
     var shareOverlay = document.getElementById(selectedID + "shareOverlay");
 
-    shareOverlayContainer.style.outline = "4px solid #00b4ef";
-    shareOverlayContainer.style.outlineOffset = "-4px";
+    shareOverlay.style.outline = "4px solid #00b4ef";
+    shareOverlay.style.outlineOffset = "-4px";
 
     shareBar.style.display = "none";
 
+    shareOverlayBackground.style.display = "inline";
     shareOverlay.style.display = "inline";
 }
+function cancelSharing(selectedID) {
+    selectedID = selectedID.id; // Why is this necessary?
+    var shareOverlayContainer = document.getElementById(selectedID + "shareOverlayContainer");
+    var shareBar = document.getElementById(selectedID + "shareBar");
+    var shareOverlayBackground = document.getElementById(selectedID + "shareOverlayBackground");
+    var shareOverlay = document.getElementById(selectedID + "shareOverlay");
+
+    shareOverlay.style.outline = "none";
+
+    shareBar.style.display = "inline";
+
+    shareOverlayBackground.style.display = "none";
+    shareOverlay.style.display = "none";
+}
 
 function handleCaptureSetting(setting) {
     var stillAndGif = document.getElementById('stillAndGif');

From 16b4af8a9d8f581af5869f6d383511094d4a4be1 Mon Sep 17 00:00:00 2001
From: Zach Fox <fox@highfidelity.io>
Date: Thu, 20 Apr 2017 16:25:21 -0700
Subject: [PATCH 08/36] Rearchitecture

---
 interface/src/Application.cpp              |   2 +-
 scripts/system/html/SnapshotReview.html    |   4 +-
 scripts/system/html/css/SnapshotReview.css |  25 ++----
 scripts/system/html/css/hifi-style.css     |   8 +-
 scripts/system/html/js/SnapshotReview.js   |  63 ++++++-------
 scripts/system/snapshot.js                 | 100 +++++++++++----------
 6 files changed, 95 insertions(+), 107 deletions(-)

diff --git a/interface/src/Application.cpp b/interface/src/Application.cpp
index 39a4b8ee7c..d5e1d2201b 100644
--- a/interface/src/Application.cpp
+++ b/interface/src/Application.cpp
@@ -6448,7 +6448,7 @@ void Application::takeSnapshot(bool notify, bool includeAnimated, float aspectRa
         // Get a screenshot and save it
         QString path = Snapshot::saveSnapshot(getActiveDisplayPlugin()->getScreenshot(aspectRatio));
         // If we're not doing an animated snapshot as well...
-        if (!includeAnimated || !(SnapshotAnimated::alsoTakeAnimatedSnapshot.get())) {
+        if (!includeAnimated) {
             // Tell the dependency manager that the capture of the still snapshot has taken place.
             emit DependencyManager::get<WindowScriptingInterface>()->stillSnapshotTaken(path, notify);
         } else {
diff --git a/scripts/system/html/SnapshotReview.html b/scripts/system/html/SnapshotReview.html
index 3d8387890a..e785fde69d 100644
--- a/scripts/system/html/SnapshotReview.html
+++ b/scripts/system/html/SnapshotReview.html
@@ -26,7 +26,7 @@
 </head>
 
 <body>
-    <div class="snapsection title">
+    <div class="title">
         <label>Snap</label>
         <label id="settingsLabel" for="snapshotSettings">Settings</label>
         <input type="button" class="hifi-glyph naked" id="snapshotSettings" value="@" onclick="snapshotSettings()" />
@@ -40,7 +40,7 @@
         <div id="snap-settings">
             <label>CAMERA CAPTURES</label><br />
             <form action="">
-                <input type="radio" name="cameraCaptures" id="stillAndGif" value="stillAndGif" checked="checked" />
+                <input type="radio" name="cameraCaptures" id="stillAndGif" value="stillAndGif" />
                 <label for="stillAndGif">Still + GIF</label><br />
                 <input type="radio" name="cameraCaptures" id="stillOnly" value="stillOnly" />
                 <label for="stillOnly">Still Only</label>
diff --git a/scripts/system/html/css/SnapshotReview.css b/scripts/system/html/css/SnapshotReview.css
index a0602b2575..58866feef0 100644
--- a/scripts/system/html/css/SnapshotReview.css
+++ b/scripts/system/html/css/SnapshotReview.css
@@ -16,41 +16,34 @@ body {
 /*
 // START styling of top bar and its contents
 */
-.snapsection {
-    padding-left: 8px;
-    padding-right: 8px;
-    padding-top: 12px;
-    margin: 8px;
-}
 
-.snapsection.title {
-    padding-top: 0;
+.title {
+    padding: 6px 10px;
     text-align: left;
-    height: 24px;
+    height: 20px;
+    line-height: 20px;
     clear: both;
 }
 
 .title label {
     position: relative;
-    top: 10px;
     font-size: 18px;
     float: left;
 }
 
 #snapshotSettings {
     position: relative;
-    top: 4px;
     float: right;
 }
 #settingsLabel {
     position: relative;
     float: right;
-    top: 12px;
     font-family: Raleway-SemiBold;
     font-size: 14px;
 }
 .hifi-glyph {
     font-size: 30px;
+    top: -7px;
 }
 input[type=button].naked {
     color: #afafaf;
@@ -71,7 +64,7 @@ input[type=button].naked:active {
 */
 #snapshot-pane {
     width: 100%;
-    height: 510px;
+    height: 574px;
     display: flex;
     justify-content: center;
     align-items: center;
@@ -169,17 +162,13 @@ input[type=button].naked:active {
     width: 100%;
     position: absolute;
     left: 0;
-    bottom: 14px;
-    margin-bottom: 4px;
+    margin-top: 8px;
     overflow: hidden;
 }
 #snap-settings {
     float: left;
     margin-left: 10px;
 }
-#snap-settings label {
-    height: 50px;
-}
 #snap-settings form input {
     margin-bottom: 10px;
 }
diff --git a/scripts/system/html/css/hifi-style.css b/scripts/system/html/css/hifi-style.css
index 52d4c72b23..e95ceca4da 100644
--- a/scripts/system/html/css/hifi-style.css
+++ b/scripts/system/html/css/hifi-style.css
@@ -77,9 +77,13 @@ body {
 hr {
     border: none;
     background: #404040 url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAQAAAAECAYAAACp8Z5+AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsQAAA7EAZUrDhsAAAAjSURBVBhXY1RVVf3PgARYjIyMoEwIYHRwcEBRwQSloYCBAQCwjgPMiI7W2QAAAABJRU5ErkJggg==) repeat-x top left;
+    padding: 1px;
+    -webkit-margin-before: 0;
+    -webkit-margin-after: 0;
+    -webkit-margin-start: 0;
+    -webkit-margin-end: 0;
     width: 100%;
-    margin: 21px -21px 0 -21px;
-    padding: 14px 21px 0 21px;
+    position: absolute;
 }
 
 .hifi-glyph {
diff --git a/scripts/system/html/js/SnapshotReview.js b/scripts/system/html/js/SnapshotReview.js
index 21affd772b..3346635a6a 100644
--- a/scripts/system/html/js/SnapshotReview.js
+++ b/scripts/system/html/js/SnapshotReview.js
@@ -149,40 +149,25 @@ function handleCaptureSetting(setting) {
 
     stillAndGif.onclick = function () {
         EventBridge.emitWebEvent(JSON.stringify({
-            type: "captureSettings",
-            action: true
+            type: "snapshot",
+            action: "captureStillAndGif"
         }));
     }
     stillOnly.onclick = function () {
-        EventBridge.emitWebEvent(JSON.stringify({
-            type: "captureSettings",
-            action: false
-        }));
-    }
-
-}
-function handleShareButtons(messageOptions) {
-    var openFeed = document.getElementById('openFeed');
-    openFeed.checked = messageOptions.openFeedAfterShare;
-    openFeed.onchange = function () {
         EventBridge.emitWebEvent(JSON.stringify({
             type: "snapshot",
-            action: (openFeed.checked ? "setOpenFeedTrue" : "setOpenFeedFalse")
+            action: "captureStillOnly"
         }));
-    };
-
-    if (!messageOptions.canShare) {
-        // this means you may or may not be logged in, but can't share
-        // because you are not in a public place.
-        document.getElementById("sharing").innerHTML = "<p class='prompt'>Snapshots can be shared when they're taken in shareable places.";
     }
+
 }
 window.onload = function () {
     // TESTING FUNCTIONS START
     // Uncomment and modify the lines below to test SnapshotReview in a browser.
-    imageCount = 2;
-    addImage({ localPath: 'D:/Dropbox/Screenshots/High Fidelity Snapshots/2017-01-27 50 Avatars!/!!!.gif' });
-    addImage({ localPath: 'http://lorempixel.com/553/255' });
+    //imageCount = 2;
+    //addImage({ localPath: 'C:/Users/Zach Fox/Desktop/hifi-snap-by-zfox-on-2017-04-20_14-59-12.gif' });
+    //addImage({ localPath: 'C:/Users/Zach Fox/Desktop/hifi-snap-by-zfox-on-2017-04-20_14-59-12.jpg' });
+    //addImage({ localPath: 'http://lorempixel.com/553/255' });
     //addImage({localPath: 'c:/Users/howar/OneDrive/Pictures/hifi-snap-by--on-2016-07-27_12-58-43.jpg'});
     // TESTING FUNCTIONS END
 
@@ -192,36 +177,42 @@ window.onload = function () {
 
             message = JSON.parse(message);
 
-            switch (message.type) {
-                case 'snapshot':
+            if (message.type !== "snapshot") {
+                return;
+            }
+            
+            switch (message.action) {
+                case 'addImages':
                     // The last element of the message contents list contains a bunch of options,
                     // including whether or not we can share stuff
                     // The other elements of the list contain image paths.
-                    var messageOptions = message.action.pop();
-                    handleShareButtons(messageOptions);
+                    var messageOptions = message.options;
 
                     if (messageOptions.containsGif) {
                         if (messageOptions.processingGif) {
-                            imageCount = message.action.length + 1; // "+1" for the GIF that'll finish processing soon
-                            message.action.unshift({ localPath: messageOptions.loadingGifPath });
-                            message.action.forEach(addImage);
+                            imageCount = message.data.length + 1; // "+1" for the GIF that'll finish processing soon
+                            message.data.unshift({ localPath: messageOptions.loadingGifPath });
+                            message.data.forEach(addImage);
                         } else {
-                            var gifPath = message.action[0].localPath;
+                            var gifPath = message.data[0].localPath;
                             document.getElementById('p0img').src = gifPath;
                             paths[0].localPath = gifPath;
                         }
                     } else {
-                        imageCount = message.action.length;
-                        message.action.forEach(addImage);
+                        imageCount = message.data.length;
+                        message.data.forEach(addImage);
                     }
                     break;
-                case 'snapshotSettings':
-                    handleCaptureSetting(message.action);
+                case 'captureSettings':
+                    handleCaptureSetting(message.setting);
                     break;
                 default:
-                    return;
+                    print("Unknown message action received in SnapshotReview.js.");
+                    break;
             }
+
         });
+
         EventBridge.emitWebEvent(JSON.stringify({
             type: "snapshot",
             action: "ready"
diff --git a/scripts/system/snapshot.js b/scripts/system/snapshot.js
index 266f90c704..97cd2c542e 100644
--- a/scripts/system/snapshot.js
+++ b/scripts/system/snapshot.js
@@ -43,7 +43,8 @@ function showFeedWindow() {
 }
 
 var outstanding;
-var readyData;
+var snapshotOptions;
+var imageData;
 var shareAfterLogin = false;
 var snapshotToShareAfterLogin;     
 function onMessage(message) {
@@ -62,12 +63,15 @@ function onMessage(message) {
     switch (message.action) {
         case 'ready':  // Send it.
             tablet.emitScriptEvent(JSON.stringify({
-                type: "snapshotSettings",
-                action: Settings.getValue("alsoTakeAnimatedSnapshot", true)
+                type: "snapshot",
+                action: "captureSettings",
+                setting: Settings.getValue("alsoTakeAnimatedSnapshot", true)
             }));
             tablet.emitScriptEvent(JSON.stringify({
                 type: "snapshot",
-                action: readyData
+                action: "addImages",
+                options: snapshotOptions,
+                data: imageData
             }));
             outstanding = 0;
             break;
@@ -79,20 +83,19 @@ function onMessage(message) {
                 tablet.loadQMLOnTop("TabletGeneralPreferences.qml");
             }
             break;
-        case 'captureSettings':
-            Settings.setValue("alsoTakeAnimatedSnapshot", message.action);
+        case 'captureStillAndGif':
+            print("Changing Snapshot Capture Settings to Capture Still + GIF");
+            Settings.setValue("alsoTakeAnimatedSnapshot", true);
+            break;
+        case 'captureStillOnly':
+            print("Changing Snapshot Capture Settings to Capture Still Only");
+            Settings.setValue("alsoTakeAnimatedSnapshot", false);
             break;
         case 'takeSnapshot':
             // In settings, first store the paths to the last snapshot
             //
             onClicked();
             break;
-        case 'setOpenFeedFalse':
-            Settings.setValue('openFeedAfterShare', false);
-            break;
-        case 'setOpenFeedTrue':
-            Settings.setValue('openFeedAfterShare', true);
-            break;
         default:
             //tablet.webEventReceived.disconnect(onMessage);  // <<< It's probably this that's missing?!
             HMD.closeTablet();
@@ -135,9 +138,8 @@ function onMessage(message) {
 
 var SNAPSHOT_REVIEW_URL = Script.resolvePath("html/SnapshotReview.html");
 var isInSnapshotReview = false;
-function confirmShare(data) {
+function reviewSnapshot() {
     tablet.gotoWebScreen(SNAPSHOT_REVIEW_URL);
-    readyData = data;
     tablet.webEventReceived.connect(onMessage);
     HMD.openTablet();
     isInSnapshotReview = true;
@@ -182,7 +184,7 @@ function onClicked() {
     Script.setTimeout(function () {
         HMD.closeTablet();
         Script.setTimeout(function () {
-            Window.takeSnapshot(false, true, 1.91);
+            Window.takeSnapshot(false, Settings.getValue("alsoTakeAnimatedSnapshot", true), 1.91);
         }, SNAPSHOT_DELAY);
     }, FINISH_SOUND_DELAY);
 }
@@ -220,15 +222,14 @@ function stillSnapshotTaken(pathStillSnapshot, notify) {
     // during which time the user may have moved. So stash that info in the dialog so that
     // it records the correct href. (We can also stash in .jpegs, but not .gifs.)
     // last element in data array tells dialog whether we can share or not
-    var confirmShareContents = [
-        { localPath: pathStillSnapshot, href: href },
-        {
-            containsGif: false,
-            processingGif: false,
-            canShare: !!isDomainOpen(domainId),
-            openFeedAfterShare: shouldOpenFeedAfterShare()
-        }];
-    confirmShare(confirmShareContents);
+    snapshotOptions = {
+        containsGif: false,
+        processingGif: false,
+        canShare: !!isDomainOpen(domainId),
+        openFeedAfterShare: shouldOpenFeedAfterShare()
+    };
+    imageData = [{ localPath: pathStillSnapshot, href: href }];
+    reviewSnapshot();
     if (clearOverlayWhenMoving) {
         MyAvatar.setClearOverlayWhenMoving(true); // not until after the share dialog
     }
@@ -237,8 +238,10 @@ function stillSnapshotTaken(pathStillSnapshot, notify) {
 
 function processingGifStarted(pathStillSnapshot) {
     Window.processingGifStarted.disconnect(processingGifStarted);
-    button.clicked.disconnect(onClicked);
-    buttonConnected = false;
+    if (buttonConnected) {
+        button.clicked.disconnect(onClicked);
+        buttonConnected = false;
+    }
     // show hud
     Reticle.visible = reticleVisible;
     // show overlays if they were on
@@ -246,16 +249,15 @@ function processingGifStarted(pathStillSnapshot) {
         Menu.setIsOptionChecked("Overlays", true);
     }
 
-    var confirmShareContents = [
-        { localPath: pathStillSnapshot, href: href },
-        {
-            containsGif: true,
-            processingGif: true,
-            loadingGifPath: Script.resolvePath(Script.resourcesPath() + 'icons/loadingDark.gif'),
-            canShare: !!isDomainOpen(domainId),
-            openFeedAfterShare: shouldOpenFeedAfterShare()
-        }];
-    confirmShare(confirmShareContents);
+    snapshotOptions = {
+        containsGif: true,
+        processingGif: true,
+        loadingGifPath: Script.resolvePath(Script.resourcesPath() + 'icons/loadingDark.gif'),
+        canShare: !!isDomainOpen(domainId),
+        openFeedAfterShare: shouldOpenFeedAfterShare()
+    };
+    imageData = [{ localPath: pathStillSnapshot, href: href }];
+    reviewSnapshot();
     if (clearOverlayWhenMoving) {
         MyAvatar.setClearOverlayWhenMoving(true); // not until after the share dialog
     }
@@ -264,22 +266,24 @@ function processingGifStarted(pathStillSnapshot) {
 
 function processingGifCompleted(pathAnimatedSnapshot) {
     Window.processingGifCompleted.disconnect(processingGifCompleted);
-    button.clicked.connect(onClicked);
-    buttonConnected = true;
+    if (!buttonConnected) {
+        button.clicked.connect(onClicked);
+        buttonConnected = true;
+    }
 
-    var confirmShareContents = [
-        { localPath: pathAnimatedSnapshot, href: href },
-        {
-            containsGif: true,
-            processingGif: false,
-            canShare: !!isDomainOpen(domainId),
-            openFeedAfterShare: shouldOpenFeedAfterShare()
-        }];
-    readyData = confirmShareContents;
+    snapshotOptions = {
+        containsGif: true,
+        processingGif: false,
+        canShare: !!isDomainOpen(domainId),
+        openFeedAfterShare: shouldOpenFeedAfterShare()
+    }
+    imageData = [{ localPath: pathAnimatedSnapshot, href: href }];
 
     tablet.emitScriptEvent(JSON.stringify({
         type: "snapshot",
-        action: readyData
+        action: "addImages",
+        options: snapshotOptions,
+        data: imageData
     }));
 }
 

From 01e78612c7ece62d22d1bf9d16b583ac287e760d Mon Sep 17 00:00:00 2001
From: Zach Fox <fox@highfidelity.io>
Date: Thu, 20 Apr 2017 17:17:35 -0700
Subject: [PATCH 09/36] Soooo much progress today

---
 scripts/system/html/SnapshotReview.html    |  9 +++--
 scripts/system/html/css/SnapshotReview.css | 10 +++---
 scripts/system/html/css/hifi-style.css     | 40 ++++++++++++++++++++++
 scripts/system/html/js/SnapshotReview.js   | 28 ++++++++++-----
 4 files changed, 69 insertions(+), 18 deletions(-)

diff --git a/scripts/system/html/SnapshotReview.html b/scripts/system/html/SnapshotReview.html
index e785fde69d..400be4abdc 100644
--- a/scripts/system/html/SnapshotReview.html
+++ b/scripts/system/html/SnapshotReview.html
@@ -27,7 +27,7 @@
 
 <body>
     <div class="title">
-        <label>Snap</label>
+        <label>Snapshot Review</label>
         <label id="settingsLabel" for="snapshotSettings">Settings</label>
         <input type="button" class="hifi-glyph naked" id="snapshotSettings" value="@" onclick="snapshotSettings()" />
     </div>
@@ -40,10 +40,9 @@
         <div id="snap-settings">
             <label>CAMERA CAPTURES</label><br />
             <form action="">
-                <input type="radio" name="cameraCaptures" id="stillAndGif" value="stillAndGif" />
-                <label for="stillAndGif">Still + GIF</label><br />
-                <input type="radio" name="cameraCaptures" id="stillOnly" value="stillOnly" />
-                <label for="stillOnly">Still Only</label>
+                <input type="radio" name="cameraCaptures" id="stillAndGif" value="stillAndGif" /><label for="stillAndGif"><span><span></span></span>Still + GIF</label>
+                <br />
+                <input type="radio" name="cameraCaptures" id="stillOnly" value="stillOnly" /><label for="stillOnly"><span><span></span></span>Still Only</label>
             </form>
         </div>
         <div id="snap-button" onclick="takeSnapshot()">
diff --git a/scripts/system/html/css/SnapshotReview.css b/scripts/system/html/css/SnapshotReview.css
index 58866feef0..1e233b22f3 100644
--- a/scripts/system/html/css/SnapshotReview.css
+++ b/scripts/system/html/css/SnapshotReview.css
@@ -20,8 +20,8 @@ body {
 .title {
     padding: 6px 10px;
     text-align: left;
-    height: 20px;
-    line-height: 20px;
+    height: 26px;
+    line-height: 26px;
     clear: both;
 }
 
@@ -43,7 +43,7 @@ body {
 }
 .hifi-glyph {
     font-size: 30px;
-    top: -7px;
+    top: -4px;
 }
 input[type=button].naked {
     color: #afafaf;
@@ -64,7 +64,7 @@ input[type=button].naked:active {
 */
 #snapshot-pane {
     width: 100%;
-    height: 574px;
+    height: 560px;
     display: flex;
     justify-content: center;
     align-items: center;
@@ -170,7 +170,7 @@ input[type=button].naked:active {
     margin-left: 10px;
 }
 #snap-settings form input {
-    margin-bottom: 10px;
+    margin-bottom: 5px;
 }
 
 #snap-button {
diff --git a/scripts/system/html/css/hifi-style.css b/scripts/system/html/css/hifi-style.css
index e95ceca4da..41cda569c9 100644
--- a/scripts/system/html/css/hifi-style.css
+++ b/scripts/system/html/css/hifi-style.css
@@ -92,3 +92,43 @@ hr {
     //margin: -10px;
     padding: 0;
 }
+
+input[type=radio] {
+  width: 2em;
+  margin: 0;
+  padding: 0;
+  font-size: 1em;
+  opacity: 0;
+}
+input[type=radio] + label{
+  display: inline-block;
+  margin-left: -2em;
+  line-height: 2em;
+}
+input[type=radio] + label > span{
+  display: inline-block;
+  width: 20px;
+  height: 20px;
+  margin: 5px;
+  border-radius: 50%;
+  background: #6B6A6B;
+  background-image: linear-gradient(#7D7D7D, #6B6A6B);
+  vertical-align: bottom;
+}
+input[type=radio]:checked + label > span{
+  background-image: linear-gradient(#7D7D7D, #6B6A6B);
+}
+input[type=radio]:active + label > span,
+input[type=radio]:hover + label > span{
+  background-image: linear-gradient(#FFFFFF, #AFAFAF);
+}
+input[type=radio]:checked + label > span > span,
+input[type=radio]:active + label > span > span{
+  display: block;
+  width: 10px;
+  height: 10px;
+  margin: 2.5px;
+  border: 2px solid #36CDFF;
+  border-radius: 50%;
+  background: #00B4EF;
+}
\ No newline at end of file
diff --git a/scripts/system/html/js/SnapshotReview.js b/scripts/system/html/js/SnapshotReview.js
index 3346635a6a..aae1fc5787 100644
--- a/scripts/system/html/js/SnapshotReview.js
+++ b/scripts/system/html/js/SnapshotReview.js
@@ -21,7 +21,7 @@ function addImage(data) {
     div.id = id;
     img.id = id + "img";
     div.style.width = "100%";
-    div.style.height = "" + Math.floor(100 / imageCount) + "%";
+    div.style.height = "" + 502 / imageCount + "px";
     div.style.display = "flex";
     div.style.justifyContent = "center";
     div.style.alignItems = "center";
@@ -32,13 +32,16 @@ function addImage(data) {
     img.src = data.localPath;
     div.appendChild(img);
     document.getElementById("snapshot-images").appendChild(div);
-    div.appendChild(createShareOverlay(id, img.src.split('.').pop().toLowerCase() === "gif"));
-    img.onload = function () {
-        var shareBar = document.getElementById(id + "shareBar");
-        shareBar.style.width = img.clientWidth;
-        shareBar.style.display = "inline";
+    var isGif = img.src.split('.').pop().toLowerCase() === "gif";
+    div.appendChild(createShareOverlay(id, isGif));
+    if (!isGif) {
+        img.onload = function () {
+            var shareBar = document.getElementById(id + "shareBar");
+            shareBar.style.width = img.clientWidth;
+            shareBar.style.display = "inline";
 
-        document.getElementById(id).style.height = img.clientHeight;
+            document.getElementById(id).style.height = img.clientHeight;
+        }
     }
     paths.push(data);
 }
@@ -195,7 +198,16 @@ window.onload = function () {
                             message.data.forEach(addImage);
                         } else {
                             var gifPath = message.data[0].localPath;
-                            document.getElementById('p0img').src = gifPath;
+                            var p0img = document.getElementById('p0img');
+                            p0img.src = gifPath;
+
+                            p0img.onload = function () {
+                                var shareBar = document.getElementById("p0shareBar");
+                                shareBar.style.width = p0img.clientWidth;
+                                shareBar.style.display = "inline";
+                                document.getElementById('p0').style.height = p0img.clientHeight;
+                            }
+
                             paths[0].localPath = gifPath;
                         }
                     } else {

From c08b40b95009aec68759926e9212084f58450cae Mon Sep 17 00:00:00 2001
From: Zach Fox <fox@highfidelity.io>
Date: Fri, 21 Apr 2017 10:17:49 -0700
Subject: [PATCH 10/36] Initial sharing code hooked up

---
 scripts/system/html/js/SnapshotReview.js | 22 +++++-----
 scripts/system/snapshot.js               | 56 +++++++++---------------
 2 files changed, 32 insertions(+), 46 deletions(-)

diff --git a/scripts/system/html/js/SnapshotReview.js b/scripts/system/html/js/SnapshotReview.js
index aae1fc5787..8fffd207ff 100644
--- a/scripts/system/html/js/SnapshotReview.js
+++ b/scripts/system/html/js/SnapshotReview.js
@@ -43,7 +43,7 @@ function addImage(data) {
             document.getElementById(id).style.height = img.clientHeight;
         }
     }
-    paths.push(data);
+    paths.push(data.localPath);
 }
 function createShareOverlay(parentID, isGif) {
     var shareOverlayContainer = document.createElement("DIV");
@@ -99,7 +99,7 @@ function createShareOverlay(parentID, isGif) {
         '<br/>' +
         '<div class="shareControls">' +
             '<div class="hifiShareControls">' +
-                '<input type="button" class="shareWithEveryone" id="' + shareWithEveryoneButtonID + '" value="SHARE WITH EVERYONE" onclick="" /><br>' +
+                '<input type="button" class="shareWithEveryone" id="' + shareWithEveryoneButtonID + '" value="SHARE WITH EVERYONE" onclick="shareWithEveryone(parentID)" /><br>' +
                 '<input type="checkbox" class="inviteConnections" id="' + inviteConnectionsCheckboxID + '" checked="checked" />' +
                 '<label class="shareButtonLabel" for="' + inviteConnectionsCheckboxID + '">Invite My Connections</label><br>' +
                 '<input type="button" class="cancelShare" value="CANCEL" onclick="cancelSharing(' + parentID + ')" />' +
@@ -129,6 +129,15 @@ function selectImageToShare(selectedID) {
     shareOverlayBackground.style.display = "inline";
     shareOverlay.style.display = "inline";
 }
+function shareWithEveryone(selectedID) {
+    selectedID = selectedID.id; // Why is this necessary?
+
+    EventBridge.emitWebEvent(JSON.stringify({
+        type: "snapshot",
+        action: "shareSnapshot",
+        data: paths[parseInt(selectedID.substring(1))]
+    }));
+}
 function cancelSharing(selectedID) {
     selectedID = selectedID.id; // Why is this necessary?
     var shareOverlayContainer = document.getElementById(selectedID + "shareOverlayContainer");
@@ -208,7 +217,7 @@ window.onload = function () {
                                 document.getElementById('p0').style.height = p0img.clientHeight;
                             }
 
-                            paths[0].localPath = gifPath;
+                            paths[0] = gifPath;
                         }
                     } else {
                         imageCount = message.data.length;
@@ -232,13 +241,6 @@ window.onload = function () {
     });
 
 };
-// beware of bug: Cannot send objects at top level. (Nested in arrays is fine.)
-function shareSelected() {
-    EventBridge.emitWebEvent(JSON.stringify({
-        type: "snapshot",
-        action: paths
-    }));
-}
 function doNotShare() {
     EventBridge.emitWebEvent(JSON.stringify({
         type: "snapshot",
diff --git a/scripts/system/snapshot.js b/scripts/system/snapshot.js
index 97cd2c542e..7f71336dcf 100644
--- a/scripts/system/snapshot.js
+++ b/scripts/system/snapshot.js
@@ -96,43 +96,31 @@ function onMessage(message) {
             //
             onClicked();
             break;
-        default:
-            //tablet.webEventReceived.disconnect(onMessage);  // <<< It's probably this that's missing?!
-            HMD.closeTablet();
+        case 'shareSnapshot':
             isLoggedIn = Account.isLoggedIn();
-            message.action.forEach(function (submessage) {
-                if (submessage.share && !isLoggedIn) {
-                    needsLogin = true;
-                    submessage.share = false;
-                    shareAfterLogin = true;
-                    snapshotToShareAfterLogin = {path: submessage.localPath, href: submessage.href || href};
-                }
-                if (submessage.share) {
-                    print('sharing', submessage.localPath);
-                    outstanding = true;
-                    Window.shareSnapshot(submessage.localPath, submessage.href || href);
-                } else {
-                    print('not sharing', submessage.localPath);
-                }
-                
-            });
-            if (outstanding && shouldOpenFeedAfterShare()) {
-                showFeedWindow();
-                outstanding = false;
+            if (!isLoggedIn) {
+                needsLogin = true;
+                shareAfterLogin = true;
+                snapshotToShareAfterLogin = { path: message.data, href: message.href || href };
+            } else {
+                print('sharing', message.data);
+                outstanding++;
+                Window.shareSnapshot(message.data, message.href || href);
             }
-            if (needsLogin) { // after the possible feed, so that the login is on top
-                var isLoggedIn = Account.isLoggedIn();
 
-                if (!isLoggedIn) {
-                    if ((HMD.active && Settings.getValue("hmdTabletBecomesToolbar"))
-                        || (!HMD.active && Settings.getValue("desktopTabletBecomesToolbar"))) {
-                        Menu.triggerOption("Login / Sign Up");
-                    } else {
-                        tablet.loadQMLOnTop("../../dialogs/TabletLoginDialog.qml");
-                        HMD.openTablet();
-                    }
+            if (needsLogin) {
+                if ((HMD.active && Settings.getValue("hmdTabletBecomesToolbar"))
+                    || (!HMD.active && Settings.getValue("desktopTabletBecomesToolbar"))) {
+                    Menu.triggerOption("Login / Sign Up");
+                } else {
+                    tablet.loadQMLOnTop("../../dialogs/TabletLoginDialog.qml");
+                    HMD.openTablet();
                 }
             }
+            break;
+        default:
+            print('Unknown message action received by snapshot.js!');
+            break;
     }
 }
 
@@ -298,11 +286,7 @@ function onConnected() {
         print('sharing', snapshotToShareAfterLogin.path);
         Window.shareSnapshot(snapshotToShareAfterLogin.path, snapshotToShareAfterLogin.href);
         shareAfterLogin = false;
-        if (shouldOpenFeedAfterShare()) {
-            showFeedWindow();
-        }
     }
-    
 }
 
 button.clicked.connect(onClicked);

From 880bcf3b1ee2558c8053d66615d28f232118977c Mon Sep 17 00:00:00 2001
From: Zach Fox <fox@highfidelity.io>
Date: Fri, 21 Apr 2017 15:42:41 -0700
Subject: [PATCH 11/36] Checkpoint

---
 .../src/scripting/WindowScriptingInterface.h  |   2 +-
 interface/src/ui/SnapshotUploader.cpp         |  15 +-
 scripts/system/html/js/SnapshotReview.js      |  31 +++-
 scripts/system/snapshot.js                    | 138 ++++++++++++------
 4 files changed, 133 insertions(+), 53 deletions(-)

diff --git a/interface/src/scripting/WindowScriptingInterface.h b/interface/src/scripting/WindowScriptingInterface.h
index eb7dc02627..7641110972 100644
--- a/interface/src/scripting/WindowScriptingInterface.h
+++ b/interface/src/scripting/WindowScriptingInterface.h
@@ -74,7 +74,7 @@ signals:
     void svoImportRequested(const QString& url);
     void domainConnectionRefused(const QString& reasonMessage, int reasonCode, const QString& extraInfo);
     void stillSnapshotTaken(const QString& pathStillSnapshot, bool notify);
-    void snapshotShared(const QString& error);
+    void snapshotShared(bool isError, const QString& reply);
     void processingGifStarted(const QString& pathStillSnapshot);
     void processingGifCompleted(const QString& pathAnimatedSnapshot);
 
diff --git a/interface/src/ui/SnapshotUploader.cpp b/interface/src/ui/SnapshotUploader.cpp
index 411e892de5..54faa822b8 100644
--- a/interface/src/ui/SnapshotUploader.cpp
+++ b/interface/src/ui/SnapshotUploader.cpp
@@ -49,6 +49,7 @@ void SnapshotUploader::uploadSuccess(QNetworkReply& reply) {
         userStoryObject.insert("place_name", placeName);
         userStoryObject.insert("path", currentPath);
         userStoryObject.insert("action", "snapshot");
+        userStoryObject.insert("audience", "for_url");
         rootObject.insert("user_story", userStoryObject);
 
         auto accountManager = DependencyManager::get<AccountManager>();
@@ -61,7 +62,7 @@ void SnapshotUploader::uploadSuccess(QNetworkReply& reply) {
             QJsonDocument(rootObject).toJson());
 
     } else {
-        emit DependencyManager::get<WindowScriptingInterface>()->snapshotShared(contents);
+        emit DependencyManager::get<WindowScriptingInterface>()->snapshotShared(true, contents);
         delete this;
     }
 }
@@ -72,12 +73,18 @@ void SnapshotUploader::uploadFailure(QNetworkReply& reply) {
     if (replyString.size() == 0) {
         replyString = reply.errorString();
     }
-    emit DependencyManager::get<WindowScriptingInterface>()->snapshotShared(replyString); // maybe someday include _inWorldLocation, _filename?
+    emit DependencyManager::get<WindowScriptingInterface>()->snapshotShared(true, replyString); // maybe someday include _inWorldLocation, _filename?
     delete this;
 }
 
 void SnapshotUploader::createStorySuccess(QNetworkReply& reply) {
-    emit DependencyManager::get<WindowScriptingInterface>()->snapshotShared(QString());
+    QString replyString = reply.readAll();
+    // oh no QT pls
+    // let's write our own JSON parser???
+    QJsonDocument jsonResponse = QJsonDocument::fromJson(replyString.toUtf8());
+    QJsonObject object = jsonResponse.object()["user_story"].toObject();
+    QString storyId = QString::number(object["id"].toInt());
+    emit DependencyManager::get<WindowScriptingInterface>()->snapshotShared(false, storyId);
     delete this;
 }
 
@@ -87,7 +94,7 @@ void SnapshotUploader::createStoryFailure(QNetworkReply& reply) {
     if (replyString.size() == 0) {
         replyString = reply.errorString();
     }
-    emit DependencyManager::get<WindowScriptingInterface>()->snapshotShared(replyString);
+    emit DependencyManager::get<WindowScriptingInterface>()->snapshotShared(true, replyString);
     delete this;
 }
 
diff --git a/scripts/system/html/js/SnapshotReview.js b/scripts/system/html/js/SnapshotReview.js
index 8fffd207ff..042bc55fb5 100644
--- a/scripts/system/html/js/SnapshotReview.js
+++ b/scripts/system/html/js/SnapshotReview.js
@@ -11,7 +11,7 @@
 //
 
 var paths = [], idCounter = 0, imageCount = 1;
-function addImage(data) {
+function addImage(data, isGifLoading) {
     if (!data.localPath) {
         return;
     }
@@ -38,12 +38,14 @@ function addImage(data) {
         img.onload = function () {
             var shareBar = document.getElementById(id + "shareBar");
             shareBar.style.width = img.clientWidth;
-            shareBar.style.display = "inline";
 
             document.getElementById(id).style.height = img.clientHeight;
         }
     }
     paths.push(data.localPath);
+    if (!isGifLoading) {
+        shareForUrl(id);
+    }
 }
 function createShareOverlay(parentID, isGif) {
     var shareOverlayContainer = document.createElement("DIV");
@@ -99,7 +101,7 @@ function createShareOverlay(parentID, isGif) {
         '<br/>' +
         '<div class="shareControls">' +
             '<div class="hifiShareControls">' +
-                '<input type="button" class="shareWithEveryone" id="' + shareWithEveryoneButtonID + '" value="SHARE WITH EVERYONE" onclick="shareWithEveryone(parentID)" /><br>' +
+                '<input type="button" class="shareWithEveryone" id="' + shareWithEveryoneButtonID + '" value="SHARE WITH EVERYONE" onclick="shareWithEveryone(' + parentID + ')" /><br>' +
                 '<input type="checkbox" class="inviteConnections" id="' + inviteConnectionsCheckboxID + '" checked="checked" />' +
                 '<label class="shareButtonLabel" for="' + inviteConnectionsCheckboxID + '">Invite My Connections</label><br>' +
                 '<input type="button" class="cancelShare" value="CANCEL" onclick="cancelSharing(' + parentID + ')" />' +
@@ -129,12 +131,19 @@ function selectImageToShare(selectedID) {
     shareOverlayBackground.style.display = "inline";
     shareOverlay.style.display = "inline";
 }
+function shareForUrl(selectedID) {
+    EventBridge.emitWebEvent(JSON.stringify({
+        type: "snapshot",
+        action: "shareSnapshotForUrl",
+        data: paths[parseInt(selectedID.substring(1))]
+    }));
+}
 function shareWithEveryone(selectedID) {
     selectedID = selectedID.id; // Why is this necessary?
 
     EventBridge.emitWebEvent(JSON.stringify({
         type: "snapshot",
-        action: "shareSnapshot",
+        action: "shareSnapshotWithEveryone",
         data: paths[parseInt(selectedID.substring(1))]
     }));
 }
@@ -204,7 +213,9 @@ window.onload = function () {
                         if (messageOptions.processingGif) {
                             imageCount = message.data.length + 1; // "+1" for the GIF that'll finish processing soon
                             message.data.unshift({ localPath: messageOptions.loadingGifPath });
-                            message.data.forEach(addImage);
+                            message.data.forEach(function (element, idx, array) {
+                                addImage(element, idx === 0);
+                            });
                         } else {
                             var gifPath = message.data[0].localPath;
                             var p0img = document.getElementById('p0img');
@@ -213,20 +224,26 @@ window.onload = function () {
                             p0img.onload = function () {
                                 var shareBar = document.getElementById("p0shareBar");
                                 shareBar.style.width = p0img.clientWidth;
-                                shareBar.style.display = "inline";
                                 document.getElementById('p0').style.height = p0img.clientHeight;
                             }
 
                             paths[0] = gifPath;
+                            shareForUrl("p0");
                         }
                     } else {
                         imageCount = message.data.length;
-                        message.data.forEach(addImage);
+                        message.data.forEach(function (element, idx, array) {
+                            addImage(element, false);
+                        });
                     }
                     break;
                 case 'captureSettings':
                     handleCaptureSetting(message.setting);
                     break;
+                case 'enableShareButtons':
+                    var shareBar = document.getElementById("p0shareBar");
+                    shareBar.style.display = "inline";
+                    break;
                 default:
                     print("Unknown message action received in SnapshotReview.js.");
                     break;
diff --git a/scripts/system/snapshot.js b/scripts/system/snapshot.js
index 7f71336dcf..37f3070dc0 100644
--- a/scripts/system/snapshot.js
+++ b/scripts/system/snapshot.js
@@ -28,25 +28,61 @@ var button = tablet.addButton({
     sortOrder: 5
 });
 
-function shouldOpenFeedAfterShare() {
-    var persisted = Settings.getValue('openFeedAfterShare', true); // might answer true, false, "true", or "false"
-    return persisted && (persisted !== 'false');
-}
-function showFeedWindow() {
-    if ((HMD.active && Settings.getValue("hmdTabletBecomesToolbar"))
-            || (!HMD.active && Settings.getValue("desktopTabletBecomesToolbar"))) {
-        tablet.loadQMLSource("TabletAddressDialog.qml");
-    } else {
-         tablet.initialScreen("TabletAddressDialog.qml");
-        HMD.openTablet();
-    }
-}
-
-var outstanding;
 var snapshotOptions;
 var imageData;
 var shareAfterLogin = false;
-var snapshotToShareAfterLogin;     
+var snapshotToShareAfterLogin;
+var METAVERSE_BASE = location.metaverseServerUrl;
+
+function request(options, callback) { // cb(error, responseOfCorrectContentType) of url. A subset of npm request.
+    var httpRequest = new XMLHttpRequest(), key;
+    // QT bug: apparently doesn't handle onload. Workaround using readyState.
+    httpRequest.onreadystatechange = function () {
+        var READY_STATE_DONE = 4;
+        var HTTP_OK = 200;
+        if (httpRequest.readyState >= READY_STATE_DONE) {
+            var error = (httpRequest.status !== HTTP_OK) && httpRequest.status.toString() + ':' + httpRequest.statusText,
+                response = !error && httpRequest.responseText,
+                contentType = !error && httpRequest.getResponseHeader('content-type');
+            if (!error && contentType.indexOf('application/json') === 0) { // ignoring charset, etc.
+                try {
+                    response = JSON.parse(response);
+                } catch (e) {
+                    error = e;
+                }
+            }
+            callback(error, response);
+        }
+    };
+    if (typeof options === 'string') {
+        options = { uri: options };
+    }
+    if (options.url) {
+        options.uri = options.url;
+    }
+    if (!options.method) {
+        options.method = 'GET';
+    }
+    if (options.body && (options.method === 'GET')) { // add query parameters
+        var params = [], appender = (-1 === options.uri.search('?')) ? '?' : '&';
+        for (key in options.body) {
+            params.push(key + '=' + options.body[key]);
+        }
+        options.uri += appender + params.join('&');
+        delete options.body;
+    }
+    if (options.json) {
+        options.headers = options.headers || {};
+        options.headers["Content-type"] = "application/json";
+        options.body = JSON.stringify(options.body);
+    }
+    for (key in options.headers || {}) {
+        httpRequest.setRequestHeader(key, options.headers[key]);
+    }
+    httpRequest.open(options.method, options.uri, true);
+    httpRequest.send(options.body);
+}
+
 function onMessage(message) {
     // Receives message from the html dialog via the qwebchannel EventBridge. This is complicated by the following:
     // 1. Although we can send POJOs, we cannot receive a toplevel object. (Arrays of POJOs are fine, though.)
@@ -73,7 +109,6 @@ function onMessage(message) {
                 options: snapshotOptions,
                 data: imageData
             }));
-            outstanding = 0;
             break;
         case 'openSettings':
             if ((HMD.active && Settings.getValue("hmdTabletBecomesToolbar"))
@@ -96,18 +131,41 @@ function onMessage(message) {
             //
             onClicked();
             break;
-        case 'shareSnapshot':
+        case 'shareSnapshotForUrl':
             isLoggedIn = Account.isLoggedIn();
-            if (!isLoggedIn) {
+            if (isLoggedIn) {
+                print('Sharing snapshot with audience "for_url":', message.data);
+                Window.shareSnapshot(message.data, message.href || href);
+            } else {
+                // TODO?
+            }
+            break;
+        case 'shareSnapshotWithEveryone':
+            isLoggedIn = Account.isLoggedIn();
+            if (isLoggedIn) {
+                print('sharing', message.data);
+                request({
+                    uri: METAVERSE_BASE + '/api/v1/user_stories/' + story_id,
+                    method: 'PUT',
+                    json: true,
+                    body: {
+                        audience: "for_feed",
+                    }
+                }, function (error, response) {
+                    if (error || (response.status !== 'success')) {
+                        print("Error changing audience: ", error || response.status);
+                        return;
+                    }
+                });
+            } else {
+                // TODO
+                /*
                 needsLogin = true;
                 shareAfterLogin = true;
                 snapshotToShareAfterLogin = { path: message.data, href: message.href || href };
-            } else {
-                print('sharing', message.data);
-                outstanding++;
-                Window.shareSnapshot(message.data, message.href || href);
+                */
             }
-
+            /*
             if (needsLogin) {
                 if ((HMD.active && Settings.getValue("hmdTabletBecomesToolbar"))
                     || (!HMD.active && Settings.getValue("desktopTabletBecomesToolbar"))) {
@@ -116,7 +174,7 @@ function onMessage(message) {
                     tablet.loadQMLOnTop("../../dialogs/TabletLoginDialog.qml");
                     HMD.openTablet();
                 }
-            }
+            }*/
             break;
         default:
             print('Unknown message action received by snapshot.js!');
@@ -133,14 +191,15 @@ function reviewSnapshot() {
     isInSnapshotReview = true;
 }
 
-function snapshotShared(errorMessage) {
-    if (!errorMessage) {
-        print('snapshot uploaded and shared');
+function snapshotUploaded(isError, reply) {
+    if (!isError) {
+        print('SUCCESS: Snapshot uploaded! Story with audience:for_url created! ID:', reply);
+        tablet.emitScriptEvent(JSON.stringify({
+            type: "snapshot",
+            action: "enableShareButtons"
+        }));
     } else {
-        print(errorMessage);
-    }
-    if ((--outstanding <= 0) && shouldOpenFeedAfterShare()) {
-        showFeedWindow();
+        print(reply);
     }
 }
 var href, domainId;
@@ -213,8 +272,7 @@ function stillSnapshotTaken(pathStillSnapshot, notify) {
     snapshotOptions = {
         containsGif: false,
         processingGif: false,
-        canShare: !!isDomainOpen(domainId),
-        openFeedAfterShare: shouldOpenFeedAfterShare()
+        canShare: !!isDomainOpen(domainId)
     };
     imageData = [{ localPath: pathStillSnapshot, href: href }];
     reviewSnapshot();
@@ -241,8 +299,7 @@ function processingGifStarted(pathStillSnapshot) {
         containsGif: true,
         processingGif: true,
         loadingGifPath: Script.resolvePath(Script.resourcesPath() + 'icons/loadingDark.gif'),
-        canShare: !!isDomainOpen(domainId),
-        openFeedAfterShare: shouldOpenFeedAfterShare()
+        canShare: !!isDomainOpen(domainId)
     };
     imageData = [{ localPath: pathStillSnapshot, href: href }];
     reviewSnapshot();
@@ -262,8 +319,7 @@ function processingGifCompleted(pathAnimatedSnapshot) {
     snapshotOptions = {
         containsGif: true,
         processingGif: false,
-        canShare: !!isDomainOpen(domainId),
-        openFeedAfterShare: shouldOpenFeedAfterShare()
+        canShare: !!isDomainOpen(domainId)
     }
     imageData = [{ localPath: pathAnimatedSnapshot, href: href }];
 
@@ -283,7 +339,7 @@ function onTabletScreenChanged(type, url) {
 }
 function onConnected() {
     if (shareAfterLogin && Account.isLoggedIn()) {
-        print('sharing', snapshotToShareAfterLogin.path);
+        print('Sharing snapshot after login:', snapshotToShareAfterLogin.path);
         Window.shareSnapshot(snapshotToShareAfterLogin.path, snapshotToShareAfterLogin.href);
         shareAfterLogin = false;
     }
@@ -291,7 +347,7 @@ function onConnected() {
 
 button.clicked.connect(onClicked);
 buttonConnected = true;
-Window.snapshotShared.connect(snapshotShared);
+Window.snapshotShared.connect(snapshotUploaded);
 tablet.screenChanged.connect(onTabletScreenChanged);
 Account.usernameChanged.connect(onConnected);
 Script.scriptEnding.connect(function () {
@@ -302,7 +358,7 @@ Script.scriptEnding.connect(function () {
     if (tablet) {
         tablet.removeButton(button);
     }
-    Window.snapshotShared.disconnect(snapshotShared);
+    Window.snapshotShared.disconnect(snapshotUploaded);
     tablet.screenChanged.disconnect(onTabletScreenChanged);
 });
 

From eaa699bbfdba3fe875bfe78b1cf5ab2f6147c083 Mon Sep 17 00:00:00 2001
From: Zach Fox <fox@highfidelity.io>
Date: Fri, 21 Apr 2017 17:09:14 -0700
Subject: [PATCH 12/36] Wow, it's really coming together!

---
 interface/src/ui/SnapshotUploader.cpp    |  7 +----
 scripts/system/html/js/SnapshotReview.js | 37 +++++++++---------------
 scripts/system/snapshot.js               | 16 ++++++----
 3 files changed, 26 insertions(+), 34 deletions(-)

diff --git a/interface/src/ui/SnapshotUploader.cpp b/interface/src/ui/SnapshotUploader.cpp
index 54faa822b8..aa37608476 100644
--- a/interface/src/ui/SnapshotUploader.cpp
+++ b/interface/src/ui/SnapshotUploader.cpp
@@ -79,12 +79,7 @@ void SnapshotUploader::uploadFailure(QNetworkReply& reply) {
 
 void SnapshotUploader::createStorySuccess(QNetworkReply& reply) {
     QString replyString = reply.readAll();
-    // oh no QT pls
-    // let's write our own JSON parser???
-    QJsonDocument jsonResponse = QJsonDocument::fromJson(replyString.toUtf8());
-    QJsonObject object = jsonResponse.object()["user_story"].toObject();
-    QString storyId = QString::number(object["id"].toInt());
-    emit DependencyManager::get<WindowScriptingInterface>()->snapshotShared(false, storyId);
+    emit DependencyManager::get<WindowScriptingInterface>()->snapshotShared(false, replyString);
     delete this;
 }
 
diff --git a/scripts/system/html/js/SnapshotReview.js b/scripts/system/html/js/SnapshotReview.js
index 042bc55fb5..6e15dad567 100644
--- a/scripts/system/html/js/SnapshotReview.js
+++ b/scripts/system/html/js/SnapshotReview.js
@@ -33,21 +33,12 @@ function addImage(data, isGifLoading) {
     div.appendChild(img);
     document.getElementById("snapshot-images").appendChild(div);
     var isGif = img.src.split('.').pop().toLowerCase() === "gif";
-    div.appendChild(createShareOverlay(id, isGif));
-    if (!isGif) {
-        img.onload = function () {
-            var shareBar = document.getElementById(id + "shareBar");
-            shareBar.style.width = img.clientWidth;
-
-            document.getElementById(id).style.height = img.clientHeight;
-        }
-    }
     paths.push(data.localPath);
     if (!isGifLoading) {
         shareForUrl(id);
     }
 }
-function createShareOverlay(parentID, isGif) {
+function createShareOverlay(parentID, isGif, shareURL) {
     var shareOverlayContainer = document.createElement("DIV");
     shareOverlayContainer.id = parentID + "shareOverlayContainer";
     shareOverlayContainer.style.position = "absolute";
@@ -60,7 +51,7 @@ function createShareOverlay(parentID, isGif) {
 
     var shareBar = document.createElement("div");
     shareBar.id = parentID + "shareBar"
-    shareBar.style.display = "none";
+    shareBar.style.display = "inline";
     shareBar.style.width = "100%";
     shareBar.style.height = "60px";
     shareBar.style.lineHeight = "60px";
@@ -107,8 +98,8 @@ function createShareOverlay(parentID, isGif) {
                 '<input type="button" class="cancelShare" value="CANCEL" onclick="cancelSharing(' + parentID + ')" />' +
             '</div>' +
             '<div class="externalShareControls">' +
-                '<iframe src="https://www.facebook.com/plugins/share_button.php?href=http%3A%2F%2Fhighfidelity.io&layout=button_count&size=small&mobile_iframe=false&width=84&height=20&appId" width="84" height="20" style="border:none;overflow:hidden" scrolling="no" frameborder="0" allowTransparency="true"></iframe>' +
-                '<a class="twitter-share-button" href="https://twitter.com/intent/tweet">Tweet</a>' +
+                '<iframe src="https://www.facebook.com/plugins/share_button.php?href=' + shareURL + '&layout=button_count&size=small&mobile_iframe=false&width=84&height=20&appId" width="84" height="20" style="border:none;overflow:hidden" scrolling="no" frameborder="0" allowTransparency="true"></iframe>' +
+                '<a class="twitter-share-button" href="https://twitter.com/intent/tweet?text=I just took a snapshot in #HiFi!&url=' + shareURL + '&via=highfidelity"></a>' +
             '</div>' +
         '</div>';
     shareOverlayContainer.appendChild(shareOverlay);
@@ -144,7 +135,7 @@ function shareWithEveryone(selectedID) {
     EventBridge.emitWebEvent(JSON.stringify({
         type: "snapshot",
         action: "shareSnapshotWithEveryone",
-        data: paths[parseInt(selectedID.substring(1))]
+        story_id: document.getElementById(selectedID).getAttribute("data-story-id")
     }));
 }
 function cancelSharing(selectedID) {
@@ -221,12 +212,6 @@ window.onload = function () {
                             var p0img = document.getElementById('p0img');
                             p0img.src = gifPath;
 
-                            p0img.onload = function () {
-                                var shareBar = document.getElementById("p0shareBar");
-                                shareBar.style.width = p0img.clientWidth;
-                                document.getElementById('p0').style.height = p0img.clientHeight;
-                            }
-
                             paths[0] = gifPath;
                             shareForUrl("p0");
                         }
@@ -240,9 +225,15 @@ window.onload = function () {
                 case 'captureSettings':
                     handleCaptureSetting(message.setting);
                     break;
-                case 'enableShareButtons':
-                    var shareBar = document.getElementById("p0shareBar");
-                    shareBar.style.display = "inline";
+                case 'snapshotUploadComplete':
+                    var isGif = message.shareable_url.split('.').pop().toLowerCase() === "gif";
+                    var id = "p0"
+                    if (imageCount > 1 && !isGif) {
+                        id = "p1";
+                    }
+                    var parentDiv = document.getElementById(id);
+                    parentDiv.setAttribute('data-story-id', message.id);
+                    document.getElementById(id).appendChild(createShareOverlay(id, isGif, message.story_url));
                     break;
                 default:
                     print("Unknown message action received in SnapshotReview.js.");
diff --git a/scripts/system/snapshot.js b/scripts/system/snapshot.js
index 37f3070dc0..6b0b8e1214 100644
--- a/scripts/system/snapshot.js
+++ b/scripts/system/snapshot.js
@@ -143,9 +143,9 @@ function onMessage(message) {
         case 'shareSnapshotWithEveryone':
             isLoggedIn = Account.isLoggedIn();
             if (isLoggedIn) {
-                print('sharing', message.data);
+                print('Modifying audience of story ID', message.story_id, "to 'for_feed'");
                 request({
-                    uri: METAVERSE_BASE + '/api/v1/user_stories/' + story_id,
+                    uri: METAVERSE_BASE + '/api/v1/user_stories/' + message.story_id,
                     method: 'PUT',
                     json: true,
                     body: {
@@ -153,8 +153,10 @@ function onMessage(message) {
                     }
                 }, function (error, response) {
                     if (error || (response.status !== 'success')) {
-                        print("Error changing audience: ", error || response.status);
+                        print("ERROR changing audience: ", error || response.status);
                         return;
+                    } else {
+                        print("SUCCESS changing audience!");
                     }
                 });
             } else {
@@ -193,10 +195,14 @@ function reviewSnapshot() {
 
 function snapshotUploaded(isError, reply) {
     if (!isError) {
-        print('SUCCESS: Snapshot uploaded! Story with audience:for_url created! ID:', reply);
+        print('SUCCESS: Snapshot uploaded! Story with audience:for_url created!');
+        var replyJson = JSON.parse(reply);
         tablet.emitScriptEvent(JSON.stringify({
             type: "snapshot",
-            action: "enableShareButtons"
+            action: "snapshotUploadComplete",
+            id: replyJson.user_story.id,
+            story_url: "https://highfidelity.com/user_stories/" + replyJson.user_story.id,
+            shareable_url: replyJson.user_story.details.shareable_url,
         }));
     } else {
         print(reply);

From fad470eeea20dd9609f62764a99241f073648854 Mon Sep 17 00:00:00 2001
From: Zach Fox <fox@highfidelity.io>
Date: Mon, 24 Apr 2017 14:35:05 -0700
Subject: [PATCH 13/36] Checkpoint (this is complicated)

---
 scripts/system/html/js/SnapshotReview.js |  86 +++++++++++------
 scripts/system/snapshot.js               | 112 ++++++++++++++++++-----
 2 files changed, 148 insertions(+), 50 deletions(-)

diff --git a/scripts/system/html/js/SnapshotReview.js b/scripts/system/html/js/SnapshotReview.js
index 6e15dad567..cf1f881a46 100644
--- a/scripts/system/html/js/SnapshotReview.js
+++ b/scripts/system/html/js/SnapshotReview.js
@@ -10,9 +10,20 @@
 //  See the accompanying file LICENSE or http://www.apache.org/licenses/LICENSE-2.0.html
 //
 
-var paths = [], idCounter = 0, imageCount = 1;
-function addImage(data, isGifLoading) {
-    if (!data.localPath) {
+var paths = [];
+var idCounter = 0;
+var imageCount = 0;
+function clearImages() {
+    var snapshotImagesDiv = document.getElementById("snapshot-images");
+    while (snapshotImagesDiv.hasChildNodes()) {
+        snapshotImagesDiv.removeChild(snapshotImagesDiv.lastChild);
+    }
+    paths = [];
+    imageCount = 0;
+    idCounter = 0;
+}
+function addImage(image_data, isGifLoading, isShowingPreviousImages) {
+    if (!image_data.localPath) {
         return;
     }
     var div = document.createElement("DIV");
@@ -29,15 +40,26 @@ function addImage(data, isGifLoading) {
     if (imageCount > 1) {
         img.setAttribute("class", "multiple");
     }
-    img.src = data.localPath;
+    img.src = image_data.localPath;
     div.appendChild(img);
     document.getElementById("snapshot-images").appendChild(div);
     var isGif = img.src.split('.').pop().toLowerCase() === "gif";
-    paths.push(data.localPath);
-    if (!isGifLoading) {
+    paths.push(image_data.localPath);
+    if (!isGifLoading && !isShowingPreviousImages) {
         shareForUrl(id);
+    } else if (isShowingPreviousImages) {
+        appendShareBar(id, image_data.story_id, isGif)
     }
 }
+function appendShareBar(divID, story_id, isGif) {
+    var story_url = "https://highfidelity.com/user_stories/" + story_id;
+    var parentDiv = document.getElementById(divID);
+    parentDiv.setAttribute('data-story-id', story_id);
+    document.getElementById(divID).appendChild(createShareOverlay(divID, isGif, story_url));
+    twttr.events.bind('click', function (event) {
+        shareButtonClicked(divID);
+    });
+}
 function createShareOverlay(parentID, isGif, shareURL) {
     var shareOverlayContainer = document.createElement("DIV");
     shareOverlayContainer.id = parentID + "shareOverlayContainer";
@@ -138,6 +160,13 @@ function shareWithEveryone(selectedID) {
         story_id: document.getElementById(selectedID).getAttribute("data-story-id")
     }));
 }
+function shareButtonClicked(selectedID) {
+    EventBridge.emitWebEvent(JSON.stringify({
+        type: "snapshot",
+        action: "shareButtonClicked",
+        story_id: document.getElementById(selectedID).getAttribute("data-story-id")
+    }));
+}
 function cancelSharing(selectedID) {
     selectedID = selectedID.id; // Why is this necessary?
     var shareOverlayContainer = document.getElementById(selectedID + "shareOverlayContainer");
@@ -176,9 +205,10 @@ function handleCaptureSetting(setting) {
 window.onload = function () {
     // TESTING FUNCTIONS START
     // Uncomment and modify the lines below to test SnapshotReview in a browser.
-    //imageCount = 2;
+    //imageCount = 1;
     //addImage({ localPath: 'C:/Users/Zach Fox/Desktop/hifi-snap-by-zfox-on-2017-04-20_14-59-12.gif' });
-    //addImage({ localPath: 'C:/Users/Zach Fox/Desktop/hifi-snap-by-zfox-on-2017-04-20_14-59-12.jpg' });
+    //addImage({ localPath: 'C:/Users/Zach Fox/Desktop/hifi-snap-by-zfox-on-2017-04-24_10-49-20.jpg' });
+    //document.getElementById('p0').appendChild(createShareOverlay('p0', false, ''));
     //addImage({ localPath: 'http://lorempixel.com/553/255' });
     //addImage({localPath: 'c:/Users/howar/OneDrive/Pictures/hifi-snap-by--on-2016-07-27_12-58-43.jpg'});
     // TESTING FUNCTIONS END
@@ -194,6 +224,17 @@ window.onload = function () {
             }
             
             switch (message.action) {
+                case 'clearPreviousImages':
+                    clearImages();
+                    break;
+                case 'showPreviousImages':
+                    clearImages();
+                    var messageOptions = message.options;
+                    imageCount = message.image_data.length;
+                    message.image_data.forEach(function (element, idx, array) {
+                        addImage(element, true, true);
+                    });
+                    break;
                 case 'addImages':
                     // The last element of the message contents list contains a bunch of options,
                     // including whether or not we can share stuff
@@ -202,13 +243,13 @@ window.onload = function () {
 
                     if (messageOptions.containsGif) {
                         if (messageOptions.processingGif) {
-                            imageCount = message.data.length + 1; // "+1" for the GIF that'll finish processing soon
-                            message.data.unshift({ localPath: messageOptions.loadingGifPath });
-                            message.data.forEach(function (element, idx, array) {
+                            imageCount = message.image_data.length + 1; // "+1" for the GIF that'll finish processing soon
+                            message.image_data.unshift({ localPath: messageOptions.loadingGifPath });
+                            message.image_data.forEach(function (element, idx, array) {
                                 addImage(element, idx === 0);
                             });
                         } else {
-                            var gifPath = message.data[0].localPath;
+                            var gifPath = message.image_data[0].localPath;
                             var p0img = document.getElementById('p0img');
                             p0img.src = gifPath;
 
@@ -216,8 +257,8 @@ window.onload = function () {
                             shareForUrl("p0");
                         }
                     } else {
-                        imageCount = message.data.length;
-                        message.data.forEach(function (element, idx, array) {
+                        imageCount = message.image_data.length;
+                        message.image_data.forEach(function (element, idx, array) {
                             addImage(element, false);
                         });
                     }
@@ -227,19 +268,12 @@ window.onload = function () {
                     break;
                 case 'snapshotUploadComplete':
                     var isGif = message.shareable_url.split('.').pop().toLowerCase() === "gif";
-                    var id = "p0"
-                    if (imageCount > 1 && !isGif) {
-                        id = "p1";
-                    }
-                    var parentDiv = document.getElementById(id);
-                    parentDiv.setAttribute('data-story-id', message.id);
-                    document.getElementById(id).appendChild(createShareOverlay(id, isGif, message.story_url));
+                    appendShareBar(isGif || imageCount === 1 ? "p0" : "p1", message.story_id, isGif);
                     break;
                 default:
-                    print("Unknown message action received in SnapshotReview.js.");
+                    console.log("Unknown message action received in SnapshotReview.js.");
                     break;
             }
-
         });
 
         EventBridge.emitWebEvent(JSON.stringify({
@@ -249,12 +283,6 @@ window.onload = function () {
     });
 
 };
-function doNotShare() {
-    EventBridge.emitWebEvent(JSON.stringify({
-        type: "snapshot",
-        action: []
-    }));
-}
 function snapshotSettings() {
     EventBridge.emitWebEvent(JSON.stringify({
         type: "snapshot",
diff --git a/scripts/system/snapshot.js b/scripts/system/snapshot.js
index 6b0b8e1214..1af35f4061 100644
--- a/scripts/system/snapshot.js
+++ b/scripts/system/snapshot.js
@@ -29,7 +29,8 @@ var button = tablet.addButton({
 });
 
 var snapshotOptions;
-var imageData;
+var imageData = [];
+var storyIDsToMaybeDelete = [];
 var shareAfterLogin = false;
 var snapshotToShareAfterLogin;
 var METAVERSE_BASE = location.metaverseServerUrl;
@@ -105,9 +106,9 @@ function onMessage(message) {
             }));
             tablet.emitScriptEvent(JSON.stringify({
                 type: "snapshot",
-                action: "addImages",
+                action: "showPreviousImages",
                 options: snapshotOptions,
-                data: imageData
+                image_data: imageData
             }));
             break;
         case 'openSettings':
@@ -127,9 +128,7 @@ function onMessage(message) {
             Settings.setValue("alsoTakeAnimatedSnapshot", false);
             break;
         case 'takeSnapshot':
-            // In settings, first store the paths to the last snapshot
-            //
-            onClicked();
+            takeSnapshot();
             break;
         case 'shareSnapshotForUrl':
             isLoggedIn = Account.isLoggedIn();
@@ -142,6 +141,7 @@ function onMessage(message) {
             break;
         case 'shareSnapshotWithEveryone':
             isLoggedIn = Account.isLoggedIn();
+            storyIDsToMaybeDelete.splice(storyIDsToMaybeDelete.indexOf(message.story_id), 1);
             if (isLoggedIn) {
                 print('Modifying audience of story ID', message.story_id, "to 'for_feed'");
                 request({
@@ -178,6 +178,10 @@ function onMessage(message) {
                 }
             }*/
             break;
+        case 'shareButtonClicked':
+            print('Twitter or FB "Share" button clicked! Removing ID', message.story_id, 'from storyIDsToMaybeDelete[].')
+            storyIDsToMaybeDelete.splice(storyIDsToMaybeDelete.indexOf(message.story_id), 1);
+            break;
         default:
             print('Unknown message action received by snapshot.js!');
             break;
@@ -186,7 +190,23 @@ function onMessage(message) {
 
 var SNAPSHOT_REVIEW_URL = Script.resolvePath("html/SnapshotReview.html");
 var isInSnapshotReview = false;
-function reviewSnapshot() {
+function openSnapApp() {
+    var previousStillSnapPath = Settings.getValue("previousStillSnapPath");
+    var previousStillSnapStoryID = Settings.getValue("previousStillSnapStoryID");
+    var previousAnimatedSnapPath = Settings.getValue("previousAnimatedSnapPath");
+    var previousAnimatedSnapStoryID = Settings.getValue("previousAnimatedSnapStoryID");
+    snapshotOptions = {
+        containsGif: previousAnimatedSnapPath !== "",
+        processingGif: false,
+        shouldUpload: false
+    }
+    imageData = [];
+    if (previousAnimatedSnapPath !== "") {
+        imageData.push({ localPath: previousAnimatedSnapPath, story_id: previousAnimatedSnapStoryID });
+    }
+    if (previousStillSnapPath !== "") {
+        imageData.push({ localPath: previousStillSnapPath, story_id: previousStillSnapStoryID });
+    }
     tablet.gotoWebScreen(SNAPSHOT_REVIEW_URL);
     tablet.webEventReceived.connect(onMessage);
     HMD.openTablet();
@@ -195,21 +215,28 @@ function reviewSnapshot() {
 
 function snapshotUploaded(isError, reply) {
     if (!isError) {
-        print('SUCCESS: Snapshot uploaded! Story with audience:for_url created!');
         var replyJson = JSON.parse(reply);
+        var storyID = replyJson.user_story.id;
+        var shareableURL = replyJson.user_story.details.shareable_url;
+        var isGif = shareableURL.split('.').pop().toLowerCase() === "gif";
+        print('SUCCESS: Snapshot uploaded! Story with audience:for_url created! ID:', storyID);
         tablet.emitScriptEvent(JSON.stringify({
             type: "snapshot",
             action: "snapshotUploadComplete",
-            id: replyJson.user_story.id,
-            story_url: "https://highfidelity.com/user_stories/" + replyJson.user_story.id,
-            shareable_url: replyJson.user_story.details.shareable_url,
+            story_id: storyID,
+            shareable_url: shareableURL,
         }));
+        if (isGif) {
+            Settings.setValue("previousAnimatedSnapStoryID", storyID);
+        } else {
+            Settings.setValue("previousStillSnapStoryID", storyID);
+        }
     } else {
         print(reply);
     }
 }
 var href, domainId;
-function onClicked() {
+function takeSnapshot() {
     // Raising the desktop for the share dialog at end will interact badly with clearOverlayWhenMoving.
     // Turn it off now, before we start futzing with things (and possibly moving).
     clearOverlayWhenMoving = MyAvatar.getClearOverlayWhenMoving(); // Do not use Settings. MyAvatar keeps a separate copy.
@@ -220,8 +247,16 @@ function onClicked() {
     href = location.href;
     domainId = location.domainId;
 
+    tablet.emitScriptEvent(JSON.stringify({
+        type: "snapshot",
+        action: "clearPreviousImages"
+    }));
+    maybeDeleteSnapshotStories();
+    Settings.setValue("previousStillSnapPath", "");
+    Settings.setValue("previousAnimatedSnapPath", "");
+
     // update button states
-    resetOverlays = Menu.isOptionChecked("Overlays"); // For completness. Certainly true if the button is visible to be clicke.
+    resetOverlays = Menu.isOptionChecked("Overlays"); // For completness. Certainly true if the button is visible to be clicked.
     reticleVisible = Reticle.visible;
     Reticle.visible = false;
     Window.stillSnapshotTaken.connect(stillSnapshotTaken);
@@ -281,7 +316,15 @@ function stillSnapshotTaken(pathStillSnapshot, notify) {
         canShare: !!isDomainOpen(domainId)
     };
     imageData = [{ localPath: pathStillSnapshot, href: href }];
-    reviewSnapshot();
+    Settings.setValue("previousStillSnapPath", pathStillSnapshot);
+
+    tablet.emitScriptEvent(JSON.stringify({
+        type: "snapshot",
+        action: "addImages",
+        options: snapshotOptions,
+        image_data: imageData
+    }));
+
     if (clearOverlayWhenMoving) {
         MyAvatar.setClearOverlayWhenMoving(true); // not until after the share dialog
     }
@@ -291,7 +334,7 @@ function stillSnapshotTaken(pathStillSnapshot, notify) {
 function processingGifStarted(pathStillSnapshot) {
     Window.processingGifStarted.disconnect(processingGifStarted);
     if (buttonConnected) {
-        button.clicked.disconnect(onClicked);
+        button.clicked.disconnect(openSnapApp);
         buttonConnected = false;
     }
     // show hud
@@ -308,7 +351,15 @@ function processingGifStarted(pathStillSnapshot) {
         canShare: !!isDomainOpen(domainId)
     };
     imageData = [{ localPath: pathStillSnapshot, href: href }];
-    reviewSnapshot();
+    Settings.setValue("previousStillSnapPath", pathStillSnapshot);
+
+    tablet.emitScriptEvent(JSON.stringify({
+        type: "snapshot",
+        action: "addImages",
+        options: snapshotOptions,
+        image_data: imageData
+    }));
+
     if (clearOverlayWhenMoving) {
         MyAvatar.setClearOverlayWhenMoving(true); // not until after the share dialog
     }
@@ -318,7 +369,7 @@ function processingGifStarted(pathStillSnapshot) {
 function processingGifCompleted(pathAnimatedSnapshot) {
     Window.processingGifCompleted.disconnect(processingGifCompleted);
     if (!buttonConnected) {
-        button.clicked.connect(onClicked);
+        button.clicked.connect(openSnapApp);
         buttonConnected = true;
     }
 
@@ -328,15 +379,34 @@ function processingGifCompleted(pathAnimatedSnapshot) {
         canShare: !!isDomainOpen(domainId)
     }
     imageData = [{ localPath: pathAnimatedSnapshot, href: href }];
+    Settings.setValue("previousAnimatedSnapPath", pathAnimatedSnapshot);
 
     tablet.emitScriptEvent(JSON.stringify({
         type: "snapshot",
         action: "addImages",
         options: snapshotOptions,
-        data: imageData
+        image_data: imageData
     }));
 }
-
+function maybeDeleteSnapshotStories() {
+    if (storyIDsToMaybeDelete.length > 0) {
+        print("User took new snapshot & didn't share old one(s); deleting old snapshot stories");
+        storyIDsToMaybeDelete.forEach(function (element, idx, array) {
+            request({
+                uri: METAVERSE_BASE + '/api/v1/user_stories/' + element,
+                method: 'DELETE'
+            }, function (error, response) {
+                if (error || (response.status !== 'success')) {
+                    print("ERROR deleting snapshot story: ", error || response.status);
+                    return;
+                } else {
+                    print("SUCCESS deleting snapshot story with ID", element);
+                }
+            })
+        });
+        storyIDsToMaybeDelete = [];
+    }
+}
 function onTabletScreenChanged(type, url) {
     if (isInSnapshotReview) {
         tablet.webEventReceived.disconnect(onMessage);
@@ -351,14 +421,14 @@ function onConnected() {
     }
 }
 
-button.clicked.connect(onClicked);
+button.clicked.connect(openSnapApp);
 buttonConnected = true;
 Window.snapshotShared.connect(snapshotUploaded);
 tablet.screenChanged.connect(onTabletScreenChanged);
 Account.usernameChanged.connect(onConnected);
 Script.scriptEnding.connect(function () {
     if (buttonConnected) {
-        button.clicked.disconnect(onClicked);
+        button.clicked.disconnect(openSnapApp);
         buttonConnected = false;
     }
     if (tablet) {

From 7c5de1e60b3dca11aadb56cfed6a44388b9e997d Mon Sep 17 00:00:00 2001
From: Zach Fox <fox@highfidelity.io>
Date: Mon, 24 Apr 2017 15:19:59 -0700
Subject: [PATCH 14/36] Getting closer

---
 scripts/system/html/js/SnapshotReview.js | 11 ++++++-----
 scripts/system/snapshot.js               | 22 ++++++++++++++++------
 2 files changed, 22 insertions(+), 11 deletions(-)

diff --git a/scripts/system/html/js/SnapshotReview.js b/scripts/system/html/js/SnapshotReview.js
index cf1f881a46..d5cc9faf74 100644
--- a/scripts/system/html/js/SnapshotReview.js
+++ b/scripts/system/html/js/SnapshotReview.js
@@ -18,11 +18,12 @@ function clearImages() {
     while (snapshotImagesDiv.hasChildNodes()) {
         snapshotImagesDiv.removeChild(snapshotImagesDiv.lastChild);
     }
+    twttr.events.unbind('click');
     paths = [];
     imageCount = 0;
     idCounter = 0;
 }
-function addImage(image_data, isGifLoading, isShowingPreviousImages) {
+function addImage(image_data, isGifLoading, canSharePreviousImages) {
     if (!image_data.localPath) {
         return;
     }
@@ -45,9 +46,9 @@ function addImage(image_data, isGifLoading, isShowingPreviousImages) {
     document.getElementById("snapshot-images").appendChild(div);
     var isGif = img.src.split('.').pop().toLowerCase() === "gif";
     paths.push(image_data.localPath);
-    if (!isGifLoading && !isShowingPreviousImages) {
+    if (!isGifLoading && !canSharePreviousImages) {
         shareForUrl(id);
-    } else if (isShowingPreviousImages) {
+    } else if (canSharePreviousImages) {
         appendShareBar(id, image_data.story_id, isGif)
     }
 }
@@ -232,7 +233,7 @@ window.onload = function () {
                     var messageOptions = message.options;
                     imageCount = message.image_data.length;
                     message.image_data.forEach(function (element, idx, array) {
-                        addImage(element, true, true);
+                        addImage(element, true, message.canShare);
                     });
                     break;
                 case 'addImages':
@@ -267,7 +268,7 @@ window.onload = function () {
                     handleCaptureSetting(message.setting);
                     break;
                 case 'snapshotUploadComplete':
-                    var isGif = message.shareable_url.split('.').pop().toLowerCase() === "gif";
+                    var isGif = message.image_url.split('.').pop().toLowerCase() === "gif";
                     appendShareBar(isGif || imageCount === 1 ? "p0" : "p1", message.story_id, isGif);
                     break;
                 default:
diff --git a/scripts/system/snapshot.js b/scripts/system/snapshot.js
index 1af35f4061..39fc45556e 100644
--- a/scripts/system/snapshot.js
+++ b/scripts/system/snapshot.js
@@ -108,7 +108,8 @@ function onMessage(message) {
                 type: "snapshot",
                 action: "showPreviousImages",
                 options: snapshotOptions,
-                image_data: imageData
+                image_data: imageData,
+                canShare: !!isDomainOpen(Settings.getValue("previousSnapshotDomainID"))
             }));
             break;
         case 'openSettings':
@@ -179,8 +180,9 @@ function onMessage(message) {
             }*/
             break;
         case 'shareButtonClicked':
-            print('Twitter or FB "Share" button clicked! Removing ID', message.story_id, 'from storyIDsToMaybeDelete[].')
+            print('Twitter or FB "Share" button clicked! Removing ID', message.story_id, 'from storyIDsToMaybeDelete[].');
             storyIDsToMaybeDelete.splice(storyIDsToMaybeDelete.indexOf(message.story_id), 1);
+            print('storyIDsToMaybeDelete[] now:', JSON.stringify(storyIDsToMaybeDelete));
             break;
         default:
             print('Unknown message action received by snapshot.js!');
@@ -217,14 +219,15 @@ function snapshotUploaded(isError, reply) {
     if (!isError) {
         var replyJson = JSON.parse(reply);
         var storyID = replyJson.user_story.id;
-        var shareableURL = replyJson.user_story.details.shareable_url;
-        var isGif = shareableURL.split('.').pop().toLowerCase() === "gif";
+        storyIDsToMaybeDelete.push(storyID);
+        var imageURL = replyJson.user_story.details.image_url;
+        var isGif = imageURL.split('.').pop().toLowerCase() === "gif";
         print('SUCCESS: Snapshot uploaded! Story with audience:for_url created! ID:', storyID);
         tablet.emitScriptEvent(JSON.stringify({
             type: "snapshot",
             action: "snapshotUploadComplete",
             story_id: storyID,
-            shareable_url: shareableURL,
+            image_url: imageURL,
         }));
         if (isGif) {
             Settings.setValue("previousAnimatedSnapStoryID", storyID);
@@ -246,14 +249,17 @@ function takeSnapshot() {
     // Even the domainId could change (e.g., if the user falls into a teleporter while recording).
     href = location.href;
     domainId = location.domainId;
+    Settings.setValue("previousSnapshotDomainID", domainId);
 
+    maybeDeleteSnapshotStories();
     tablet.emitScriptEvent(JSON.stringify({
         type: "snapshot",
         action: "clearPreviousImages"
     }));
-    maybeDeleteSnapshotStories();
     Settings.setValue("previousStillSnapPath", "");
+    Settings.setValue("previousStillSnapStoryID", "");
     Settings.setValue("previousAnimatedSnapPath", "");
+    Settings.setValue("previousAnimatedSnapStoryID", "");
 
     // update button states
     resetOverlays = Menu.isOptionChecked("Overlays"); // For completness. Certainly true if the button is visible to be clicked.
@@ -278,6 +284,10 @@ function takeSnapshot() {
 }
 
 function isDomainOpen(id) {
+    print("Checking open status of domain with ID:", id);
+    if (!id) {
+        return false;
+    }
     var request = new XMLHttpRequest();
     var options = [
         'now=' + new Date().toISOString(),

From f838e87f4891627ca64637395148964174a301fd Mon Sep 17 00:00:00 2001
From: Zach Fox <fox@highfidelity.io>
Date: Mon, 24 Apr 2017 15:59:19 -0700
Subject: [PATCH 15/36] Pretty stable...

---
 scripts/system/html/css/SnapshotReview.css |  1 +
 scripts/system/html/js/SnapshotReview.js   | 12 +++---
 scripts/system/snapshot.js                 | 44 +++++++++++++---------
 3 files changed, 34 insertions(+), 23 deletions(-)

diff --git a/scripts/system/html/css/SnapshotReview.css b/scripts/system/html/css/SnapshotReview.css
index 1e233b22f3..859b4d8c90 100644
--- a/scripts/system/html/css/SnapshotReview.css
+++ b/scripts/system/html/css/SnapshotReview.css
@@ -11,6 +11,7 @@
 body {
     padding: 0;
     margin: 0;
+    overflow: hidden;
 }
 
 /*
diff --git a/scripts/system/html/js/SnapshotReview.js b/scripts/system/html/js/SnapshotReview.js
index d5cc9faf74..9fa58e6d33 100644
--- a/scripts/system/html/js/SnapshotReview.js
+++ b/scripts/system/html/js/SnapshotReview.js
@@ -23,7 +23,7 @@ function clearImages() {
     imageCount = 0;
     idCounter = 0;
 }
-function addImage(image_data, isGifLoading, canSharePreviousImages) {
+function addImage(image_data, isGifLoading, isShowingPreviousImages, canSharePreviousImages) {
     if (!image_data.localPath) {
         return;
     }
@@ -46,9 +46,9 @@ function addImage(image_data, isGifLoading, canSharePreviousImages) {
     document.getElementById("snapshot-images").appendChild(div);
     var isGif = img.src.split('.').pop().toLowerCase() === "gif";
     paths.push(image_data.localPath);
-    if (!isGifLoading && !canSharePreviousImages) {
+    if (!isGifLoading && !isShowingPreviousImages) {
         shareForUrl(id);
-    } else if (canSharePreviousImages) {
+    } else if (isShowingPreviousImages && canSharePreviousImages) {
         appendShareBar(id, image_data.story_id, isGif)
     }
 }
@@ -233,7 +233,7 @@ window.onload = function () {
                     var messageOptions = message.options;
                     imageCount = message.image_data.length;
                     message.image_data.forEach(function (element, idx, array) {
-                        addImage(element, true, message.canShare);
+                        addImage(element, true, true, message.canShare);
                     });
                     break;
                 case 'addImages':
@@ -247,7 +247,7 @@ window.onload = function () {
                             imageCount = message.image_data.length + 1; // "+1" for the GIF that'll finish processing soon
                             message.image_data.unshift({ localPath: messageOptions.loadingGifPath });
                             message.image_data.forEach(function (element, idx, array) {
-                                addImage(element, idx === 0);
+                                addImage(element, idx === 0, false, false);
                             });
                         } else {
                             var gifPath = message.image_data[0].localPath;
@@ -260,7 +260,7 @@ window.onload = function () {
                     } else {
                         imageCount = message.image_data.length;
                         message.image_data.forEach(function (element, idx, array) {
-                            addImage(element, false);
+                            addImage(element, false, false, false);
                         });
                     }
                     break;
diff --git a/scripts/system/snapshot.js b/scripts/system/snapshot.js
index 39fc45556e..422c557391 100644
--- a/scripts/system/snapshot.js
+++ b/scripts/system/snapshot.js
@@ -240,6 +240,15 @@ function snapshotUploaded(isError, reply) {
 }
 var href, domainId;
 function takeSnapshot() {
+    tablet.emitScriptEvent(JSON.stringify({
+        type: "snapshot",
+        action: "clearPreviousImages"
+    }));
+    Settings.setValue("previousStillSnapPath", "");
+    Settings.setValue("previousStillSnapStoryID", "");
+    Settings.setValue("previousAnimatedSnapPath", "");
+    Settings.setValue("previousAnimatedSnapStoryID", "");
+
     // Raising the desktop for the share dialog at end will interact badly with clearOverlayWhenMoving.
     // Turn it off now, before we start futzing with things (and possibly moving).
     clearOverlayWhenMoving = MyAvatar.getClearOverlayWhenMoving(); // Do not use Settings. MyAvatar keeps a separate copy.
@@ -252,22 +261,22 @@ function takeSnapshot() {
     Settings.setValue("previousSnapshotDomainID", domainId);
 
     maybeDeleteSnapshotStories();
-    tablet.emitScriptEvent(JSON.stringify({
-        type: "snapshot",
-        action: "clearPreviousImages"
-    }));
-    Settings.setValue("previousStillSnapPath", "");
-    Settings.setValue("previousStillSnapStoryID", "");
-    Settings.setValue("previousAnimatedSnapPath", "");
-    Settings.setValue("previousAnimatedSnapStoryID", "");
 
     // update button states
-    resetOverlays = Menu.isOptionChecked("Overlays"); // For completness. Certainly true if the button is visible to be clicked.
+    resetOverlays = Menu.isOptionChecked("Overlays"); // For completeness. Certainly true if the button is visible to be clicked.
     reticleVisible = Reticle.visible;
     Reticle.visible = false;
-    Window.stillSnapshotTaken.connect(stillSnapshotTaken);
-    Window.processingGifStarted.connect(processingGifStarted);
-    Window.processingGifCompleted.connect(processingGifCompleted);
+    
+    var includeAnimated = Settings.getValue("alsoTakeAnimatedSnapshot", true);
+    if (includeAnimated) {
+        Window.processingGifStarted.connect(processingGifStarted);
+    } else {
+        Window.stillSnapshotTaken.connect(stillSnapshotTaken);
+    }
+    if (buttonConnected) {
+        button.clicked.disconnect(openSnapApp);
+        buttonConnected = false;
+    }
 
     // hide overlays if they are on
     if (resetOverlays) {
@@ -278,7 +287,7 @@ function takeSnapshot() {
     Script.setTimeout(function () {
         HMD.closeTablet();
         Script.setTimeout(function () {
-            Window.takeSnapshot(false, Settings.getValue("alsoTakeAnimatedSnapshot", true), 1.91);
+            Window.takeSnapshot(false, includeAnimated, 1.91);
         }, SNAPSHOT_DELAY);
     }, FINISH_SOUND_DELAY);
 }
@@ -315,6 +324,10 @@ function stillSnapshotTaken(pathStillSnapshot, notify) {
         Menu.setIsOptionChecked("Overlays", true);
     }
     Window.stillSnapshotTaken.disconnect(stillSnapshotTaken);
+    if (!buttonConnected) {
+        button.clicked.connect(openSnapApp);
+        buttonConnected = true;
+    }
 
     // A Snapshot Review dialog might be left open indefinitely after taking the picture,
     // during which time the user may have moved. So stash that info in the dialog so that
@@ -343,10 +356,7 @@ function stillSnapshotTaken(pathStillSnapshot, notify) {
 
 function processingGifStarted(pathStillSnapshot) {
     Window.processingGifStarted.disconnect(processingGifStarted);
-    if (buttonConnected) {
-        button.clicked.disconnect(openSnapApp);
-        buttonConnected = false;
-    }
+    Window.processingGifCompleted.connect(processingGifCompleted);
     // show hud
     Reticle.visible = reticleVisible;
     // show overlays if they were on

From e1789996fbe3d69f779ab20d613a2c768079d8eb Mon Sep 17 00:00:00 2001
From: Zach Fox <fox@highfidelity.io>
Date: Mon, 24 Apr 2017 16:34:58 -0700
Subject: [PATCH 16/36] Add announcements support

---
 scripts/system/html/js/SnapshotReview.js | 25 +++++++++++--------
 scripts/system/snapshot.js               | 31 +++++++++++++++++++-----
 2 files changed, 40 insertions(+), 16 deletions(-)

diff --git a/scripts/system/html/js/SnapshotReview.js b/scripts/system/html/js/SnapshotReview.js
index 9fa58e6d33..4c5419869d 100644
--- a/scripts/system/html/js/SnapshotReview.js
+++ b/scripts/system/html/js/SnapshotReview.js
@@ -23,7 +23,7 @@ function clearImages() {
     imageCount = 0;
     idCounter = 0;
 }
-function addImage(image_data, isGifLoading, isShowingPreviousImages, canSharePreviousImages) {
+function addImage(image_data, isGifLoading, isShowingPreviousImages, canSharePreviousImages, hifiShareButtonsDisabled) {
     if (!image_data.localPath) {
         return;
     }
@@ -49,19 +49,19 @@ function addImage(image_data, isGifLoading, isShowingPreviousImages, canSharePre
     if (!isGifLoading && !isShowingPreviousImages) {
         shareForUrl(id);
     } else if (isShowingPreviousImages && canSharePreviousImages) {
-        appendShareBar(id, image_data.story_id, isGif)
+        appendShareBar(id, image_data.story_id, isGif, hifiShareButtonsDisabled)
     }
 }
-function appendShareBar(divID, story_id, isGif) {
+function appendShareBar(divID, story_id, isGif, hifiShareButtonsDisabled) {
     var story_url = "https://highfidelity.com/user_stories/" + story_id;
     var parentDiv = document.getElementById(divID);
     parentDiv.setAttribute('data-story-id', story_id);
-    document.getElementById(divID).appendChild(createShareOverlay(divID, isGif, story_url));
+    document.getElementById(divID).appendChild(createShareOverlay(divID, isGif, story_url, hifiShareButtonsDisabled));
     twttr.events.bind('click', function (event) {
         shareButtonClicked(divID);
     });
 }
-function createShareOverlay(parentID, isGif, shareURL) {
+function createShareOverlay(parentID, isGif, shareURL, hifiShareButtonsDisabled) {
     var shareOverlayContainer = document.createElement("DIV");
     shareOverlayContainer.id = parentID + "shareOverlayContainer";
     shareOverlayContainer.style.position = "absolute";
@@ -115,8 +115,8 @@ function createShareOverlay(parentID, isGif, shareURL) {
         '<br/>' +
         '<div class="shareControls">' +
             '<div class="hifiShareControls">' +
-                '<input type="button" class="shareWithEveryone" id="' + shareWithEveryoneButtonID + '" value="SHARE WITH EVERYONE" onclick="shareWithEveryone(' + parentID + ')" /><br>' +
-                '<input type="checkbox" class="inviteConnections" id="' + inviteConnectionsCheckboxID + '" checked="checked" />' +
+                '<input type="button"' + (hifiShareButtonsDisabled ? ' disabled="disabled"' : '') + ' class="shareWithEveryone" id="' + shareWithEveryoneButtonID + '" value="SHARE WITH EVERYONE" onclick="shareWithEveryone(' + parentID + ', ' + isGif + ')" /><br>' +
+                '<input type="checkbox"' + (hifiShareButtonsDisabled ? ' disabled="disabled"' : '') + ' class="inviteConnections" id="' + inviteConnectionsCheckboxID + '" checked="checked" />' +
                 '<label class="shareButtonLabel" for="' + inviteConnectionsCheckboxID + '">Invite My Connections</label><br>' +
                 '<input type="button" class="cancelShare" value="CANCEL" onclick="cancelSharing(' + parentID + ')" />' +
             '</div>' +
@@ -152,13 +152,18 @@ function shareForUrl(selectedID) {
         data: paths[parseInt(selectedID.substring(1))]
     }));
 }
-function shareWithEveryone(selectedID) {
+function shareWithEveryone(selectedID, isGif) {
     selectedID = selectedID.id; // Why is this necessary?
 
+    document.getElementById(selectedID + "shareWithEveryoneButton").setAttribute("disabled", "disabled");
+    document.getElementById(selectedID + "inviteConnectionsCheckbox").setAttribute("disabled", "disabled");
+
     EventBridge.emitWebEvent(JSON.stringify({
         type: "snapshot",
         action: "shareSnapshotWithEveryone",
-        story_id: document.getElementById(selectedID).getAttribute("data-story-id")
+        story_id: document.getElementById(selectedID).getAttribute("data-story-id"),
+        isAnnouncement: document.getElementById(selectedID + "inviteConnectionsCheckbox").getAttribute("checked"),
+        isGif: isGif
     }));
 }
 function shareButtonClicked(selectedID) {
@@ -233,7 +238,7 @@ window.onload = function () {
                     var messageOptions = message.options;
                     imageCount = message.image_data.length;
                     message.image_data.forEach(function (element, idx, array) {
-                        addImage(element, true, true, message.canShare);
+                        addImage(element, true, true, message.canShare, message.image_data[idx].buttonDisabled);
                     });
                     break;
                 case 'addImages':
diff --git a/scripts/system/snapshot.js b/scripts/system/snapshot.js
index 422c557391..95a76a9188 100644
--- a/scripts/system/snapshot.js
+++ b/scripts/system/snapshot.js
@@ -143,21 +143,38 @@ function onMessage(message) {
         case 'shareSnapshotWithEveryone':
             isLoggedIn = Account.isLoggedIn();
             storyIDsToMaybeDelete.splice(storyIDsToMaybeDelete.indexOf(message.story_id), 1);
+            if (message.isGif) {
+                Settings.setValue("previousAnimatedSnapSharingDisabled", true);
+            } else {
+                Settings.setValue("previousStillSnapSharingDisabled", true);
+            }
+
+            var requestBody = {
+                audience: "for_feed"
+            }
+
+            if (message.isAnnouncement) {
+                requestBody.action = "announcement";
+            }
+
             if (isLoggedIn) {
                 print('Modifying audience of story ID', message.story_id, "to 'for_feed'");
                 request({
                     uri: METAVERSE_BASE + '/api/v1/user_stories/' + message.story_id,
                     method: 'PUT',
                     json: true,
-                    body: {
-                        audience: "for_feed",
-                    }
+                    body: requestBody
                 }, function (error, response) {
                     if (error || (response.status !== 'success')) {
                         print("ERROR changing audience: ", error || response.status);
+                        if (message.isGif) {
+                            Settings.setValue("previousAnimatedSnapSharingDisabled", false);
+                        } else {
+                            Settings.setValue("previousStillSnapSharingDisabled", false);
+                        }
                         return;
                     } else {
-                        print("SUCCESS changing audience!");
+                        print("SUCCESS changing audience" + (message.isAnnouncement ? " and posting announcement!" : "!"));
                     }
                 });
             } else {
@@ -195,8 +212,10 @@ var isInSnapshotReview = false;
 function openSnapApp() {
     var previousStillSnapPath = Settings.getValue("previousStillSnapPath");
     var previousStillSnapStoryID = Settings.getValue("previousStillSnapStoryID");
+    var previousStillSnapSharingDisabled = Settings.getValue("previousStillSnapSharingDisabled");
     var previousAnimatedSnapPath = Settings.getValue("previousAnimatedSnapPath");
     var previousAnimatedSnapStoryID = Settings.getValue("previousAnimatedSnapStoryID");
+    var previousAnimatedSnapSharingDisabled = Settings.getValue("previousAnimatedSnapSharingDisabled");
     snapshotOptions = {
         containsGif: previousAnimatedSnapPath !== "",
         processingGif: false,
@@ -204,10 +223,10 @@ function openSnapApp() {
     }
     imageData = [];
     if (previousAnimatedSnapPath !== "") {
-        imageData.push({ localPath: previousAnimatedSnapPath, story_id: previousAnimatedSnapStoryID });
+        imageData.push({ localPath: previousAnimatedSnapPath, story_id: previousAnimatedSnapStoryID, buttonDisabled: previousAnimatedSnapSharingDisabled });
     }
     if (previousStillSnapPath !== "") {
-        imageData.push({ localPath: previousStillSnapPath, story_id: previousStillSnapStoryID });
+        imageData.push({ localPath: previousStillSnapPath, story_id: previousStillSnapStoryID, buttonDisabled: previousStillSnapSharingDisabled });
     }
     tablet.gotoWebScreen(SNAPSHOT_REVIEW_URL);
     tablet.webEventReceived.connect(onMessage);

From ef2e5f78fff6c01a6badc1319729652acc7b6f3c Mon Sep 17 00:00:00 2001
From: Zach Fox <fox@highfidelity.io>
Date: Mon, 24 Apr 2017 17:41:37 -0700
Subject: [PATCH 17/36] Startings of needsLogin support

---
 scripts/system/snapshot.js | 28 +++++++++++++---------------
 1 file changed, 13 insertions(+), 15 deletions(-)

diff --git a/scripts/system/snapshot.js b/scripts/system/snapshot.js
index 95a76a9188..0ac809f8a7 100644
--- a/scripts/system/snapshot.js
+++ b/scripts/system/snapshot.js
@@ -149,16 +149,16 @@ function onMessage(message) {
                 Settings.setValue("previousStillSnapSharingDisabled", true);
             }
 
-            var requestBody = {
-                audience: "for_feed"
-            }
-
-            if (message.isAnnouncement) {
-                requestBody.action = "announcement";
-            }
-
             if (isLoggedIn) {
                 print('Modifying audience of story ID', message.story_id, "to 'for_feed'");
+                var requestBody = {
+                    audience: "for_feed"
+                }
+
+                if (message.isAnnouncement) {
+                    requestBody.action = "announcement";
+                    print('...Also announcing!');
+                }
                 request({
                     uri: METAVERSE_BASE + '/api/v1/user_stories/' + message.story_id,
                     method: 'PUT',
@@ -178,14 +178,10 @@ function onMessage(message) {
                     }
                 });
             } else {
-                // TODO
-                /*
                 needsLogin = true;
                 shareAfterLogin = true;
                 snapshotToShareAfterLogin = { path: message.data, href: message.href || href };
-                */
             }
-            /*
             if (needsLogin) {
                 if ((HMD.active && Settings.getValue("hmdTabletBecomesToolbar"))
                     || (!HMD.active && Settings.getValue("desktopTabletBecomesToolbar"))) {
@@ -194,7 +190,7 @@ function onMessage(message) {
                     tablet.loadQMLOnTop("../../dialogs/TabletLoginDialog.qml");
                     HMD.openTablet();
                 }
-            }*/
+            }
             break;
         case 'shareButtonClicked':
             print('Twitter or FB "Share" button clicked! Removing ID', message.story_id, 'from storyIDsToMaybeDelete[].');
@@ -265,8 +261,10 @@ function takeSnapshot() {
     }));
     Settings.setValue("previousStillSnapPath", "");
     Settings.setValue("previousStillSnapStoryID", "");
+    Settings.setValue("previousStillSnapSharingDisabled", false);
     Settings.setValue("previousAnimatedSnapPath", "");
     Settings.setValue("previousAnimatedSnapStoryID", "");
+    Settings.setValue("previousAnimatedSnapSharingDisabled", false);
 
     // Raising the desktop for the share dialog at end will interact badly with clearOverlayWhenMoving.
     // Turn it off now, before we start futzing with things (and possibly moving).
@@ -452,7 +450,7 @@ function onTabletScreenChanged(type, url) {
         isInSnapshotReview = false;
     }
 }
-function onConnected() {
+function onUsernameChanged() {
     if (shareAfterLogin && Account.isLoggedIn()) {
         print('Sharing snapshot after login:', snapshotToShareAfterLogin.path);
         Window.shareSnapshot(snapshotToShareAfterLogin.path, snapshotToShareAfterLogin.href);
@@ -464,7 +462,7 @@ button.clicked.connect(openSnapApp);
 buttonConnected = true;
 Window.snapshotShared.connect(snapshotUploaded);
 tablet.screenChanged.connect(onTabletScreenChanged);
-Account.usernameChanged.connect(onConnected);
+Account.usernameChanged.connect(onUsernameChanged);
 Script.scriptEnding.connect(function () {
     if (buttonConnected) {
         button.clicked.disconnect(openSnapApp);

From d7348aabc882e6284c9eeb77b86d00d2444165c7 Mon Sep 17 00:00:00 2001
From: Zach Fox <fox@highfidelity.io>
Date: Tue, 25 Apr 2017 10:10:58 -0700
Subject: [PATCH 18/36] Quick comment updates

---
 scripts/system/html/js/SnapshotReview.js | 6 +++---
 scripts/system/snapshot.js               | 4 ++--
 2 files changed, 5 insertions(+), 5 deletions(-)

diff --git a/scripts/system/html/js/SnapshotReview.js b/scripts/system/html/js/SnapshotReview.js
index 4c5419869d..c3fb20a2f9 100644
--- a/scripts/system/html/js/SnapshotReview.js
+++ b/scripts/system/html/js/SnapshotReview.js
@@ -131,7 +131,7 @@ function createShareOverlay(parentID, isGif, shareURL, hifiShareButtonsDisabled)
     return shareOverlayContainer;
 }
 function selectImageToShare(selectedID) {
-    selectedID = selectedID.id; // Why is this necessary?
+    selectedID = selectedID.id; // `selectedID` is passed as an HTML object to these functions; we just want the ID
     var shareOverlayContainer = document.getElementById(selectedID + "shareOverlayContainer");
     var shareBar = document.getElementById(selectedID + "shareBar");
     var shareOverlayBackground = document.getElementById(selectedID + "shareOverlayBackground");
@@ -153,7 +153,7 @@ function shareForUrl(selectedID) {
     }));
 }
 function shareWithEveryone(selectedID, isGif) {
-    selectedID = selectedID.id; // Why is this necessary?
+    selectedID = selectedID.id; // `selectedID` is passed as an HTML object to these functions; we just want the ID
 
     document.getElementById(selectedID + "shareWithEveryoneButton").setAttribute("disabled", "disabled");
     document.getElementById(selectedID + "inviteConnectionsCheckbox").setAttribute("disabled", "disabled");
@@ -174,7 +174,7 @@ function shareButtonClicked(selectedID) {
     }));
 }
 function cancelSharing(selectedID) {
-    selectedID = selectedID.id; // Why is this necessary?
+    selectedID = selectedID.id; // `selectedID` is passed as an HTML object to these functions; we just want the ID
     var shareOverlayContainer = document.getElementById(selectedID + "shareOverlayContainer");
     var shareBar = document.getElementById(selectedID + "shareBar");
     var shareOverlayBackground = document.getElementById(selectedID + "shareOverlayBackground");
diff --git a/scripts/system/snapshot.js b/scripts/system/snapshot.js
index 0ac809f8a7..fe6ab3f28f 100644
--- a/scripts/system/snapshot.js
+++ b/scripts/system/snapshot.js
@@ -98,7 +98,7 @@ function onMessage(message) {
     var isLoggedIn;
     var needsLogin = false;
     switch (message.action) {
-        case 'ready':  // Send it.
+        case 'ready': // DOM is ready and page has loaded
             tablet.emitScriptEvent(JSON.stringify({
                 type: "snapshot",
                 action: "captureSettings",
@@ -137,7 +137,7 @@ function onMessage(message) {
                 print('Sharing snapshot with audience "for_url":', message.data);
                 Window.shareSnapshot(message.data, message.href || href);
             } else {
-                // TODO?
+                // TODO
             }
             break;
         case 'shareSnapshotWithEveryone':

From d461723012e180b1b84db48292a8951172ebda1c Mon Sep 17 00:00:00 2001
From: Zach Fox <fox@highfidelity.io>
Date: Tue, 25 Apr 2017 11:40:01 -0700
Subject: [PATCH 19/36] Thanks to Jess, slightly different Tweet language

---
 scripts/system/html/js/SnapshotReview.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/scripts/system/html/js/SnapshotReview.js b/scripts/system/html/js/SnapshotReview.js
index c3fb20a2f9..eec08a0e1e 100644
--- a/scripts/system/html/js/SnapshotReview.js
+++ b/scripts/system/html/js/SnapshotReview.js
@@ -122,7 +122,7 @@ function createShareOverlay(parentID, isGif, shareURL, hifiShareButtonsDisabled)
             '</div>' +
             '<div class="externalShareControls">' +
                 '<iframe src="https://www.facebook.com/plugins/share_button.php?href=' + shareURL + '&layout=button_count&size=small&mobile_iframe=false&width=84&height=20&appId" width="84" height="20" style="border:none;overflow:hidden" scrolling="no" frameborder="0" allowTransparency="true"></iframe>' +
-                '<a class="twitter-share-button" href="https://twitter.com/intent/tweet?text=I just took a snapshot in #HiFi!&url=' + shareURL + '&via=highfidelity"></a>' +
+                '<a class="twitter-share-button" href="https://twitter.com/intent/tweet?text=I%20just%20took%20a%20snapshot%20in%20#HiFi!&url=' + shareURL + '&via=highfidelity&hashtags=VR"></a>' +
             '</div>' +
         '</div>';
     shareOverlayContainer.appendChild(shareOverlay);

From 8c9cd0fad0c3b38193493c8a79b5927ae47fbdc6 Mon Sep 17 00:00:00 2001
From: Zach Fox <fox@highfidelity.io>
Date: Tue, 25 Apr 2017 13:56:32 -0700
Subject: [PATCH 20/36] Custom social buttons; better testing functionality

---
 scripts/system/html/SnapshotReview.html    |  18 ------------
 scripts/system/html/css/SnapshotReview.css |  18 ++++++++++--
 scripts/system/html/img/fb_logo.png        | Bin 0 -> 1257 bytes
 scripts/system/html/img/twitter_logo.png   | Bin 0 -> 552 bytes
 scripts/system/html/js/SnapshotReview.js   |  32 +++++++++------------
 5 files changed, 29 insertions(+), 39 deletions(-)
 create mode 100644 scripts/system/html/img/fb_logo.png
 create mode 100644 scripts/system/html/img/twitter_logo.png

diff --git a/scripts/system/html/SnapshotReview.html b/scripts/system/html/SnapshotReview.html
index 400be4abdc..940adddd73 100644
--- a/scripts/system/html/SnapshotReview.html
+++ b/scripts/system/html/SnapshotReview.html
@@ -5,24 +5,6 @@
     <link rel="stylesheet" type="text/css" href="css/SnapshotReview.css">
     <script type="text/javascript" src="js/eventBridgeLoader.js"></script>
     <script type="text/javascript" src="js/SnapshotReview.js"></script>
-    <script>
-        window.twttr = (function (d, s, id) {
-            var js, fjs = d.getElementsByTagName(s)[0],
-              t = window.twttr || {};
-            if (d.getElementById(id)) return t;
-            js = d.createElement(s);
-            js.id = id;
-            js.src = "https://platform.twitter.com/widgets.js";
-            fjs.parentNode.insertBefore(js, fjs);
-
-            t._e = [];
-            t.ready = function (f) {
-                t._e.push(f);
-            };
-
-            return t;
-        }(document, "script", "twitter-wjs"));
-    </script>
 </head>
 
 <body>
diff --git a/scripts/system/html/css/SnapshotReview.css b/scripts/system/html/css/SnapshotReview.css
index 859b4d8c90..0d1bd737e5 100644
--- a/scripts/system/html/css/SnapshotReview.css
+++ b/scripts/system/html/css/SnapshotReview.css
@@ -140,12 +140,26 @@ input[type=button].naked:active {
     width: 40%;
     margin-left: 10%;
 }
-.externalShareControls {
+.buttonShareControls {
     text-align: left;
+    height: 50px;
+    line-height: 50px;
     width: 40%;
     margin-right: 10%;
 }
-.cancelShare {
+.facebookButton {
+    background-image: url(../img/fb_logo.png);
+    width: 29px;
+    height: 29px;
+    display: inline-block;
+    margin-right: 8px;
+}
+.twitterButton {
+    background-image: url(../img/twitter_logo.png);
+    width: 29px;
+    height: 29px;
+    display: inline-block;
+    margin-right: 8px;
 }
 /*
 // END styling of share overlay
diff --git a/scripts/system/html/img/fb_logo.png b/scripts/system/html/img/fb_logo.png
new file mode 100644
index 0000000000000000000000000000000000000000..1de20bacd8fb5719db3291365576d6368a5ff510
GIT binary patch
literal 1257
zcmbVMTWl0n7(QC5q@|jWMiwtH8D1>y?#%4$&dv;bo1NJ$YuM6kx44mqGMzcw9oo4#
zGj*qp1_ML_4>k(n5-tsiiSfl4LTZe`R*D1>$y#dyO^uc(e5f=9v2sbxlwI(l;lY!f
z<mAuyegFUc=RaqEds}Nm-OF_VfQIyDAqxO_&D|?&0RY<$_PhuHSZgQqc86ZDOQHz@
zC+po1NvmQH%tBEfc>8-82B4;><nnetvxSv()hD_bpQ9SUUE!Exh*B@Kk#5+dXc6?*
z*P|$+$Px6-U<S_^JS-}k2Tj;9*p`z9dnHCjV^JjRu#Re|&=wI#?b9sQiJ(imtY)!p
z7(<aIh}|1O9~G6)v?IK3LL}%Ty%J6k2u1mbK#-z{7Q~Meehl|xIOQb*Y>;C8A*8a<
zC=xd10-F_5m0YG=h@eH=HdqWRl}f%6>C?>~j9?hX)$sehrd;q^1DY*5Ud`H2RS=*h
znTla6x`w!lVz=IJM^LnCK{Ya&$HJObX_Ta^m?Ih(;lnXib$u-vw(Kl?QpU1qD>q<3
zEDJ5Y-;`h$7B*DLj%qwTkqb038Fs6w^eCFxC+JeY3N<?|L{LXHe6k|5c#y^kA{4+w
zew?BSg2ri*=LwR=c|R9SCaN0CaTB2wPLe5(qX>#1l72do<Pv<6Bx!+9kPKesrZvkJ
zH3?SpDvDg?GEe2Qya`2HH*>n)SDk?NqHgO}Q8y62gF;@<h?1hYfhPBY9{ClZsk{T_
zl&P!8QioY(nF=^Q#3fQ3L(&!JJP}}MF2&FUm*Ds$TH(t7r)yXg31jYf{AXOMp{$T{
zkB^5xiadEfP?IC5iN>OxAIXydJhLV(a5-nH`|JzDKU^9cYk%%SL;T8keAC>Dovm2?
z<oR{AQ#I?3Mz+MKFU7mcE6*G{e)X_P605+D(+7TLu6v&SHQ;&G+vsWhWQFJ2^}Oes
z#f2Z|W^Ql&pgi3<`DHH29X);S+A%KM7@V=pFLo2Zymxv0yNl)RGZ&GTvGm8$12+N_
ztw-egrn{e=`zl<w>*1frSCL1C3k&nJYi8fw*!=Cj^TVTe!(4sS$f09vJMZ5g`mMPB
z)0@99?y9}F{f&crZ8^C*JwLkmKr;4sU6}j(R_xwCcYeA(<audgdgA$^SUJ|VKKw8~
zaAHchGXBcGoAY}%{`KKo?9M;RBX^ol&OWF+bN1xb!y|iI)S4Ts*@cDX$y3|j2Q>h_
W+`9J^=-T9dKIvqe@Ofg#?tcLbL$|sB

literal 0
HcmV?d00001

diff --git a/scripts/system/html/img/twitter_logo.png b/scripts/system/html/img/twitter_logo.png
new file mode 100644
index 0000000000000000000000000000000000000000..59fd027c2a59cffb4c4f353dbc0ddce2cc3e92d4
GIT binary patch
literal 552
zcmV+@0@wYCP)<h;3K|Lk000e1NJLTq0012T0012b0ssI2+41mL00009a7bBm001QE
z001QE0Z=68_y7O_+DSw~R7i<qlwJ6Vfd+ty7KV<RJ7mpe!4%?VW&Ha4KUURZoQ$Q0
z?DkSD3=9nWpZ@7S|MT<j|1L5t+aLY;hpGdMxlLy5=U)F^dh0iuI6oWXIu9;6UZ@u%
zRasqSS=gBwCS3f*&dm7z4~oH9!a+lTsm+3;)R3J8RWebN6>ca5h;T6e`N!ZW%_7Fh
zh-L^Db6<Y{&&a@#tIM|4o7+v6g&C&BNQ4<v@$Y{OO=o^Q{QM7197{MXyY<^ehJ}HF
zK~s=vjw9#G@Ba@y`*Z#MKQT@$j=1su?~V89hGI8YnV;$OtG}jVP}hlbGKMO%Vk(1x
zcR#VmFcv3h2{OSAB?xYQz~Wf!=1#rx>)RjfuD}F`pZz7)+*=?1MeO>1_Vr(aX5V=K
z@A6xs&1GO<5aVQ2;b%fmI~ZW%B^;rP%iP^h{_K772fv|vpZwYO5T_dK=KlZBP<Z4=
z^8W7!o?_Q|`{TdDqd)Kj6wY!-ikneah}i^N!Z`ctZ}`q{A8>{N0|RFI72{;g)@5^-
zWs&5@629+${-1W`*WByB{$NjC2*8N7-ZT_pc9Uh%6JeI*Vq|7y`0(@p?T`PCJpa4v
q@gE|SAa-*p2ScsC7&Vu+<^lkzl%{SoyW=zf0000<MNUMnLSTZ3BNPSz

literal 0
HcmV?d00001

diff --git a/scripts/system/html/js/SnapshotReview.js b/scripts/system/html/js/SnapshotReview.js
index eec08a0e1e..451767d93d 100644
--- a/scripts/system/html/js/SnapshotReview.js
+++ b/scripts/system/html/js/SnapshotReview.js
@@ -18,7 +18,6 @@ function clearImages() {
     while (snapshotImagesDiv.hasChildNodes()) {
         snapshotImagesDiv.removeChild(snapshotImagesDiv.lastChild);
     }
-    twttr.events.unbind('click');
     paths = [];
     imageCount = 0;
     idCounter = 0;
@@ -57,9 +56,6 @@ function appendShareBar(divID, story_id, isGif, hifiShareButtonsDisabled) {
     var parentDiv = document.getElementById(divID);
     parentDiv.setAttribute('data-story-id', story_id);
     document.getElementById(divID).appendChild(createShareOverlay(divID, isGif, story_url, hifiShareButtonsDisabled));
-    twttr.events.bind('click', function (event) {
-        shareButtonClicked(divID);
-    });
 }
 function createShareOverlay(parentID, isGif, shareURL, hifiShareButtonsDisabled) {
     var shareOverlayContainer = document.createElement("DIV");
@@ -111,6 +107,8 @@ function createShareOverlay(parentID, isGif, shareURL, hifiShareButtonsDisabled)
     shareOverlay.style.zIndex = "2";
     var shareWithEveryoneButtonID = parentID + "shareWithEveryoneButton";
     var inviteConnectionsCheckboxID = parentID + "inviteConnectionsCheckbox";
+    var facebookButtonID = parentID + "facebookButton";
+    var twitterButtonID = parentID + "twitterButton";
     shareOverlay.innerHTML = '<label class="shareOverlayLabel">SHARE</label>' +
         '<br/>' +
         '<div class="shareControls">' +
@@ -118,15 +116,14 @@ function createShareOverlay(parentID, isGif, shareURL, hifiShareButtonsDisabled)
                 '<input type="button"' + (hifiShareButtonsDisabled ? ' disabled="disabled"' : '') + ' class="shareWithEveryone" id="' + shareWithEveryoneButtonID + '" value="SHARE WITH EVERYONE" onclick="shareWithEveryone(' + parentID + ', ' + isGif + ')" /><br>' +
                 '<input type="checkbox"' + (hifiShareButtonsDisabled ? ' disabled="disabled"' : '') + ' class="inviteConnections" id="' + inviteConnectionsCheckboxID + '" checked="checked" />' +
                 '<label class="shareButtonLabel" for="' + inviteConnectionsCheckboxID + '">Invite My Connections</label><br>' +
-                '<input type="button" class="cancelShare" value="CANCEL" onclick="cancelSharing(' + parentID + ')" />' +
+                '<input type="button" value="CANCEL" onclick="cancelSharing(' + parentID + ')" />' +
             '</div>' +
-            '<div class="externalShareControls">' +
-                '<iframe src="https://www.facebook.com/plugins/share_button.php?href=' + shareURL + '&layout=button_count&size=small&mobile_iframe=false&width=84&height=20&appId" width="84" height="20" style="border:none;overflow:hidden" scrolling="no" frameborder="0" allowTransparency="true"></iframe>' +
-                '<a class="twitter-share-button" href="https://twitter.com/intent/tweet?text=I%20just%20took%20a%20snapshot%20in%20#HiFi!&url=' + shareURL + '&via=highfidelity&hashtags=VR"></a>' +
+            '<div class="buttonShareControls">' +
+                '<a class="facebookButton" id="' + facebookButtonID + '" onClick="shareButtonClicked(' + parentID + ')" target="_blank" href="https://www.facebook.com/dialog/feed?app_id=1585088821786423&link=' + shareURL + '"></a>' +
+                '<a class="twitterButton" id="' + twitterButtonID + '" onClick="shareButtonClicked(' + parentID + ')" target="_blank" href="https://twitter.com/intent/tweet?text=I%20just%20took%20a%20snapshot!&url=' + shareURL + '&via=highfidelity&hashtags=VR,HiFi"></a>' +
             '</div>' +
         '</div>';
     shareOverlayContainer.appendChild(shareOverlay);
-    twttr.widgets.load(shareOverlay);
 
     return shareOverlayContainer;
 }
@@ -167,6 +164,7 @@ function shareWithEveryone(selectedID, isGif) {
     }));
 }
 function shareButtonClicked(selectedID) {
+    selectedID = selectedID.id; // `selectedID` is passed as an HTML object to these functions; we just want the ID
     EventBridge.emitWebEvent(JSON.stringify({
         type: "snapshot",
         action: "shareButtonClicked",
@@ -209,16 +207,6 @@ function handleCaptureSetting(setting) {
 
 }
 window.onload = function () {
-    // TESTING FUNCTIONS START
-    // Uncomment and modify the lines below to test SnapshotReview in a browser.
-    //imageCount = 1;
-    //addImage({ localPath: 'C:/Users/Zach Fox/Desktop/hifi-snap-by-zfox-on-2017-04-20_14-59-12.gif' });
-    //addImage({ localPath: 'C:/Users/Zach Fox/Desktop/hifi-snap-by-zfox-on-2017-04-24_10-49-20.jpg' });
-    //document.getElementById('p0').appendChild(createShareOverlay('p0', false, ''));
-    //addImage({ localPath: 'http://lorempixel.com/553/255' });
-    //addImage({localPath: 'c:/Users/howar/OneDrive/Pictures/hifi-snap-by--on-2016-07-27_12-58-43.jpg'});
-    // TESTING FUNCTIONS END
-
     openEventBridge(function () {
         // Set up a handler for receiving the data, and tell the .js we are ready to receive it.
         EventBridge.scriptEventReceived.connect(function (message) {
@@ -301,3 +289,9 @@ function takeSnapshot() {
         action: "takeSnapshot"
     }));
 }
+
+function testInBrowser() {
+    imageCount = 1;
+    //addImage({ localPath: 'http://lorempixel.com/553/255' });
+    addImage({ localPath: 'C:/Users/Zach Fox/Desktop/hifi-snap-by-zfox-on-2017-04-25_11-35-13.jpg' }, false, true, true, false);   
+}

From 92187e2424b952952f018fa27576e29fa5bee40e Mon Sep 17 00:00:00 2001
From: Zach Fox <fox@highfidelity.io>
Date: Wed, 26 Apr 2017 12:08:22 -0700
Subject: [PATCH 21/36] Making progress towards file chooser dialog

---
 scripts/system/html/SnapshotReview.html    |   4 +-
 scripts/system/html/css/SnapshotReview.css |  60 ++++++++++++++++-----
 scripts/system/html/img/snapshotIcon.png   | Bin 0 -> 16358 bytes
 scripts/system/html/js/SnapshotReview.js   |  44 ++++++++++++---
 scripts/system/snapshot.js                 |  32 ++++++++---
 5 files changed, 110 insertions(+), 30 deletions(-)
 create mode 100644 scripts/system/html/img/snapshotIcon.png

diff --git a/scripts/system/html/SnapshotReview.html b/scripts/system/html/SnapshotReview.html
index 940adddd73..9469a9d313 100644
--- a/scripts/system/html/SnapshotReview.html
+++ b/scripts/system/html/SnapshotReview.html
@@ -27,8 +27,8 @@
                 <input type="radio" name="cameraCaptures" id="stillOnly" value="stillOnly" /><label for="stillOnly"><span><span></span></span>Still Only</label>
             </form>
         </div>
-        <div id="snap-button" onclick="takeSnapshot()">
-        </div>
+        <input type="button" id="snap-button" onclick="takeSnapshot()" />
+        <div id="snap-settings-right"></div>
     </div>
 </body>
 </html>
diff --git a/scripts/system/html/css/SnapshotReview.css b/scripts/system/html/css/SnapshotReview.css
index 0d1bd737e5..9db7e35b9f 100644
--- a/scripts/system/html/css/SnapshotReview.css
+++ b/scripts/system/html/css/SnapshotReview.css
@@ -8,12 +8,6 @@
 //  See the accompanying file LICENSE or http://www.apache.org/licenses/LICENSE-2.0.html
 */
 
-body {
-    padding: 0;
-    margin: 0;
-    overflow: hidden;
-}
-
 /*
 // START styling of top bar and its contents
 */
@@ -60,6 +54,17 @@ input[type=button].naked:active {
 // END styling of top bar and its contents
 */
 
+/*
+// START styling of snapshot instructions panel
+*/
+.snapshotInstructions {
+    font-family: Raleway-Regular;
+    margin: 0 20px;
+}
+/*
+// END styling of snapshot instructions panel
+*/
+
 /*
 // START styling of snapshot pane and its contents
 */
@@ -172,17 +177,18 @@ input[type=button].naked:active {
 // START styling of snapshot controls (bottom panel) and its contents
 */
 #snapshot-controls {
-    padding-left: 8px;
-    padding-right: 8px;
     width: 100%;
     position: absolute;
     left: 0;
     margin-top: 8px;
     overflow: hidden;
+    display: flex;
+    justify-content: center;
 }
 #snap-settings {
-    float: left;
-    margin-left: 10px;
+    display: inline;
+    width: 150px;
+    margin: auto;
 }
 #snap-settings form input {
     margin-bottom: 5px;
@@ -191,18 +197,28 @@ input[type=button].naked:active {
 #snap-button {
     width: 65px;
     height: 65px;
+    padding: 0;
     border-radius: 50%;
     background: #EA4C5F;
     border: 3px solid white;
-    margin-left: auto;
-    margin-right: auto;
+    margin: auto;
+    box-sizing: content-box;
+    display: inline;
 }
-#snap-button:hover {
+#snap-button:disabled {
+    background: gray;
+}
+#snap-button:hover:enabled {
     background: #C62147;
 }
-#snap-button:active {
+#snap-button:active:enabled {
     background: #EA4C5F;
 }
+#snap-settings-right {
+    display: inline;
+    width: 150px;
+    margin: auto;
+}
 /*
 // END styling of snapshot controls (bottom panel) and its contents
 */
@@ -210,6 +226,22 @@ input[type=button].naked:active {
 /*
 // START misc styling
 */
+body {
+    padding: 0;
+    margin: 0;
+    overflow: hidden;
+}
+p {
+    margin: 2px 0;
+}
+h4 {
+    margin: 14px 0 0 0;
+}
+.centeredImage {
+    margin: 0 auto;
+    display: block;
+}
+
 .prompt {
     font-family: Raleway-SemiBold;
     font-size: 14px;
diff --git a/scripts/system/html/img/snapshotIcon.png b/scripts/system/html/img/snapshotIcon.png
new file mode 100644
index 0000000000000000000000000000000000000000..5cb2742a32bf362a6cf1e230e9ebad1ac8feffba
GIT binary patch
literal 16358
zcmeI3X;>529>yn76mUTV1Qj&~H^h)hAcTxz51SIi2m&I=FqwoAk_pKGVTbCiQmED{
z6_p~bC>2-S6_;ogyHHWE(t2G`^ja-eDpstw$bG^Z5WLQZew+7sk`L#9-uImIn{(#m
zOY%d4{l}P2G6eu&OkjXe3;=+q?qfUx0Dwv?=?(w@Cdz<FH2{pV(0ypY))E^4;Fn^d
z5k!P22tshVBP_w=P)Chi3Fsv7&?sRf0VU{hs0>rMF`iYQW6&{)8zY=60!2z6G#(2`
zSD{PNgF}(@1cWbPc(|JiG>}HFl%oVp*T@qUYDnY8=*oo@YDm}2V$i#~5D9J!FWrFj
z2vG>#2UnqVuA>VRVLQ3fd3;AUm+#7Po=4|^Y!?>DXR)1`AR7Yt5Xh$Yh~aKZr_%*0
zi4+nG{d$H|Nu+L!c!E$uELLi2s$;5?Bd(IM*nB>p1#(y%4pSwOGSz7c0@g4UYP;@`
z-W(ySMpT%Rz;Fd!mkY<?$%Gq&p&O`AJ?oMy`vy{|d)OhkoTY)4EVd)a8pb3Nz1t?2
z59w4BVzhr{Lk_48O;e&QF{;LsRR}6ZrFKJ2K~4Ck5bvJCz#!igR6z_GB|-Xfl*y{Z
zF3=K$g(jkMR6(d&Y)AHxYf;AI1g?(9hXL4E9u^~kNrz#fs|;&HHP|pVU8URBwWqoz
z(8!gLj|zneTosDriSFIoHKcd;bRQqx_T<s$gkuT`o~pJNum)TDH%@;VDufBtUFT$i
z&P<L=D4PvAb0E-}3GyHi)C=kEIVeMfOE78LP#I1T=%k;a*K=?NO287BfZr=czwf{t
zkq8P@s0mnspn*bnja=!7VG@YL<*{A3To<M@80X4FU}uo&>H>3^aj>&17i6<tr97vu
zMGmyT6)nV(WZg#UiI!jz$PZ-mTwVQqIUFAzo9)Z<=JWVozI>4H=k4nw^yT!%>RI28
zMO9b|D)Cd{@~$(kgjH%(cXZqsy=O;%7wBFMU55|C-d<|Ye7uLB&s*01`Sd4ChFz)8
z|4Y`h_9ypY=wGUSRU_A-U!=lhm;z4JW2Jk7WH1jAp*M-{VFEBUfveK=3cWAeC1}#X
z*4{!Q_MQ)>TY|1v8U!P{*S5PFPC+FC)_}JDN%g76G{iG~zwO(duV){AjMR8kG5EOa
zAJy)tu3p23sBtNg3ad~r8LA-O=S|d|I?y(JJQ5EpWT?cQ)l06oVX#HO(%p-R*uX+}
z>%a%vy9wXk00IdDNpY1NCfqSOEJImJg-pQeZ|oma(03O=K6oOo65$fm-AT}YMd&r_
zxpcRHZgZjv0`A%rY(dw}FraO4{|MdbPfYIW&*Oj~2(s9^?;fjud9XF|-B$hbU~9iK
zOo0*ZoSxAJHS4)_S5^0_mndNbb$8)%ow$Oo8%)1>up<Q1potMeOpYqlx?|$v+~XNs
z7}6LyoKdgPW9;4vdOxJP3f-+@p`W{{fYtXCvDfp@s((fQpr}DeiNZxn6fRPtaFG&)
zi<Br_q(tE&B?=cQQMgEn!bM6HE>fa!krIWAlqg)JMBySO3KuC+xJZe@MM@MdQlfB?
z5`~MDC|smO;UXmp7b#J=NQuHlN)#?qqHvKCg^QFZT%<(dA|(nJDN(pciNZxn6fRPt
zaFG&)i<Br_q(tE&rFY^o?f=sys*t!bQW+lZwT*T2005vP0b&sVq|XF^+*JVZS0@1E
zJ_dkf5CERU0svGD0M__tD=zr~fYF6Op;xHpX3I8td}Em9WsfUc7Uj3WV~>h|C^0`t
zjNf`>S$=+b{#T2e3f6k2Z}f)oz2J<!TgD%v*KdAleCD9|5FEKo$k<i2Wltvkdr<@G
zz&+kjaK$5g>a)&vO$VOPX=weXJ@uJed&ZT{H@~}?wKw_;fBi9ZSy@_*!EuA*zdozd
zf=!d;=Zs5e**EHqGb_$z>@|=Yw&hjl+I!wz-8?@R&#TLmYiEZWN~YBv(0-ytv_4u<
zY1JFx^q9mE*)M9sgqfQbnE%4~*A6BmleR>LYk?-Crrm3^{d2RlUS%fnM!|+T*nd4^
zKL{BcG(urmnYYdE)eYL7yte2ngQ?>-G*9oW&o)o<6IOC+7w;6jTvMxFURA!;j(PCU
z>A80-HY{6oVCli@bDw2~h8r8bu-@=R8qhLs!^CheWt8;S<&HOZ+Z_1V!0+RLjYz$V
zdE`>yygYK3I%=hOZ;Tb_Eev*@l`w9@wP<?g{=%iBKM$TGWtq;g+916=W80|^Wt0oQ
zmFw`b*7WD6v1d<BHrej5XNqg8EKK`)DkHOa{Edn*&wZ;Rvv?ES!=Fq!k+5;uhcj31
zE;1_3GP(7O&*@udw6&fc^FZ5APh7b=BG$Jo+uX*aWFbvj2?aKu0v@RAbAvl9#+EA!
z)&La-zq@GtVo}>AnnJ{c8F<n*%Qe8-_d&j;nw8W#$wFrK^U4uVzl**6-}1%wU<+Gt
z%+J2;0y}BharJ(gQIP2IuBb}mm-cM@;>KNX%$2VDc08W1*%(&~7fnA<m|~H*c)P&A
z;ivUxJ1$M4ZT(<$eaMZOZeIHfXwOSZp;dOTrx?At3dXD`i$>OL%lqilq@T3BymSZf
z`=cf|ig(uAAo=@5Rhy!GAB352nayYxO4hF3l>aSZ9_h%a7Pl_9%sYJT#et-!w8^51
zF!P|<<-n<6qjlnz4#x8=gR}m2ul8{|c&99t;JyFwSYNibStw$6GM*;|-Fd{g52QE=
z;;ljykZl1?nPPD7(MPQlXEMI=zS(}cDQAIjgkO`Jv}V)DMR}OC`PGGH#}y-6z&ZsG
zW0-9a9FGB?Lp61a_kgAgEvGs(94Yy6y<glaLfddHd4lGqpxS?Z#Y3%z8$QyoedVp3
zg2#7FPq)wtiZE3OtyzQ|o^5nm@nlC{^rYZA|MdoS^Or7OdWiFh+1#=V&TsAq(*7OP
zajCeu)Tua_wnBC>4y`nv8~Zi#Sh{m8;``EYY7m%Rwfk9HD>MR&522+5mbRDW-pzA4
z{Pz#z3y+_?)G+anl2pmj{jEls;+&4gRkQH%on^Pr*Uc|ljm@?jQ=b9wp&cjBpSa%i
ztw8o85>v%cnZ`SPf|gne8m>3i*fttxN=tu|T#Q3kj+)z4-hAS@*ZOU*=WC<bE_Fs@
zk*@`I6C4`8D>GQPwI;vR5*&5n8$pJR#=b7Q)k<02TpRO<_JeRuM#o*NEwdUT9wu#1
zv$m0y?h`N3tUDHcbq`o=+Z<jgKJ;19ZhITEfacM+H)|)}EamJy26`33o)ctWTe(U~
ziWaP&UU~A=?&$5YwWduS#aRpOT0<*?_)s}#g>>Z4hz!11-Z9?s{G_9!w;Rn`{UQp;
ztUQ^2;=0M-Q|ixxcg-gkn%pSfQIVhX?9Ycg>?fY7IkVFG?@HN=8Oe(;?|i^@xF0bl
z{dB5fb#(rQ32mjJ{-?wJ%QHeE?(e$!LT)mu;2iuUf#H1a$m9n!kE<JJP1|Qubj>GD
zvUP3d9L7^d{dC4=(-4Swlru9S?qZSc?aG=3x7r>2zu_Kgh|JA7W7aykRVF;=w!HLO
zwuNR!qS341bt!1z7q-4am*PC@xSF==g%iIjUUlS4jn{>HIh$77OenD3FV8X?clOS`
zk67PNF0_yNY;Md(hnP+CVv3kCpF75EUbOs4`fnpGI;$5+Kb|JC^4Rv<!)d{<mwJAh
z{;=ZkU*G=u2N6kc&hT<O_F;}7dX5nh^;!n-Iy8IF-ac5M`zL;&Z?JH`ckGA%1Fl2E
AX8-^I

literal 0
HcmV?d00001

diff --git a/scripts/system/html/js/SnapshotReview.js b/scripts/system/html/js/SnapshotReview.js
index 451767d93d..9ee45281ac 100644
--- a/scripts/system/html/js/SnapshotReview.js
+++ b/scripts/system/html/js/SnapshotReview.js
@@ -13,8 +13,28 @@
 var paths = [];
 var idCounter = 0;
 var imageCount = 0;
-function clearImages() {
+function showSetupInstructions() {
     var snapshotImagesDiv = document.getElementById("snapshot-images");
+    snapshotImagesDiv.className = "snapshotInstructions";
+    snapshotImagesDiv.innerHTML = '<img class="centeredImage" src="./img/snapshotIcon.png" alt="Snapshot Instructions" width="64" height="64"/>' +
+    '<br/>' +
+    '<p>This app lets you take and share snaps and GIFs with your connections in High Fidelity.</p>' +
+    "<h4>Setup Instructions</h4>" +
+    "<p>Before you can begin taking snaps, please choose where you'd like to save snaps on your computer:</p>" +
+    '<br/>' +
+    '<input type="button" value="CHOOSE" onclick="chooseSnapshotLocation()" />';
+    document.getElementById("snap-button").disabled = true;
+}
+function chooseSnapshotLocation() {
+    EventBridge.emitWebEvent(JSON.stringify({
+        type: "snapshot",
+        action: "chooseSnapshotLocation"
+    }));
+}
+function clearImages() {
+    document.getElementById("snap-button").disabled = false;
+    var snapshotImagesDiv = document.getElementById("snapshot-images");
+    snapshotImagesDiv.classList.remove("snapshotInstructions");
     while (snapshotImagesDiv.hasChildNodes()) {
         snapshotImagesDiv.removeChild(snapshotImagesDiv.lastChild);
     }
@@ -207,6 +227,7 @@ function handleCaptureSetting(setting) {
 
 }
 window.onload = function () {
+    testInBrowser(false);
     openEventBridge(function () {
         // Set up a handler for receiving the data, and tell the .js we are ready to receive it.
         EventBridge.scriptEventReceived.connect(function (message) {
@@ -218,6 +239,12 @@ window.onload = function () {
             }
             
             switch (message.action) {
+                case 'showSetupInstructions':
+                    showSetupInstructions();
+                    break;
+                case 'snapshotLocationChosen':
+                    clearImages();
+                    break;
                 case 'clearPreviousImages':
                     clearImages();
                     break;
@@ -274,8 +301,7 @@ window.onload = function () {
             type: "snapshot",
             action: "ready"
         }));
-    });
-
+    });;
 };
 function snapshotSettings() {
     EventBridge.emitWebEvent(JSON.stringify({
@@ -290,8 +316,12 @@ function takeSnapshot() {
     }));
 }
 
-function testInBrowser() {
-    imageCount = 1;
-    //addImage({ localPath: 'http://lorempixel.com/553/255' });
-    addImage({ localPath: 'C:/Users/Zach Fox/Desktop/hifi-snap-by-zfox-on-2017-04-25_11-35-13.jpg' }, false, true, true, false);   
+function testInBrowser(isTestingSetupInstructions) {
+    if (isTestingSetupInstructions) {
+        showSetupInstructions();
+    } else {
+        imageCount = 1;
+        //addImage({ localPath: 'http://lorempixel.com/553/255' });
+        addImage({ localPath: 'C:/Users/valef/Desktop/hifi-snap-by-zfox-on-2017-04-26_10-26-53.jpg' }, false, true, true, false);
+    }
 }
diff --git a/scripts/system/snapshot.js b/scripts/system/snapshot.js
index fe6ab3f28f..1f685924f6 100644
--- a/scripts/system/snapshot.js
+++ b/scripts/system/snapshot.js
@@ -104,13 +104,31 @@ function onMessage(message) {
                 action: "captureSettings",
                 setting: Settings.getValue("alsoTakeAnimatedSnapshot", true)
             }));
-            tablet.emitScriptEvent(JSON.stringify({
-                type: "snapshot",
-                action: "showPreviousImages",
-                options: snapshotOptions,
-                image_data: imageData,
-                canShare: !!isDomainOpen(Settings.getValue("previousSnapshotDomainID"))
-            }));
+            if (Settings.getValue("snapshotsLocation", "") !== "") {
+                tablet.emitScriptEvent(JSON.stringify({
+                    type: "snapshot",
+                    action: "showPreviousImages",
+                    options: snapshotOptions,
+                    image_data: imageData,
+                    canShare: !!isDomainOpen(Settings.getValue("previousSnapshotDomainID"))
+                }));
+            } else {
+                tablet.emitScriptEvent(JSON.stringify({
+                    type: "snapshot",
+                    action: "showSetupInstructions"
+                }));
+            }
+            break;
+        case 'chooseSnapshotLocation':
+            var snapshotPath = Window.browse("Choose Snapshots Directory","","");
+
+            if (!snapshotPath.isEmpty()) { // not cancelled
+                Settings.setValue("snapshotsLocation", snapshotPath);
+                tablet.emitScriptEvent(JSON.stringify({
+                    type: "snapshot",
+                    action: "snapshotLocationChosen"
+                }));
+            }
             break;
         case 'openSettings':
             if ((HMD.active && Settings.getValue("hmdTabletBecomesToolbar"))

From 322121428398fb926658c73ba2c1571471a11699 Mon Sep 17 00:00:00 2001
From: Zach Fox <fox@highfidelity.io>
Date: Wed, 26 Apr 2017 12:38:38 -0700
Subject: [PATCH 22/36] New Snap FTUE flow

---
 .../scripting/WindowScriptingInterface.cpp    | 22 +++++++++++++++++++
 .../src/scripting/WindowScriptingInterface.h  |  1 +
 scripts/system/html/css/SnapshotReview.css    |  1 +
 scripts/system/html/js/SnapshotReview.js      |  9 ++++++++
 scripts/system/snapshot.js                    | 10 +++++++--
 5 files changed, 41 insertions(+), 2 deletions(-)

diff --git a/interface/src/scripting/WindowScriptingInterface.cpp b/interface/src/scripting/WindowScriptingInterface.cpp
index 2df825d643..1e14c24da3 100644
--- a/interface/src/scripting/WindowScriptingInterface.cpp
+++ b/interface/src/scripting/WindowScriptingInterface.cpp
@@ -168,6 +168,28 @@ void WindowScriptingInterface::ensureReticleVisible() const {
     }
 }
 
+/// Display a "browse to directory" dialog.  If `directory` is an invalid file or directory the browser will start at the current
+/// working directory.
+/// \param const QString& title title of the window
+/// \param const QString& directory directory to start the file browser at
+/// \param const QString& nameFilter filter to filter filenames by - see `QFileDialog`
+/// \return QScriptValue file path as a string if one was selected, otherwise `QScriptValue::NullValue`
+QScriptValue WindowScriptingInterface::browseDir(const QString& title, const QString& directory) {
+    ensureReticleVisible();
+    QString path = directory;
+    if (path.isEmpty()) {
+        path = getPreviousBrowseLocation();
+    }
+#ifndef Q_OS_WIN
+    path = fixupPathForMac(directory);
+#endif
+    QString result = OffscreenUi::getExistingDirectory(nullptr, title, path);
+    if (!result.isEmpty()) {
+        setPreviousBrowseLocation(QFileInfo(result).absolutePath());
+    }
+    return result.isEmpty() ? QScriptValue::NullValue : QScriptValue(result);
+}
+
 /// Display an open file dialog.  If `directory` is an invalid file or directory the browser will start at the current
 /// working directory.
 /// \param const QString& title title of the window
diff --git a/interface/src/scripting/WindowScriptingInterface.h b/interface/src/scripting/WindowScriptingInterface.h
index 7641110972..2b1e48d918 100644
--- a/interface/src/scripting/WindowScriptingInterface.h
+++ b/interface/src/scripting/WindowScriptingInterface.h
@@ -51,6 +51,7 @@ public slots:
     QScriptValue confirm(const QString& message = "");
     QScriptValue prompt(const QString& message = "", const QString& defaultText = "");
     CustomPromptResult customPrompt(const QVariant& config);
+    QScriptValue browseDir(const QString& title = "", const QString& directory = "");
     QScriptValue browse(const QString& title = "", const QString& directory = "",  const QString& nameFilter = "");
     QScriptValue save(const QString& title = "", const QString& directory = "",  const QString& nameFilter = "");
     QScriptValue browseAssets(const QString& title = "", const QString& directory = "", const QString& nameFilter = "");
diff --git a/scripts/system/html/css/SnapshotReview.css b/scripts/system/html/css/SnapshotReview.css
index 9db7e35b9f..ef737870e0 100644
--- a/scripts/system/html/css/SnapshotReview.css
+++ b/scripts/system/html/css/SnapshotReview.css
@@ -204,6 +204,7 @@ input[type=button].naked:active {
     margin: auto;
     box-sizing: content-box;
     display: inline;
+    outline:none;
 }
 #snap-button:disabled {
     background: gray;
diff --git a/scripts/system/html/js/SnapshotReview.js b/scripts/system/html/js/SnapshotReview.js
index 9ee45281ac..418e623aa8 100644
--- a/scripts/system/html/js/SnapshotReview.js
+++ b/scripts/system/html/js/SnapshotReview.js
@@ -25,6 +25,14 @@ function showSetupInstructions() {
     '<input type="button" value="CHOOSE" onclick="chooseSnapshotLocation()" />';
     document.getElementById("snap-button").disabled = true;
 }
+function showSetupComplete() {
+    var snapshotImagesDiv = document.getElementById("snapshot-images");
+    snapshotImagesDiv.className = "snapshotInstructions";
+    snapshotImagesDiv.innerHTML = '<img class="centeredImage" src="./img/snapshotIcon.png" alt="Snapshot Instructions" width="64" height="64"/>' +
+    '<br/>' +
+    "<h4>You're all set!</h4>" +
+    '<p>Try taking a snapshot by pressing the button below.</p>';
+}
 function chooseSnapshotLocation() {
     EventBridge.emitWebEvent(JSON.stringify({
         type: "snapshot",
@@ -244,6 +252,7 @@ window.onload = function () {
                     break;
                 case 'snapshotLocationChosen':
                     clearImages();
+                    showSetupComplete();
                     break;
                 case 'clearPreviousImages':
                     clearImages();
diff --git a/scripts/system/snapshot.js b/scripts/system/snapshot.js
index 1f685924f6..88014d5c50 100644
--- a/scripts/system/snapshot.js
+++ b/scripts/system/snapshot.js
@@ -117,12 +117,18 @@ function onMessage(message) {
                     type: "snapshot",
                     action: "showSetupInstructions"
                 }));
+                Settings.setValue("previousStillSnapPath", "");
+                Settings.setValue("previousStillSnapStoryID", "");
+                Settings.setValue("previousStillSnapSharingDisabled", false);
+                Settings.setValue("previousAnimatedSnapPath", "");
+                Settings.setValue("previousAnimatedSnapStoryID", "");
+                Settings.setValue("previousAnimatedSnapSharingDisabled", false);
             }
             break;
         case 'chooseSnapshotLocation':
-            var snapshotPath = Window.browse("Choose Snapshots Directory","","");
+            var snapshotPath = Window.browseDir("Choose Snapshots Directory", "", "");
 
-            if (!snapshotPath.isEmpty()) { // not cancelled
+            if (snapshotPath) { // not cancelled
                 Settings.setValue("snapshotsLocation", snapshotPath);
                 tablet.emitScriptEvent(JSON.stringify({
                     type: "snapshot",

From 6711e8cbc2cdf3217ef3ae4d0250daa3eabc9be8 Mon Sep 17 00:00:00 2001
From: Zach Fox <fox@highfidelity.io>
Date: Wed, 26 Apr 2017 13:01:02 -0700
Subject: [PATCH 23/36] Remove duplicate setting; Make settings page open;
 button state

---
 interface/src/ui/PreferencesDialog.cpp |  5 --
 scripts/system/snapshot.js             | 64 ++++++++++++++------------
 2 files changed, 35 insertions(+), 34 deletions(-)

diff --git a/interface/src/ui/PreferencesDialog.cpp b/interface/src/ui/PreferencesDialog.cpp
index a12d9020ae..617ac1ed1c 100644
--- a/interface/src/ui/PreferencesDialog.cpp
+++ b/interface/src/ui/PreferencesDialog.cpp
@@ -116,11 +116,6 @@ void setupPreferences() {
         auto preference = new BrowsePreference(SNAPSHOTS, "Put my snapshots here", getter, setter);
         preferences->addPreference(preference);
     }
-    {
-        auto getter = []()->bool { return SnapshotAnimated::alsoTakeAnimatedSnapshot.get(); };
-        auto setter = [](bool value) { SnapshotAnimated::alsoTakeAnimatedSnapshot.set(value); };
-        preferences->addPreference(new CheckPreference(SNAPSHOTS, "Take Animated GIF Snapshot", getter, setter));
-    }
     {
         auto getter = []()->float { return SnapshotAnimated::snapshotAnimatedDuration.get(); };
         auto setter = [](float value) { SnapshotAnimated::snapshotAnimatedDuration.set(value); };
diff --git a/scripts/system/snapshot.js b/scripts/system/snapshot.js
index 88014d5c50..4cb1232a58 100644
--- a/scripts/system/snapshot.js
+++ b/scripts/system/snapshot.js
@@ -24,6 +24,7 @@ var buttonConnected = false;
 var tablet = Tablet.getTablet("com.highfidelity.interface.tablet.system");
 var button = tablet.addButton({
     icon: "icons/tablet-icons/snap-i.svg",
+    activeIcon: "icons/tablet-icons/snap-a.svg",
     text: buttonName,
     sortOrder: 5
 });
@@ -137,8 +138,7 @@ function onMessage(message) {
             }
             break;
         case 'openSettings':
-            if ((HMD.active && Settings.getValue("hmdTabletBecomesToolbar"))
-                    || (!HMD.active && Settings.getValue("desktopTabletBecomesToolbar"))) {
+            if ((HMD.active && Settings.getValue("hmdTabletBecomesToolbar", true)) || (!HMD.active && Settings.getValue("desktopTabletBecomesToolbar", false))) {
                 Desktop.show("hifi/dialogs/GeneralPreferencesDialog.qml", "General Preferences");
             } else {
                 tablet.loadQMLOnTop("TabletGeneralPreferences.qml");
@@ -229,29 +229,34 @@ function onMessage(message) {
 
 var SNAPSHOT_REVIEW_URL = Script.resolvePath("html/SnapshotReview.html");
 var isInSnapshotReview = false;
-function openSnapApp() {
-    var previousStillSnapPath = Settings.getValue("previousStillSnapPath");
-    var previousStillSnapStoryID = Settings.getValue("previousStillSnapStoryID");
-    var previousStillSnapSharingDisabled = Settings.getValue("previousStillSnapSharingDisabled");
-    var previousAnimatedSnapPath = Settings.getValue("previousAnimatedSnapPath");
-    var previousAnimatedSnapStoryID = Settings.getValue("previousAnimatedSnapStoryID");
-    var previousAnimatedSnapSharingDisabled = Settings.getValue("previousAnimatedSnapSharingDisabled");
-    snapshotOptions = {
-        containsGif: previousAnimatedSnapPath !== "",
-        processingGif: false,
-        shouldUpload: false
+function onButtonClicked() {
+    if (isInSnapshotReview){
+        // for toolbar-mode: go back to home screen, this will close the window.
+        tablet.gotoHomeScreen();
+    } else {
+        var previousStillSnapPath = Settings.getValue("previousStillSnapPath");
+        var previousStillSnapStoryID = Settings.getValue("previousStillSnapStoryID");
+        var previousStillSnapSharingDisabled = Settings.getValue("previousStillSnapSharingDisabled");
+        var previousAnimatedSnapPath = Settings.getValue("previousAnimatedSnapPath");
+        var previousAnimatedSnapStoryID = Settings.getValue("previousAnimatedSnapStoryID");
+        var previousAnimatedSnapSharingDisabled = Settings.getValue("previousAnimatedSnapSharingDisabled");
+        snapshotOptions = {
+            containsGif: previousAnimatedSnapPath !== "",
+            processingGif: false,
+            shouldUpload: false
+        }
+        imageData = [];
+        if (previousAnimatedSnapPath !== "") {
+            imageData.push({ localPath: previousAnimatedSnapPath, story_id: previousAnimatedSnapStoryID, buttonDisabled: previousAnimatedSnapSharingDisabled });
+        }
+        if (previousStillSnapPath !== "") {
+            imageData.push({ localPath: previousStillSnapPath, story_id: previousStillSnapStoryID, buttonDisabled: previousStillSnapSharingDisabled });
+        }
+        tablet.gotoWebScreen(SNAPSHOT_REVIEW_URL);
+        tablet.webEventReceived.connect(onMessage);
+        HMD.openTablet();
+        isInSnapshotReview = true;
     }
-    imageData = [];
-    if (previousAnimatedSnapPath !== "") {
-        imageData.push({ localPath: previousAnimatedSnapPath, story_id: previousAnimatedSnapStoryID, buttonDisabled: previousAnimatedSnapSharingDisabled });
-    }
-    if (previousStillSnapPath !== "") {
-        imageData.push({ localPath: previousStillSnapPath, story_id: previousStillSnapStoryID, buttonDisabled: previousStillSnapSharingDisabled });
-    }
-    tablet.gotoWebScreen(SNAPSHOT_REVIEW_URL);
-    tablet.webEventReceived.connect(onMessage);
-    HMD.openTablet();
-    isInSnapshotReview = true;
 }
 
 function snapshotUploaded(isError, reply) {
@@ -315,7 +320,7 @@ function takeSnapshot() {
         Window.stillSnapshotTaken.connect(stillSnapshotTaken);
     }
     if (buttonConnected) {
-        button.clicked.disconnect(openSnapApp);
+        button.clicked.disconnect(onButtonClicked);
         buttonConnected = false;
     }
 
@@ -366,7 +371,7 @@ function stillSnapshotTaken(pathStillSnapshot, notify) {
     }
     Window.stillSnapshotTaken.disconnect(stillSnapshotTaken);
     if (!buttonConnected) {
-        button.clicked.connect(openSnapApp);
+        button.clicked.connect(onButtonClicked);
         buttonConnected = true;
     }
 
@@ -430,7 +435,7 @@ function processingGifStarted(pathStillSnapshot) {
 function processingGifCompleted(pathAnimatedSnapshot) {
     Window.processingGifCompleted.disconnect(processingGifCompleted);
     if (!buttonConnected) {
-        button.clicked.connect(openSnapApp);
+        button.clicked.connect(onButtonClicked);
         buttonConnected = true;
     }
 
@@ -469,6 +474,7 @@ function maybeDeleteSnapshotStories() {
     }
 }
 function onTabletScreenChanged(type, url) {
+    button.editProperties({ isActive: !isInSnapshotReview });
     if (isInSnapshotReview) {
         tablet.webEventReceived.disconnect(onMessage);
         isInSnapshotReview = false;
@@ -482,14 +488,14 @@ function onUsernameChanged() {
     }
 }
 
-button.clicked.connect(openSnapApp);
+button.clicked.connect(onButtonClicked);
 buttonConnected = true;
 Window.snapshotShared.connect(snapshotUploaded);
 tablet.screenChanged.connect(onTabletScreenChanged);
 Account.usernameChanged.connect(onUsernameChanged);
 Script.scriptEnding.connect(function () {
     if (buttonConnected) {
-        button.clicked.disconnect(openSnapApp);
+        button.clicked.disconnect(onButtonClicked);
         buttonConnected = false;
     }
     if (tablet) {

From b26f31704b7591e735e6b8fd393407aafa543758 Mon Sep 17 00:00:00 2001
From: Zach Fox <fox@highfidelity.io>
Date: Wed, 26 Apr 2017 13:17:00 -0700
Subject: [PATCH 24/36] Fix button state; use request()

---
 scripts/system/snapshot.js | 68 ++++++++++++++++++++------------------
 1 file changed, 36 insertions(+), 32 deletions(-)

diff --git a/scripts/system/snapshot.js b/scripts/system/snapshot.js
index 4cb1232a58..06d519969e 100644
--- a/scripts/system/snapshot.js
+++ b/scripts/system/snapshot.js
@@ -111,7 +111,7 @@ function onMessage(message) {
                     action: "showPreviousImages",
                     options: snapshotOptions,
                     image_data: imageData,
-                    canShare: !!isDomainOpen(Settings.getValue("previousSnapshotDomainID"))
+                    canShare: !isDomainOpen(Settings.getValue("previousSnapshotDomainID"))
                 }));
             } else {
                 tablet.emitScriptEvent(JSON.stringify({
@@ -229,11 +229,13 @@ function onMessage(message) {
 
 var SNAPSHOT_REVIEW_URL = Script.resolvePath("html/SnapshotReview.html");
 var isInSnapshotReview = false;
+var shouldActivateButton = false;
 function onButtonClicked() {
     if (isInSnapshotReview){
         // for toolbar-mode: go back to home screen, this will close the window.
         tablet.gotoHomeScreen();
     } else {
+        shouldActivateButton = true;
         var previousStillSnapPath = Settings.getValue("previousStillSnapPath");
         var previousStillSnapStoryID = Settings.getValue("previousStillSnapStoryID");
         var previousStillSnapSharingDisabled = Settings.getValue("previousStillSnapSharingDisabled");
@@ -343,7 +345,7 @@ function isDomainOpen(id) {
     if (!id) {
         return false;
     }
-    var request = new XMLHttpRequest();
+
     var options = [
         'now=' + new Date().toISOString(),
         'include_actions=concurrency',
@@ -351,15 +353,19 @@ function isDomainOpen(id) {
         'restriction=open,hifi' // If we're sharing, we're logged in
         // If we're here, protocol matches, and it is online
     ];
-    var url = location.metaverseServerUrl + "/api/v1/user_stories?" + options.join('&');
-    request.open("GET", url, false);
-    request.send();
-    if (request.status !== 200) {
-        return false;
-    }
-    var response = JSON.parse(request.response); // Not parsed for us.
-    return (response.status === 'success') &&
-        response.total_entries;
+    var url = METAVERSE_BASE + "/api/v1/user_stories?" + options.join('&');
+
+    return request({
+        uri: url,
+        method: 'GET'
+    }, function (error, response) {
+        if (error || (response.status !== 'success')) {
+            print("ERROR getting open status of domain: ", error || response.status);
+            return false;
+        } else {
+            return response.total_entries;
+        }
+    });
 }
 
 function stillSnapshotTaken(pathStillSnapshot, notify) {
@@ -382,7 +388,7 @@ function stillSnapshotTaken(pathStillSnapshot, notify) {
     snapshotOptions = {
         containsGif: false,
         processingGif: false,
-        canShare: !!isDomainOpen(domainId)
+        canShare: !isDomainOpen(domainId)
     };
     imageData = [{ localPath: pathStillSnapshot, href: href }];
     Settings.setValue("previousStillSnapPath", pathStillSnapshot);
@@ -414,7 +420,7 @@ function processingGifStarted(pathStillSnapshot) {
         containsGif: true,
         processingGif: true,
         loadingGifPath: Script.resolvePath(Script.resourcesPath() + 'icons/loadingDark.gif'),
-        canShare: !!isDomainOpen(domainId)
+        canShare: !isDomainOpen(domainId)
     };
     imageData = [{ localPath: pathStillSnapshot, href: href }];
     Settings.setValue("previousStillSnapPath", pathStillSnapshot);
@@ -442,7 +448,7 @@ function processingGifCompleted(pathAnimatedSnapshot) {
     snapshotOptions = {
         containsGif: true,
         processingGif: false,
-        canShare: !!isDomainOpen(domainId)
+        canShare: !isDomainOpen(domainId)
     }
     imageData = [{ localPath: pathAnimatedSnapshot, href: href }];
     Settings.setValue("previousAnimatedSnapPath", pathAnimatedSnapshot);
@@ -455,26 +461,24 @@ function processingGifCompleted(pathAnimatedSnapshot) {
     }));
 }
 function maybeDeleteSnapshotStories() {
-    if (storyIDsToMaybeDelete.length > 0) {
-        print("User took new snapshot & didn't share old one(s); deleting old snapshot stories");
-        storyIDsToMaybeDelete.forEach(function (element, idx, array) {
-            request({
-                uri: METAVERSE_BASE + '/api/v1/user_stories/' + element,
-                method: 'DELETE'
-            }, function (error, response) {
-                if (error || (response.status !== 'success')) {
-                    print("ERROR deleting snapshot story: ", error || response.status);
-                    return;
-                } else {
-                    print("SUCCESS deleting snapshot story with ID", element);
-                }
-            })
-        });
-        storyIDsToMaybeDelete = [];
-    }
+    storyIDsToMaybeDelete.forEach(function (element, idx, array) {
+        request({
+            uri: METAVERSE_BASE + '/api/v1/user_stories/' + element,
+            method: 'DELETE'
+        }, function (error, response) {
+            if (error || (response.status !== 'success')) {
+                print("ERROR deleting snapshot story: ", error || response.status);
+                return;
+            } else {
+                print("SUCCESS deleting snapshot story with ID", element);
+            }
+        })
+    });
+    storyIDsToMaybeDelete = [];
 }
 function onTabletScreenChanged(type, url) {
-    button.editProperties({ isActive: !isInSnapshotReview });
+    button.editProperties({ isActive: shouldActivateButton });
+    shouldActivateButton = false;
     if (isInSnapshotReview) {
         tablet.webEventReceived.disconnect(onMessage);
         isInSnapshotReview = false;

From a24a48843fdb6c692d098bdb7ffcbfc6b031bee1 Mon Sep 17 00:00:00 2001
From: Zach Fox <fox@highfidelity.io>
Date: Wed, 26 Apr 2017 16:22:01 -0700
Subject: [PATCH 25/36] Checkpoint

---
 scripts/system/html/css/SnapshotReview.css | 133 ++++++++++------
 scripts/system/html/img/shareIcon.png      | Bin 0 -> 15201 bytes
 scripts/system/html/js/SnapshotReview.js   | 177 ++++++++++-----------
 scripts/system/snapshot.js                 |  83 ++++++++--
 4 files changed, 234 insertions(+), 159 deletions(-)
 create mode 100644 scripts/system/html/img/shareIcon.png

diff --git a/scripts/system/html/css/SnapshotReview.css b/scripts/system/html/css/SnapshotReview.css
index ef737870e0..fdfc3bfca9 100644
--- a/scripts/system/html/css/SnapshotReview.css
+++ b/scripts/system/html/css/SnapshotReview.css
@@ -86,71 +86,49 @@ input[type=button].naked:active {
 }
 
 .gifLabel {
+    position:absolute;
+    left: 15px;
+    top: 10px;
     font-family: Raleway-SemiBold;
     font-size: 18px;
     color: white;
-    float: left;
     text-shadow: 2px 2px 3px #000000;
-    margin-left: 20px;
-}
-.shareButtonDiv {
-    display: flex;
-    align-items: center;
-    font-family: Raleway-SemiBold;
-    font-size: 14px;
-    color: white;
-    float: right;
-    text-shadow: 2px 2px 3px #000000;
-    width: 100px;
-    height: 100%;
-    margin-right: 10px;
-}
-.shareButtonLabel {
-    vertical-align: middle;
-}
-.shareButton {
-    background-color: white;
-    width: 40px;
-    height: 40px;
-    border-radius: 50%;
-    border-width: 0;
-    margin-left: 5px;
-}
-.shareButton:hover {
-    background-color: #afafaf;
-}
-.shareButton:active {
-    background-color: white;
 }
+/*
+// END styling of snapshot pane and its contents
+*/
 
 /*
-// START styling of share overlay
+// START styling of share bar
 */
-.shareOverlayDiv {
-    text-align: center;
-}
 .shareControls {
-    text-align: left;
     display: flex;
-    justify-content: center;
+    justify-content: space-between;
     flex-direction: row;
-    align-items: flex-start;
+    align-items: center;
     height: 50px;
+    line-height: 60px;
+    width: calc(100% - 8px);
+    position: absolute;
+    bottom: 4px;
+    left: 4px;
+    right: 4px;
 }
-.shareOverlayLabel {
-    line-height: 75px;
+.shareButtons {
+    display: flex;
+    align-items: center;
+    margin-left: 40px;
+    height: 100%;
 }
-.hifiShareControls {
+.blastToConnections {
     text-align: left;
-    width: 40%;
-    margin-left: 10%;
+    margin-right: 25px;
+    height: 29px;
 }
-.buttonShareControls {
+.shareWithEveryone {
     text-align: left;
-    height: 50px;
-    line-height: 50px;
-    width: 40%;
-    margin-right: 10%;
+    margin-right: 8px;
+    height: 29px;
 }
 .facebookButton {
     background-image: url(../img/fb_logo.png);
@@ -166,12 +144,65 @@ input[type=button].naked:active {
     display: inline-block;
     margin-right: 8px;
 }
+.showShareButtonsButtonDiv {
+    display: inline-flex;
+    align-items: center;
+    font-family: Raleway-SemiBold;
+    font-size: 14px;
+    color: white;
+    text-shadow: 2px 2px 3px #000000;
+    height: 100%;
+    margin-right: 10px;
+}
+.showShareButton {
+    width: 40px;
+    height: 40px;
+    border-radius: 50%;
+    border-width: 0;
+    margin-left: 5px;
+    outline: none;
+}
+.showShareButton.active {
+    border-color: #00b4ef;
+    border-width: 3px;
+    background-color: white;
+}
+.showShareButton.active:hover {
+    background-color: #afafaf;
+}
+.showShareButton.active:active {
+    background-color: white;
+}
+.showShareButton.inactive {
+    border-width: 0;
+    background-color: white;
+}
+.showShareButton.inactive:hover {
+    background-color: #afafaf;
+}
+.showShareButton.inactive:active {
+    background-color: white;
+}
+.showShareButtonDots {
+    display: flex;
+    width: 32px;
+    height: 40px;
+    position: absolute;
+    right: 14px;
+    pointer-events: none;
+}
+.showShareButtonDots > span {
+    width: 10px;
+    height: 10px;
+    margin: auto;
+    background-color: #0093C5;
+    border-radius: 50%;
+    border-width: 0;
+    display: inline;
+}
 /*
 // END styling of share overlay
 */
-/*
-// END styling of snapshot pane and its contents
-*/
 
 /*
 // START styling of snapshot controls (bottom panel) and its contents
diff --git a/scripts/system/html/img/shareIcon.png b/scripts/system/html/img/shareIcon.png
new file mode 100644
index 0000000000000000000000000000000000000000..0486ac920222964fc18287bd03131bc70ed942bd
GIT binary patch
literal 15201
zcmeI3TZ|J`7{|{F5-IM!pkbp3!>mRyPUq6=jMFYlyU<3uuFINTObkqCPP-G@nPFzS
z?d}u0(FBA@l&l7fl1PX?NRS6_5Wx_m5i}A*P*CK-#E1%-5LbvsGrhOF-RueB#hhQ#
zK78N#f8U({xlCWWy}xf=yXzho0H8e{iw*z)I-SoQ3jhF@@}a)~01J)SMhk#Ni=9s!
z*!yZH0Q|4&;IKWMSTD$W)-5S|61odn12~A?1w)dzK$}Ryw5o;3t4EKMgsOzdAzy+?
z7!f$4#>P#!VZ3ip9^WGK3fUcYi3OpMHL}o_h(b1_SwbO17V8R{B{*T4B#J}qEg`bU
zX-Etw`iY2cLc-_vQ!?ub5&_=L`uHH{eVE`F)=x7$&3Y+@6&PM%SfUIWb`b<2no3F-
zh^{TSGnG_`9I<Ufpy_-*@6LPNx|ya~p66+XqdAT;l@w)-X|`0LG^?vrq*5meE!k8J
zTh%qfsVgP*oE;)br%{#iys}2Mk!F>>ll3fJkPMo2Gjt14A~Cxxo1IZ<*}bFo>`H5J
z%z*R&wDg=Q!`@M-*<CX|gd$h#7&$Xj^hc3tn1NZS*%r;Z*%=?f7}0Ir8qr(KyP9q}
zds|J_7N@~8C(}{}3u+6QlPSrHTcLzl$QnY#gp#eBgSwsxmv&iy<>`q?#MxB=V&#yk
zDSF;oCDP53+IrWj!Kh@zu%o0HFU9!>S)btJ1h0=`0s_O-6)BBus*!-Uq)4_jmnsco
zo9pO`ni`u^mD<S08i|Au*DPDoWEhWz3t7Xhs)``{gA&hr{8TUrIV$DzLW&P~eU#$y
z207O64@i8lILSu&w9-*s&N&+?9u1cczM{*jQrkTO!zWpuOUV=`DISVtVSq|90f~|V
z9LuttNAmi)N~5}B(;7Wys%ce|GIe8|xhSe4@P5bzgWeRy2Nj0$B)v&0DS2cn;Dtek
z_p-c)t+tq<%(PZ9)v|SStS(WxF*d-hjnPUXqZV%vLozMs9Lx||IhpmFwTf6g;DRJO
zcTZS$wl7pfx*=M7tSV)hI(<3kW<jZboxF9A{0P)$+y13e#Zj$`SbECNOD60|L(QJc
z$t+cElr@(ZY3HuasM8ar_)RQ?C5_(PGR*B%{V$fm+4-f3$Rm=LhDw;OY~V^@ZYx(>
z&&HEgxe%tGL{X82lx}7vJFI4<G^7nJEz-4Mt*2OhMF|l-qnim`fnkqWdvn!=>r~Fm
z$+;z<W=qA>$%@4nRzs|L{IGM{Gr8jU0LL&4L$l6zSz4cNmTsI~TAyx~)|5|ZsvYLa
z-I~I6D(4Man)L=ll402I^Lcz?@x@vnZdUZG1(+F*s#&O6&V9vs%bMoIjKYnrgmsCs
zu(TEGewGyzrRYF(ZP+E!)gPP{&8?+2qgx1Wf&{h;32YY<*e)cnT}WWNkid2!f$c&9
z+l2(S3khr&64)*zuw6)CyO6+kA%X2e0^5ZIwhIYt7ZTVmB(PmbV7rjOb|Hc7LIT@`
z1hxwaY!?#PE+nvBNMO5=z;+>l?Lq?Eg#@+>32YY<*e)cnT}WWNkid2!F{@p!+Fv-K
zri92m*&Y7qaNr;SfRJMY2>`|)0ASk$0N4KoVB60C<QM=hZw5ek1%M^`i<>@K3jnwp
zkM;}}&L5i$bxbgKKHL4_DBK^>=ZEfo^uk-;zrViYtBcQdpIP<PZN0>azUb@M4o2UV
zyDxnF<nxn@m2GVgt($k?q`H4%>ET7E(;a(aLp!HVuUXpp^t{Ep+SfgPU~B)pPj@|X
zwk`DK>J?1K{vE-#Wvd^IeX*O|{$29Y0<Y`jadOd*fBqq!@|pXN+<xUsZpqa7^JjK;
zz5Myx>7Op|9@#PE+O?#wXJ6;k<O}P+eWPn)V9(fHAG94h^w}?8Ut7-o_Rjt9eG@;@
zu6h^tov^wtUw`xW&U619ekr(eYT3D5Z27VI`HL&=r6NbU{H7bP{V;h}y>TD-d+)JR
UXL=U)Ie&tU_x42(t=as{e=9bQEdT%j

literal 0
HcmV?d00001

diff --git a/scripts/system/html/js/SnapshotReview.js b/scripts/system/html/js/SnapshotReview.js
index 418e623aa8..8a266198a5 100644
--- a/scripts/system/html/js/SnapshotReview.js
+++ b/scripts/system/html/js/SnapshotReview.js
@@ -31,7 +31,7 @@ function showSetupComplete() {
     snapshotImagesDiv.innerHTML = '<img class="centeredImage" src="./img/snapshotIcon.png" alt="Snapshot Instructions" width="64" height="64"/>' +
     '<br/>' +
     "<h4>You're all set!</h4>" +
-    '<p>Try taking a snapshot by pressing the button below.</p>';
+    '<p>Try taking a snapshot by pressing the red button below.</p>';
 }
 function chooseSnapshotLocation() {
     EventBridge.emitWebEvent(JSON.stringify({
@@ -54,25 +54,30 @@ function addImage(image_data, isGifLoading, isShowingPreviousImages, canSharePre
     if (!image_data.localPath) {
         return;
     }
-    var div = document.createElement("DIV");
     var id = "p" + idCounter++;
+    // imageContainer setup
+    var imageContainer = document.createElement("DIV");
+    imageContainer.id = id;
+    imageContainer.style.width = "100%";
+    imageContainer.style.height = "251px";
+    imageContainer.style.display = "flex";
+    imageContainer.style.justifyContent = "center";
+    imageContainer.style.alignItems = "center";
+    imageContainer.style.position = "relative";
+    // img setup
     var img = document.createElement("IMG");
-    div.id = id;
     img.id = id + "img";
-    div.style.width = "100%";
-    div.style.height = "" + 502 / imageCount + "px";
-    div.style.display = "flex";
-    div.style.justifyContent = "center";
-    div.style.alignItems = "center";
-    div.style.position = "relative";
     if (imageCount > 1) {
         img.setAttribute("class", "multiple");
     }
     img.src = image_data.localPath;
-    div.appendChild(img);
-    document.getElementById("snapshot-images").appendChild(div);
-    var isGif = img.src.split('.').pop().toLowerCase() === "gif";
+    imageContainer.appendChild(img);
+    document.getElementById("snapshot-images").appendChild(imageContainer);
     paths.push(image_data.localPath);
+    var isGif = img.src.split('.').pop().toLowerCase() === "gif";
+    if (isGif) {
+        imageContainer.innerHTML += '<span class="gifLabel">GIF</span>';
+    }
     if (!isGifLoading && !isShowingPreviousImages) {
         shareForUrl(id);
     } else if (isShowingPreviousImages && canSharePreviousImages) {
@@ -83,92 +88,68 @@ function appendShareBar(divID, story_id, isGif, hifiShareButtonsDisabled) {
     var story_url = "https://highfidelity.com/user_stories/" + story_id;
     var parentDiv = document.getElementById(divID);
     parentDiv.setAttribute('data-story-id', story_id);
-    document.getElementById(divID).appendChild(createShareOverlay(divID, isGif, story_url, hifiShareButtonsDisabled));
+    document.getElementById(divID).appendChild(createShareBar(divID, isGif, story_url, hifiShareButtonsDisabled));
 }
-function createShareOverlay(parentID, isGif, shareURL, hifiShareButtonsDisabled) {
-    var shareOverlayContainer = document.createElement("DIV");
-    shareOverlayContainer.id = parentID + "shareOverlayContainer";
-    shareOverlayContainer.style.position = "absolute";
-    shareOverlayContainer.style.top = "0px";
-    shareOverlayContainer.style.left = "0px";
-    shareOverlayContainer.style.display = "flex";
-    shareOverlayContainer.style.alignItems = "flex-end";
-    shareOverlayContainer.style.width = "100%";
-    shareOverlayContainer.style.height = "100%";
-
+function createShareBar(parentID, isGif, shareURL, hifiShareButtonsDisabled) {
     var shareBar = document.createElement("div");
-    shareBar.id = parentID + "shareBar"
-    shareBar.style.display = "inline";
-    shareBar.style.width = "100%";
-    shareBar.style.height = "60px";
-    shareBar.style.lineHeight = "60px";
-    shareBar.style.clear = "both";
-    shareBar.style.marginLeft = "auto";
-    shareBar.style.marginRight = "auto";
-    shareBar.innerHTML = isGif ? '<span class="gifLabel">GIF</span>' : "";
-    var shareButtonID = parentID + "shareButton";
-    shareBar.innerHTML += '<div class="shareButtonDiv">' +
-            '<label class="shareButtonLabel" for="' + shareButtonID + '">SHARE</label>' +
-            '<input type="button" class="shareButton" id="' + shareButtonID + '" onclick="selectImageToShare(' + parentID + ')" />' +
-        '</div>'
-    shareOverlayContainer.appendChild(shareBar);
-
-    var shareOverlayBackground = document.createElement("div");
-    shareOverlayBackground.id = parentID + "shareOverlayBackground";
-    shareOverlayBackground.style.display = "none";
-    shareOverlayBackground.style.position = "absolute";
-    shareOverlayBackground.style.zIndex = "1";
-    shareOverlayBackground.style.top = "0px";
-    shareOverlayBackground.style.left = "0px";
-    shareOverlayBackground.style.backgroundColor = "black";
-    shareOverlayBackground.style.opacity = "0.5";
-    shareOverlayBackground.style.width = "100%";
-    shareOverlayBackground.style.height = "100%";
-    shareOverlayContainer.appendChild(shareOverlayBackground);
-
-    var shareOverlay = document.createElement("div");
-    shareOverlay.id = parentID + "shareOverlay";
-    shareOverlay.className = "shareOverlayDiv";
-    shareOverlay.style.display = "none";
-    shareOverlay.style.width = "100%";
-    shareOverlay.style.height = "100%";
-    shareOverlay.style.zIndex = "2";
+    shareBar.id = parentID + "shareBar";
+    shareBar.className = "shareControls";
+    var shareButtonsDivID = parentID + "shareButtonsDiv";
+    var showShareButtonsButtonDivID = parentID + "showShareButtonsButtonDiv";
+    var showShareButtonsButtonID = parentID + "showShareButtonsButton";
+    var showShareButtonsLabelID = parentID + "showShareButtonsLabel";
+    var blastToConnectionsButtonID = parentID + "blastToConnectionsButton";
     var shareWithEveryoneButtonID = parentID + "shareWithEveryoneButton";
-    var inviteConnectionsCheckboxID = parentID + "inviteConnectionsCheckbox";
     var facebookButtonID = parentID + "facebookButton";
     var twitterButtonID = parentID + "twitterButton";
-    shareOverlay.innerHTML = '<label class="shareOverlayLabel">SHARE</label>' +
-        '<br/>' +
-        '<div class="shareControls">' +
-            '<div class="hifiShareControls">' +
-                '<input type="button"' + (hifiShareButtonsDisabled ? ' disabled="disabled"' : '') + ' class="shareWithEveryone" id="' + shareWithEveryoneButtonID + '" value="SHARE WITH EVERYONE" onclick="shareWithEveryone(' + parentID + ', ' + isGif + ')" /><br>' +
-                '<input type="checkbox"' + (hifiShareButtonsDisabled ? ' disabled="disabled"' : '') + ' class="inviteConnections" id="' + inviteConnectionsCheckboxID + '" checked="checked" />' +
-                '<label class="shareButtonLabel" for="' + inviteConnectionsCheckboxID + '">Invite My Connections</label><br>' +
-                '<input type="button" value="CANCEL" onclick="cancelSharing(' + parentID + ')" />' +
-            '</div>' +
-            '<div class="buttonShareControls">' +
-                '<a class="facebookButton" id="' + facebookButtonID + '" onClick="shareButtonClicked(' + parentID + ')" target="_blank" href="https://www.facebook.com/dialog/feed?app_id=1585088821786423&link=' + shareURL + '"></a>' +
-                '<a class="twitterButton" id="' + twitterButtonID + '" onClick="shareButtonClicked(' + parentID + ')" target="_blank" href="https://twitter.com/intent/tweet?text=I%20just%20took%20a%20snapshot!&url=' + shareURL + '&via=highfidelity&hashtags=VR,HiFi"></a>' +
+    shareBar.innerHTML += '' +
+        '<div class="shareButtons" id="' + shareButtonsDivID + '" style="opacity:0">' +
+            '<input type="button"' + (hifiShareButtonsDisabled ? ' disabled="disabled"' : '') + ' class="blastToConnections" id="' + blastToConnectionsButtonID + '" value="BLAST TO CONNECTIONS" onclick="blastToConnections(' + parentID + ', ' + isGif + ')" />' +
+            '<input type="button"' + (hifiShareButtonsDisabled ? ' disabled="disabled"' : '') + ' class="shareWithEveryone" id="' + shareWithEveryoneButtonID + '" value="B" onclick="shareWithEveryone(' + parentID + ', ' + isGif + ')" />' +
+            '<a class="facebookButton" id="' + facebookButtonID + '" onClick="shareButtonClicked(' + parentID + ')" target="_blank" href="https://www.facebook.com/dialog/feed?app_id=1585088821786423&link=' + shareURL + '"></a>' +
+            '<a class="twitterButton" id="' + twitterButtonID + '" onClick="shareButtonClicked(' + parentID + ')" target="_blank" href="https://twitter.com/intent/tweet?text=I%20just%20took%20a%20snapshot!&url=' + shareURL + '&via=highfidelity&hashtags=VR,HiFi"></a>' +
+        '</div>' +
+        '<div class="showShareButtonsButtonDiv" id="' + showShareButtonsButtonDivID + '">' +
+            '<label id="' + showShareButtonsLabelID + '" for="' + showShareButtonsButtonID + '">SHARE</label>' +
+            '<input type="button" class="showShareButton inactive" id="' + showShareButtonsButtonID + '" onclick="selectImageToShare(' + parentID + ', true)" />' +
+            '<div class="showShareButtonDots">' +
+                '<span></span><span></span><span></span>' +
             '</div>' +
         '</div>';
-    shareOverlayContainer.appendChild(shareOverlay);
 
-    return shareOverlayContainer;
+    return shareBar;
 }
-function selectImageToShare(selectedID) {
-    selectedID = selectedID.id; // `selectedID` is passed as an HTML object to these functions; we just want the ID
-    var shareOverlayContainer = document.getElementById(selectedID + "shareOverlayContainer");
+function selectImageToShare(selectedID, isSelected) {
+    if (selectedID.id) {
+        selectedID = selectedID.id; // sometimes (?), `selectedID` is passed as an HTML object to these functions; we just want the ID
+    }
+    var imageContainer = document.getElementById(selectedID);
     var shareBar = document.getElementById(selectedID + "shareBar");
-    var shareOverlayBackground = document.getElementById(selectedID + "shareOverlayBackground");
-    var shareOverlay = document.getElementById(selectedID + "shareOverlay");
+    var shareButtonsDiv = document.getElementById(selectedID + "shareButtonsDiv");
+    var showShareButtonsButton = document.getElementById(selectedID + "showShareButtonsButton");
 
-    shareOverlay.style.outline = "4px solid #00b4ef";
-    shareOverlay.style.outlineOffset = "-4px";
+    if (isSelected) {
+        showShareButtonsButton.onclick = function () { selectImageToShare(selectedID, false) };
+        showShareButtonsButton.classList.remove("inactive");
+        showShareButtonsButton.classList.add("active");
 
-    shareBar.style.display = "none";
+        imageContainer.style.outline = "4px solid #00b4ef";
+        imageContainer.style.outlineOffset = "-4px";
 
-    shareOverlayBackground.style.display = "inline";
-    shareOverlay.style.display = "inline";
+        shareBar.style.backgroundColor = "rgba(0, 0, 0, 0.5)";
+
+        shareButtonsDiv.style.opacity = "1.0";
+    } else {
+        showShareButtonsButton.onclick = function () { selectImageToShare(selectedID, true) };
+        showShareButtonsButton.classList.remove("active");
+        showShareButtonsButton.classList.add("inactive");
+
+        imageContainer.style.outline = "none";
+
+        shareBar.style.backgroundColor = "rgba(0, 0, 0, 0.0)";
+
+        shareButtonsDiv.style.opacity = "0.0";
+    }
 }
 function shareForUrl(selectedID) {
     EventBridge.emitWebEvent(JSON.stringify({
@@ -177,17 +158,29 @@ function shareForUrl(selectedID) {
         data: paths[parseInt(selectedID.substring(1))]
     }));
 }
+function blastToConnections(selectedID, isGif) {
+    selectedID = selectedID.id; // `selectedID` is passed as an HTML object to these functions; we just want the ID
+
+    document.getElementById(selectedID + "blastToConnectionsButton").setAttribute("disabled", "disabled");
+    document.getElementById(selectedID + "shareWithEveryoneButton").setAttribute("disabled", "disabled");
+
+    EventBridge.emitWebEvent(JSON.stringify({
+        type: "snapshot",
+        action: "blastToConnections",
+        story_id: document.getElementById(selectedID).getAttribute("data-story-id"),
+        isGif: isGif
+    }));
+}
 function shareWithEveryone(selectedID, isGif) {
     selectedID = selectedID.id; // `selectedID` is passed as an HTML object to these functions; we just want the ID
 
+    document.getElementById(selectedID + "blastToConnectionsButton").setAttribute("disabled", "disabled");
     document.getElementById(selectedID + "shareWithEveryoneButton").setAttribute("disabled", "disabled");
-    document.getElementById(selectedID + "inviteConnectionsCheckbox").setAttribute("disabled", "disabled");
 
     EventBridge.emitWebEvent(JSON.stringify({
         type: "snapshot",
         action: "shareSnapshotWithEveryone",
         story_id: document.getElementById(selectedID).getAttribute("data-story-id"),
-        isAnnouncement: document.getElementById(selectedID + "inviteConnectionsCheckbox").getAttribute("checked"),
         isGif: isGif
     }));
 }
@@ -201,17 +194,9 @@ function shareButtonClicked(selectedID) {
 }
 function cancelSharing(selectedID) {
     selectedID = selectedID.id; // `selectedID` is passed as an HTML object to these functions; we just want the ID
-    var shareOverlayContainer = document.getElementById(selectedID + "shareOverlayContainer");
     var shareBar = document.getElementById(selectedID + "shareBar");
-    var shareOverlayBackground = document.getElementById(selectedID + "shareOverlayBackground");
-    var shareOverlay = document.getElementById(selectedID + "shareOverlay");
-
-    shareOverlay.style.outline = "none";
 
     shareBar.style.display = "inline";
-
-    shareOverlayBackground.style.display = "none";
-    shareOverlay.style.display = "none";
 }
 
 function handleCaptureSetting(setting) {
@@ -331,6 +316,6 @@ function testInBrowser(isTestingSetupInstructions) {
     } else {
         imageCount = 1;
         //addImage({ localPath: 'http://lorempixel.com/553/255' });
-        addImage({ localPath: 'C:/Users/valef/Desktop/hifi-snap-by-zfox-on-2017-04-26_10-26-53.jpg' }, false, true, true, false);
+        addImage({ localPath: 'C:/Users/valef/Desktop/hifi-snap-by-zfox-on-2017-04-26_10-26-53.gif' }, false, true, true, false);
     }
 }
diff --git a/scripts/system/snapshot.js b/scripts/system/snapshot.js
index 06d519969e..9ec81eec10 100644
--- a/scripts/system/snapshot.js
+++ b/scripts/system/snapshot.js
@@ -85,6 +85,16 @@ function request(options, callback) { // cb(error, responseOfCorrectContentType)
     httpRequest.send(options.body);
 }
 
+function openLoginWindow() {
+    if ((HMD.active && Settings.getValue("hmdTabletBecomesToolbar", false))
+        || (!HMD.active && Settings.getValue("desktopTabletBecomesToolbar", true))) {
+        Menu.triggerOption("Login / Sign Up");
+    } else {
+        tablet.loadQMLOnTop("../../dialogs/TabletLoginDialog.qml");
+        HMD.openTablet();
+    }
+}
+
 function onMessage(message) {
     // Receives message from the html dialog via the qwebchannel EventBridge. This is complicated by the following:
     // 1. Although we can send POJOs, we cannot receive a toplevel object. (Arrays of POJOs are fine, though.)
@@ -97,7 +107,6 @@ function onMessage(message) {
     }
 
     var isLoggedIn;
-    var needsLogin = false;
     switch (message.action) {
         case 'ready': // DOM is ready and page has loaded
             tablet.emitScriptEvent(JSON.stringify({
@@ -138,7 +147,8 @@ function onMessage(message) {
             }
             break;
         case 'openSettings':
-            if ((HMD.active && Settings.getValue("hmdTabletBecomesToolbar", true)) || (!HMD.active && Settings.getValue("desktopTabletBecomesToolbar", false))) {
+            if ((HMD.active && Settings.getValue("hmdTabletBecomesToolbar", false))
+                || (!HMD.active && Settings.getValue("desktopTabletBecomesToolbar", true))) {
                 Desktop.show("hifi/dialogs/GeneralPreferencesDialog.qml", "General Preferences");
             } else {
                 tablet.loadQMLOnTop("TabletGeneralPreferences.qml");
@@ -164,6 +174,64 @@ function onMessage(message) {
                 // TODO
             }
             break;
+        case 'blastToConnections':
+            isLoggedIn = Account.isLoggedIn();
+            storyIDsToMaybeDelete.splice(storyIDsToMaybeDelete.indexOf(message.story_id), 1);
+            if (message.isGif) {
+                Settings.setValue("previousAnimatedSnapSharingDisabled", true);
+            } else {
+                Settings.setValue("previousStillSnapSharingDisabled", true);
+            }
+
+            if (isLoggedIn) {
+                print('Uploading new story for announcement!');
+
+                request({
+                    uri: METAVERSE_BASE + '/api/v1/user_stories/' + message.story_id,
+                    method: 'GET'
+                }, function (error, response) {
+                    if (error || (response.status !== 'success')) {
+                        print("ERROR getting details about existing snapshot story:", error || response.status);
+                        return;
+                    } else {
+                        var requestBody = {
+                            user_story: {
+                                audience: "for_feed",
+                                action: "announcement",
+                                path: response.user_story.path,
+                                place_name: response.user_story.place_name,
+                                thumbnail_url: response.user_story.thumbnail_url,
+                                details: {
+                                    shareable_url: response.user_story.details.shareable_url,
+                                    image_url: response.user_story.details.image_url
+                                }
+                            }
+                        }
+                        request({
+                            uri: METAVERSE_BASE + '/api/v1/user_stories',
+                            method: 'POST',
+                            json: true,
+                            body: requestBody
+                        }, function (error, response) {
+                            if (error || (response.status !== 'success')) {
+                                print("ERROR uploading announcement story: ", error || response.status);
+                                if (message.isGif) {
+                                    Settings.setValue("previousAnimatedSnapSharingDisabled", false);
+                                } else {
+                                    Settings.setValue("previousStillSnapSharingDisabled", false);
+                                }
+                                return;
+                            } else {
+                                print("SUCCESS uploading announcement story! Story ID:", response.user_story.id);
+                            }
+                        });
+                    }
+                });
+
+            } else {
+                openLoginWindow();
+            }
+            break;
         case 'shareSnapshotWithEveryone':
             isLoggedIn = Account.isLoggedIn();
             storyIDsToMaybeDelete.splice(storyIDsToMaybeDelete.indexOf(message.story_id), 1);
@@ -202,19 +270,10 @@ function onMessage(message) {
                     }
                 });
             } else {
-                needsLogin = true;
+                openLoginWindow();
                 shareAfterLogin = true;
                 snapshotToShareAfterLogin = { path: message.data, href: message.href || href };
             }
-            if (needsLogin) {
-                if ((HMD.active && Settings.getValue("hmdTabletBecomesToolbar"))
-                    || (!HMD.active && Settings.getValue("desktopTabletBecomesToolbar"))) {
-                    Menu.triggerOption("Login / Sign Up");
-                } else {
-                    tablet.loadQMLOnTop("../../dialogs/TabletLoginDialog.qml");
-                    HMD.openTablet();
-                }
-            }
             break;
         case 'shareButtonClicked':
             print('Twitter or FB "Share" button clicked! Removing ID', message.story_id, 'from storyIDsToMaybeDelete[].');

From b6601feb1d20fe7e19630ff3a438b224eef280ed Mon Sep 17 00:00:00 2001
From: Zach Fox <fox@highfidelity.io>
Date: Wed, 26 Apr 2017 16:50:11 -0700
Subject: [PATCH 26/36] It's 5 already?

---
 scripts/system/html/css/SnapshotReview.css |  36 +++++----------------
 scripts/system/html/css/hifi-style.css     |  36 ++++++++++++++++++++-
 scripts/system/html/img/shareToFeed.png    | Bin 0 -> 15486 bytes
 scripts/system/html/js/SnapshotReview.js   |   4 +--
 4 files changed, 45 insertions(+), 31 deletions(-)
 create mode 100644 scripts/system/html/img/shareToFeed.png

diff --git a/scripts/system/html/css/SnapshotReview.css b/scripts/system/html/css/SnapshotReview.css
index fdfc3bfca9..9258aa7f1a 100644
--- a/scripts/system/html/css/SnapshotReview.css
+++ b/scripts/system/html/css/SnapshotReview.css
@@ -126,9 +126,13 @@ input[type=button].naked:active {
     height: 29px;
 }
 .shareWithEveryone {
+    background: #DDDDDD url(../img/shareToFeed.png) no-repeat scroll center;
+    border-width: 0px;
     text-align: left;
     margin-right: 8px;
     height: 29px;
+    width: 30px;
+    border-radius: 3px;
 }
 .facebookButton {
     background-image: url(../img/fb_logo.png);
@@ -143,6 +147,7 @@ input[type=button].naked:active {
     height: 29px;
     display: inline-block;
     margin-right: 8px;
+    border-radius: 3px;
 }
 .showShareButtonsButtonDiv {
     display: inline-flex;
@@ -188,6 +193,7 @@ input[type=button].naked:active {
     width: 32px;
     height: 40px;
     position: absolute;
+    top: 5px;
     right: 14px;
     pointer-events: none;
 }
@@ -226,8 +232,8 @@ input[type=button].naked:active {
 }
 
 #snap-button {
-    width: 65px;
-    height: 65px;
+    width: 75px;
+    height: 75px;
     padding: 0;
     border-radius: 50%;
     background: #EA4C5F;
@@ -273,32 +279,6 @@ h4 {
     margin: 0 auto;
     display: block;
 }
-
-.prompt {
-    font-family: Raleway-SemiBold;
-    font-size: 14px;
-}
-
-.compound-button {
-    position: relative;
-    height: auto;
-}
-
-.compound-button input {
-    padding-left: 40px;
-}
-
-.compound-button {
-    display: inline-block;
-    position: absolute;
-    left: 12px;
-    top: 16px;
-    width: 23px;
-    height: 23px;
-    background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+CjxzdmcKICAgeG1sbnM6ZGM9Imh0dHA6Ly9wdXJsLm9yZy9kYy9lbGVtZW50cy8xLjEvIgogICB4bWxuczpjYz0iaHR0cDovL2NyZWF0aXZlY29tbW9ucy5vcmcvbnMjIgogICB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiCiAgIHhtbG5zOnN2Zz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciCiAgIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIKICAgaGVpZ2h0PSI0MCIKICAgd2lkdGg9IjQwIgogICBpZD0ic3ZnMiIKICAgeG1sOnNwYWNlPSJwcmVzZXJ2ZSIKICAgdmlld0JveD0iMCAwIDQwIDQwIgogICB5PSIwcHgiCiAgIHg9IjBweCIKICAgdmVyc2lvbj0iMS4xIj48bWV0YWRhdGEKICAgICBpZD0ibWV0YWRhdGEzNCI+PHJkZjpSREY+PGNjOldvcmsKICAgICAgICAgcmRmOmFib3V0PSIiPjxkYzpmb3JtYXQ+aW1hZ2Uvc3ZnK3htbDwvZGM6Zm9ybWF0PjxkYzp0eXBlCiAgICAgICAgICAgcmRmOnJlc291cmNlPSJodHRwOi8vcHVybC5vcmcvZGMvZGNtaXR5cGUvU3RpbGxJbWFnZSIgLz48ZGM6dGl0bGU+PC9kYzp0aXRsZT48L2NjOldvcms+PC9yZGY6UkRGPjwvbWV0YWRhdGE+PGRlZnMKICAgICBpZD0iZGVmczMyIiAvPjxzdHlsZQogICAgIGlkPSJzdHlsZTQiCiAgICAgdHlwZT0idGV4dC9jc3MiPgoJLnN0MHtmaWxsOiM0MTQwNDI7fQoJLnN0MXtmaWxsOiNDQ0NDQ0M7fQoJLnN0MntmaWxsOiMxMzk4QkI7fQoJLnN0M3tmaWxsOiMzMUQ4RkY7fQo8L3N0eWxlPjxnCiAgICAgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMCwtMTEwKSIKICAgICBpZD0iTGF5ZXJfMSI+PGNpcmNsZQogICAgICAgc3R5bGU9ImZpbGw6I2ZmZmZmZjtmaWxsLW9wYWNpdHk6MSIKICAgICAgIGlkPSJjaXJjbGUxMyIKICAgICAgIHI9IjQuNDQwMDAwMSIKICAgICAgIGN5PSIxMjYuMTciCiAgICAgICBjeD0iMjAuNTQwMDAxIgogICAgICAgY2xhc3M9InN0MSIgLz48cGF0aAogICAgICAgc3R5bGU9ImZpbGw6I2ZmZmZmZjtmaWxsLW9wYWNpdHk6MSIKICAgICAgIGlkPSJwYXRoMTUiCiAgICAgICBkPSJtIDI4Ljg3LDEzOS4yNiBjIDAuMDEsLTAuMDEgMC4wMiwtMC4wMiAwLjAzLC0wLjAzIGwgMCwtMS44NiBjIDAsLTIuNjggLTIuMzMsLTQuNzcgLTUsLTQuNzcgbCAtNi40MiwwIGMgLTIuNjgsMCAtNC44NSwyLjA5IC00Ljg1LDQuNzcgbCAwLDEuODggMTYuMjQsMCB6IgogICAgICAgY2xhc3M9InN0MSIgLz48cGF0aAogICAgICAgc3R5bGU9ImZpbGw6I2ZmZmZmZjtmaWxsLW9wYWNpdHk6MSIKICAgICAgIGlkPSJwYXRoMTciCiAgICAgICBkPSJtIDM4LjE3LDEyMy40MiBjIDAsLTMuOTcgLTMuMjIsLTcuMTkgLTcuMTksLTcuMTkgbCAtMjAuMzEsMCBjIC0zLjk3LDAgLTcuMTksMy4yMiAtNy4xOSw3LjE5IGwgMCwxNC4xOCBjIDAsMy45NyAzLjIyLDcuMTkgNy4xOSw3LjE5IGwgMjAuMzEsMCBjIDMuOTcsMCA3LjE5LC0zLjIyIDcuMTksLTcuMTkgbCAwLC0xNC4xOCB6IG0gLTEuNzgsMTQuMjcgYyAwLDMuMDMgLTIuNDYsNS40OSAtNS40OSw1LjQ5IGwgLTIwLjMyLDAgYyAtMy4wMywwIC01LjQ5LC0yLjQ2IC01LjQ5LC01LjQ5IGwgMCwtMTQuMTkgYyAwLC0zLjAzIDIuNDYsLTUuNDkgNS40OSwtNS40OSBsIDIwLjMzLDAgYyAzLjAzLDAgNS40OSwyLjQ2IDUuNDksNS40OSBsIDAsMTQuMTkgeiIKICAgICAgIGNsYXNzPSJzdDEiIC8+PC9nPjxnCiAgICAgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMCwtMTEwKSIKICAgICBpZD0iTGF5ZXJfMiIgLz48L3N2Zz4=);
-    background-repeat: no-repeat;
-    background-size: 23px 23px;
-}
 /*
 // END misc styling
 */
diff --git a/scripts/system/html/css/hifi-style.css b/scripts/system/html/css/hifi-style.css
index 41cda569c9..6e8dd7c710 100644
--- a/scripts/system/html/css/hifi-style.css
+++ b/scripts/system/html/css/hifi-style.css
@@ -127,8 +127,42 @@ input[type=radio]:active + label > span > span{
   display: block;
   width: 10px;
   height: 10px;
-  margin: 2.5px;
+  margin: 3px;
   border: 2px solid #36CDFF;
   border-radius: 50%;
   background: #00B4EF;
+}
+
+.grayButton {
+    font-family: FiraSans-SemiBold;
+    color: white;
+    padding: 0px 10px;
+    border-width: 0px;
+    background-image: linear-gradient(#FFFFFF, #AFAFAF);
+}
+.grayButton:hover {
+    background-image: linear-gradient(#FFFFFF, #FFFFFF);
+}
+.grayButton:active {
+    background-image: linear-gradient(#AFAFAF, #AFAFAF);
+}
+.grayButton:disabled {
+    background-image: linear-gradient(#FFFFFF, ##AFAFAF);
+}
+.blueButton {
+    font-family: FiraSans-SemiBold;
+    color: white;
+    padding: 0px 10px;
+    border-radius: 3px;
+    border-width: 0px;
+    background-image: linear-gradient(#00B4EF, #1080B8);
+}
+.blueButton:hover {
+    background-image: linear-gradient(#00B4EF, #00B4EF);
+}
+.blueButton:active {
+    background-image: linear-gradient(#1080B8, #1080B8);
+}
+.blueButton:disabled {
+    background-image: linear-gradient(#FFFFFF, ##AFAFAF);
 }
\ No newline at end of file
diff --git a/scripts/system/html/img/shareToFeed.png b/scripts/system/html/img/shareToFeed.png
new file mode 100644
index 0000000000000000000000000000000000000000..f681c49d8f83a3f77ec8db52f62ff2bd1e6ee628
GIT binary patch
literal 15486
zcmeI3ZEO_B8OH}h;@XV~#K_=)(De}10rvLg-n^^3a~z+I-E!tIZn0Y+-rJqCx4zrm
z?yh}j%OR&yC{C=pA*!IHp$$@6wIz{h(<YRL7AT}?0fFL#BuWUe6-uHgEg>S%v{3E6
z_+D%iMo~UQnxABUn3@0c?EL3>X79@m2AfxvmEK(n04Qr}^tS*2EC7H-U%DLt0FFFw
z1pt(&jqN%BUoJQQW`Ny4T>t?4rqtSIv;|gkf)cgyq7s6(cvLk-z*7@fd7&E`mJsZe
zWUuvK2mfrfNTS!e-Wi|*Y8~v78v8Z4uD`ie=<gO-(OTmx^~AY&RE<J|x5T3nS?A(j
zYceh;>zp}ES}n;XMz_~mYbLa`1%j43MS~Wn%|!^bz1retZM2iEW*jRm3`M(0iX~|W
zLD3w=aujVzWA&9<EEbO@hPf7hLpq%%hP~D<!%#VrjKyNMnBAsmog~e&EJ-mW!w{Mn
zCiFhp;Nyg>FG&T-#PLI2&?ME66xm|N<wHu3;k8=LL=&X<6;&q^$$Hv5L5Y%aUL|Q8
zMNT6M1a2;iMyFKjMt!ewbEV$er$Vv?>Pn9$!1`V&8%w5o2vL}bqxNW#q(7oS!U&8)
z+0aSaMo;+&YL{XtdY3ZIz9*)q-Mt}&vxk%CnK?79492BtWadmtmMn!7o_JK{>NLn3
ziq@(q5nrmxf|;kc)YX|)<+fC<mt;|i>GycZLP_?#v(ccRH=xf{5|o2rT&=W=bGQh~
z%~4cNgw(Qv00C(5B5&}Y8X|9DVGu=>!hN3}BD*X<Kp?<1$-2SI0&Md8;!)KmNg_wt
zU11oq^F+0Swi8Z=!$t74y_(?dPKt6d0^?#_$?fIKCx!MaLXTNLO@3dh-$g}`#B9-U
zZov_z1coLUUgQayhHfH6xp{(jGc-*zcHZG)GKq46O-i&zlR71tkL0W|_ad5mp~Jkx
zAv%eWlXVj;bTCB78FCRK!}9KGcbE<HLMFu&VJ4+&lypPU`f?^R7sWdG-TcwaL_|tn
z94fEr(CkOAHPeu}H9CPO+1DH|m{*QZFsl}d9x`t<`&bjCWzrPKc}o_g;^)Yx&k^f_
z^0ZZ-ij!P2eFR+z8!=vkwVhBlZlxPjQS)Vm;XR~zKS!j=6RGjfa0)u#`x(#RmRjnI
ze+FjFr*<K9@p2~=ePpI|GXuAFY^lS{@2O0mPVPaEC~#p#i}Hp~it?S1ROL<&nH|jL
z^h~^yxH=`GXaPlpKD#ITs>&J8QJHTe^L~J`!6*BY_9Wj>d1Hm^+sr<X^d#528H%DP
zk~aURrMc6E()OE6bEgZXS>-om$?!4hYz4zPD)W_@+Vwh>7ogAOblRPs<eM~ixKI(4
z;xN+Ym!eSC&6~>3q&0;TQwrO&LZ&)bm@|<Urb;2_cUW>FHQM5D@RfSViC>r*&F4#Y
zN1r1&2@=>YB(PmbV7rjOb|Hc7LIT@`1hxwaY!?#PE+nvBNMO5=z;+>l?Lq?Eg#@+>
z32YY<*e)cnT}WWNkid2!f$c&9+l2(S3khr&64)*zuw6)CyO6+kA%X2e0^5ZIwhIYt
z7ZTVmB(PmbV7rjOb|Hc7LIT@`#7*rg&3>~9WzlPmS!;YN7oKi3KL-^WTLJ*|F9jg6
z1%PWe07$$GKo14LdmR99y8xK4?706}0{}$}oBXw{@z>u!>+Nc-om2epw{BZobZz<Q
z-y4?h=@?yRaaHWCxU04Lnex$dReL*TJ)G!TarpSWQ04ZyC4X($KXPg2+IbImtPYNp
zR(xf!eh&K>+qU??!Ptvi9hLDn4!!pHPi~w%aXohb6B}&bUL);4_1hU8>%Mu$`H|;=
zHy`T0cyw{(#dl*Rk1lv&&gS*YF8pWBg;V#IyhSJeS2k;Y_nl*|UmRUux3r3%_jurM
z+N!I|-??q1Y&f|6<6lu9+_CZN``9gq<ISrMd@B^_e0BBK;rp(>vFX`jl?@(sFFLYe
ztgF~IR@A#~^X<dq*S7X~j;;7pJw34L*i-$L)ju98-f{l)w(;lo%=*E`=jQ6s!Ogbv
z5pqq*m1W~Q|1o;G>h+!byN3__aOiqHW4kcpN4=j6gr82la(CI;-5)jASM0cS;pMx|
zghrp)J#b=Hge$jo6fLQB-E(Q^e0yR8TmH%;57stsxjJ<2^n=^azqCJm5-h5%neF$k
zsC@s}(t(oq9(cY2%pT{%JH;m#eo}PevGA3@$akDA*&~m?J<>im@#Kj^^Y@*7>E1u|
zA8FXOtKu@)wfguAV;}#wboLVuogDPLAN^(V@$ssy2M_<V=JdsPE`9ZnM^@D@`w+wv
zD;~LSJvSZ>erMATX;^=I;|6j0zW$m!6R%wyJM;6G<)NoOY!1%;+3)&dhZmf3e(g8T
zS1(6?U$eG*p>I&QviQ)LGPCx^`SK6GKm6;;m63s6``n2eGr``uQv0)ehPRnt2shO?
L`=7qA<9q)H#YG)p

literal 0
HcmV?d00001

diff --git a/scripts/system/html/js/SnapshotReview.js b/scripts/system/html/js/SnapshotReview.js
index 8a266198a5..eb28aa4be5 100644
--- a/scripts/system/html/js/SnapshotReview.js
+++ b/scripts/system/html/js/SnapshotReview.js
@@ -104,8 +104,8 @@ function createShareBar(parentID, isGif, shareURL, hifiShareButtonsDisabled) {
     var twitterButtonID = parentID + "twitterButton";
     shareBar.innerHTML += '' +
         '<div class="shareButtons" id="' + shareButtonsDivID + '" style="opacity:0">' +
-            '<input type="button"' + (hifiShareButtonsDisabled ? ' disabled="disabled"' : '') + ' class="blastToConnections" id="' + blastToConnectionsButtonID + '" value="BLAST TO CONNECTIONS" onclick="blastToConnections(' + parentID + ', ' + isGif + ')" />' +
-            '<input type="button"' + (hifiShareButtonsDisabled ? ' disabled="disabled"' : '') + ' class="shareWithEveryone" id="' + shareWithEveryoneButtonID + '" value="B" onclick="shareWithEveryone(' + parentID + ', ' + isGif + ')" />' +
+            '<input type="button"' + (hifiShareButtonsDisabled ? ' disabled="disabled"' : '') + ' class="blastToConnections blueButton" id="' + blastToConnectionsButtonID + '" value="BLAST TO MY CONNECTIONS" onclick="blastToConnections(' + parentID + ', ' + isGif + ')" />' +
+            '<input type="button"' + (hifiShareButtonsDisabled ? ' disabled="disabled"' : '') + ' class="shareWithEveryone" id="' + shareWithEveryoneButtonID + '" onclick="shareWithEveryone(' + parentID + ', ' + isGif + ')" />' +
             '<a class="facebookButton" id="' + facebookButtonID + '" onClick="shareButtonClicked(' + parentID + ')" target="_blank" href="https://www.facebook.com/dialog/feed?app_id=1585088821786423&link=' + shareURL + '"></a>' +
             '<a class="twitterButton" id="' + twitterButtonID + '" onClick="shareButtonClicked(' + parentID + ')" target="_blank" href="https://twitter.com/intent/tweet?text=I%20just%20took%20a%20snapshot!&url=' + shareURL + '&via=highfidelity&hashtags=VR,HiFi"></a>' +
         '</div>' +

From 0ac660d4ab5872c30549ffcd031c8af888cecf59 Mon Sep 17 00:00:00 2001
From: Zach Fox <fox@highfidelity.io>
Date: Wed, 26 Apr 2017 16:55:20 -0700
Subject: [PATCH 27/36] Cleanup

---
 scripts/system/html/css/SnapshotReview.css | 2 +-
 scripts/system/snapshot.js                 | 2 ++
 2 files changed, 3 insertions(+), 1 deletion(-)

diff --git a/scripts/system/html/css/SnapshotReview.css b/scripts/system/html/css/SnapshotReview.css
index 9258aa7f1a..d86befc30a 100644
--- a/scripts/system/html/css/SnapshotReview.css
+++ b/scripts/system/html/css/SnapshotReview.css
@@ -117,7 +117,7 @@ input[type=button].naked:active {
 .shareButtons {
     display: flex;
     align-items: center;
-    margin-left: 40px;
+    margin-left: 30px;
     height: 100%;
 }
 .blastToConnections {
diff --git a/scripts/system/snapshot.js b/scripts/system/snapshot.js
index 9ec81eec10..ecb7aba982 100644
--- a/scripts/system/snapshot.js
+++ b/scripts/system/snapshot.js
@@ -36,6 +36,8 @@ var shareAfterLogin = false;
 var snapshotToShareAfterLogin;
 var METAVERSE_BASE = location.metaverseServerUrl;
 
+// It's totally unnecessary to return to C++ to perform many of these requests, such as DELETEing an old story,
+// POSTING a new one, PUTTING a new audience, or GETTING story data. It's far more efficient to do all of that within JS
 function request(options, callback) { // cb(error, responseOfCorrectContentType) of url. A subset of npm request.
     var httpRequest = new XMLHttpRequest(), key;
     // QT bug: apparently doesn't handle onload. Workaround using readyState.

From 7297355183b7fccbdc40f796b40e4012ba08532e Mon Sep 17 00:00:00 2001
From: Zach Fox <fox@highfidelity.io>
Date: Wed, 26 Apr 2017 17:16:01 -0700
Subject: [PATCH 28/36] Open ShareBar on P0 by default

---
 scripts/system/html/SnapshotReview.html  | 2 +-
 scripts/system/html/js/SnapshotReview.js | 3 +++
 2 files changed, 4 insertions(+), 1 deletion(-)

diff --git a/scripts/system/html/SnapshotReview.html b/scripts/system/html/SnapshotReview.html
index 9469a9d313..fb40c04d05 100644
--- a/scripts/system/html/SnapshotReview.html
+++ b/scripts/system/html/SnapshotReview.html
@@ -9,7 +9,7 @@
 
 <body>
     <div class="title">
-        <label>Snapshot Review</label>
+        <label>Snapshots</label>
         <label id="settingsLabel" for="snapshotSettings">Settings</label>
         <input type="button" class="hifi-glyph naked" id="snapshotSettings" value="@" onclick="snapshotSettings()" />
     </div>
diff --git a/scripts/system/html/js/SnapshotReview.js b/scripts/system/html/js/SnapshotReview.js
index eb28aa4be5..8a204840ac 100644
--- a/scripts/system/html/js/SnapshotReview.js
+++ b/scripts/system/html/js/SnapshotReview.js
@@ -89,6 +89,9 @@ function appendShareBar(divID, story_id, isGif, hifiShareButtonsDisabled) {
     var parentDiv = document.getElementById(divID);
     parentDiv.setAttribute('data-story-id', story_id);
     document.getElementById(divID).appendChild(createShareBar(divID, isGif, story_url, hifiShareButtonsDisabled));
+    if (divID === "p0") {
+        selectImageToShare(divID, true);
+    }
 }
 function createShareBar(parentID, isGif, shareURL, hifiShareButtonsDisabled) {
     var shareBar = document.createElement("div");

From 832e16ef8644bcc9b29735f52eb318040a00480d Mon Sep 17 00:00:00 2001
From: Zach Fox <fox@highfidelity.io>
Date: Thu, 27 Apr 2017 11:18:23 -0700
Subject: [PATCH 29/36] Visual tweaks; fix active share buttons; comment out
 tests

---
 scripts/system/html/css/SnapshotReview.css | 13 ++++++++-----
 scripts/system/html/css/hifi-style.css     |  2 ++
 scripts/system/html/js/SnapshotReview.js   | 14 +++++++++-----
 3 files changed, 19 insertions(+), 10 deletions(-)

diff --git a/scripts/system/html/css/SnapshotReview.css b/scripts/system/html/css/SnapshotReview.css
index d86befc30a..12b91d372b 100644
--- a/scripts/system/html/css/SnapshotReview.css
+++ b/scripts/system/html/css/SnapshotReview.css
@@ -60,6 +60,8 @@ input[type=button].naked:active {
 .snapshotInstructions {
     font-family: Raleway-Regular;
     margin: 0 20px;
+    width: 100%;
+    height: 50%;
 }
 /*
 // END styling of snapshot instructions panel
@@ -119,6 +121,7 @@ input[type=button].naked:active {
     align-items: center;
     margin-left: 30px;
     height: 100%;
+    width: 80%;
 }
 .blastToConnections {
     text-align: left;
@@ -158,6 +161,7 @@ input[type=button].naked:active {
     text-shadow: 2px 2px 3px #000000;
     height: 100%;
     margin-right: 10px;
+    width: 20%;
 }
 .showShareButton {
     width: 40px;
@@ -217,7 +221,6 @@ input[type=button].naked:active {
     width: 100%;
     position: absolute;
     left: 0;
-    margin-top: 8px;
     overflow: hidden;
     display: flex;
     justify-content: center;
@@ -225,20 +228,20 @@ input[type=button].naked:active {
 #snap-settings {
     display: inline;
     width: 150px;
-    margin: auto;
+    margin: 2px auto 0 auto;
 }
 #snap-settings form input {
     margin-bottom: 5px;
 }
 
 #snap-button {
-    width: 75px;
-    height: 75px;
+    width: 72px;
+    height: 72px;
     padding: 0;
     border-radius: 50%;
     background: #EA4C5F;
     border: 3px solid white;
-    margin: auto;
+    margin: 2px auto 0 auto;
     box-sizing: content-box;
     display: inline;
     outline:none;
diff --git a/scripts/system/html/css/hifi-style.css b/scripts/system/html/css/hifi-style.css
index 6e8dd7c710..37810707e0 100644
--- a/scripts/system/html/css/hifi-style.css
+++ b/scripts/system/html/css/hifi-style.css
@@ -156,6 +156,8 @@ input[type=radio]:active + label > span > span{
     border-radius: 3px;
     border-width: 0px;
     background-image: linear-gradient(#00B4EF, #1080B8);
+    min-height: 30px;
+
 }
 .blueButton:hover {
     background-image: linear-gradient(#00B4EF, #00B4EF);
diff --git a/scripts/system/html/js/SnapshotReview.js b/scripts/system/html/js/SnapshotReview.js
index 8a204840ac..f5aaa59d90 100644
--- a/scripts/system/html/js/SnapshotReview.js
+++ b/scripts/system/html/js/SnapshotReview.js
@@ -22,7 +22,9 @@ function showSetupInstructions() {
     "<h4>Setup Instructions</h4>" +
     "<p>Before you can begin taking snaps, please choose where you'd like to save snaps on your computer:</p>" +
     '<br/>' +
-    '<input type="button" value="CHOOSE" onclick="chooseSnapshotLocation()" />';
+    '<div style="text-align:center;">' +
+        '<input class="blueButton" style="margin-left:auto;margin-right:auto;width:130px;" type="button" value="CHOOSE" onclick="chooseSnapshotLocation()" />' +
+    '</div>';
     document.getElementById("snap-button").disabled = true;
 }
 function showSetupComplete() {
@@ -106,7 +108,7 @@ function createShareBar(parentID, isGif, shareURL, hifiShareButtonsDisabled) {
     var facebookButtonID = parentID + "facebookButton";
     var twitterButtonID = parentID + "twitterButton";
     shareBar.innerHTML += '' +
-        '<div class="shareButtons" id="' + shareButtonsDivID + '" style="opacity:0">' +
+        '<div class="shareButtons" id="' + shareButtonsDivID + '" style="visibility:hidden">' +
             '<input type="button"' + (hifiShareButtonsDisabled ? ' disabled="disabled"' : '') + ' class="blastToConnections blueButton" id="' + blastToConnectionsButtonID + '" value="BLAST TO MY CONNECTIONS" onclick="blastToConnections(' + parentID + ', ' + isGif + ')" />' +
             '<input type="button"' + (hifiShareButtonsDisabled ? ' disabled="disabled"' : '') + ' class="shareWithEveryone" id="' + shareWithEveryoneButtonID + '" onclick="shareWithEveryone(' + parentID + ', ' + isGif + ')" />' +
             '<a class="facebookButton" id="' + facebookButtonID + '" onClick="shareButtonClicked(' + parentID + ')" target="_blank" href="https://www.facebook.com/dialog/feed?app_id=1585088821786423&link=' + shareURL + '"></a>' +
@@ -141,7 +143,7 @@ function selectImageToShare(selectedID, isSelected) {
 
         shareBar.style.backgroundColor = "rgba(0, 0, 0, 0.5)";
 
-        shareButtonsDiv.style.opacity = "1.0";
+        shareButtonsDiv.style.visibility = "visible";
     } else {
         showShareButtonsButton.onclick = function () { selectImageToShare(selectedID, true) };
         showShareButtonsButton.classList.remove("active");
@@ -151,7 +153,7 @@ function selectImageToShare(selectedID, isSelected) {
 
         shareBar.style.backgroundColor = "rgba(0, 0, 0, 0.0)";
 
-        shareButtonsDiv.style.opacity = "0.0";
+        shareButtonsDiv.style.visibility = "hidden";
     }
 }
 function shareForUrl(selectedID) {
@@ -223,7 +225,9 @@ function handleCaptureSetting(setting) {
 
 }
 window.onload = function () {
-    testInBrowser(false);
+    // Uncomment the line below to test functionality in a browser.
+    // See definition of "testInBrowser()" to modify tests.
+    //testInBrowser(true);
     openEventBridge(function () {
         // Set up a handler for receiving the data, and tell the .js we are ready to receive it.
         EventBridge.scriptEventReceived.connect(function (message) {

From 794751abfaa6a158fac25ba39ae934141f0e91e4 Mon Sep 17 00:00:00 2001
From: Zach Fox <fox@highfidelity.io>
Date: Thu, 27 Apr 2017 11:28:18 -0700
Subject: [PATCH 30/36] Nested objects aren't REAL!

---
 scripts/system/snapshot.js | 6 ++++--
 1 file changed, 4 insertions(+), 2 deletions(-)

diff --git a/scripts/system/snapshot.js b/scripts/system/snapshot.js
index ecb7aba982..6d0c4bbf58 100644
--- a/scripts/system/snapshot.js
+++ b/scripts/system/snapshot.js
@@ -203,10 +203,12 @@ function onMessage(message) {
                                 path: response.user_story.path,
                                 place_name: response.user_story.place_name,
                                 thumbnail_url: response.user_story.thumbnail_url,
-                                details: {
+                                // For historical reasons, the server doesn't take nested JSON objects.
+                                // Thus, I'm required to STRINGIFY what should be a nested object.
+                                details: JSON.stringify({
                                     shareable_url: response.user_story.details.shareable_url,
                                     image_url: response.user_story.details.image_url
-                                }
+                                })
                             }
                         }
                         request({

From 3ce81844da80673531b8611d360bf9b211ac0da8 Mon Sep 17 00:00:00 2001
From: Zach Fox <fox@highfidelity.io>
Date: Thu, 27 Apr 2017 12:53:35 -0700
Subject: [PATCH 31/36] Snapshot JS interface for better Settings handling

---
 interface/src/Application.cpp              | 3 +++
 interface/src/ui/Snapshot.cpp              | 7 +++++++
 interface/src/ui/Snapshot.h                | 9 ++++++++-
 interface/src/ui/overlays/Web3DOverlay.cpp | 2 ++
 scripts/system/snapshot.js                 | 6 +++---
 5 files changed, 23 insertions(+), 4 deletions(-)

diff --git a/interface/src/Application.cpp b/interface/src/Application.cpp
index d5e1d2201b..171c755101 100644
--- a/interface/src/Application.cpp
+++ b/interface/src/Application.cpp
@@ -535,6 +535,7 @@ bool setupEssentials(int& argc, char** argv) {
     DependencyManager::set<OctreeStatsProvider>(nullptr, qApp->getOcteeSceneStats());
     DependencyManager::set<AvatarBookmarks>();
     DependencyManager::set<LocationBookmarks>();
+    DependencyManager::set<Snapshot>();
 
     return previousSessionCrashed;
 }
@@ -2052,6 +2053,7 @@ void Application::initializeUi() {
     rootContext->setContextProperty("Scene", DependencyManager::get<SceneScriptingInterface>().data());
     rootContext->setContextProperty("Render", _renderEngine->getConfiguration().get());
     rootContext->setContextProperty("Reticle", getApplicationCompositor().getReticleInterface());
+    rootContext->setContextProperty("Snapshot", DependencyManager::get<Snapshot>().data());
 
     rootContext->setContextProperty("ApplicationCompositor", &getApplicationCompositor());
 
@@ -5504,6 +5506,7 @@ void Application::registerScriptEngineWithApplicationServices(ScriptEngine* scri
     scriptEngine->registerGlobalObject("Menu", MenuScriptingInterface::getInstance());
     scriptEngine->registerGlobalObject("Stats", Stats::getInstance());
     scriptEngine->registerGlobalObject("Settings", SettingsScriptingInterface::getInstance());
+    scriptEngine->registerGlobalObject("Snapshot", DependencyManager::get<Snapshot>().data());
     scriptEngine->registerGlobalObject("AudioDevice", AudioDeviceScriptingInterface::getInstance());
     scriptEngine->registerGlobalObject("AudioStats", DependencyManager::get<AudioClient>()->getStats().data());
     scriptEngine->registerGlobalObject("AudioScope", DependencyManager::get<AudioScope>().data());
diff --git a/interface/src/ui/Snapshot.cpp b/interface/src/ui/Snapshot.cpp
index f75190530c..59ecce5bc7 100644
--- a/interface/src/ui/Snapshot.cpp
+++ b/interface/src/ui/Snapshot.cpp
@@ -194,3 +194,10 @@ void Snapshot::uploadSnapshot(const QString& filename, const QUrl& href) {
                                 multiPart);
 }
 
+QString Snapshot::getSnapshotsLocation() {
+    return snapshotsLocation.get("");
+}
+
+void Snapshot::setSnapshotsLocation(const QString& location) {
+    snapshotsLocation.set(location);
+}
diff --git a/interface/src/ui/Snapshot.h b/interface/src/ui/Snapshot.h
index 14e1bc2e9f..93ffbbc7bb 100644
--- a/interface/src/ui/Snapshot.h
+++ b/interface/src/ui/Snapshot.h
@@ -18,6 +18,7 @@
 #include <QStandardPaths>
 
 #include <SettingHandle.h>
+#include <DependencyManager.h>
 
 class QFile;
 class QTemporaryFile;
@@ -32,7 +33,9 @@ private:
     QUrl _URL;
 };
 
-class Snapshot {
+class Snapshot : public QObject, public Dependency {
+    Q_OBJECT
+    SINGLETON_DEPENDENCY
 public:
     static QString saveSnapshot(QImage image);
     static QTemporaryFile* saveTempSnapshot(QImage image);
@@ -40,6 +43,10 @@ public:
 
     static Setting::Handle<QString> snapshotsLocation;
     static void uploadSnapshot(const QString& filename, const QUrl& href = QUrl(""));
+
+public slots:
+    Q_INVOKABLE QString getSnapshotsLocation();
+    Q_INVOKABLE void setSnapshotsLocation(const QString& location);
 private:
     static QFile* savedFileForSnapshot(QImage & image, bool isTemporary);
 };
diff --git a/interface/src/ui/overlays/Web3DOverlay.cpp b/interface/src/ui/overlays/Web3DOverlay.cpp
index 24b12dacf0..fedead5aa5 100644
--- a/interface/src/ui/overlays/Web3DOverlay.cpp
+++ b/interface/src/ui/overlays/Web3DOverlay.cpp
@@ -51,6 +51,7 @@
 #include "ui/AvatarInputs.h"
 #include "avatar/AvatarManager.h"
 #include "scripting/GlobalServicesScriptingInterface.h"
+#include "ui/Snapshot.h"
 
 static const float DPI = 30.47f;
 static const float INCHES_TO_METERS = 1.0f / 39.3701f;
@@ -177,6 +178,7 @@ void Web3DOverlay::loadSourceURL() {
         _webSurface->getRootContext()->setContextProperty("Quat", new Quat());
         _webSurface->getRootContext()->setContextProperty("MyAvatar", DependencyManager::get<AvatarManager>()->getMyAvatar().get());
         _webSurface->getRootContext()->setContextProperty("Entities", DependencyManager::get<EntityScriptingInterface>().data());
+        _webSurface->getRootContext()->setContextProperty("Snapshot", DependencyManager::get<Snapshot>().data());
 
         if (_webSurface->getRootItem() && _webSurface->getRootItem()->objectName() == "tabletRoot") {
             auto tabletScriptingInterface = DependencyManager::get<TabletScriptingInterface>();
diff --git a/scripts/system/snapshot.js b/scripts/system/snapshot.js
index 6d0c4bbf58..e342a5d149 100644
--- a/scripts/system/snapshot.js
+++ b/scripts/system/snapshot.js
@@ -7,7 +7,7 @@
 // Distributed under the Apache License, Version 2.0
 // See the accompanying file LICENSE or http://www.apache.org/licenses/LICENSE-2.0.html
 //
-/* globals Tablet, Script, HMD, Settings, DialogsManager, Menu, Reticle, OverlayWebWindow, Desktop, Account, MyAvatar */
+/* globals Tablet, Script, HMD, Settings, DialogsManager, Menu, Reticle, OverlayWebWindow, Desktop, Account, MyAvatar, Snapshot */
 /* eslint indent: ["error", 4, { "outerIIFEBody": 0 }] */
 
 (function() { // BEGIN LOCAL_SCOPE
@@ -116,7 +116,7 @@ function onMessage(message) {
                 action: "captureSettings",
                 setting: Settings.getValue("alsoTakeAnimatedSnapshot", true)
             }));
-            if (Settings.getValue("snapshotsLocation", "") !== "") {
+            if (Snapshot.getSnapshotsLocation() !== "") {
                 tablet.emitScriptEvent(JSON.stringify({
                     type: "snapshot",
                     action: "showPreviousImages",
@@ -141,7 +141,7 @@ function onMessage(message) {
             var snapshotPath = Window.browseDir("Choose Snapshots Directory", "", "");
 
             if (snapshotPath) { // not cancelled
-                Settings.setValue("snapshotsLocation", snapshotPath);
+                Snapshot.setSnapshotsLocation(snapshotPath);
                 tablet.emitScriptEvent(JSON.stringify({
                     type: "snapshot",
                     action: "snapshotLocationChosen"

From 4152e44d2c123eca7fd55500a63645d74093af02 Mon Sep 17 00:00:00 2001
From: Zach Fox <fox@highfidelity.io>
Date: Thu, 27 Apr 2017 13:14:48 -0700
Subject: [PATCH 32/36] Click anywhere on the image except the bottom to toggle
 share buttons

---
 scripts/system/html/js/SnapshotReview.js | 10 ++++++++--
 1 file changed, 8 insertions(+), 2 deletions(-)

diff --git a/scripts/system/html/js/SnapshotReview.js b/scripts/system/html/js/SnapshotReview.js
index f5aaa59d90..d8f1eceae3 100644
--- a/scripts/system/html/js/SnapshotReview.js
+++ b/scripts/system/html/js/SnapshotReview.js
@@ -111,8 +111,8 @@ function createShareBar(parentID, isGif, shareURL, hifiShareButtonsDisabled) {
         '<div class="shareButtons" id="' + shareButtonsDivID + '" style="visibility:hidden">' +
             '<input type="button"' + (hifiShareButtonsDisabled ? ' disabled="disabled"' : '') + ' class="blastToConnections blueButton" id="' + blastToConnectionsButtonID + '" value="BLAST TO MY CONNECTIONS" onclick="blastToConnections(' + parentID + ', ' + isGif + ')" />' +
             '<input type="button"' + (hifiShareButtonsDisabled ? ' disabled="disabled"' : '') + ' class="shareWithEveryone" id="' + shareWithEveryoneButtonID + '" onclick="shareWithEveryone(' + parentID + ', ' + isGif + ')" />' +
-            '<a class="facebookButton" id="' + facebookButtonID + '" onClick="shareButtonClicked(' + parentID + ')" target="_blank" href="https://www.facebook.com/dialog/feed?app_id=1585088821786423&link=' + shareURL + '"></a>' +
-            '<a class="twitterButton" id="' + twitterButtonID + '" onClick="shareButtonClicked(' + parentID + ')" target="_blank" href="https://twitter.com/intent/tweet?text=I%20just%20took%20a%20snapshot!&url=' + shareURL + '&via=highfidelity&hashtags=VR,HiFi"></a>' +
+            '<a class="facebookButton" id="' + facebookButtonID + '" onclick="shareButtonClicked(' + parentID + ')" target="_blank" href="https://www.facebook.com/dialog/feed?app_id=1585088821786423&link=' + shareURL + '"></a>' +
+            '<a class="twitterButton" id="' + twitterButtonID + '" onclick="shareButtonClicked(' + parentID + ')" target="_blank" href="https://twitter.com/intent/tweet?text=I%20just%20took%20a%20snapshot!&url=' + shareURL + '&via=highfidelity&hashtags=VR,HiFi"></a>' +
         '</div>' +
         '<div class="showShareButtonsButtonDiv" id="' + showShareButtonsButtonDivID + '">' +
             '<label id="' + showShareButtonsLabelID + '" for="' + showShareButtonsButtonID + '">SHARE</label>' +
@@ -122,6 +122,9 @@ function createShareBar(parentID, isGif, shareURL, hifiShareButtonsDisabled) {
             '</div>' +
         '</div>';
 
+    // Add onclick handler to parent DIV's img to toggle share buttons
+    document.getElementById(parentID + 'img').onclick = function () { selectImageToShare(parentID, true) };
+
     return shareBar;
 }
 function selectImageToShare(selectedID, isSelected) {
@@ -129,6 +132,7 @@ function selectImageToShare(selectedID, isSelected) {
         selectedID = selectedID.id; // sometimes (?), `selectedID` is passed as an HTML object to these functions; we just want the ID
     }
     var imageContainer = document.getElementById(selectedID);
+    var image = document.getElementById(selectedID + 'img');
     var shareBar = document.getElementById(selectedID + "shareBar");
     var shareButtonsDiv = document.getElementById(selectedID + "shareButtonsDiv");
     var showShareButtonsButton = document.getElementById(selectedID + "showShareButtonsButton");
@@ -138,6 +142,7 @@ function selectImageToShare(selectedID, isSelected) {
         showShareButtonsButton.classList.remove("inactive");
         showShareButtonsButton.classList.add("active");
 
+        image.onclick = function () { selectImageToShare(selectedID, false) };
         imageContainer.style.outline = "4px solid #00b4ef";
         imageContainer.style.outlineOffset = "-4px";
 
@@ -149,6 +154,7 @@ function selectImageToShare(selectedID, isSelected) {
         showShareButtonsButton.classList.remove("active");
         showShareButtonsButton.classList.add("inactive");
 
+        image.onclick = function () { selectImageToShare(selectedID, true) };
         imageContainer.style.outline = "none";
 
         shareBar.style.backgroundColor = "rgba(0, 0, 0, 0.0)";

From 3f146fca9de0b20b35958b1216a23f2ab0cf320b Mon Sep 17 00:00:00 2001
From: Zach Fox <fox@highfidelity.io>
Date: Thu, 27 Apr 2017 15:36:59 -0700
Subject: [PATCH 33/36] Fix announcement audience; Fix disabled buttons

---
 scripts/system/html/css/hifi-style.css   |  2 +-
 scripts/system/html/js/SnapshotReview.js | 12 ++++++------
 scripts/system/snapshot.js               |  2 +-
 3 files changed, 8 insertions(+), 8 deletions(-)

diff --git a/scripts/system/html/css/hifi-style.css b/scripts/system/html/css/hifi-style.css
index 37810707e0..f1ace02eb0 100644
--- a/scripts/system/html/css/hifi-style.css
+++ b/scripts/system/html/css/hifi-style.css
@@ -166,5 +166,5 @@ input[type=radio]:active + label > span > span{
     background-image: linear-gradient(#1080B8, #1080B8);
 }
 .blueButton:disabled {
-    background-image: linear-gradient(#FFFFFF, ##AFAFAF);
+    background-image: linear-gradient(#FFFFFF, #AFAFAF);
 }
\ No newline at end of file
diff --git a/scripts/system/html/js/SnapshotReview.js b/scripts/system/html/js/SnapshotReview.js
index d8f1eceae3..53f4d17930 100644
--- a/scripts/system/html/js/SnapshotReview.js
+++ b/scripts/system/html/js/SnapshotReview.js
@@ -109,8 +109,8 @@ function createShareBar(parentID, isGif, shareURL, hifiShareButtonsDisabled) {
     var twitterButtonID = parentID + "twitterButton";
     shareBar.innerHTML += '' +
         '<div class="shareButtons" id="' + shareButtonsDivID + '" style="visibility:hidden">' +
-            '<input type="button"' + (hifiShareButtonsDisabled ? ' disabled="disabled"' : '') + ' class="blastToConnections blueButton" id="' + blastToConnectionsButtonID + '" value="BLAST TO MY CONNECTIONS" onclick="blastToConnections(' + parentID + ', ' + isGif + ')" />' +
-            '<input type="button"' + (hifiShareButtonsDisabled ? ' disabled="disabled"' : '') + ' class="shareWithEveryone" id="' + shareWithEveryoneButtonID + '" onclick="shareWithEveryone(' + parentID + ', ' + isGif + ')" />' +
+            '<input type="button"' + (hifiShareButtonsDisabled ? ' disabled' : '') + ' class="blastToConnections blueButton" id="' + blastToConnectionsButtonID + '" value="BLAST TO MY CONNECTIONS" onclick="blastToConnections(' + parentID + ', ' + isGif + ')" />' +
+            '<input type="button"' + (hifiShareButtonsDisabled ? ' disabled' : '') + ' class="shareWithEveryone" id="' + shareWithEveryoneButtonID + '" onclick="shareWithEveryone(' + parentID + ', ' + isGif + ')" />' +
             '<a class="facebookButton" id="' + facebookButtonID + '" onclick="shareButtonClicked(' + parentID + ')" target="_blank" href="https://www.facebook.com/dialog/feed?app_id=1585088821786423&link=' + shareURL + '"></a>' +
             '<a class="twitterButton" id="' + twitterButtonID + '" onclick="shareButtonClicked(' + parentID + ')" target="_blank" href="https://twitter.com/intent/tweet?text=I%20just%20took%20a%20snapshot!&url=' + shareURL + '&via=highfidelity&hashtags=VR,HiFi"></a>' +
         '</div>' +
@@ -172,8 +172,8 @@ function shareForUrl(selectedID) {
 function blastToConnections(selectedID, isGif) {
     selectedID = selectedID.id; // `selectedID` is passed as an HTML object to these functions; we just want the ID
 
-    document.getElementById(selectedID + "blastToConnectionsButton").setAttribute("disabled", "disabled");
-    document.getElementById(selectedID + "shareWithEveryoneButton").setAttribute("disabled", "disabled");
+    document.getElementById(selectedID + "blastToConnectionsButton").disabled = true;
+    document.getElementById(selectedID + "shareWithEveryoneButton").disabled = true;
 
     EventBridge.emitWebEvent(JSON.stringify({
         type: "snapshot",
@@ -185,8 +185,8 @@ function blastToConnections(selectedID, isGif) {
 function shareWithEveryone(selectedID, isGif) {
     selectedID = selectedID.id; // `selectedID` is passed as an HTML object to these functions; we just want the ID
 
-    document.getElementById(selectedID + "blastToConnectionsButton").setAttribute("disabled", "disabled");
-    document.getElementById(selectedID + "shareWithEveryoneButton").setAttribute("disabled", "disabled");
+    document.getElementById(selectedID + "blastToConnectionsButton").disabled = true;
+    document.getElementById(selectedID + "shareWithEveryoneButton").disabled = true;
 
     EventBridge.emitWebEvent(JSON.stringify({
         type: "snapshot",
diff --git a/scripts/system/snapshot.js b/scripts/system/snapshot.js
index e342a5d149..1cc24b8265 100644
--- a/scripts/system/snapshot.js
+++ b/scripts/system/snapshot.js
@@ -198,7 +198,7 @@ function onMessage(message) {
                     } else {
                         var requestBody = {
                             user_story: {
-                                audience: "for_feed",
+                                audience: "for_connections",
                                 action: "announcement",
                                 path: response.user_story.path,
                                 place_name: response.user_story.place_name,

From aed762e986ba38fd42de41274050725e842e6c7e Mon Sep 17 00:00:00 2001
From: howard-stearns <howard.stearns@gmail.com>
Date: Thu, 27 Apr 2017 17:16:03 -0700
Subject: [PATCH 34/36] ux

---
 interface/resources/qml/hifi/Card.qml         |  70 ++++++-----
 interface/resources/qml/hifi/Feed.qml         |  34 +++--
 .../qml/hifi/tablet/TabletAddressDialog.qml   | 116 ++++++++++--------
 3 files changed, 127 insertions(+), 93 deletions(-)

diff --git a/interface/resources/qml/hifi/Card.qml b/interface/resources/qml/hifi/Card.qml
index 59fa66af0b..0b34a8f9ac 100644
--- a/interface/resources/qml/hifi/Card.qml
+++ b/interface/resources/qml/hifi/Card.qml
@@ -17,7 +17,7 @@ import QtGraphicalEffects 1.0
 import "toolbars"
 import "../styles-uit"
 
-Rectangle {
+Item {
     id: root;
     property string userName: "";
     property string placeName: "";
@@ -45,7 +45,7 @@ Rectangle {
     property int textSizeSmall: 18;
     property int stackShadowNarrowing: 5;
     property string defaultThumbnail: Qt.resolvedUrl("../../images/default-domain.gif");
-    property int shadowHeight: 20;
+    property int shadowHeight: 10;
     HifiConstants { id: hifi }
 
     function pastTime(timestamp) { // Answer a descriptive string
@@ -70,6 +70,40 @@ Rectangle {
     }
 
     property bool hasGif: imageUrl.indexOf('.gif') === (imageUrl.length - 4);
+
+    DropShadow {
+        visible: isStacked;
+        anchors.fill: shadow1;
+        source: shadow1;
+        verticalOffset: 2;
+        radius: 4;
+        samples: 9;
+        color: hifi.colors.baseGrayShadow;
+    }
+    Rectangle {
+        id: shadow1;
+        visible: isStacked;
+        width: parent.width - stackShadowNarrowing;
+        height: shadowHeight;
+        anchors {
+            top: parent.bottom;
+            horizontalCenter: parent.horizontalCenter;
+        }
+    }
+    DropShadow {
+        anchors.fill: base;
+        source: base;
+        verticalOffset: 2;
+        radius: 4;
+        samples: 9;
+        color: hifi.colors.baseGrayShadow;
+    }
+    Rectangle {
+        id: base;
+        color: "white";
+        anchors.fill: parent;
+    }
+
     AnimatedImage {
         id: animation;
         // Always visible, to drive loading, but initially covered up by lobby during load.
@@ -96,34 +130,6 @@ Rectangle {
             }
         }
     }
-    Rectangle {
-        id: shadow1;
-        visible: isStacked;
-        width: parent.width - stackShadowNarrowing;
-        height: shadowHeight / 2;
-        anchors {
-            top: parent.bottom;
-            horizontalCenter: parent.horizontalCenter;
-        }
-        gradient: Gradient {
-            GradientStop { position: 0.0; color: "gray" }
-            GradientStop { position: 1.0; color: "white" }
-        }
-    }
-    Rectangle {
-        id: shadow2;
-        visible: isStacked;
-        width: shadow1.width - stackShadowNarrowing;
-        height: shadowHeight / 2;
-        anchors {
-            top: shadow1.bottom;
-            horizontalCenter: parent.horizontalCenter;
-        }
-        gradient: Gradient {
-            GradientStop { position: 0.0; color: "gray" }
-            GradientStop { position: 1.0; color: "white" }
-        }
-    }
     property int dropHorizontalOffset: 0;
     property int dropVerticalOffset: 1;
     property int dropRadius: 2;
@@ -168,7 +174,7 @@ Rectangle {
             source: "../../images/snap-icon.svg"
             width: 40;
             height: 40;
-            visible: action === 'snapshot';
+            visible: (action === 'snapshot') && (messageHeight >= 40);
         }
         RalewayRegular {
             id: message;
@@ -209,7 +215,7 @@ Rectangle {
     StateImage {
         id: actionIcon;
         imageURL: "../../images/info-icon-2-state.svg";
-        size: 32;
+        size: 30;
         buttonState: messageArea.containsMouse ? 1 : 0;
         anchors {
             bottom: parent.bottom;
diff --git a/interface/resources/qml/hifi/Feed.qml b/interface/resources/qml/hifi/Feed.qml
index d95518b891..8cae42f21c 100644
--- a/interface/resources/qml/hifi/Feed.qml
+++ b/interface/resources/qml/hifi/Feed.qml
@@ -23,7 +23,15 @@ Column {
 
     property int cardWidth: 212;
     property int cardHeight: 152;
-    property int stackedCardShadowHeight: 10;
+    property int textPadding: 10;
+    property int smallMargin: 4;
+    property int messageHeight: 40;
+    property int textSize: 24;
+    property int textSizeSmall: 18;
+    property int stackShadowNarrowing: 5;
+    property int stackedCardShadowHeight: 4;
+    property int labelSize: 20;
+
     property string metaverseServerUrl: '';
     property string actions: 'snapshot';
     onActionsChanged: fillDestinations();
@@ -161,25 +169,27 @@ Column {
         root.visible = !!suggestions.count;
     }
 
-    RalewayLight {
+    RalewayBold {
         id: label;
         text: labelText;
-        color: hifi.colors.white;
-        size: 28;
+        color: hifi.colors.blueAccent;
+        size: labelSize;
     }
     ListView {
         id: scroll;
-        clip: true;
+        //fixme clip: true;
         model: suggestions;
         orientation: ListView.Horizontal;
         highlightMoveDuration: -1;
         highlightMoveVelocity: -1;
-        highlight: Rectangle { color: "transparent"; border.width: 4; border.color: hifiStyleConstants.colors.blueHighlight; z: 1; }
+        highlight: Rectangle { color: "transparent"; border.width: 4; border.color: hifiStyleConstants.colors.primaryHighlight; z: 1; }
+        currentIndex: -1;
 
-        spacing: 14;
+        spacing: 12;
         width: parent.width;
         height: cardHeight + stackedCardShadowHeight;
         delegate: Card {
+            id: card;
             width: cardWidth;
             height: cardHeight;
             goFunction: root.goFunction;
@@ -193,7 +203,15 @@ Column {
             onlineUsers: model.online_users;
             storyId: model.metaverseId;
             drillDownToPlace: model.drillDownToPlace;
-            shadowHeight: stackedCardShadowHeight;
+
+            textPadding: root.textPadding;
+            smallMargin: root.smallMargin;
+            messageHeight: root.messageHeight;
+            textSize: root.textSize;
+            textSizeSmall: root.textSizeSmall;
+            stackShadowNarrowing: root.stackShadowNarrowing;
+            shadowHeight: root.stackedCardShadowHeight;
+
             hoverThunk: function () { scroll.currentIndex = index; }
             unhoverThunk: function () { scroll.currentIndex = -1; }
         }
diff --git a/interface/resources/qml/hifi/tablet/TabletAddressDialog.qml b/interface/resources/qml/hifi/tablet/TabletAddressDialog.qml
index 5578b94168..3ccdd93542 100644
--- a/interface/resources/qml/hifi/tablet/TabletAddressDialog.qml
+++ b/interface/resources/qml/hifi/tablet/TabletAddressDialog.qml
@@ -154,7 +154,7 @@ StackView {
                 left: parent.left;
             }
 
-            HifiStyles.RalewayLight {
+            HifiStyles.RalewayRegular {
                 id: notice;
                 font.pixelSize: hifi.fonts.pixelSize * 0.7;
                 anchors {
@@ -224,63 +224,73 @@ StackView {
 
         Rectangle {
             id: bgMain;
-            color: hifiStyleConstants.colors.faintGray50;
             anchors {
                 top: addressBar.bottom;
                 bottom: parent.keyboardEnabled ? keyboard.top : parent.bottom;
                 left: parent.left;
                 right: parent.right;
             }
-            ScrollView {
-                anchors.fill: bgMain;
-                horizontalScrollBarPolicy: Qt.ScrollBarAlwaysOff;
-                verticalScrollBarPolicy: Qt.ScrollBarAsNeeded;
-                Rectangle { // Column margins require QtQuick 2.7, which we don't use yet.
-                    id: column;
-                    property real pad: 10;
-                    width: bgMain.width - column.pad;
-                    height: stack.height;
-                    color: "transparent";
-                    anchors {
-                        left: parent.left;
-                        leftMargin: column.pad;
-                        topMargin: column.pad;
+            Rectangle {
+                id: addressShadow;
+                width: parent.width;
+                height: 42 - 33;
+                gradient: Gradient {
+                    GradientStop { position: 0.0; color: "gray" }
+                    GradientStop { position: 1.0; color: "white" }
+                }
+            }
+            Rectangle { // Column margins require QtQuick 2.7, which we don't use yet.
+                id: column;
+                property real pad: 10;
+                width: bgMain.width - column.pad;
+                height: stack.height;
+                color: "transparent";
+                anchors {
+                    left: parent.left;
+                    leftMargin: column.pad;
+                    top: addressShadow.bottom;
+                    topMargin: column.pad;
+                }
+                Column {
+                    id: stack;
+                    width: column.width;
+                    spacing: 33 - places.labelSize;
+                    Feed {
+                        id: happeningNow;
+                        width: parent.width;
+                        cardWidth: 312 + (2 * 4);
+                        cardHeight: 163 + (2 * 4);
+                        metaverseServerUrl: addressBarDialog.metaverseServerUrl;
+                        labelText: 'HAPPENING NOW';
+                        actions: 'concurrency,snapshot'; // uncomment this line instead of next to produce fake announcement data for testing.
+                        //actions: 'announcement';
+                        filter: addressLine.text;
+                        goFunction: goCard;
                     }
-                    Column {
-                        id: stack;
-                        width: column.width;
-                        spacing: column.pad;
-                        Feed {
-                            id: happeningNow;
-                            width: parent.width;
-                            property real cardScale: 1.5;
-                            cardWidth: places.cardWidth * happeningNow.cardScale;
-                            cardHeight: places.cardHeight * happeningNow.cardScale;
-                            metaverseServerUrl: addressBarDialog.metaverseServerUrl;
-                            labelText: 'Happening Now';
-                            //actions: 'concurrency,snapshot'; // uncomment this line instead of next to produce fake announcement data for testing.
-                            actions: 'announcement';
-                            filter: addressLine.text;
-                            goFunction: goCard;
-                        }
-                        Feed {
-                            id: places;
-                            width: parent.width;
-                            metaverseServerUrl: addressBarDialog.metaverseServerUrl;
-                            labelText: 'Places';
-                            actions: 'concurrency';
-                            filter: addressLine.text;
-                            goFunction: goCard;
-                        }
-                        Feed {
-                            id: snapshots;
-                            width: parent.width;
-                            metaverseServerUrl: addressBarDialog.metaverseServerUrl;
-                            labelText: 'Recent Activity';
-                            actions: 'snapshot';
-                            filter: addressLine.text;
-                            goFunction: goCard;
-                        }
+                    Feed {
+                        id: places;
+                        width: parent.width;
+                        cardWidth: 210;
+                        cardHeight: 110 + messageHeight;
+                        messageHeight: 44;
+                        metaverseServerUrl: addressBarDialog.metaverseServerUrl;
+                        labelText: 'PLACES';
+                        actions: 'concurrency';
+                        filter: addressLine.text;
+                        goFunction: goCard;
+                    }
+                    Feed {
+                        id: snapshots;
+                        width: parent.width;
+                        cardWidth: 143 + (2 * 4);
+                        cardHeight: 75 + messageHeight + 4;
+                        messageHeight: 32;
+                        textPadding: 6;
+                        metaverseServerUrl: addressBarDialog.metaverseServerUrl;
+                        labelText: 'RECENT SNAPS';
+                        actions: 'snapshot';
+                        filter: addressLine.text;
+                        goFunction: goCard;
                     }
                 }
             }
@@ -369,8 +379,8 @@ StackView {
             notice.text = "Go To a place, @user, path, or network address:";
             notice.color = hifiStyleConstants.colors.baseGrayHighlight;
         } else {
-            notice.text = AddressManager.isConnected ? "Your location:" : "Not Connected";
-            notice.color = AddressManager.isConnected ? hifiStyleConstants.colors.baseGrayHighlight : hifiStyleConstants.colors.redHighlight;
+            notice.text = AddressManager.isConnected ? "YOUR LOCATION" : "NOT CONNECTED";
+            notice.color = AddressManager.isConnected ? hifiStyleConstants.colors.blueHighlight : hifiStyleConstants.colors.redHighlight;
             // Display hostname, which includes ip address, localhost, and other non-placenames.
             location.text = (AddressManager.placename || AddressManager.hostname || '') + (AddressManager.pathname ? AddressManager.pathname.match(/\/[^\/]+/)[0] : '');
         }

From c61e6a8a9e0e392a9455d96f082d7b4923292273 Mon Sep 17 00:00:00 2001
From: "Anthony J. Thibault" <tony@highfidelity.io>
Date: Thu, 27 Apr 2017 18:24:21 -0700
Subject: [PATCH 35/36] AnimInverseKinematics: reduce number of magic constants

---
 .../animation/src/AnimInverseKinematics.cpp     | 17 ++++++++++++-----
 1 file changed, 12 insertions(+), 5 deletions(-)

diff --git a/libraries/animation/src/AnimInverseKinematics.cpp b/libraries/animation/src/AnimInverseKinematics.cpp
index b36abebb1b..6edd969568 100644
--- a/libraries/animation/src/AnimInverseKinematics.cpp
+++ b/libraries/animation/src/AnimInverseKinematics.cpp
@@ -568,8 +568,10 @@ void AnimInverseKinematics::computeHipsOffset(const std::vector<IKTarget>& targe
                 newHipsOffset += targetPosition - actualPosition;
 
                 // Add downward pressure on the hips
-                newHipsOffset *= 0.95f;
-                newHipsOffset -= 1.0f;
+                const float PRESSURE_SCALE_FACTOR = 0.95f;
+                const float PRESSURE_TRANSLATION_OFFSET = 1.0f;
+                newHipsOffset *= PRESSURE_SCALE_FACTOR;
+                newHipsOffset -= PRESSURE_TRANSLATION_OFFSET;
             }
         } else if (target.getType() == IKTarget::Type::RotationAndPosition) {
             glm::vec3 actualPosition = _skeleton->getAbsolutePose(targetIndex, _relativePoses).trans();
@@ -627,7 +629,7 @@ static void setEllipticalSwingLimits(SwingTwistConstraint* stConstraint, float l
     const int NUM_SUBDIVISIONS = 8;
     std::vector<float> minDots;
     minDots.reserve(NUM_SUBDIVISIONS);
-    float dTheta = (2.0f * PI) / NUM_SUBDIVISIONS;
+    float dTheta = TWO_PI / NUM_SUBDIVISIONS;
     float theta = 0.0f;
     for (int i = 0; i < NUM_SUBDIVISIONS; i++) {
         minDots.push_back(cosf(glm::length(glm::vec2(anteriorSwingTheta * cosf(theta), lateralSwingTheta * sinf(theta)))));
@@ -829,7 +831,9 @@ void AnimInverseKinematics::initConstraints() {
             stConstraint->setTwistLimits(-MAX_SPINE_TWIST, MAX_SPINE_TWIST);
 
             // limit lateral swings more then forward-backward swings
-            setEllipticalSwingLimits(stConstraint, PI / 30.0f, PI / 20.0f);
+            const float MAX_SPINE_LATERAL_SWING = PI / 30.0f;
+            const float MAX_SPINE_ANTERIOR_SWING = PI / 20.0f;
+            setEllipticalSwingLimits(stConstraint, MAX_SPINE_LATERAL_SWING, MAX_SPINE_ANTERIOR_SWING);
 
             if (0 == baseName.compare("Spine1", Qt::CaseSensitive)
                     || 0 == baseName.compare("Spine", Qt::CaseSensitive)) {
@@ -844,7 +848,10 @@ void AnimInverseKinematics::initConstraints() {
             const float MAX_NECK_TWIST = PI / 10.0f;
             stConstraint->setTwistLimits(-MAX_NECK_TWIST, MAX_NECK_TWIST);
 
-            setEllipticalSwingLimits(stConstraint, PI / 10.0f, PI / 8.0f);
+            // limit lateral swings more then forward-backward swings
+            const float MAX_NECK_LATERAL_SWING = PI / 10.0f;
+            const float MAX_NECK_ANTERIOR_SWING = PI / 8.0f;
+            setEllipticalSwingLimits(stConstraint, MAX_NECK_LATERAL_SWING, MAX_NECK_ANTERIOR_SWING);
 
             constraint = static_cast<RotationConstraint*>(stConstraint);
         } else if (0 == baseName.compare("Head", Qt::CaseSensitive)) {

From 0ad8f4d985ed7727f9d8cf76bf5d7fec5935c439 Mon Sep 17 00:00:00 2001
From: Howard Stearns <howard@highfidelity.io>
Date: Fri, 28 Apr 2017 07:15:22 -0700
Subject: [PATCH 36/36] remove debugging

---
 interface/resources/qml/hifi/Feed.qml                       | 3 +--
 interface/resources/qml/hifi/tablet/TabletAddressDialog.qml | 4 ++--
 2 files changed, 3 insertions(+), 4 deletions(-)

diff --git a/interface/resources/qml/hifi/Feed.qml b/interface/resources/qml/hifi/Feed.qml
index 8cae42f21c..b03144644a 100644
--- a/interface/resources/qml/hifi/Feed.qml
+++ b/interface/resources/qml/hifi/Feed.qml
@@ -126,7 +126,7 @@ Column {
     }
     function makeFilteredStoryProcessor() { // answer a function(storyData) that adds it to suggestions if it matches
         var words = filter.toUpperCase().split(/\s+/).filter(identity);
-        function suggestable(story) { // fixme add to makeFilteredStoryProcessor
+        function suggestable(story) {
             if (story.action === 'snapshot') {
                 return true;
             }
@@ -177,7 +177,6 @@ Column {
     }
     ListView {
         id: scroll;
-        //fixme clip: true;
         model: suggestions;
         orientation: ListView.Horizontal;
         highlightMoveDuration: -1;
diff --git a/interface/resources/qml/hifi/tablet/TabletAddressDialog.qml b/interface/resources/qml/hifi/tablet/TabletAddressDialog.qml
index 3ccdd93542..9689583649 100644
--- a/interface/resources/qml/hifi/tablet/TabletAddressDialog.qml
+++ b/interface/resources/qml/hifi/tablet/TabletAddressDialog.qml
@@ -262,8 +262,8 @@ StackView {
                         cardHeight: 163 + (2 * 4);
                         metaverseServerUrl: addressBarDialog.metaverseServerUrl;
                         labelText: 'HAPPENING NOW';
-                        actions: 'concurrency,snapshot'; // uncomment this line instead of next to produce fake announcement data for testing.
-                        //actions: 'announcement';
+                        //actions: 'concurrency,snapshot'; // uncomment this line instead of next to produce fake announcement data for testing.
+                        actions: 'announcement';
                         filter: addressLine.text;
                         goFunction: goCard;
                     }