var Simple_Start = (function() {

    var _self = this,
        _data = null,
        _simple_start = null,
        _start_btn = null,
        _download_xl = null,
        _shell_wrapper = $('#shell_wrapper');

    this.init = function(data) {
        _data = (data) ? data : getData()
        domInit();
        _shell_wrapper.trigger('componentDidMount');        
    }


    var domInit = function() {

        _simple_start = $("#simple_start").empty();
        _simple_start.hide();

        // console.log("Simple_Start:    udpateData:  " + _data)

        $.each(_data, function(i, item) {
            var _idNo = (i + 1)
            var _section = $('<div id="section_' + _idNo + '" class="no-gutters h-100 section section_' + _idNo + '">')
            _section.html(item['section']);
            _simple_start.append(_section)
        })

        _simple_start.fadeIn();
        

    }

    var addEventOnStart = function() {

        _start_btn = $("button.btn");
        _start_btn.off("click").on("click", function() {
            var _btn = $(this)
            if (_btn.hasClass('active')) {
                Utils.JumpTile('next_tile')
            }
        })
        Utils.enabledDisabled(_start_btn, false)

        _download_xl = $("#simple_start .download_xl");
        _download_xl.off("click").on("click", function() {
            var _btn = $(this)
            if (_btn.hasClass('active')) {
                var _dataFile = $(this).attr("data-file");
                window.open(_dataFile, "download_xl");
            }
        })
        Utils.enabledDisabled(_download_xl, true)

    }


    var getData = function() {
        var _data = {};
        _data['audio'] = {
            url: "./shell/audio/blank.mp3",
            autoplay: true,
            timeline: [{}]
        }
        return _data
    }

    $("#btn_cc").addClass("CC_disabled");

    return this;

})