var Vue = require('yoho-vue');

var app = require('example/home.vue');
var tpl = require('example/hello.hbs');
var tip = require('../common/tip');

var vm = new Vue({
    el: '#app',
    components: {
        app: app
    }
});

console.log(vm);

/* eslint-disable */
// 私有包测试
var qs = require('yoho-qs');
console.log(qs);

var parse = require('yoho-qs/parse'); // 提供解析函数
console.log(parse('q=w&e=r')); // { q: 'w', e: 'r' }

var cookie = require('yoho-cookie');

console.log(cookie.all());

// ES6 test
var test = {
    data() {
        return {
            message: 'test',
            message2: 'test2'
        };
    }
};

// Handlebars/HBS 模版例子
$('#hbs-placeholder').html(tpl({
    text: 'Handlerbars'
}));

/* --------------tip demo---------*/
var tipBtn = document.querySelector('#show-tip');
tipBtn.addEventListener('click', function(){
    tip('中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中中')
});


var Overlay = require('../common/overlay');
var Modal = require('../common/modal');
var customModal = require('../../hbs/example/custom-modal.hbs');
var loading = require('../common/loading');

$('#modal-overlay').click(()=> {
    var overlay = new Overlay();
    overlay.show();
});

$('#modal-alert').click(()=> {
    Modal.alert('自毁系统已经开启，请马上撤离！', '警告');
});

$('#modal-confirm').click(()=> {
    Modal.confirm('是否开启自毁系统？', '', function() {
        this.hide();
        alert('BOOM!');
    });
});

// 自定义模态
$('#modal-custom').click(()=> {
    const modal = new Modal({
        title: '自定义模态对话框',
        text: '你可以自定义哦！',
        template: customModal,
        buttons: [
            {
                text: '香蕉',
                handler: function() {
                    this.hide();
                    alert('香蕉');
                }
            },
            {
                text: '苹果',
                handler: function() {
                    this.hide();
                    alert('苹果');
                }
            }
        ]
    });
    modal.show();
});


$('#loading').click(()=> {
    loading.show();

    setTimeout(()=> {
        loading.hide();
    }, 3000)
});

/* eslint-enable */