Merge pull request #49 from tmickel/GH-48

Implement gear icon on the splash page #48

editions/free/src/css/start.css

@@ -152,6 +152,23 @@ div.frame {
 .gettings.hide {display: none;}
 .gettings.show {display: block;}
 
+.gear.hide {display: none;}
+.gear.show {display: block;}
+
+.gear {
+    position: absolute;
+    top: 10px;
+    right: 25px;
+    background: url('../assets/lobby/gearOff.svg');
+    background-repeat: no-repeat;
+    background-size: auto 100%;
+    background-position-x: center;
+    -webkit-tap-highlight-color: transparent;
+    z-index: 1000;
+    width: 60px;
+    height: 60px;
+}
+
 .startcode {
     position: absolute;
     top: 65%;

editions/free/src/index.html

@@ -22,6 +22,7 @@
 
             </div>
         </div>
+        <div class="gear hide" id="gear"></div>
         <div class="credits hide" id="authors"></div>
         <div class="creditsText hide" id="authorsText"></div>
         <div class="rays" id="rays"></div>

src/entry/index.js

@@ -25,6 +25,8 @@ export function indexMain () {
 
         gn('topbar-moreapps').ontouchstart = indexMoreApps;
         gn('topbar-info').ontouchstart = indexInfo;
+    } else {
+        gn('gear').ontouchstart = indexGoSettings;
     }
 
     setTimeout(function () {
@@ -72,6 +74,7 @@ function indexLoadOptions () {
         gn('purpleguy').className = 'purple hide';
         gn('blueguy').className = 'blue hide';
         gn('redguy').className = 'red hide';
+        gn('gear').className = 'gear show';
     }
     gn('gettings').className = 'gettings show';
     gn('startcode').className = 'startcode show';
@@ -99,6 +102,13 @@ function indexGohome () {
     }
 }
 
+function indexGoSettings () {
+    // Switch to the settings selection page
+    // Triggered by tapping the gear icon in the top right
+    ScratchAudio.sndFX('tap.wav');
+    window.location.href = 'home.html?place=gear';
+}
+
 function indexGettingstarted () {
     ScratchAudio.sndFX('tap.wav');
     window.location.href = 'gettingstarted.html?place=home';