Add a "going back" page-curl transition style

web/scene.js

@@ -946,6 +946,7 @@ Scene.prototype.finish = function finish(buttonName) {
       if (window.isAndroidApp && window.statsMode.get()) return;
       printButton(buttonName || "Next", main, false,
         function() {
+          window.nextCurlStyle = "back";
           clearScreen(loadAndRestoreGame);
         }
       );
@@ -4110,6 +4111,10 @@ Scene.prototype.track_event = function track_event(data) {
   }
 }
 
+Scene.prototype.next_curl_goes_back = function next_curl_goes_back() {
+  window.nextCurlStyle = "back";
+}
+
 Scene.prototype.lineMsg = function lineMsg() {
     return this.name + " line " + (this.lineNum+1) + ": ";
 };
@@ -4235,5 +4240,6 @@ Scene.validCommands = {"comment":1, "goto":1, "gotoref":1, "label":1, "looplimit
     "restart":1,"more_games":1,"delay_ending":1,"end_trial":1,"login":1,"achieve":1,"scene_list":1,"title":1,
     "bug":1,"link_button":1,"check_registration":1,"sound":1,"author":1,"gosub_scene":1,"achievement":1,
     "check_achievements":1,"redirect_scene":1,"print_discount":1,"purchase_discount":1,"track_event":1,
-    "timer":1,"youtube":1,"product":1,"text_image":1,"params":1
+    "timer":1,"youtube":1,"product":1,"text_image":1,"params":1,
+    "next_curl_goes_back":1
     };

web/style.css

@@ -43,26 +43,6 @@ a {
   -webkit-transition-timing-function: ease-in;
 }
 
-@keyframes containerslidein {
-  from {
-    transform: translateX(100%);
-  }
-
-  to {
-    transform: none;
-  }
-}
-
-@-webkit-keyframes containerslidein {
-  from {
-    -webkit-transform: translateX(100%);
-  }
-
-  to {
-    -webkit-transform: none;
-  }
-}
-
 .tempfocus:focus {
   outline: none;
 }

web/ui.js

@@ -89,6 +89,7 @@ function showStats() {
       return clearScreen(function() {
         setButtonTitles();
         loadAndRestoreGame();
+        window.nextCurlStyle = "back";
       });
     }
     var currentScene = window.stats.scene;
@@ -116,6 +117,7 @@ function showAchievements(hideNextButton) {
   if (!button) return;
   if (button.innerHTML == "Return to the Game") {
     return clearScreen(function() {
+      window.nextCurlStyle = "back";
       setButtonTitles();
       loadAndRestoreGame();
     });
@@ -128,6 +130,7 @@ function showAchievements(hideNextButton) {
       printAchievements(document.getElementById("text"));
       if (!hideNextButton) printButton("Next", main, false, function() {
         clearScreen(function() {
+          window.nextCurlStyle = "back";
           setButtonTitles();
           loadAndRestoreGame();
         });
@@ -232,6 +235,7 @@ function textOptionsMenu(categories) {
     if (button.innerHTML == "Menu") return showMenu();
     if (button.innerHTML == "Return to the Game") {
       return clearScreen(function() {
+        window.nextCurlStyle = "back";
         setButtonTitles();
         loadAndRestoreGame();
       });
@@ -278,6 +282,7 @@ function textOptionsMenu(categories) {
     printOptions([""], options, function(option) {
       if (option.resume) {
         return clearScreen(function() {
+          window.nextCurlStyle = "back";
           setButtonTitles();
           loadAndRestoreGame();
         });
@@ -575,6 +580,11 @@ function clearScreen(code) {
 
 // in the iOS app, display a page curl animation
 function curl() {
+  console.log('curl');
+  var back = window.nextCurlStyle === "back";
+  if (back) {
+    window.nextCurlStyle = undefined;
+  }
   var focusFirst = function() {
     var text = document.getElementById("text");
     if (text.firstElementChild) {
@@ -631,10 +641,16 @@ function curl() {
 
     slideoutStyle.innerHTML = "@keyframes containerslideout { "+
       "from { transform: "+container1.style.transform+"; } " +
-      "to   { transform: "+container1.style.transform+" translateX(-105%); } }\n"+
+      "to   { transform: "+container1.style.transform+" translateX("+(back ? "" : "-")+"105%); } }\n"+
       "@-webkit-keyframes containerslideout { "+
       "from { -webkit-transform: "+container1.style.webkitTransform+"; } " +
-      "to   { -webkit-transform: "+container1.style.webkitTransform+" translateX(-105%); } }"+
+      "to   { -webkit-transform: " + container1.style.webkitTransform + " translateX(" + (back ? "" : "-") + "105%); } }" +
+      "@keyframes containerslidein { " +
+      "from { transform: translateX(" + (back ? "-" : "") + "100%); } " +
+      "to   { transform: none; } }\n" +
+      "@-webkit-keyframes containerslidein { " +
+      "from { -webkit-transform: translateX(" + (back ? "-" : "") + "100%); } " +
+      "to   { transform: none; } }\n" +
       timingFunction;
 
     // double rAF so we start after container1 is transformed and scrolled to the top
@@ -661,9 +677,9 @@ function curl() {
                 -6.4041738958415664 * Math.exp(
                   -7.2908241330981340 * fraction));
               container1.style.transform = container1.style.webkitTransform =
-                oldContainer1Transform + " translateX(-" + (105 * fraction) + "%)";
+                oldContainer1Transform + " translateX(" + (back ? "" : "-") + (105 * fraction) + "%)";
               container2.style.transform = container2.style.webkitTransform =
-                "translateX(" + (100 - 100 * fraction) + "%)";
+                "translateX(" + (back ? "-" : "")  + (100 - 100 * fraction) + "%)";
               if (frames < totalSteps) {
                 frames++;
                 requestAnimationFrame(rafSlide);

web/util.js

@@ -731,6 +731,7 @@ function restartGame(shouldPrompt) {
     submitAnyDirtySaves();
     clearCookie(function() {}, 'temp');
     clearCookie(function() {
+      window.nextCurlStyle = "back";
       window.nav.resetStats(window.stats);
       clearScreen(restoreGame);
     }, "");