JSFiddle - React, Tailwind, and code Playground

by zono

HTML

<div data-ng-app>
   <div ng-controller="AppCtrl">
    <div data-ng-hide="hideForm">
        <form data-ng-submit="saveName()">
            <label form="visitorName">
                 Please write your name.
            </label>
            <input required="required" type="text" id="visitorName" data-ng-model="visitorName" name="visitorName"/>
            <input type="submit" value="Send"/>
        </form>
    </div>
    <div data-ng-show="hideForm">
        <div data-ng-show="steps.firstStep">
            Every time, when God closes the door for you, {{visitorName}}. 
             <hr>
                 <img src="http://s18.postimg.org/ghwxn26c9/slice_0_0.jpg"/>
             <hr>    
            <input data-ng-click="showStep('secondStep')" type="button" value="Next &gt;&gt;"/>
        </div>
        <div data-ng-show="steps.secondStep">
            God opens a window for you, {{visitorName}}.
<hr>
                 <img src="http://s8.postimg.org/4dh9adu45/slice_1_0.jpg"/>
             <hr>               
            <input data-ng-click="showStep('thirdStep')" type="button" value="Next &gt;&gt;"/>
        </div>
        <div data-ng-show="steps.thirdStep">
             {{visitorName}}, show everyone how you throw of this window. 
<hr>
                 <img src="http://s13.postimg.org/yqfg9kzyv/slice_2_0.jpg"/>
             <hr>
                 <input data-ng-click="backToStart()" type="button" value="Go back to start."/>
        </div>
    </div>
  </div>
</div>

JavaScript

function AppCtrl($scope) {
    $scope.saveName = function() {
         $scope.hideForm = true;
         $scope.showStep('firstStep');
    }
    
    $scope.showStep = function(stepName) {
        $scope.steps  = {
            firstStep: false,
            secondStep: false,
            thirdStep: false
        };
        $scope.steps[stepName] = true;       
    }
    
    $scope.backToStart = function() {
        delete $scope.hideForm;
        delete $scope.steps;
        delete $scope.visitorName;
    }
}