(function () {

    var _shell_wrapper = null,
        _data = null,
        _userDetails = null,
        _shell_wrapper = $('#shell_wrapper');

    let _btn_next = $(".btn_next");
    let _btn_prev = $(".btn_prev");

    _shell_wrapper.off("initPage").on("initPage", function (e) {
        _shell_wrapper.off("initPage");
        _shell_wrapper.off("takePageDetails").on("takePageDetails", function (e, pageData) {
            e.stopPropagation();
            updateDom();
        });

        _shell_wrapper.off("sentUserDetails").on("sentUserDetails", function (e, userData) {
            e.stopPropagation();
            _userDetails = userData;
            _data = getData(_userDetails)[0];
            _shell_wrapper.trigger('getPageDetails', _data.userDataRef.currentPageNo);
        });

        _shell_wrapper.trigger('getUserDetails');

    });

    var updateDom = function () {
        _shell_wrapper.off("componentDidMount").on("componentDidMount", function (e) {
            e.stopPropagation();
            pageInit();
        });

        Utils.loadTemplate('#templateHolder', 'simple_start', function () {
            var _simple_start = new Simple_Start();
            _simple_start.init(getData(_userDetails));
        });
    }


    var pageInit = function () {

        //    console.log("pageInit")
        $(".fadeInUpPage").addClass("pageAnim");

        let _initData = {
            'callback': function () {
                clearTimeout(_timerInstance);
                _shell_wrapper.off("clearAlertTimerInstance").on("clearAlertTimerInstance", function (e) {
                    clearTimeout(_timerInstance);
                    _shell_wrapper.off("clearAlertTimerInstance");
                });

                stepStart();

            }
        }

        enabledDisable(_btn_next, false);
        enabledDisable(_btn_prev, false);
        if ($("#tree_pTile_1_7").hasClass("completed")) {
            let _data = {
                mNo: 1,
                pNo: 4
            }
            let btn = $(".closebgtn");
            btn.off("click").on("click", function () {
                btn.off("click");
                _shell_wrapper.trigger("gotoModule", _data)
            }).addClass("active");
        }
        _shell_wrapper.trigger('pageLoaded', _initData);

    }

    var stepStart = function () {
        enabledDisable($(".btn_next"), false);
        Utils.updateAudio(_data.audio[0], lastStep)
    }

    var lastStep = function () {
        let _data = {
            mNo: 1,
            pNo: 4
        }

        enabledDisable(_btn_next, false);
        enabledDisable(_btn_prev, false);

        let btn = $(".closebgtn");
        // btn.addClass("d-show")
        btn.off("click").on("click", function () {
            btn.off("click");
            _shell_wrapper.trigger("gotoModule", _data)
        }).addClass("active");

        // let btn = $("#continue-btn");
        // btn.addClass("d-show")
        // btn.off("click").on("click", function () {
        //     alert("ok")
        //     btn.off("click");
        //     _shell_wrapper.trigger('jumpToNext');
        // }).addClass("active");
        Utils.pageCompleted();
        setTimeout(function () {
            enabledDisable($(".btn_next"), false);
        }, 200)


    }


    var getData = function (_userDetails) {
        var _data = [{
            section: `
                <h2 class="pagetitle subPageTitle">The Limitation of Liabilities Room</h2>
                <div class = 'sub-sections blueBox' id = 'sub-sections-1'>
                    <span class="iconMark"> </span>
                    <div class='midDesc'>
                        <h6 class='secTitle'>Buffers</h6>
                        <ul class="setBox">
                            <li class='animate item_1'>
                                <p class="titleBox"><span>What is<br> a Buffer?  </span></p>
                                <p class="desc">A one-sided rounding system that only benefits the employer​</p>
                            </li>
                            <li class='animate item_2'>
                                <p class="titleBox"><span>Why Employers<br>use Buffer? ​  </span></p>
                                <p class="desc">To prevent employees from clocking in or out early and being paid for time the employer thinks the employee is not working</p>
                            </li>
                            <li class='animate item_3'>
                                <p class="titleBox"><span>What can <br> Employees<br> claim? </span></p>
                                <p class="desc">That they are not compensated for time worked and/or over time​</p>
                            </li>
                            <li class='animate item_5'>
                                <p class="titleBox"><span>Why is this<br> a violation? </span></p>
                                <p class="desc">Buffers are one-sided rounding system as the employee never gets the benefits of it​</p>
                            </li>
                        </ul>       
                    </div>
                    <div class='closebgtn'>Close</div>
                </div>
                `,
            id: 'm01_l03_p03_03',
            triggered_by: '',
            triggers: '',
            userDataRef: {
                currentPageNo: 8
            },
            audio: [{
                id: "1",
                autoplay: true,
                url: './views/m01_l03_p03_03/m01_l03_p03_03.mp3',
                timeline: [{
                    'element': "#sub-sections-1 .item_1",
                    'sTime': 0.5,
                    'eTime': '',
                    'classIn': 'd-show fadeInDown',
                    'classOut': ''
                },
                {
                    'element': "#sub-sections-1 .item_2",
                    'sTime': 35,
                    'eTime': '',
                    'classIn': 'd-show fadeInDown',
                    'classOut': ''
                },
                {
                    'element': "#sub-sections-1 .item_3",
                    'sTime': 43,
                    'eTime': '',
                    'classIn': 'd-show fadeInDown',
                    'classOut': ''
                },
                {
                    'element': "#sub-sections-1 .item_5",
                    'sTime': 61,
                    'eTime': '',
                    'classIn': 'd-show fadeInDown',
                    'classOut': ''
                }
                ],
                transcript: '<p><b>What is a Buffer?</b></p><p>A buffer is a one-sided rounding system that only benefits the employer.</p><p><b>Example of a buffer:</b></p><p>Imagine that an employee’s shift starts at 8am. If the employee clocks in any time between 7am and 8am, the clock automatically reflects a clock-in time of 8am.</p><p>As discussed previously, time rounding is only permissible if it operates to the benefit of the employer and the employee equally over time. A buffer will never benefit the employee and are, therefore, not legally defensible. </p><p>Employers use buffers to prevent employees from clocking in early or clocking out late and being paid for time that they did not work.</p><p>Employees could claim that they are required to come in early, actually do perform work or other activities for which they should be paid during this time but are not compensated for all compensable. The company would have a difficult time defending against such claims.</p><p>This means that a buffer is a violation of wage and hour law because they are the equivalent to a one-sided rounding system, i.e., the employee never gets the benefits of the buffer.</p>'
            }]
        }];
        return _data;
    };

    var _shell_wrapper = $('#shell_wrapper');


    _shell_wrapper.trigger("initPage");

})();