module.exports = {
    util: {
        files: 'index.html',
        extension: ['js', 'html'],
        transpiler: [
            {
                test: /\.html$/,
                handler: require('eustia-component')()
            }
        ]
    }
};

var style = ' #msg-container { position: fixed; background: #ccc; top: 15px; left: 50%; width: 500px; margin-left: -250px; padding: 10px 0; text-align: center; border-radius: 5px; box-shadow: 0 0 2px rgba(0,0,0,.175); border: 1px solid #ccc; } #msg-container .content { color: #fff; font-size: 18px; font-family: \'Helvetica Neue\', Helvetica, Arial, sans-serif; } #msg-container.hidden { display: none; }';
 
var msgContainer = '<div id=\"msg-container\" class=\"hidden\"> <div class=\"content\">Hello world!</div> </div>';
 
var initialized = false;
 
function init()
{
    $insert.append('body', msgContainer);
    evalCss(style);
 
    initialized = true;
}
 
var defOpts = {
    duration: 3000,
    background: '#9e3c2f',
    delay: 0
};
 
function showMsg(str, options)
{
    $property.text('#msg-container .content', str);
    $class.remove('#msg-container', 'hidden');
    $css('#msg-container', 'background', options.background);
 
    if (options.duration === 0) return;
 
    setTimeout(function ()
    {
        $class.add('#msg-container', 'hidden');
    }, options.duration);
}
 
msg = function (str, options)
{
    options = options || {};
    defaults(options, defOpts);
 
    if (!initialized) init();
 
    setTimeout(function ()
    {
        showMsg(str, options);
    }, options.delay);
 
};