/**
 * views/top/layout__1.0.1.js
 * Encoding: UTF-8
 * Copyright: Alike Co.,Ltd.
 */
(function($){

    // カテゴリ：グルメ
    var DIVISION_ID_GOURMET = 2;

    // カテゴリ：ビューティ
    var DIVISION_ID_BEAUTY = 4;

    // カテゴリ：ホテル
    var DIVISION_ID_HOTEL = 5;

    // カテゴリ名
    var _divNames = {2 : "gourmet",
                     4  : "beauty",
                     5   : "hotel"};

    // ガイド：クリップ
    var TOP_GUIDE_ID_CLIP = 1;

    // ガイド：コミュニティ
    var TOP_GUIDE_ID_COMMUNITY = 2;

    // ガイド：クーポン
    var TOP_GUIDE_ID_COUPON = 3;

    // ガイド：アライク
    var TOP_GUIDE_ID_ALIKE = 4;

    // ガイド名
    var _topGuideNames = {1 : "clip",
                          2 : "community",
                          3 : "coupon",
                          4 : "alike"};

    // ガイド切り替え処理のロック
    var lock = false;

    // インターバルID
    var interval = 0;

    // 速度(ms)
    var speed    = 500;

    // 表示時間(ms)
    var pause    = 5000;

    // 現在表示しているガイドID
    var currentGuideId = 4;

    // 初期化実行
    $(function(){
        //
        setTimeout(init, 0);
    });

    /**
     * 初期化
     *
     * @param
     * @return
     */
    function init()
    {
        // タブを表示
        selectTab(DIVISION_ID_GOURMET);

        // カテゴリ毎の設定
        for (var index in _divNames)
        {
            // サーチボタンのclickイベントリスナーを設定
            $('#hs_search_button__'+_divNames[index]).click(
                function(index_)
                {
                    return function()
                    {
                        hs_submit(index_);
                    }
                }(index));

            // カテゴリタブのイベントリスナーの設定
            $('#tab__'+_divNames[index]).click(
                function(index_)
                {
                    return function()
                    {
                        selectTab(index_);
                    }
                }(index));
        }

        // グルメ検索ボックスに説明文
        $("#hs_search_input__"+_divNames[DIVISION_ID_GOURMET])
            .each(hs_setDefaultText_Gourmet)
            .focus(hs_removeDefaultText)
            .blur(hs_setDefaultText_Gourmet);

        // ホテル検索ボックスに説明文
        $("#hs_search_input__"+_divNames[DIVISION_ID_HOTEL])
            .each(hs_setDefaultText_Hotel)
            .focus(hs_removeDefaultText)
            .blur(hs_setDefaultText_Hotel);

        // ビューティ検索ボックスに説明文
        $("#hs_search_input__"+_divNames[DIVISION_ID_BEAUTY])
            .each(hs_setDefaultText_Beauty)
            .focus(hs_removeDefaultText)
            .blur(hs_setDefaultText_Beauty);

        // ガイド画像の表示
        nextTopGuide()

        // ガイド更新インターバルセット
        interval = setInterval(nextTopGuide, pause);

        // ガイド画像ブロックのhoverイベントリスナーを設定
        $('#intro_box').hover(
            function()
            {
                //
                clearInterval(interval);
            },
            function()
            {
                interval = setInterval(nextTopGuide, pause);
            }
            );

        // 全ガイドボタンをひとつずつ処理
        for (var index in _topGuideNames)
        {
            // ガイドボタンのhoverイベントリスナーを設定
            $('#intro_box_selector__'+_topGuideNames[index]).hover(
                    function (index_)
                    {
                        return function()
                        {
                            //
                            clearInterval(interval);

                            //
                            selectTopGuide(index_, false);
                        }
                    }(index),
                    function()
                    {
                        interval = setInterval(nextTopGuide, pause);
                    }
                );
        }

        //
        $('#intro_box__community').click(function(){
            location.href="/com/";
        });

        $('#intro_box__community').css("cursor", "pointer");
    };

    /**
     * カテゴリタブの切り替え
     *
     * @param
     * @return
     */
    function selectTab(divId_)
    {
        //
        for (var index in _divNames)
        {
            if (index != divId_)
            {
                //
                $('#search_padding__'+_divNames[index]).hide();

                //
                $('#tab__'+_divNames[index]).removeClass("selected");
            }
        }

        //
        $('#search_padding__'+_divNames[divId_]).show();

        //
        $('#tab__'+_divNames[divId_]).addClass("selected");

        // SWFのDIV変更
        var swf = window["AreaChooser"] || document["AreaChooser"];
        if (swf && typeof swf.changeCategory === "function")
        {
            swf.changeCategory(divId_);
        }
    }

    /**
     * 検索の実行
     *
     * @param
     * @return
     */
    function hs_submit(divId_)
    {
        var keywords = jQuery('#hs_search_input__'+_divNames[divId_]);

        if (keywords.hasClass('hs_notext'))
        {
            keywords.val("");
        }

        jQuery('#hs_search_form__'+_divNames[divId_]).submit();
    }

     /**
      * 次のガイドを表示
      *
      * @param
      * @return
      */
     function nextTopGuide()
     {
         //
         var next = currentGuideId + 1;

         //
         if (next > 4)
         {
             next = 1;
         }

         //
         selectTopGuide(next, true);
     }

     /**
      * ガイドの表示
      *
      * @param
      * @return
      */
     function selectTopGuide(guideId_, slow_)
     {
         //
         slow = (slow_ ? true : false);

         //
         if (lock)
         {
             return;
         }

         //
         lock = true;

         // 全てのガイドをひとつずつ処理
         for (var index in _topGuideNames)
         {
             if (index != currentGuideId)
             {
                 // 画像を非表示
                 $('#intro_box__'+_topGuideNames[index]).hide();
             }

             // ボタンを非表示
             $('#intro_box_selector__'+_topGuideNames[index]).removeClass('selected');
         }

         if (slow)
         {
             // 表示する画像をフェードアウト
             $('#intro_box__'+_topGuideNames[currentGuideId])
                 .animate({opacity: 1},
                          speed)
                 .fadeOut('slow',function(){

                    // 表示する画像をフェードイン
                    $('#intro_box__'+_topGuideNames[guideId_])
                        .animate({opacity: 1},
                                speed)
                       .fadeIn('slow',function(){
                           // 現在表示している画像IDを保存
                           currentGuideId = guideId_;

                           //
                           lock = false;
                       });
                });
         }
         else
         {
             //
             $('#intro_box__'+_topGuideNames[currentGuideId]).hide();

             //
             $('#intro_box__'+_topGuideNames[guideId_]).show();

             // 現在表示している画像IDを保存
             currentGuideId = guideId_;

             //
             lock = false;
         }

         // 表示している画像のボタンをハイライト
         $('#intro_box_selector__'+_topGuideNames[guideId_]).addClass('selected');
     }

     /**
      * 検索テキストフィールド説明文を非表示化
      *
      * @param
      * @return
      */
     function hs_removeDefaultText()
     {
         var self = jQuery(this);

         if (self.hasClass("hs_notext"))
         {
             self.val("");
             self.removeClass("hs_notext");
         }
     }

     /**
      * グルメ検索のテキストフィールドの説明文字の表示
      *
      * @param
      * @return
      */
     function hs_setDefaultText_Gourmet()
     {
         var self = jQuery(this);
         var defaultText = "店名 地名 ジャンル名 電話番号など";

         if (self.val().length == 0 ||
             (!self.hasClass("hs_notext") && self.val() == defaultText))
         {
             self.addClass("hs_notext");
             self.val(defaultText);
         }

         hs_removeDefaultText();
     }

     /**
      * ホテル検索のテキストフィールドの説明文字の表示
      *
      * @param
      * @return
      */
     function hs_setDefaultText_Hotel()
     {
         var self = jQuery(this);
         var defaultText = "地名 ホテル名 電話番号など";

         if (self.val().length == 0 ||
             (!self.hasClass("hs_notext") && self.val() == defaultText))
         {
             self.addClass("hs_notext");
             self.val(defaultText);
         }

         hs_removeDefaultText();
     }

     /**
      * ビューティ検索のテキストフィールドの説明文字の表示
      *
      * @param
      * @return
      */
     function hs_setDefaultText_Beauty()
     {
         var self = jQuery(this);
         var defaultText = "店名 地名 ジャンル名 電話番号など";

         if (self.val().length == 0 ||
             (!self.hasClass("hs_notext") && self.val() == defaultText))
         {
             self.addClass("hs_notext");
             self.val(defaultText);
         }

         hs_removeDefaultText();
     }
})(jQuery);