266 lines
9.8 KiB
Java
266 lines
9.8 KiB
Java
package org.gcube.portlets.user.geoportaldataviewer.client.ui.products.concessioni;
|
|
|
|
import org.gcube.application.geoportalcommon.shared.products.model.LayerConcessioneDV;
|
|
import org.gcube.portlets.user.geoportaldataviewer.client.GeoportalDataViewerConstants;
|
|
import org.gcube.portlets.user.geoportaldataviewer.client.GeoportalDataViewerConstants.MAP_PROJECTION;
|
|
import org.gcube.portlets.user.geoportaldataviewer.client.ui.map.ExtentMapUtil;
|
|
import org.gcube.portlets.user.geoportaldataviewer.client.ui.map.ExtentMapUtil.Location;
|
|
import org.gcube.portlets.user.geoportaldataviewer.client.ui.map.ExtentMapUtil.PLACE;
|
|
import org.gcube.portlets.user.geoportaldataviewer.client.ui.map.MapView;
|
|
import org.gcube.portlets.user.geoportaldataviewer.client.ui.util.CustomFlexTable;
|
|
|
|
import com.github.gwtbootstrap.client.ui.DropdownButton;
|
|
import com.github.gwtbootstrap.client.ui.NavLink;
|
|
import com.github.gwtbootstrap.client.ui.constants.ButtonType;
|
|
import com.github.gwtbootstrap.client.ui.constants.IconType;
|
|
import com.google.gwt.core.client.GWT;
|
|
import com.google.gwt.dom.client.Style;
|
|
import com.google.gwt.dom.client.Style.Unit;
|
|
import com.google.gwt.event.dom.client.ClickEvent;
|
|
import com.google.gwt.event.dom.client.ClickHandler;
|
|
import com.google.gwt.uibinder.client.UiBinder;
|
|
import com.google.gwt.uibinder.client.UiField;
|
|
import com.google.gwt.user.client.Window;
|
|
import com.google.gwt.user.client.ui.Composite;
|
|
import com.google.gwt.user.client.ui.HTML;
|
|
import com.google.gwt.user.client.ui.HTMLPanel;
|
|
import com.google.gwt.user.client.ui.Widget;
|
|
|
|
import ol.Coordinate;
|
|
|
|
public class LayerConcessioneView extends Composite {
|
|
|
|
private static LayerConcessioneUiBinder uiBinder = GWT.create(LayerConcessioneUiBinder.class);
|
|
|
|
interface LayerConcessioneUiBinder extends UiBinder<Widget, LayerConcessioneView> {
|
|
}
|
|
|
|
@UiField
|
|
HTMLPanel layerConcessionePanel;
|
|
|
|
@UiField
|
|
HTMLPanel mapViewPanel;
|
|
|
|
private CustomFlexTable customTable = new CustomFlexTable();
|
|
|
|
private static enum IMAGE_EXPORT_AS {
|
|
PNG, JPEG
|
|
};
|
|
|
|
int downloadAttempt = 0;
|
|
|
|
public LayerConcessioneView(LayerConcessioneDV layerDV) {
|
|
initWidget(uiBinder.createAndBindUi(this));
|
|
GWT.log("Showing: " + layerDV);
|
|
|
|
GWT.log("WMS LINK: " + layerDV.getWmsLink());
|
|
if (layerDV.getLayerName() != null && layerDV.getWmsLink() != null) {
|
|
|
|
DropdownButton exportMapButton = new DropdownButton("Export Map as...");
|
|
exportMapButton.setType(ButtonType.LINK);
|
|
exportMapButton.setIcon(IconType.DOWNLOAD_ALT);
|
|
exportMapButton.setTitle("Export the map view (OSM + layer) as an image...");
|
|
Style exportStyle = exportMapButton.getElement().getStyle();
|
|
//exportStyle.setWidth(100, Unit.PCT);
|
|
exportStyle.setMarginLeft(70, Unit.PCT);
|
|
|
|
Location italyLocation = ExtentMapUtil.getLocation(PLACE.ITALY);
|
|
Coordinate transformedCenterCoordinate = italyLocation.getCoordinate(MAP_PROJECTION.EPSG_3857);
|
|
MapView mapView = new MapView(transformedCenterCoordinate,
|
|
GeoportalDataViewerConstants.LIGHT_MAP_ITALY_FIT_ZOOM_ON, "70%", "300px");
|
|
|
|
mapViewPanel.add(mapView);
|
|
mapViewPanel.add(exportMapButton);
|
|
String mapServerHost = layerDV.getWmsLink().contains("?")
|
|
? layerDV.getWmsLink().substring(0, layerDV.getWmsLink().indexOf("?"))
|
|
: layerDV.getWmsLink();
|
|
|
|
mapView.addWMSLayer(mapServerHost, layerDV.getLayerName(), layerDV.getBbox());
|
|
|
|
String htmlLinkId = mapView.getPanelMapElementId() + "-image-download";
|
|
|
|
for (IMAGE_EXPORT_AS exportType : IMAGE_EXPORT_AS.values()) {
|
|
NavLink navLink = new NavLink(exportType.name());
|
|
String exportExt = exportType.name().toLowerCase();
|
|
String filename = layerDV.getLayerName() + "." + exportExt;
|
|
String mimeType = "image/" + exportExt;
|
|
final HTML htmlLink = new HTML("<a id=\"" + htmlLinkId + "\" download=\"" + filename + "\"></a>");
|
|
navLink.getElement().appendChild(htmlLink.getElement());
|
|
navLink.addClickHandler(new ClickHandler() {
|
|
|
|
@Override
|
|
public void onClick(ClickEvent event) {
|
|
|
|
// DOWNLOAD only the layer by Geoserver
|
|
/*
|
|
* Map<String, String> mapLayerURLs =
|
|
* mapView.getLightOLSM().getLayerURLsProperty(); Collection<String> layerURLs =
|
|
* mapLayerURLs.values(); ArrayList<String> layers = new
|
|
* ArrayList<String>(layerURLs); exportPDF(layers.get(0)); String layerURL =
|
|
* mapLayerURLs.get(layerDV.getLayerName()); GWT.log("layerDV name is: " +
|
|
* layerDV.getLayerName()); if (layerURL != null) Window.open(layerURL,
|
|
* "_blank", null);
|
|
*/
|
|
|
|
downloadAttempt++;
|
|
|
|
if (downloadAttempt > 3) {
|
|
Window.alert("LOOP");
|
|
return;
|
|
}
|
|
|
|
// DOWNLOAD the OSM + layer by canvas
|
|
downloadMap(mapView.getLightOLSM().getMap(), mapView.getPanelMapElementId(), htmlLinkId,
|
|
filename, mimeType);
|
|
// mapExport(mapView.getLightOLSM().getMap(), mapView.getPanelMapElementId());
|
|
}
|
|
});
|
|
|
|
exportMapButton.add(navLink);
|
|
|
|
}
|
|
//mapViewPanel.add(exportMapButton);
|
|
}
|
|
|
|
customTable.addNextKeyValue("Abstract", layerDV.getAbstractSection());
|
|
customTable.addNextKeyValue("Valutazione qualità", layerDV.getValutazioneQualita());
|
|
customTable.addNextKeyValue("Metodo raccolta dati", layerDV.getMetodoRaccoltaDati());
|
|
customTable.addNextKeyValue("Scala acquisizione dati", layerDV.getScalaAcquisizione());
|
|
customTable.addNextKeyValues("Autori", layerDV.getAuthors(), GeoportalDataViewerConstants.NEW_LINE_BR);
|
|
layerConcessionePanel.add(customTable);
|
|
}
|
|
|
|
public static native void exportPDF(String layerURL) /*-{
|
|
var image = new Image(layerURL);
|
|
|
|
var doc = new $wnd.jspdf.jsPDF();
|
|
doc.addImage(layerURL, 'PNG', 0, 0, image.width, image.height);
|
|
doc.save("map.pdf")
|
|
}-*/;
|
|
|
|
/**
|
|
* Prints the.
|
|
*
|
|
* @param msg the msg
|
|
*/
|
|
public static native void downloadMap(ol.Map map, String mapPanelId, String linkId, String filename,
|
|
String mimeType)/*-{
|
|
console.log("map: " + map);
|
|
|
|
map.once('rendercomplete', function() {
|
|
var mapCanvas = $doc.createElement('canvas');
|
|
var size = map.getSize();
|
|
mapCanvas.width = size[0];
|
|
mapCanvas.height = size[1];
|
|
var mapContext = mapCanvas.getContext('2d');
|
|
var mapContainer = $doc.querySelector('#' + mapPanelId);
|
|
//console.log("mapContainer:" +JSON.stringify(mapContainer, null, 4));
|
|
Array.prototype.forEach.call(mapContainer
|
|
.querySelectorAll('.ol-layer canvas'), function(canvas) {
|
|
if (canvas.width > 0) {
|
|
var opacity = canvas.parentNode.style.opacity;
|
|
mapContext.globalAlpha = opacity === '' ? 1
|
|
: Number(opacity);
|
|
var transform = canvas.style.transform;
|
|
// Get the transform parameters from the style's transform matrix
|
|
var matrix = transform.match(/^matrix\(([^\(]*)\)$/)[1]
|
|
.split(',').map(Number);
|
|
// Apply the transform to the export map context
|
|
CanvasRenderingContext2D.prototype.setTransform.apply(
|
|
mapContext, matrix);
|
|
mapContext.drawImage(canvas, 0, 0);
|
|
}
|
|
});
|
|
if (navigator.msSaveBlob) {
|
|
// link download attribute does not work on MS browsers
|
|
navigator.msSaveBlob(mapCanvas.msToBlob(), filename);
|
|
} else {
|
|
var link = $doc.getElementById(linkId);
|
|
link.href = mapCanvas.toDataURL(mimeType);
|
|
link.click();
|
|
}
|
|
});
|
|
map.renderSync();
|
|
}-*/;
|
|
|
|
// public static native void mapExport(ol.Map map, String mapPanelId)/*-{
|
|
// try {
|
|
// var dims = {
|
|
// a0 : [ 1189, 841 ],
|
|
// a1 : [ 841, 594 ],
|
|
// a2 : [ 594, 420 ],
|
|
// a3 : [ 420, 297 ],
|
|
// a4 : [ 297, 210 ],
|
|
// a5 : [ 210, 148 ],
|
|
// };
|
|
//
|
|
// var resolutions = {
|
|
// 72 : 72,
|
|
// 150 : 150,
|
|
// 300 : 300,
|
|
// };
|
|
//
|
|
// //var format = document.getElementById('format').value;
|
|
// var format = 'a4';
|
|
// //var resolution = document.getElementById('resolution').value;
|
|
// var resolution = resolutions[150];
|
|
// var dim = dims[format];
|
|
// var width = Math.round((dim[0] * resolution) / 25.4);
|
|
// var height = Math.round((dim[1] * resolution) / 25.4);
|
|
// var size = map.getSize();
|
|
// var viewResolution = map.getView().getResolution();
|
|
//
|
|
// map.once('rendercomplete', function() {
|
|
// var mapCanvas = $doc.createElement('canvas');
|
|
// mapCanvas.width = width;
|
|
// mapCanvas.height = height;
|
|
// var mapContext = mapCanvas.getContext('2d');
|
|
// var selectId = "#" + mapPanelId;
|
|
// console.log('selectId: ' + selectId);
|
|
// var container = $doc.querySelector(selectId);
|
|
// console.log('container: ' + container);
|
|
// Array.prototype.forEach.call(container
|
|
// .querySelectorAll('.ol-layer canvas'),
|
|
// function(canvas) {
|
|
// canvas.crossOrigin = "anonymous"; // This enables CORS
|
|
// if (canvas.width > 0) {
|
|
// var opacity = canvas.parentNode.style.opacity;
|
|
// mapContext.globalAlpha = opacity === '' ? 1
|
|
// : Number(opacity);
|
|
// var transform = canvas.style.transform;
|
|
// // Get the transform parameters from the style's transform matrix
|
|
// var matrix = transform
|
|
// .match(/^matrix\(([^\(]*)\)$/)[1]
|
|
// .split(',').map(Number);
|
|
// // Apply the transform to the export map context
|
|
// CanvasRenderingContext2D.prototype.setTransform
|
|
// .apply(mapContext, matrix);
|
|
// mapContext.drawImage(canvas, 0, 0);
|
|
// }
|
|
// });
|
|
//
|
|
// //window.open(mapCanvas.toDataURL(), '_blank');
|
|
//
|
|
// var pdf = new $wnd.jspdf.jsPDF('landscape', undefined, format);
|
|
// pdf.addImage(mapCanvas.toDataURL('image/jpeg'), 'JPEG', 0, 0,
|
|
// dim[0], dim[1]);
|
|
// pdf.save('map.pdf');
|
|
// // Reset original map size
|
|
// map.setSize(size);
|
|
// map.getView().setResolution(viewResolution);
|
|
// exportButton.disabled = false;
|
|
// document.body.style.cursor = 'auto';
|
|
// });
|
|
// //map.renderSync();
|
|
// // Set print size
|
|
// var printSize = [width, height];
|
|
// map.setSize(printSize);
|
|
// var scaling = Math.min(width / size[0], height / size[1]);
|
|
// map.getView().setResolution(viewResolution / scaling);
|
|
// } catch (error) {
|
|
// window.alert(error);
|
|
// }
|
|
// }-*/;
|
|
|
|
}
|