var Courselist = Class.create();
// @todo インスタンスが courselist で作られる必要がある (changePage()の指定をする際に利用している)
Courselist.prototype = {
    // 検索URL
    url: '',
    //検索対象のコース
    course: [],
    //検索結果リスト
    courselist: [],
    selectedId: '',
    currentPage: 1,
    searchCondition: '',
    pageOffset: null,
    initialize: function() {
    },
    // ヒットしなかったときのHTMLの定義
    notFoundFlash: '<div id="pickupFlash"></div>',
    // flashを表示するHTMLの定義
    flashHTML: function(id) {
    return '<div id="pickupFlash"><object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="https://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=8,0,0,0" id="course" height="700" width="450"><param name="movie" value="/swf/course.swf"/><param name="quality" value="high"/><param name="wmode" value="transparent"/><param name="FlashVars" value="xml_id='+id+'"/><embed src="/swf/course.swf" quality="high" wmode="transparent" name="course" pluginspage="https://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" flashvars="xml_id='+id+'" height="700" width="450"/></object></div>';
    },
    //検索結果の表示のHTML
    entryHTML: function(p) {
        var html = '<div class="entry" id="item-'+p.id+'">';
        if (p.favorite) {
            html += '<h4 class="favorite">';
        } else {
            html += '<h4>';
        }
        html += p.title +'</h4>';
        html += '<div class="entryData">';
        html += '<dl>';
        html += '<dt>';
        if (typeof p.photo != 'undefined' && typeof p.photo.url_t != 'undefined') {
            html += '<img src="'+p.photo.url_t+'" alt="" width="80" height="60" />';
        } else {
            html += '<img src="/map/nophoto.png" alt="" width="80" height="60" />';
        }
        html += '</dt>';
        html += '<dd>' + p.area + '<br />'
        html += '距離 ' + p.totaldistance + 'km</dd>';
        html += '</dl></div>';

        html += '<div class="entryMember"><ul>';
        if (p.member == 'basic') {
            html += '<li><img src="/images/myworkout/icon_basic.gif" alt="Basic" /></li>';
        }
        if (p.member == 'lite') {
            html += '<li><img src="/images/myworkout/icon_lite.gif" alt="Lite"/></li>';
        }
        if (p.member == 'premium') {
            html += '<li><img src="/images/myworkout/icon_prem.gif" alt="Premium"/></li>';
        }
        html += '</ul>';
        html += '<p>';
        if (p.type == 'run') {
            html += '<img src="/images/myworkout/icon_run.gif" alt="Run"/>';
        }
        if (p.type == 'bike') {
            html+= '<img src="/images/myworkout/icon_bike.gif" alt="Bike" />';
        }
        html += '</p>';
        html += '</div>';
        if (typeof p.available != 'undefined' && p.available == 'true' && p.id != this.selectedId) {
            html += '<p><a href="javascript:courselist.selectCourse(\'' + p.id + '\');" id="'+ p.id +'"><img class="rollover" src="/images/myworkout/btn_course_detail.jpg" alt="コースの詳しいデータを表示"/></a></p>';
        } else {
            html += '<p><img src="/images/myworkout/btn_course_detail_sw.jpg" alt="コースの詳しいデータを表示"/></p>';
            //html += '<p><a href="javascript:courselist.selectCourse(\'' + p.id + '\');" id="'+ p.id +'"><img class="rollover" src="/images/myworkout/btn_course_detail.jpg" alt="コースの詳しいデータを表示"/></a></p>';
        }
        html += '</div>';
        return html;
    },
    //読み込み中に表示するHTML
    readingHTML: function() {
        if ($('searchStatus-cf-none').hasClassName('cf-none')) {
        $('searchStatus').replace('<span id="searchStatus"/>');
        $('searchStatus-cf-none').removeClassName('cf-none');
        }
        return '<div id="pickupFlash">データ読み込み中…</div>';
    },
    //リストからコースを選択して、Flashで表示する
    selectCourse: function(id) {
        if (id == this.selectedId) {
            return;
        }
        var target = this.course.find(function (course) {
            if (course.id == id) return true;
        });
        if (typeof target != 'undefined' && target.available == 'false') {
            $('pickupFlash').replace(this.unavailableHTML(id));
            return;
        }

        if (this.selectedId) {
            var current = $('item-'+this.selectedId);
            if (typeof current != "undefined" && current) {
                current.writeAttribute('class', 'entry');
            }
        }
            $('pickupFlash').replace(this.flashHTML(id));
        if ($('item-'+id)) {
                $('item-'+id).writeAttribute('class','entry listActive');
        }
        this.selectedId = id;
    },
    //検索を実行する
    // APIの 〜/num までの部分がurlに定義されている場合、offsetで表示ページを指定できる
    query: function(url, offset) {
        this.url = url;
        var query_url = url;
        if (offset) {
            query_url += "/"+offset;
            this.pageOffset = offset;
        } else {
            this.pageOffset = null;
        }
        this.selectedId = '';
        var uncache_param = (new Date()).getTime();
        query_url += "?=" + uncache_param;
        var http = new JKL.ParseXML(query_url);
        var cl = this;
            $('pickupFlash').replace(cl.readingHTML());
        http.async(function(data) {cl.setCourse(data);});
        http.parse();
    },
    // 検索結果が渡ってくるのを処理する
    setCourse: function(data) {
    if (typeof data == 'undefined' ||
        typeof data.courcelist == 'undefined' ||
        typeof data.courcelist.course == 'undefined'  ||
        (data.courcelist.course.size == 'function' &&
         data.courcelist.course.size() == 0)) {
        $('pickupFlash').replace(this.notFoundFlash);
        $('entryList').replace(this.notFoundList());
        $('pagination').replace('<div id="pagination"></div>');
        this.selectedId = '';
        return;
    }
    this.courselist = data.courcelist;
    // 1件のヒットの場合、配列ではなく、値単体で帰ってくる
    if (typeof data.courcelist.course.size == 'undefined') {
        this.course = new Array(data.courcelist.course);
    } else {
        this.course = data.courcelist.course;
    }
    $('entryList').replace('<div id="entryList">');
    var cl = this; //eachの中でthisのコンテキストが変わるようだ
    var firstItem = null;
    this.course.each(function(item) {
            $('entryList').insert(cl.entryHTML(item));
    });
    $('entryList').insert('</div>');
    this.onListChanged();
    if (typeof this.courselist.totalpage != 'undefined' &&
        this.courselist.totalpage > 1) {
        this.pagination(this.courselist.totalpage, this.currentPage);
    } else {
        if ($('pagination')) {
        $('pagination').replace('<div id="pagination"></div>');
        }
    }
    this.searchStatusHTML();
    },
    // 検索時にデフォルトで表示するコースを指定する
    onListChanged: function() {
    if (this.course) {
            //最初にアクセス権限のあるコース
            var target = this.course.find(function (course) {
                //return true;
                if (course.available == 'true') return true;
            });
            if (target) {
            this.selectCourse(target.id);
            } else {
                $('pickupFlash').replace(this.unavailableHTML());
            }
    }
    },
    // ページのリンク表示
    pagination: function(pages, current) {
    if (pages <= 1) {
        return '';
    }
    var html = '<div id="pagination"><ul class="pagination">';
    if (current != 1) {
        html +=
        '<li class="p-first"><a href="javascript:courselist.changePage('+
        (current-1)+');">PREV</a> </li>';
    }
    for (var i = 1; i <= pages; i++) {
        if (i == current) {
        html += '<li><strong><a href="javascript:courselist.changePage('+i+');">'+i+'</a></strong> </li>';
        } else {
        html += '<li><a href="javascript:courselist.changePage('+i+');">'+i+'</a> </li>';
        }
    }
    if (current < pages) {
        html += '<li class="p-last"><a href="javascript:courselist.changePage('+(current+1)+');">NEXT</a> </li>';
    }
    html += "</ul></div>";
    $('pagination').replace(html);
    },
    changePage: function(num) {
    if (!this.url) {
        return;
    }
    this.currentPage = num;
    this.query(this.url, num);
    },
    // 検索が引っかからなかったときのHTML
    // オーバーライドして使用する
    notFoundList: function() {
        $('double').addClassName('courseNone');
        return '<div id="entryList" class="entryList"><h4>該当のコースはありませんでした。</h4></div>';
    },
    unavailableHTML: function(id) {
        html = '<div id="pickupFlash" class="entry-wrapper">';
        html += '<div class="bg-box"><br/><br/>';
        html += '<h4>「Bikeモードはベーシック会員でご利用いただける機能です。 会員ステータスの変更はauケータイから、登録情報の変更はアプリからおこなうことができます。」</h4>';
        html += '<p class="bg-qr center"><img alt="QRコード" src="/images/myworkout/qr_code.gif"/></p></div>';
        html += '</div>';
        return html;
    },

    //検索を実行する。
    //オーバーライドして利用する
    search: function() {
    },
    //検索時に表示するヘッダを定義する
    searchStatusHTML: function() {
    }
};