// ---------------------------------------------------------------------------------
//
// Component: Alert popup
//
// Input Props:
//      - ok: what to do if clicked on ok
//      - id
//
//      <alert id="alertTest">Ovo je test za alert</alert>
//
Vue.component('alert',
{
    props:
    [
        'id', 'okAction'
    ],
    computed:
    {

    },
    mounted: function ()
    {
        var self = this;
        $(document).on("keyup", function (event) 
        {
            if(event.which === 27 && !self.mandatory) 
            {
                $('#'+self.id).fadeOut(100);
            }
        });
    },
    methods:
    {
        OKAction: function()
        {
            this.$emit('ok');
            $('#'+this.id).fadeOut(200);
        }
    },
    template: '<div :id="id" class="confirmOverlay">'+
    '    <div class="confirmDialog" style="overflow:hidden;">'+
    '        <div style="position:absolute;margin-left:-30px;"><i class="fa fa-info-circle" style="font-size:170px;color:rgba(0,0,0,.03);"></i></div>'+
    '        <div class="confirmText" style="padding:45px 25px 25px 25px;"><slot></slot></div>'+
    '        <div class="confirmFooter" style="text-align:center">'+
    '            <button class="blue" v-on:click="OKAction()">OK</button>'+
    '        </div>'+
    '    </div>'+
    '</div>'
});