var bg;
$(function(){
    $('.loading').addClass('on');
    chrome.runtime.getBackgroundPage(function(background){
        bg = background;
        if(bg.wordDataArr.length) bg.wordDataArr.forEach( function(word) {
            $('.total .list ul').append('<li data-word="'+word+'">'+word+'<div class="btn"><a class="info" title="查看详情"><i class="fa fa-comment-o"></i></a><a class="del" title="移出词库"><i class="fa fa-trash-o"></i></a><a class="star" title="加入收藏"><i class="fa fa-star-o"></i></a></div></li>')
        });
        $('.tabs a:eq(0) span').text('('+bg.wordDataArr.length+')');
        $('.loading').removeClass('on');
    });
    $('.tabContent .list').on('click','li a.info',function(){
        
        var word = $(this).parents('li').data('word');
        var oldWindow = chrome.app.window.get('popup');
        if(oldWindow){
            createPopup(oldWindow,word);
        }else{
            chrome.app.window.create('windows/popup.html', {
                id:'popup',
                resizable:false,
                alwaysOnTop:true,
                hidden:true,
                frame:{type:'none'}
            },function(popup){
                createPopup(popup,word);
            });
        }
    });
    $('.tabContent .search').on('keyup',function(){
        var word = $(this).val();
        $(this).parent().find('.list li').hide().filter(":contains('"+word+"')").show();
    });

    $('.tabs a').click(function(){
        $(this).addClass('on').siblings().removeClass('on');
        $('.tabContent').removeClass('on').eq($(this).index()).addClass('on');
    });

    $("#clickme").click(function (source) {
        $("#my_file").trigger('click');
    })
    $("#my_file").on('change',function(){
        var wordsObj = {};
        var wordsArr = [];
        var file = $('#my_file')[0].files[0];
        var reader = new FileReader();
        reader.readAsText(file, "utf-8");
        reader.onload = function (e) {
            wordsArr = e.target.result.split("\n");
            if(wordsArr.length>0){
                wordsArr.forEach(function(word) {
                    wordsObj[word] = {testCount:0}
                });
            }
            chrome.storage.local.set({wordsArr:wordsArr,wordsObj:wordsObj},function(e){
                bg.wordDataArr = wordsArr;
                bg.wordDataObj = wordsObj;
                console.log('导入完成',e)
            })
        }
    })
});

function createPopup(popup,word){
    var popWidth = 300,popHeight = 400;
    bg.currentWord = word;
    chrome.system.display.getInfo(function(display){
        var displayOpt = display[0].workArea;
        popup.outerBounds.left = displayOpt.width - popWidth - 20;
        popup.outerBounds.top = 20 + displayOpt.top;
        // popup.innerBounds = {width:popWidth,height:popHeight};
        popup.show();
        chrome.runtime.sendMessage('updateInfo');
        popup.onClosed.addListener(function(){
            chrome.storage.local.set({wordsObj:bg.wordDataObj,wordOpt:bg.wordOpt});
        });
    });
}