(function () {

    var _shell_wrapper = null,
        _data = null,
        _userDetails = null,
        _shell_wrapper = $('#shell_wrapper');
        _btn_next = $(".btn_next");
        _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();

            }
        }

        _shell_wrapper.trigger('pageLoaded', _initData);
        enabledDisable(_btn_next, false);
        enabledDisable(_btn_prev, false);
    }

    var stepStart = function () {
        Utils.updateAudio(_data.audio[0], lastStep)
    }

    var lastStep = function () {
        let _data = {
            mNo: 1,
            pNo: 3
        }
        
        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 () {
        //     btn.off("click");
        //     _shell_wrapper.trigger('jumpToNext');
        // }).addClass("active");
        enabledDisable(_btn_next, false);
        Utils.pageCompleted();
    }


    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'>
                    <h5>Talking Points to Share with Clients</h5>
                        <ul class="setBox">
                            <li class='animate item_1'>
                                <p class="titleBox">1</p>
                                <p class="desc">We assess risk across our platform and cap liability mutually to ensure fair risk management for both parties.​</p>
                            </li>
                            <li class='animate item_2'>
                                <p class="titleBox">2</p>
                                <p class="desc">If the worst happens, we'll refund all your service fees from the past 6 months, showing we fully stand behind our service.</p>
                            </li>
                            <li class='animate item_3'>
                                <p class="titleBox">3</p>
                                <p class="desc">To align with standard practice, we've mutually waived speculative, uncertain, or unrelated damages in our contract.</p>
                            </li>
                            <li class='animate item_4'>
                                <p class="titleBox">4</p>
                                <p class="desc">We avoid "greater than" language as we can't gauge exposure or guarantee sufficient insurance coverage for claims.</p>
                            </li>
                        </ul>       
                    </div>
                    <div class='closebgtn'>Close</div>
                </div>
                `,
            id: 'm01_l01_p07_03',
            triggered_by: '',
            triggers: '',
            userDataRef: {
                currentPageNo: 3
            },
            audio: [{
                id: "1",
                autoplay: true,
                url: './views/m01_l01_p07_03/m01_l01_p07_03.mp3',
                timeline: [{
                        'element': ".blueBox",
                        'sTime': 0.2,
                        'eTime': '',
                        'classIn': 'blueUp',
                        'classOut': ''
                    },{
                        'element': "#sub-sections-1 .item_1",
                        'sTime': 3.5,
                        'eTime': '',
                        'classIn': 'd-show fadeInLeft',
                        'classOut': ''
                    },
                    {
                        'element': "#sub-sections-1 .item_2",
                        'sTime': 27,
                        'eTime': '',
                        'classIn': 'd-show fadeInLeft',
                        'classOut': ''
                    },
                    {
                        'element': "#sub-sections-1 .item_3",
                        'sTime': 41.5,
                        'eTime': '',
                        'classIn': 'd-show fadeInLeft',
                        'classOut': ''
                    },
                    {
                        'element': "#sub-sections-1 .item_4",
                        'sTime': 54,
                        'eTime': '',
                        'classIn': 'd-show fadeInLeft',
                        'classOut': ''
                    }
                ],
                transcript: '<p>Here are some talking points that you can share with clients:</p><ul><li>Like all business partners who provide services, we assess our risk across an entire platform. It\'s vital for us to ensure we cap our liability in each relationship as a fundamental financial control. We expect it\'s vital for you, too, which is why we made this provision mutual. Both parties have important obligations in this deal, and this formulation helps us manage risk fairly.​</li><li>If the worst happened, the bottom line is that we\'d be refunding all of your service fees from the prior 6 months. That\'s a lot, and we think it\'s adequate skin in the game to get you comfortable that we stand behind our service.​</li><li>Commercial parties will commonly waive damage categories they consider too speculative, uncertain, or unrelated to core harms to justify making them an issue in potential litigation.</li><li>We can\'t use "greater than" language as we cannot calculate our exposure.</li></ul>'
            }]
        }];
        return _data;
    };

    var _shell_wrapper = $('#shell_wrapper');


    _shell_wrapper.trigger("initPage");

})();