Merge pull request #15 from rsninja722/transition1

Added beginning transition

docs/assets/js/UI/ui.js

@@ -2,9 +2,6 @@
 function drawTitleScreenUI() {
 }
 
-// UI for level transition
-function drawLevelTransitionUI() {
-}
 
 // UI for playing
 function drawPlayingUI() {

docs/assets/js/constants.js

@@ -53,7 +53,9 @@ var constants = {
         hip: {
             offset_x: 15,
             offset_y: 25
-        }
+        },
+        defaultX: 500,
+        defaultY: -70
     }
 
 };

docs/assets/js/index.js

@@ -61,13 +61,14 @@ function draw() {
 
     // Handle game state
     switch (globalState) {
+
         // title screen
         case globalStates.titleScreen:
             drawTitleScreen();
             break;
         // level transition
         case globalStates.levelTransition:
-
+            handleTransition();
             break;
         // playing
         case globalStates.playing:

docs/assets/js/player/player.js

@@ -246,5 +246,5 @@ function distanceToLineSegment(lx1, ly1, lx2, ly2, px, py) {
 
 
 
-var player = new Player(500,-70);
+var player = new Player(constants.player.defaultX, constants.player.defaultY);
 

docs/assets/js/titleScreen/titleScreen.js

@@ -24,7 +24,7 @@ function handleTitleScreen(){
 function handleMainScreen(){
     if(timer > 20){
         if(rectpoint({x:415, y:200, w: 300, h: 50}, {x:cursor.x, y:cursor.y}) && mouseDown[0]){
-            globalState = globalStates.playing;
+            globalState = globalStates.levelTransition;
             timer = 0;
         }
         if(rectpoint({x:415, y:550, w: 300, h: 50}, {x:cursor.x, y:cursor.y}) && mouseDown[0]){

docs/assets/js/transition/transition.js

@@ -0,0 +1,42 @@
+
+var currentAlpha = 1.01;
+
+
+function handleTransition(){
+
+    // Calculates alpha until its zero
+    if(currentAlpha > 0){
+        currentAlpha -= .005;
+    }
+
+
+}
+
+
+// UI for level transition
+function drawLevelTransitionUI() { 
+
+    // centers camera on player
+    centerCameraOn(constants.player.defaultX, constants.player.defaultY);
+
+    // sets alpha for background drawing
+    canvases.ctx.globalAlpha = 1;
+
+    // draws background sprites
+    drawWorldBlocks();
+    imgIgnoreCutoff(sprites.level_2,0,0,0,4,4);
+    player.draw();
+
+    // sets alpha to calculated alpha for black
+    canvases.ctx.globalAlpha = currentAlpha;
+
+    // draw a black rect unless less the 0 alpha then switches to actual game
+    if(currentAlpha > 0){
+        rect(0, 0, 2000, 2000, "black");
+    }else{
+        globalState = globalStates.playing;
+    }
+
+    // resets alpha for rest of drawing
+    canvases.ctx.globalAlpha = 1;
+}

docs/index.html

@@ -48,6 +48,7 @@
 
         <script src="assets/js/titleScreen/titleScreen.js"></script>
         <script src="assets/js/UI/ui.js"></script>
+        <script src="assets/js/transition/transition.js"></script>
 
         <!-- Webpage -->
         <script src="assets/js/injection/cssinjector.js"></script>