/* ===================================================================

    クラス生成 

===================================================================  */
MSlideShow = Class.create();
MovieFrame = Class.create();
MOnLoadController = Class.create();


/* ===================================================================

    クラス定義

===================================================================  */

/* -------------------------------------------------------------------
    SlideShowクラス
    
    レスポンスオブジェクト(json形式-title,・・・)
    ファビコンリスト(json形式)
    フレーム幅
    フレーム高さ
    画像の個数
    １番目を大きくするか
    大きいのは何倍にするか
---------------------------------------------------------------------- */
MSlideShow.prototype = {
    
    //その他
    movieCount: 0,
    roopCount: 0,
    movieList: [],
    sortList: [],
    
    initialize: function(res, list, w,h,mpn,min,mip) {
        this.frameWidth = w;
        this.frameHeight = h;
        this.maxMovieNumber = mpn;
        this.maxImageNumber = min;
        this.maxImagePower = mip;
        this.faviconList = list;
        this.roopCount = 4;
        
        //データ取り出し

        this.movieList=res.video_list[0].video;
        if(this.maxMovieNumber == 0){
            this.noShowImage();
        }else{
            this.showImage();
        }
    },
    noShowImage: function() {
        $(movieFramePointer).innerHTML = "no-image";

    },
    showImage: function() {
        for(var i=0; i<this.maxMovieNumber; i++){
            this.sortList.push(this.movieCount);
            this.movieCount++;
        };
        this.sortList.reverse();
        for(var i=0; i<this.maxMovieNumber; i++){
            if(this.sortList[i] < this.movieList.length){
                if(this.maxImageNumber != 0){
                    if( i == (this.maxMovieNumber-this.maxImageNumber)){
                        new MovieFrame(this.movieList[this.sortList[i]], this.frameWidth*this.maxImagePower,this.frameHeight*this.maxImagePower,this.maxImagePower,1,44, this.faviconList);
                    }else{
                        new MovieFrame(this.movieList[this.sortList[i]], this.frameWidth,this.frameHeight,this.maxImagePower,0,44, this.faviconList);
                    }
                }else{
                    new MovieFrame(this.movieList[this.sortList[i]], this.frameWidth,this.frameHeight,this.maxImagePower,1,44, this.faviconList);
                }
            };
        };
        this.sortList = [];
    },
    clearImage: function(){
        for(var i=0; i<this.movieList.length; i++){
            movie = $('moviec_'+this.movieList[i].url);
            txt = $('txt_'+this.movieList[i].url);
            if(movie){
                movie.parentNode.removeChild(movie);
            }
        }
    },
    nextShowImage: function() {
        this.clearImage();
        if(this.movieCount >= this.movieList.length){
            this.movieCount=0;
        }
        this.showImage();
    },
    nextShowImageOnTime: function(nt) {
        if(this.roopCount<=0){
            return;
        }
        img = this;
        var to = function(image, intime) {
            image.clearImage();

            if(image.movieCount >= image.movieList.length){
                image.movieCount=0;
            }
            image.showImage();
            movieShowTimer = setTimeout( function() {image.nextShowImageOnTime(intime)}, intime);
        }
        movieShowTimer = setTimeout( function() {to(img, nt)},0);
        this.roopCount--;
    },
    prevShowImage: function() {
        this.clearImage();
        this.movieCount = this.movieCount-this.maxMovieNumber*2;
        if(this.movieCount < 0){
            if(this.movieList.length%this.maxMovieNumber == 0){
                this.movieCount=(Math.floor(this.movieList.length/this.maxMovieNumber)-1)*this.maxMovieNumber;
            }else{
                this.movieCount=(Math.floor(this.movieList.length/this.maxMovieNumber))*this.maxMovieNumber;
            }
        }
        this.showImage();
    }
}


/*------------------------------------------------------------
    MovieFrameクラス

    動画情報
    フレーム幅
    フレーム高さ
    大きいのは何倍か
    大きくするかどうか(1--大きくする,0--大きくしない)
    タイトル文字数
------------------------------------------------------------  */
MovieFrame.prototype = {
    
    noimage_url:"/colleguide/v2/images/no_movie.gif",
    countlink_url:"http://www.nifty.com/cgi-bin/count_link2?sc_movie?",

    initialize: function(v_data, width, height, power, powerFlg, sl, flist) {
    
        this.stringLimit = sl;
        this.fname = v_data.url;            //動画URL
        this.id = 'moviec_' + this.fname;
        this.ftitle = v_data.title;         //動画タイトル
        this.furl =  this.deSanitize(v_data.thumbnail);     //サムネイルURL
        this.fsite = v_data.site;           //クロールサイト
        this.width = width;
        this.height = height;
        this.power = power;
        this.powerFlg = powerFlg;
        this.flist = flist;                 //ファビコンリスト
        this.thumb = 'thumb_' + this.fname;
        

        if($(this.id)) {
            return;
        }

        var template = $('MovieFrameTemplate').innerHTML;
        template = template.replace(/--fname--/g, this.fname);
        
        mfp = $('movieFramePointer');
        mList = mfp.getElementsByTagName("ol")[0];
        
        new Insertion.Top(mList, template);


        this.setSize(width, height);

        this.loadimg = new Image();
        
        //サムネイルURLが空白の場合、noimage画像を表示
        if(this.furl != "") {
            //サムネイルURLがhttp://～以外で始まる場合、noimage画像を表示
            if(this.furl.substring(0,7) != "http://") {
                this.loadimg.src = this.noimage_url;
            
            } else {
                this.loadimg.src = this.furl;
            }
        } else {
            this.loadimg.src = this.noimage_url;
        }
        
        this.show = false;
        if(this.loadimg.complete) {
            this.showImage();
        } else {

            if(navigator.userAgent.indexOf("Safari") != -1) {
                // Safariでは画像のonloadイベントが立たないので
                this.safariOnLoad = function() {
                    if(this.loadimg.complete) {
                        clearTimeout(this.timer);
                        this.showImage();
                    }else 
                        this.timer = setTimeout(this.safariOnLoad.bind(this), 100);
                };
                this.safariOnLoad();
                
            } else {
                Event.observe(this.loadimg, 'load', this.showImage.bind(this), false);
                //サムネイル読込失敗時、noimage画像を表示
                Event.observe(this.loadimg, 'error', function() {this.loadimg.src = this.noimage_url;}.bind(this), false);

            }
        }
    },
    showImage: function() {
        this.show = false;

        var movie = $('moviec_'+this.fname);
        var noisee = $('noise_'+this.fname);
        var thumbnail = $('thumb_'+this.fname);
        
        if(movie == null) {
            return;
        }
        Element.hide(noisee);

        thumbnail.src = this.loadimg.src;

        if(navigator.userAgent.indexOf("Safari") != -1) {
            // Safariでは画像のonerroイベントが立たないので
            $(this.thumb).addEventListener("error",function () {$(this.thumb).src = this.noimage_url;}.bind(this),false);
        }

        new Effect.Appear(thumbnail, { from:0.0,  to:1.0, fps:60, duration: 0.5}); 

    },
    setFont: function(l){
        var sanStr = this.deSanitize(l);
        sanStr = this.truncateInByte(sanStr, this.stringLimit, "...");
        sanStr = this.enSanitize(sanStr);
        
        return sanStr;
    },
    
    truncateInByte: function(str, lim, foot) {
        //文字列を指定バイトで切り詰め、超過分は代替文字に置換する。
        //2バイト文字が閾をまたぐ場合は、その文字を削除。(=(指定バイト数-1)バイト+代替文字)
        var len = str.length;
        var bytecount = 0;
        var rtnStr = "";
        for (var i = 0; i < len; i++) {
            c = str.charCodeAt(i);
            chr = str.charAt(i);
            if (c < 256 || ( c >= 0xff61 && c <= 0xff9f)) {
                bytecount=bytecount + 1;
            } else {
                bytecount=bytecount + 2;
            }
            if(bytecount > lim) {
                rtnStr = rtnStr + foot;
                break;
            } else {
                rtnStr = rtnStr + chr;
            }
        }
        return rtnStr;
    },
    setSize: function(w, h) {

        var thumbnail = $('thumb_'+this.fname);
        var link_thumbnail = $('link_thum_'+this.fname);
        var link_btn = $('link_btn_'+this.fname);
        var link_text = $('link_txt_'+this.fname);
        var noise = $('noise_'+this.fname);
        var favicon = $('favicon_'+this.fname);

        this.setFavicon(favicon, this.fsite);

        Element.hide(thumbnail);
        
        if(this.fname.length==0) {
            link_thumbnail.href = "#";
            link_btn.href = "#";
            link_text.href = "#";
        } else {
//            link_thumbnail.href = this.countlink_url + this.fname;
//            link_btn.href = this.countlink_url + this.fname;
//            link_text.href = this.countlink_url + this.fname;
            link_thumbnail.href = this.fname;
            link_btn.href = this.fname;
            link_text.href = this.fname;
            Event.observe(link_thumbnail, 'click', function(e) {return countlink('shuncolle','sc_movie',link_thumbnail.href);});
            Event.observe(link_btn, 'click', function(e) {return countlink('shuncolle','sc_movie',link_btn.href);});
            Event.observe(link_text, 'click', function(e) {return countlink('shuncolle','sc_movie',link_text.href);});
        }
        
        link_text.innerHTML=this.setFont(this.ftitle);
        
    },
    setFavicon: function(favicon, fsite) {
        var favicons = $A(this.flist.favicon);
        var test = 0;
        
        match = favicons.find( function(f,index) { return f.site == fsite;} );
                
        if(match==null) {
            //該当のサイトがｎfavicon一覧に存在しない場合
            Element.hide(favicon);
        } else {
            favicon.alt = match.site;
            favicon.src = match.icon;
            
            //favicon読込失敗時、ファビコンを消去
            Event.observe(favicon, 'error', function() {Element.hide(favicon);}.bind(favicon), false);
        }
        
    },
    replaceAll: function( baseStr, searchStr, replaceStr) {
        var strAry = baseStr.split(searchStr);
        return strAry.join(replaceStr);
    },
    deSanitize: function(baseStr) {
        var rtnStr = baseStr;
            
        // ③& (アンパサンド)変換
        rtnStr = this.replaceAll(rtnStr,"&#38;", "&");
        rtnStr = this.replaceAll(rtnStr, "&#38;", "&");
        
        // ①' (シングルクォート)変換
        rtnStr = this.replaceAll(rtnStr,"&#39;", "\'");
        // ②" (ダブルクォート)変換
        rtnStr = this.replaceAll(rtnStr,"&#34;", "\"");
        // ④< (小なり)変換
        rtnStr = this.replaceAll(rtnStr,"&#60;", "<");
        // ⑤> (大なり)変換
        rtnStr = this.replaceAll(rtnStr,"&#62;", ">");
        // ⑥{ (中括弧開く)変換
        rtnStr = this.replaceAll(rtnStr,"&#123;", "{");
        // ⑦} (中括弧閉じる)変換
        rtnStr = this.replaceAll(rtnStr,"&#125;", "}");
        // ⑧[ (大括弧開く)変換
        rtnStr = this.replaceAll(rtnStr,"&#91;", "[");
        // ⑨] (大括弧閉じる)変換
        rtnStr = this.replaceAll(rtnStr,"&#93;", "]");
        // ⑩, (カンマ)変換
        rtnStr = this.replaceAll(rtnStr,"&#44;", ",");
        // ⑪\（\マーク）変換
        rtnStr = this.replaceAll(rtnStr,"\\\\", "\\");
        
        return rtnStr;
    },
    enSanitize: function(baseStr) {
        var rtnStr = baseStr;
            
        // ③& (アンパサンド)変換
        rtnStr = this.replaceAll(rtnStr, "&", "&#38;");
        // ①' (シングルクォート)変換
        rtnStr = this.replaceAll(rtnStr, "\'", "&#39;");
        // ②" (ダブルクォート)変換
        rtnStr = this.replaceAll(rtnStr, "\"", "&#34;");
        // ④< (小なり)変換
        rtnStr = this.replaceAll(rtnStr, "<", "&#60;");
        // ⑤> (大なり)変換
        rtnStr = this.replaceAll(rtnStr, ">", "&#62;");
        // ⑥{ (中括弧開く)変換
        rtnStr = this.replaceAll(rtnStr, "{", "&#123;");
        // ⑦} (中括弧閉じる)変換
        rtnStr = this.replaceAll(rtnStr, "}", "&#125;");
        // ⑧[ (大括弧開く)変換
        rtnStr = this.replaceAll(rtnStr, "[", "&#91;");
        // ⑨] (大括弧閉じる)変換
        rtnStr = this.replaceAll(rtnStr, "]", "&#93;");
        // ⑩, (カンマ)変換
        rtnStr = this.replaceAll(rtnStr, ",", "&#44;");
        // ⑪\（\マーク）変換
        rtnStr = this.replaceAll(rtnStr, "\\"," \\\\");
        
        return rtnStr;
    }
    
}



/*------------------------------------------------------------
    MOnLoadControllerクラス

    スライドショーするまでの時間(ミリ秒)
    utf8エンコードのキーワード
------------------------------------------------------------  */
MOnLoadController.prototype = {

    //画像の個数
    imgLength:4,
    frameWidth:105,
    frameHeight:80,

    initialize: function(nt,utf8Keyword, Keyword, per_page) {
        this.nextTime = nt;
        
        //utf8エンコードのキーワード
        var kw = utf8Keyword;
        var keyIni = Keyword;
        var num = per_page;
        //本番ＵＲＬ
        var url = '/multimaker/maker/fooooo?q=' + kw + '&num=' + num;
        
        
        //JSON形式のデータ取得
        //※現状はローカルファイルからの取得
        var opt = {
            method : 'get',
            parameters : 'keyword=' + kw,
            onComplete: function(res) {
                this.getFaviconList(res);}.bind(this),
            onFailure: function() {
                }
        };
        new Ajax.Request(url, opt);

    },

    //favicon一覧取得
    getFaviconList: function(res) {
        //favicon一覧xml
        var favListURL = "/colleguide/v2/images/icons/favicon_j.xml";
        var opt = {
            method : 'get',
            onComplete: function(fres) {
                this.showInit(res, fres);
            }.bind(this),
            onFailure: function() {
            }
        };
        new Ajax.Request(favListURL, opt);
    },
    
    showInit: function(originalRequest, favlist) {
        //ajaxで画像取得クラスnew
        var response='';
        response = originalRequest.responseText;
        response = response.replace( new RegExp( '<.*?>', "i"), '' );
        
        //TODO JSON の形式による。
        response = this.decodeEscape(response);

        var result = eval('(' + response + ')');
        var fresult = eval('(' + favlist.responseText + ')');

        
        //画像表示クラスnew
        if(result.output == "OK" && result.video_list[0].video.length > 0){
        
            Element.show('mainMovieLogo');
            Element.show('mainMovie');
        
            if(result.video_list[0].video.length  > this.imgLength){
                $('movieNext').style.display='block';
                $('moviePrev').style.display='block';
                myMSlide = new MSlideShow(result,fresult, this.frameWidth,this.frameHeight,this.imgLength,0,2);
                movieShowTimer = setTimeout(function(){myMSlide.nextShowImageOnTime( this.nextTime)}.bind(this),this.nextTime);

            }else{
                $('movieNext').parentNode.removeChild($('movieNext'));
                $('moviePrev').parentNode.removeChild($('moviePrev'));
                myMSlide = new MSlideShow(result,fresult, this.frameWidth,this.frameHeight,this.imgLength,0,2);
            }
        }else{
            //outputがNG、またはvideoが0件だった場合、枠ごと非表示
            Element.hide('mainMovieLogo');
            Element.hide('mainMovie');
        }
    },
    decodeEscape: function(basetext) {
        var res = basetext;
        res = this.replaceAll(res,"&amp;", "&");
        res = this.replaceAll(res,"&lt;", "<");
        res = this.replaceAll(res,"&gt;", ">");
        
        return res;
    },replaceAll: function( baseStr, searchStr, replaceStr) {
        var strAry = baseStr.split(searchStr);
        return strAry.join(replaceStr);
    }
    

}

/* --------------------------------------
    イベント
---------------------------------------*/

addOnload(startfunc);

function startfunc() {
    new MOnLoadController(8000,utf8Keyword, Keyword, per_page);
}

function addOnload(addfunc) {
    var oldfunc = window.onload;
    
    if (typeof oldfunc != 'function') {
        window.onload = addfunc;
    } else {
        window.onload = function() {
            oldfunc();
            addfunc();
        }
    }
}