Skip to content

Commit

Permalink
Make StreetView plugin
Browse files Browse the repository at this point in the history
  • Loading branch information
uprel committed May 1, 2017
1 parent 7da56ef commit 70e1caf
Show file tree
Hide file tree
Showing 5 changed files with 186 additions and 152 deletions.
116 changes: 7 additions & 109 deletions client/site/js/Customizations.js
Original file line number Diff line number Diff line change
Expand Up @@ -2,29 +2,6 @@

function customInit() {

// I create a new control click event class
OpenLayers.Control.Click = OpenLayers.Class(OpenLayers.Control, {
defaultHandlerOptions: {
'single': true,
'double': false,
'pixelTolerance': 0,
'stopSingle': false,
'stopDouble': false
},
initialize: function(options) {
this.handlerOptions = OpenLayers.Util.extend(
{}, this.defaultHandlerOptions
);
OpenLayers.Control.prototype.initialize.apply(
this, arguments
);
this.handler = new OpenLayers.Handler.Click(
this, {
'click': this.trigger
}, this.handlerOptions
);
}
});
}

// called before map initialization
Expand Down Expand Up @@ -84,92 +61,6 @@ function customAfterMapInit() {
}
}
);

// Create a new map control based on Control Click Event
StreetViewControl = new OpenLayers.Control.Click( {
trigger: function(e) {
openStreetView(geoExtMap.map.getLonLatFromViewPortPx(e.xy));
}
});


function openStreetView (location) {

//TODO have to check if google is avaliable

var panel = Ext.getCmp('RightPanel');
panel.removeAll();

var x = location.lon;
var y = location.lat;

//alert(location);

var locWgs = location.transform(
authid,
new OpenLayers.Projection("EPSG:4326"));

//add location to higlightlayer
var marker = new OpenLayers.Feature.Vector(
new OpenLayers.Geometry.Point(x,y),
{},
streetViewMarkerStyle
);
featureInfoHighlightLayer.removeAllFeatures();
streetViewMarkerStyle.rotation = 0;
featureInfoHighlightLayer.addFeatures(marker);

// Configure panorama and associate methods and parameters to it
var options = {
position: new google.maps.LatLng(locWgs.lat, locWgs.lon),
pov: {
heading: 0,
pitch: 0,
zoom: 1
}
};

//panorama = new gxp.GoogleStreetViewPanel({
// location: location
//})

var panorama = new google.maps.StreetViewPanorama(
panel.body.dom, options
);

panel.add(panorama);
panel.expand();

//alert(sw.getStatus());


google.maps.event.addListener(panorama, 'position_changed', function() {
newLoc = panorama.getPosition();
x2 = new OpenLayers.LonLat(newLoc.lng(),newLoc.lat());
x2.transform(
new OpenLayers.Projection("EPSG:4326"),
new OpenLayers.Projection(authid)
);
marker.move(x2);
});

google.maps.event.addListener(panorama, 'pov_changed', function() {
//panorama.getPov().heading;
//panorama.getPov().pitch;

streetViewMarkerStyle.rotation = panorama.getPov().heading;
featureInfoHighlightLayer.removeAllFeatures();
featureInfoHighlightLayer.addFeatures(marker);

});


}


geoExtMap.map.addControl(StreetViewControl);


}

// called at the end of GetMapUrls
Expand Down Expand Up @@ -215,6 +106,13 @@ var customButtons = [
function customToolbarLoad() {
// // Handle the button click
// Ext.getCmp('TESTBUTTON').toggleHandler = mapToolbarHandler;

//load toolbar for each plugin
function load(key) {
this[key].customToolbarLoad();
}

Ext.iterate(Eqwc.plugins, load, Eqwc.plugins);
}

// called when an event on toolbar is invoked
Expand Down
14 changes: 5 additions & 9 deletions client/site/js/LoadAppProjectData.js
Original file line number Diff line number Diff line change
Expand Up @@ -122,6 +122,11 @@ projectData.getLegendUrl = function (layer) {
return legend;
};

//plugins
var Eqwc = {};
Eqwc.plugins = {};


var lang = "en";
var helpfile = "help_en.html";

Expand Down Expand Up @@ -401,15 +406,6 @@ var locationMarkerStyle = {
pointRadius: 10
};

var streetViewMarkerStyle = {
graphicName: "arrow",
strokeColor: '#333333',
fillColor: '#FF9900',
strokeWidth: 2,
pointRadius: 8,
rotation: 0
};

OpenLayers.Renderer.symbol.arrow = [0, 4, 2, 0, 4, 4, 2, 3, 0, 4];

//projection defaults from customProjections.js
Expand Down
35 changes: 1 addition & 34 deletions client/site/js/WebgisInit.js
Original file line number Diff line number Diff line change
Expand Up @@ -55,8 +55,6 @@ var measurePopup;
var currentlyVisibleBaseLayer = null;
var layerImageFormats = layerImageFormats || []; // use config from GlobalOptions if any

var enableStreetView = false;

// Call custom Init in Customizations.js
customInit();

Expand Down Expand Up @@ -859,19 +857,6 @@ function postLoading() {
});
myTopToolbar.insert(3, zoomToNextAction);

//streetViewBtn
var streetView = new Ext.Button({
icon: iconDirectory+'mActionStreetView.png',
id: 'streetViewBtn',
scale: 'medium',
tooltip: 'GoogleStreetView',
tooltipType: 'qtip',
toggleGroup: 'mapTools',
enableToggle: true,
allowDepress: true,
handler: mapToolbarHandler
});

//geolocate control
var geoLocateAction = new GeoExt.Action({
icon: iconDirectory+'mActionLocate.png',
Expand All @@ -892,7 +877,7 @@ function postLoading() {
allowDepress: true,
handler: mapToolbarHandler
});
myTopToolbar.insert(100, geoLocateAction,streetView);
myTopToolbar.insert(100, geoLocateAction);

//geolocation additional stuff
var pulsate = function(feature) {
Expand Down Expand Up @@ -1858,10 +1843,6 @@ function mapToolbarHandler(btn, evt) {

if (btn.id == "IdentifyTool") {
if (btn.pressed) {
if(enableStreetView) {
StreetViewControl.deactivate();
}

identifyToolActive = true;
activateGetFeatureInfo(true);
mainStatusText.setText(modeObjectIdentificationString[lang]);
Expand Down Expand Up @@ -2028,20 +2009,6 @@ function mapToolbarHandler(btn, evt) {
gl.activate();
}
}

if(btn.id == 'streetViewBtn') {
if (btn.pressed) {
StreetViewControl.activate();
mainStatusText.setText(modeStreetViewString[lang]);
enableStreetView = true;
}
else
{
StreetViewControl.deactivate();
featureInfoHighlightLayer.removeAllFeatures();
mainStatusText.setText(modeNavigationString[lang]);
}
}
}

function removeMeasurePopup() {
Expand Down
139 changes: 139 additions & 0 deletions plugins/streetview/js/0_controls.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,139 @@
/**
* Created by uros on 5/1/17.
*/

function streetViewBtnHandler(btn, evt) {

if(btn.id == 'streetViewBtn') {
if (btn.pressed) {
prepareStreetView();
}
else
{
StreetViewControl.deactivate();
featureInfoHighlightLayer.removeAllFeatures();
mainStatusText.setText(modeNavigationString[lang]);
}
}

}

function prepareStreetView() {

if(typeof(StreetViewControl) == 'undefined') {
// I create a new control click event class
OpenLayers.Control.Click = OpenLayers.Class(OpenLayers.Control, {
defaultHandlerOptions: {
'single': true,
'double': false,
'pixelTolerance': 0,
'stopSingle': false,
'stopDouble': false
},
initialize: function(options) {
this.handlerOptions = OpenLayers.Util.extend(
{}, this.defaultHandlerOptions
);
OpenLayers.Control.prototype.initialize.apply(
this, arguments
);
this.handler = new OpenLayers.Handler.Click(
this, {
'click': this.trigger
}, this.handlerOptions
);
}
});

// Create a new map control based on Control Click Event
StreetViewControl = new OpenLayers.Control.Click( {
trigger: function(e) {
openStreetView(geoExtMap.map.getLonLatFromViewPortPx(e.xy));
}
});

geoExtMap.map.addControl(StreetViewControl);
}

StreetViewControl.activate();
mainStatusText.setText(modeStreetViewString[lang]);
//enableStreetView = true;

//return true;
}


function openStreetView (location) {

//TODO have to check if google is avaliable

var panel = Ext.getCmp('RightPanel');
panel.removeAll();

var x = location.lon;
var y = location.lat;

//alert(location);

var locWgs = location.transform(
authid,
new OpenLayers.Projection("EPSG:4326"));

//add location to higlightlayer
var marker = new OpenLayers.Feature.Vector(
new OpenLayers.Geometry.Point(x,y),
{},
streetViewMarkerStyle
);
featureInfoHighlightLayer.removeAllFeatures();
streetViewMarkerStyle.rotation = 0;
featureInfoHighlightLayer.addFeatures(marker);

// Configure panorama and associate methods and parameters to it
var options = {
position: new google.maps.LatLng(locWgs.lat, locWgs.lon),
pov: {
heading: 0,
pitch: 0,
zoom: 1
}
};

//panorama = new gxp.GoogleStreetViewPanel({
// location: location
//})

var panorama = new google.maps.StreetViewPanorama(
panel.body.dom, options
);

panel.add(panorama);
panel.expand();

//alert(sw.getStatus());


google.maps.event.addListener(panorama, 'position_changed', function() {
newLoc = panorama.getPosition();
x2 = new OpenLayers.LonLat(newLoc.lng(),newLoc.lat());
x2.transform(
new OpenLayers.Projection("EPSG:4326"),
new OpenLayers.Projection(authid)
);
marker.move(x2);
});

google.maps.event.addListener(panorama, 'pov_changed', function() {
//panorama.getPov().heading;
//panorama.getPov().pitch;

streetViewMarkerStyle.rotation = panorama.getPov().heading;
featureInfoHighlightLayer.removeAllFeatures();
featureInfoHighlightLayer.addFeatures(marker);

});
}




0 comments on commit 70e1caf

Please sign in to comment.