Time for action – pausing the game

It's more than just making a button; it's also pausing all the action on screen, including physics and timers by performing the following steps:

Add in the local pauseBtn and local pauseBG variables where all the other variables are initialized near the beginning of the code. Preload the btnSound audio after gameOverSound near the top of the script:
```
-- Place near other game variables
local pauseBtn
local pauseBG

-- Place after gameOverSound
local btnSound = audio.loadSound( "btnSound.wav" )
```

Within the hud() function and after the scoreText chunk, create another function that will run the event for the pause button. Call the onPauseTouch(event) function. Pause the physics in the game by setting gameIsActive to false and have the pause elements appear on screen:

    local onPauseTouch = function( event )
      if event.phase == "release" and pauseBtn.isActive then
        audio.play( btnSound )

        -- Pause the game

        if gameIsActive then

          gameIsActive = false
          physics.pause()

          local function pauseGame()
            timer.pause( startDrop )
            print("timer has been paused")
          end
          timer.performWithDelay(1, pauseGame)

          -- SHADE
          if not shade then
            shade = display.newRect( 0, 0, 570, 380 )
            shade:setFillColor( 0, 0, 0 )
            shade.x = 240; shade.y = 160
            gameGroup:insert( shade )
          end
          shade.alpha = 0.5

          -- SHOW MENU BUTTON
          if pauseBG then
            pauseBG.isVisible = true
            pauseBG.isActive = true
            pauseBG:toFront()
          end

          pauseBtn:toFront()

When the game is unpaused, have the physics become active again and remove all the pause display objects:

          else

            if shade then
              display.remove( shade )
              shade = nil
            end

            if pauseBG then
              pauseBG.isVisible = false
              pauseBG.isActive = false
            end

            gameIsActive = true
            physics.start()

            local function resumeGame()
            timer.resume( startDrop )
            print("timer has been resumed")
          end
          timer.performWithDelay(1, resumeGame)

        end
      end
    end

Add the pauseBtn UI button and pauseBG display object after the onPauseTouch() function:

    pauseBtn = ui.newButton{
      defaultSrc = "pausebtn.png",
      defaultX = 44,
      defaultY = 44,
      overSrc = "pausebtn-over.png",
      overX = 44,
      overY = 44,
      onEvent = onPauseTouch,
      id = "PauseButton",
      text = "",
      font = "Helvetica",
      textColor = { 255, 255, 255, 255 },
      size = 16,
      emboss = false
    }

    pauseBtn.x = 38; pauseBtn.y = 288
    pauseBtn.isVisible = false
    pauseBtn.isActive = false

    gameGroup:insert( pauseBtn )

    pauseBG = display.newImageRect( "pauseoverlay.png", 480, 320 )
    pauseBG.x = 240; pauseBG.y = 160
    pauseBG.isVisible = false
    pauseBG.isActive = false

    gameGroup:insert( pauseBG )

In order for pauseBtn to display during game play, make it visible and active in the gameActivate() function:
```
    pauseBtn.isVisible = true
    pauseBtn.isActive = true
```
When
the game is over, disable pauseBtn in the callGameOver() function Place the code right after the physics.pause() line:
```
    pauseBtn.isVisible = false
    pauseBtn.isActive = false
```

What just happened?

We created the onPauseTouch(event) function to control all the pause events that occur within the game play. To pause all the motion in the game, we changed the Boolean of gameIsActive to false and the physics.pause() function to stop all the eggs that are falling from moving. Next, the timer is paused for startDrop so that any eggs falling from the sky won't accumulate over time as long as the pause function is still active.

A slightly transparent overlay called shade is called to appear when the pause button is pressed. This will deter the attention from the game scene and allow the user to differentiate when the game play is not active.

The Game Paused banner also displays on the top of the screen by making it visible and active. The pauseBG object is pushed ahead of the display hierarchy by pauseBG:toFront().

To unpause the game, we reversed the process of how the pause display items appeared. When pauseBtn is pressed for the second time, shade is taken away by display.remove(shade); shade = nil. The pauseBG.isVisible and pauseBG.isActive properties are both set to false.

Remember that we had set gameIsActive to false earlier Well, it's now time to set it back to true. This also means resuming physics with physics.start(). The timer is resumed by the resumeGame() local function and calls timer.resume(startDrop) within the function.

The pauseBtn and pauseBG display objects are inserted at the end of the if statement block. The pauseBtn object is then shown as visible and active once the game is playable. It is invisible and inactive when the Game Over screen appears so that there are no other touch events that can interfere when the game is over.