function TControlStreetView(opts)
{
	// save options
	this._opts = opts;

	// default properties
	this._active = false;

	// street view overlay
	this._stview_overlay = new GStreetviewOverlay();

        // is dragging?
        this._dragging = false;
        
        // street view client
        this._stview_client = new GStreetviewClient();

}
TControlStreetView.prototype = new GControl();

// Constants
TControlStreetView.WIDTH = 75;
TControlStreetView.TEXT = "Street View";
TControlStreetView.BTN_SELECTED_STYLE = 'color: black; border-style: solid; border-color: rgb(52, 86, 132) rgb(108, 157, 223) rgb(108, 157, 223) rgb(52, 86, 132); border-width: 1px; font-size: 12px; font-weight: bold;'+
					' width: '+(TControlStreetView.WIDTH-2)+'px;';
TControlStreetView.BTN_NOT_SELECTED_STYLE = 'color: black; border-style: solid; border-color: white rgb(176, 176, 176) rgb(176, 176, 176) white; border-width: 1px; font-size: 12px;'+
						' width: '+(TControlStreetView.WIDTH-2)+'px;';
TControlStreetView.BUTTON_RIGHT_OFFSET = 231;
TControlStreetView.BUTTON_TOP_OFFSET = 7;
TControlStreetView.DRAG_ICON_RIGHT_OFFSET = 286;
TControlStreetView.DRAG_ICON_TOP_OFFSET = 21;
TControlStreetView.DRAG_ICON_OFFSET_LEFT = 17;
TControlStreetView.DRAG_ICON_OFFSET_TOP = 34;

// Initialize control
TControlStreetView.prototype.initialize = function (map)
{
        // store map reference
        this._map = map;

	// for listeners
	var me = this;

        // create button
        this._button_container = new Element('div', {
		title: "Toggle street view overlay", 
		style: 'border: 1px solid black; position: absolute; background-color: white; text-align: center; cursor: pointer; width: '+TControlStreetView.WIDTH+"px;" 
	}).insert((this._button_element = new Element('div', { style: TControlStreetView.BTN_NOT_SELECTED_STYLE } ).update(TControlStreetView.TEXT)));

	// create dragging icon
	this._dragging_container = new Element('div', { 
		style: 'position:absolute; left: '+(this._map.getSize().width-TControlStreetView.DRAG_ICON_RIGHT_OFFSET)+'px; top: '+TControlStreetView.DRAG_ICON_TOP_OFFSET+'px;' 
	}).insert((this._dragging_sub_container = new Element('div', { 
		style: "width:35px;height:25px;overflow:hidden;position:absolute;",
		title: "Drag me to a street!"
	})).insert((this._dragging_image = new Element('img', {
		style: "top:0px;position:relative;",
		src: "images/cb_images.png"
	}))));

	$(this._dragging_container).hide();
	
	// make it draggable
	this._dragging_object = new GDraggableObject(this._dragging_container, { left: (this._map.getSize().width-TControlStreetView.DRAG_ICON_RIGHT_OFFSET), top: TControlStreetView.DRAG_ICON_TOP_OFFSET } );

	// build street view panorama window
        this._stview_layer = new Element('div',{ style: 'position:absolute;top:0px;left:0px;width:100%;height:100%;background-color:gray;z-index:2;' });
        this._stview_layer_panorama = new Element('div',{ style: 'width:100%;color:black;height:'+(this._map.getSize().height-20)+'px;' });
	this._stview_layer_title = new Element('div',{ style: 'width:100%;height:20px;' }).insert(new Element('span',{ style: 'color:white;font-weight:bold;display:block;margin-left:5px;padding-top:3px;' }).update("Street View"));
        this._stview_layer_close = new Element('div',{ style: 'position:absolute;right:0px;top:0px;color:white;font-weight:bold;z-index:10;background-color:gray;border:solid gray 1px;cursor:pointer;padding:2px 3px 3px 3px;height:12px;',
                                                        title: 'Close street view' }).update("X");
	this._stview_layer.insert(this._stview_layer_title.insert(this._stview_layer_close)).insert(this._stview_layer_panorama);
        $(this._stview_layer).hide();

	// setup event listeners
	GEvent.addDomListener(this._button_element,"click",function () {
		me._toggleActive();
	});

        GEvent.addListener(this._dragging_object,"drag",function () {
                if(!me._dragging)
                {
                        // change icon
			me._dragging_sub_container.style.height = "40px";
			me._dragging_image.style.top = "-25px";

                        me._dragging = true;
                }
        });

        GEvent.addListener(this._dragging_object,"dragend",function () {
                if(me._dragging)
                {
                        // get current lat/lng
                        var point = me._map.fromContainerPixelToLatLng(new GPoint(
					parseInt(me._dragging_container.style.left)+TControlStreetView.DRAG_ICON_OFFSET_LEFT,
					parseInt(me._dragging_container.style.top)+TControlStreetView.DRAG_ICON_OFFSET_TOP
			));

                        // check if street view is available
                        me._stview_client.getNearestPanorama(point,function (stviewData) {
                                if(stviewData.code != 200) alert("No streev view available for this area");
                                else me._openSTV(stviewData);

                                // change icon
				me._dragging_sub_container.style.height = "25px";
				me._dragging_image.style.top = "0px";
                                me._dragging_object.moveTo(new GPoint((me._map.getSize().width-TControlStreetView.DRAG_ICON_RIGHT_OFFSET),TControlStreetView.DRAG_ICON_TOP_OFFSET));
                                me._dragging = false;
                        });
                }
        });

        GEvent.addDomListener(this._stview_layer_close,"mouseover",function () { this.style.color = "gray"; this.style.backgroundColor = "white"; });
        GEvent.addDomListener(this._stview_layer_close,"mouseout",function () { this.style.color = "white"; this.style.backgroundColor = "gray"; });
        GEvent.addDomListener(this._stview_layer_close,"click",function () { me._closeSTV(); });

	// add to map	
        $(map.getContainer()).insert(this._button_container).insert(this._dragging_container).insert(this._stview_layer);

	return this._button_container;
}

// default position
TControlStreetView.prototype.getDefaultPosition = function() { return new GControlPosition(G_ANCHOR_TOP_RIGHT, new GSize(TControlStreetView.BUTTON_RIGHT_OFFSET,TControlStreetView.BUTTON_TOP_OFFSET)); } 
TControlStreetView.prototype.printable = function () { return true; }
TControlStreetView.prototype.selectable = function () { return false; }

// toggle active/inactive
TControlStreetView.prototype._toggleActive = function ()
{
	if(this._active) this._deactivate();
	else this._activate();
}

TControlStreetView.prototype._activate = function () 
{ 
	// add overlay to the map
	this._map.addOverlay(this._stview_overlay);

	// show dragging icon
	this._dragging_container.show();

	this._button_element.writeAttribute('style',TControlStreetView.BTN_SELECTED_STYLE); 
	this._active = true; 
}
TControlStreetView.prototype._deactivate = function () 
{ 
	// remove overlay from map
	this._map.removeOverlay(this._stview_overlay);

	// hide dragging icon
	this._dragging_container.hide();

	this._button_element.writeAttribute('style',TControlStreetView.BTN_NOT_SELECTED_STYLE); 
	this._active = false; 
}

TControlStreetView.prototype._openSTV = function (stviewData)
{
        $(this._stview_layer).show();
	this._stview_layer_panorama.style.height = (this._map.getSize().height-20)+'px';
        this._stview_panorama = new GStreetviewPanorama(this._stview_layer_panorama, {latlng: stviewData.location.latlng, pov: stviewData.location.pov });
}

TControlStreetView.prototype._closeSTV = function ()
{
	if( this._stview_panoram)
	{
		this._stview_panorama.remove();
		this._stview_panorama = null;
	}
        $(this._stview_layer).hide();
}