components(
    {
        'name': 'ctrl',
        'embd': function(){
            var gsv = new GStreetviewPanorama(document.getElementById("ctrl"));
            RSV.ctrl = gsv;
            this.location();
        },
        'location': function(relocation){
            var gCl = RSV.gclient || new GStreetviewClient();
            RSV.gclient = gCl;
            var gsv = RSV.ctrl;
            var pos = RSV.getLatLng();
            var pov = RSV.getPOV();
            var _this_ = this;
            if(!relocation){
                gCl.getNearestPanoramaLatLng(pos, function(latlng){
                    RSV.waitPano(gsv, _this_.init.bind(_this_));
                    gsv.setLocationAndPOV(latlng, pov);
                });
            }else{
                gCl.getNearestPanoramaLatLng(pos, function(latlng){
                    gsv.setLocationAndPOV(latlng, pov);
                });
            }
        },
        'init': function(){
            if(this.handler){
                GEvent.removeListener(this.handler);
                this.handler = null;
            }
            comInit("ctrl");
        }
    },
    {
        'name': 'panorama',
        'embd': function(){
            var gsv = new GStreetviewPanorama(document.getElementById("panorama"));
            RSV.panorama = gsv;
            this.location();
        },
        'location': function(relocate){
            var gsv = RSV.panorama;
            var gCl = RSV.gclient || new GStreetviewClient();
            RSV.gclient = gCl;
            var latlng = RSV.getLatLng();
            var pov = RSV.getPOV();
            var _this_ = this;
            if(!relocate){
                gCl.getNearestPanoramaLatLng(latlng, function(latlng){
                    RSV.waitPano(gsv, _this_.init.bind(_this_));
                    gsv.setLocationAndPOV(latlng, pov);
                });
            }else{
                gCl.getNearestPanoramaLatLng(latlng, function(latlng){
                    gsv.setLocationAndPOV(latlng, pov);
                });
            }
            RSV.setAddress(function(o){
                if(o.Status.code==200){
                    $('address').innerHTML= o.Placemark[0].address;
                }
            });
        },
        'init': function(){
            if(this.handler){
                GEvent.removeListener(this.handler);
                this.handler = null;
            }
            comInit("panorama");
        }
    },
    {
        'name': 'viewer',
        'embd': function(){
            var w = RSV.o.viewer_width, h = RSV.o.viewer_height;
            var c = $('panoramaContainer');
            var here = document.createElement('DIV');
            RSV.canvasContainer = here;
            RSV.panoramaContainer = $('panorama');
            here.id = "flashhere";
            here.style.position = "absolute";
            here.style.top = "0px";
            here.style.left = "0px";
            here.style.width = w + "px";
            here.style.height = h + "px";
            here.style.zIndex = "20";
            here.innerHTML = "<a href='http://www.adobe.com/go/getflashplayer'>Get Flash Player 10.</a>";
            c.appendChild(here);
            GEvent.addListener(RSV, "flashinit", this.init);

            var so = new SWFObject(RSV.api["flash/viewer3d"],
                "canvas", here.style.width, here.style.height,
                "10", "#FFFFFF");
            so.addParam("wmode", "transparent");
            so.addParam("scale", "noscale");
            for(var k in RSV.o){
                if(k=="authenticity_token" || k=="viewer_height" ||k=="viewer_width")
                    so.addVariable(k, RSV.o[k]);
            }
            so.useExpressInstall(RSV.api["flash/expressinstall"]);
            so.write("flashhere");


            RSV.flash = $('canvas');
            RSV.allContainer = c;
        },
        'location': function(){
            RSV.flash.setLocationAndPOV(RSV.latlng, RSV.pov);
        },
        'init': function(){
            var main = RSV.viewer || RSV.canvas;
            if(main){
                var o = getPanoSize();
                main.style.height = o.height + "px";
                main.style.width = o.width + "px";
            }
            RSV.flash.setLocationAndPOV(RSV.latlng, RSV.pov);
            comInit("viewer");
        }
    },
    {
        'name': 'canvas3d',
        'embd': function(){
            var w = RSV.canvas_width, h = RSV.canvas_height;
            var c = $('panoramaContainer');
            var here = document.createElement('DIV');
            RSV.canvasContainer = here;
            RSV.panoramaContainer = $('panorama');
            here.id = "flashhere";
            here.style.position = "absolute";
            here.style.top = "0px";
            here.style.left = "0px";
            here.style.width = w + "px";
            here.style.height = h + "px";
            here.style.zIndex = "20";
            here.innerHTML = "<a href='http://www.adobe.com/go/getflashplayer'>Get Flash Player 10.</a>";
            c.appendChild(here);
            GEvent.addListener(RSV, "flashinit", this.init);

            //var so = new SWFObject(RSV.api["flash/canvas3d"], "canvas", w, h, "10", "#FFFFFF");
            var so = new SWFObject(UI['canvas'], "canvas", w, h, "10", "#FFFFFF");
            so.addParam("wmode", "transparent");
            so.addParam("scale", "noscale");
            if(js_helper.getVar('is_logged_in')){
                so.addVariable("user_id",  js_helper.getVar('user_id') );
            }
            so.addVariable("enable_save", js_helper.getVar('is_logged_in'));
            for(var k in RSV.o){
                so.addVariable(k, RSV.o[k]);
            }
            so.useExpressInstall(RSV.api["flash/expressinstall"]);
            so.write("flashhere");


            RSV.flash = $('canvas');
            RSV.allContainer = c;
        },
        'location': function(){
            RSV.flash.setLocationAndPOV(RSV.latlng, RSV.pov);
        },
        'init': function(){
            comInit("canvas3d");
        }
    },
    {
        'name': 'map',
        'embd': function(){
            var d = $('map');
            RSV.mapContainer = d;
            var m = new GMap2(d);
            RSV.gmap = m;
            RSV.gmap.addControl(new google.maps.SmallZoomControl());
            if(js_helper.pagePath=="/view/index"){
                RSV.gmap.addControl(new google.maps.LocalSearch());
            }
            this.location();
        },
        'location': function(relocate){
            var _this_ = this;
            if(!relocate){
                this.handler = GEvent.addListener(RSV.gmap, "load", function(){
                    _this_.init();
                });
            }
            if(js_helper.pagePath=="/view/index"){
                RSV.gmap.setCenter(RSV.getLatLng(), 13);
            }else if(js_helper.pagePath=="/view/top"
                     || js_helper.pagePath=="/view/top_fav"
                     || js_helper.pagePath=="/view/top_rec"
                     || js_helper.pagePath=="/view/root"){
                RSV.gmap.setCenter(RSV.getLatLng(), 6);
            }
        },
        'init': function(){
            if(this.handler){
                GEvent.removeListener(this.handler);
                this.handler = null;
            }
            if(js_helper.pagePath=="/view/index"){
                RSV.gmap.addOverlay(new GStreetviewOverlay());
            }
            this.mapSearch(RSV.gmap);
            comInit("map");
        },
        'mapSearch': function(map, _callback){
            var bounds = map.getBounds();
            var opts = {}, ne = bounds.getNorthEast(), sw = bounds.getSouthWest();
            var callback = _callback || this.onMapData.bind(this);
            opts["nlat"] = ne.lat();
            opts["elng"] = ne.lng();
            opts["slat"] = sw.lat();
            opts["wlng"] = sw.lng();
            RSV._mapTransport = new Ajax.Request(RSV.api["rakugaki/list_by_bounds"], {
                'method': "GET",
                'parameters': opts,
                'onSuccess': callback
            });
        },
        'onMapMove': function(){
            var latlng = RSV.gmap.getCenter();
            var gCl = RSV.gclient  || new GStreetviewClient();
            var pov = Object.extend({}, RSV.pov);
            var _this_ = this;
            RSV.moveNearLatLng(latlng, function(){
                _this_.mapSearch(RSV.gmap);
            });
        },
        'onMapData': function(res){
            var list = res.responseText.evalJSON();
            if(list==null)return;
            for(var i=0,l=list.length;i<l;++i){
                var raku = list[i]["rakugaki"];
                var image = RSV.api['resource/mark'];
                var icon = new GIcon(G_DEFAULT_ICON, image);
                icon.iconSize = new GSize(22, 30);
                var opt = RSV.markOpt;
                opt.icon = icon;
                opt.title = raku.title;
                var marker = new GMarker(new GLatLng(raku.lat, raku.lng), opt);
                RSV.gmap.addOverlay(marker);
                var onclick = function(){
                    var q = arguments.callee.q;
                    if(js_helper.pagePath=="/view/index"){
                        RSV.moveByClick(q.lat,q.lng,q.pitch,q.yaw,q.zoom, "map");
                    }else{
                        location.href = location.protocol + "//" + location.host +
                            "/view/index" + "?" + Object.toQueryString(arguments.callee.q);
                    }
                };
                onclick.q = {
                    'lat': raku.lat, 'lng': raku.lng,
                    'yaw': raku.yaw, 'pitch': raku.pitch, 'zoom': raku.zoom
                };

                GEvent.addListener(marker, "click", onclick);
            }
        }
    },
    {
        'name': 'search',
        'embd': function(){
            var searchControl = new google.search.SearchControl();
            searchControl.addSearcher(new GlocalSearch());
            RSV.gsearch = searchControl;
            searchControl.draw($('search'));
        },
        'init': function(){
        }
    }
);
pageConfig({
    '/view/top': {
        'components': ['map'],
        'thumnails': {
            'rankings': [346, 211],
            'lastones': [346, 211]
        },
        'ready': function(){
            RSV.setVar("latlng", js_helper.getVar("latlng"));
        },
        'init': function(){
            var gmap = ConfigCtrl.getComponents("map");
            var gsearch = gmap.mapSearch.bind(gmap).curry(RSV.gmap);
            GEvent.addListener(RSV.gmap, "moveend", gsearch);
        }
    },
    '/view/root': {
        'components': ['map'],
        'thumnails': {
            'rankings': [346, 211],
            'lastones': [346, 211]
        },
        'ready': function(){
            RSV.setVar("latlng", js_helper.getVar("latlng"));
        },
        'init': function(){
            var gmap = ConfigCtrl.getComponents("map");
            var gsearch = gmap.mapSearch.bind(gmap).curry(RSV.gmap);
            GEvent.addListener(RSV.gmap, "moveend", gsearch);
        }
    },
    '/view/top_fav': {
        'components': ['map'],
        'thumnails': {
            'rankings': [346, 211]
        },
        'ready': function(){
            RSV.setVar("latlng", js_helper.getVar("latlng"));
        },
        'init': function(){
            var gmap = ConfigCtrl.getComponents("map");
            //gmap.mapSearch(RSV.gmap);
            var gsearch = gmap.mapSearch.bind(gmap).curry(RSV.gmap);
            GEvent.addListener(RSV.gmap, "moveend", gsearch);
        }
    },
    '/view/top_rec': {
        'components': ['map'],
        'thumnails': {
            'recommends': [346, 211]
        },
        'ready': function(){
            RSV.setVar("latlng", js_helper.getVar("latlng"));
        },
        'init': function(){
            var gmap = ConfigCtrl.getComponents("map");
            //gmap.mapSearch(RSV.gmap);
            var gsearch = gmap.mapSearch.bind(gmap).curry(RSV.gmap);
            GEvent.addListener(RSV.gmap, "moveend", gsearch);
        }
    },
    '/view/user': {
        'thumnails': {
            'rakugakis': [346, 211]
        },
        'init': function(){
            if(js_helper.getVar('has_draft')){
                RSV.embdDraft("draft", draft["draft"], 346, 211);
            }
        }
    },
    '/view/fav': {
        'thumnails': {
            'rakugakis': [346, 211]
        },
        'init': function(){
        }
    },
    '/view/index': {
        'components': [
            'ctrl', 'panorama', 'viewer', 'map'
        ],
        'thumnails': {
            'neighbors': [346, 211]
        },
        'ready': function(){
            var vars = js_helper.getAllVar();
            for(var i in vars){
                RSV.setVar(i, vars[i]);
            }
        },
        'init': function(){
            var s = js_helper.getVar("search_key");
            if(s!=null){
                RSV.search(s);
            }else{
                RSV.flash.setLocationAndPOV(RSV.latlng, RSV.pov);
                RSV.panorama.setPOV(RSV.getPOV());
                RSV.setChangeEvent(RSV.ctrl);
                //RSV.ctrl.setPOV(RSV.getPOV());
            }

            //地図のイベントをセット
            var gmap = ConfigCtrl.getComponents("map");
            var onmove = gmap.onMapMove.bind(gmap);
            var onzoom = function(){
                gmap.mapSearch(RSV.gmap);
            };
            GEvent.addListener(RSV.gmap, "moveend", onmove);
            GEvent.addListener(RSV.gmap, "zoomend", onzoom);
            GEvent.addListener(RSV.gmap, "click", RSV.moveOnMapClick);

            //落書きページ用のリンク
            var rakugakiLink = $('rakugaki');
            if(rakugakiLink!=null){
                Event.observe(rakugakiLink.getElementsByTagName('a')[0],"click",
                          function(e){
                              e.preventDefault();
                              var o = {
                                  lat: RSV.latlng.lat, lng: RSV.latlng.lng,
                                  yaw: RSV.pov.yaw, pitch: RSV.pov.pitch,
                                  zoom: RSV.pov.zoom
                              };
                              location.href = RSV.api["page/canvas3d"] + "?" + Object.toQueryString(o);
                          });
            }
            /*
            Event.observe($('SEARCHBOX'), 'submit', function(e){
                e.preventDefault();
                RSV.search($('search').value);
            });
            */
            var rakugaki_id = null;
            if(rakugaki_id = js_helper.getVar('rakugaki_id')){
                RSV.flash.changeRakugakiById(rakugaki_id);
            }
            RSV.addMarker(RSV.gmap);
            RSV.flash.pageInit();
            //if(!Prototype.Browser.WebKit){
                RSV.ctrlTrack();
                RSV.viewTrack();
            //}
            RSV.setComplaint($('complaint'));
        },
        'uninit': function(){
            var ls = RSV.ghandlers;
            for(var i=0,l=ls.length;i<l;++i){
                GEvent.removeListener(ls[i]);
            }
        }
    },
    '/view/canvas3d': {
        'components': [
            'panorama', 'canvas3d'
        ],
        'ready': function(){
            var vars = js_helper.getAllVar();
            for(var i in vars){
                RSV.setVar(i, vars[i]);
            }
        },
        'init': function(){
            RSV.flash.setLocationAndPOV(RSV.latlng, RSV.pov);
            RSV.panorama.setPOV(RSV.getPOV());
            RSV.setChangeEvent(RSV.panorama);
            RSV.setAddress(function(o){
                if(o.Status.code==200){
                    RSV.flash.setAddress(o.Placemark[0].address);
                }
            });
            RSV.flash.pageInit();
        }
    },
    '/view/canvas_draft': {
        'components': [
            'panorama', 'canvas3d'
        ],
        'ready': function(){
            var vars = js_helper.getAllVar();
            for(var i in vars){
                RSV.setVar(i, vars[i]);
            }
        },
        'init': function(){
            RSV.flash.setLocationAndPOV(RSV.latlng, RSV.pov);
            RSV.panorama.setPOV(RSV.getPOV());
            RSV.setChangeEvent(RSV.panorama);
            RSV.setAddress(function(o){
                if(o.Status.code==200){
                    RSV.flash.setAddress(o.Placemark[0].address);
                }
            });
            RSV.flash.pageInit();
        }
    },
    '/pages/top': {
        'components': [],
        'thumnails': {
        },
        'ready': function(){},
        'init': function(){}
    }
});