[Commits] r1714 - in sandbox/ahocevar/playground/ux/Printing: examples resources/css resources/images ux/plugins ux/widgets
commits at geoext.org
commits at geoext.org
Tue Jan 12 01:24:21 CET 2010
Author: ahocevar
Date: 2010-01-12 01:24:21 +0100 (Tue, 12 Jan 2010)
New Revision: 1714
Added:
sandbox/ahocevar/playground/ux/Printing/resources/images/north_arrow.png
Modified:
sandbox/ahocevar/playground/ux/Printing/examples/PrintMapPanel.html
sandbox/ahocevar/playground/ux/Printing/examples/PrintMapPanel.js
sandbox/ahocevar/playground/ux/Printing/resources/css/printpreview.css
sandbox/ahocevar/playground/ux/Printing/ux/plugins/PrintProviderField.js
sandbox/ahocevar/playground/ux/Printing/ux/widgets/PrintMapPanel.js
sandbox/ahocevar/playground/ux/Printing/ux/widgets/PrintPreview.js
Log:
now with map overlay for scale and north arrow
Modified: sandbox/ahocevar/playground/ux/Printing/examples/PrintMapPanel.html
===================================================================
--- sandbox/ahocevar/playground/ux/Printing/examples/PrintMapPanel.html 2010-01-11 14:23:55 UTC (rev 1713)
+++ sandbox/ahocevar/playground/ux/Printing/examples/PrintMapPanel.html 2010-01-12 00:24:21 UTC (rev 1714)
@@ -14,7 +14,7 @@
<script type="text/javascript" src="PrintMapPanel.js"></script>
- <script type="text/javascript" src="http://demo.opengeo.org/geoserver/pdf/info.json?var=printCapabilities"></script>
+ <script type="text/javascript" src="/geoserver/pdf/info.json?var=printCapabilities"></script>
</head>
<body>
Modified: sandbox/ahocevar/playground/ux/Printing/examples/PrintMapPanel.js
===================================================================
--- sandbox/ahocevar/playground/ux/Printing/examples/PrintMapPanel.js 2010-01-11 14:23:55 UTC (rev 1713)
+++ sandbox/ahocevar/playground/ux/Printing/examples/PrintMapPanel.js 2010-01-12 00:24:21 UTC (rev 1714)
@@ -15,7 +15,7 @@
center: [146.56, -41.56],
zoom: 6,
bbar: [{
- text: "Print",
+ text: "Print...",
handler: showPrintWindow
}]
});
@@ -46,12 +46,14 @@
printProvider: {
// using get for remote service access without same origin
// restriction. For async requests, we would set method to "POST".
- //method: "GET",
- method: "POST",
+ method: "GET",
+ //method: "POST",
// capabilities from script tag in Printing.html.
capabilities: printCapabilities
},
+ includeLegend: true,
+ mapTitle: "PrintMapPanel Demo",
bodyStyle: "padding:5px",
sourceMap: mapPanel,
legend: legendPanel
Modified: sandbox/ahocevar/playground/ux/Printing/resources/css/printpreview.css
===================================================================
--- sandbox/ahocevar/playground/ux/Printing/resources/css/printpreview.css 2010-01-11 14:23:55 UTC (rev 1713)
+++ sandbox/ahocevar/playground/ux/Printing/resources/css/printpreview.css 2010-01-12 00:24:21 UTC (rev 1714)
@@ -1,3 +1,29 @@
.x-btn .icon-print {
background-image: url(../images/silk/printer.png);
-}
\ No newline at end of file
+}
+
+.gx-map-overlay {
+ z-index: 1000;
+ position: absolute;
+ right: 10px;
+ bottom: 10px;
+ text-align: left;
+}
+
+.gx-map-overlay .x-panel-body {
+ background-color: #D0DEF0;
+}
+
+.gx-map-overlay .olControlScaleLine {
+ bottom: 0;
+ left: 0;
+ position: relative !important;
+}
+
+.gx-northarrow {
+ background: transparent url(../images/north_arrow.png) no-repeat;
+ *-background: none;
+ *-filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../resources/images/north_arrow.png',sizingMethod='crop');
+ height: 24px;
+ width: 24px;
+}
Added: sandbox/ahocevar/playground/ux/Printing/resources/images/north_arrow.png
===================================================================
(Binary files differ)
Property changes on: sandbox/ahocevar/playground/ux/Printing/resources/images/north_arrow.png
___________________________________________________________________
Name: svn:mime-type
+ application/octet-stream
Modified: sandbox/ahocevar/playground/ux/Printing/ux/plugins/PrintProviderField.js
===================================================================
--- sandbox/ahocevar/playground/ux/Printing/ux/plugins/PrintProviderField.js 2010-01-11 14:23:55 UTC (rev 1713)
+++ sandbox/ahocevar/playground/ux/Printing/ux/plugins/PrintProviderField.js 2010-01-12 00:24:21 UTC (rev 1714)
@@ -75,7 +75,7 @@
"dpichange": this.onProviderChange,
scope: this
});
- } else {
+ } else if(field.initialConfig.value === undefined) {
field.setValue(printProvider.customParams[field.name]);
}
},
Modified: sandbox/ahocevar/playground/ux/Printing/ux/widgets/PrintMapPanel.js
===================================================================
--- sandbox/ahocevar/playground/ux/Printing/ux/widgets/PrintMapPanel.js 2010-01-11 14:23:55 UTC (rev 1713)
+++ sandbox/ahocevar/playground/ux/Printing/ux/widgets/PrintMapPanel.js 2010-01-12 00:24:21 UTC (rev 1714)
@@ -93,7 +93,8 @@
var resolutions = [];
this.printProvider.scales.each(function(s){
- var res = OpenLayers.Util.getResolutionFromScale(s.get("value"));
+ var res = OpenLayers.Util.getResolutionFromScale(s.get("value"),
+ this.sourceMap.baseLayer.units);
var zoom = this.sourceMap.getZoomForResolution(res)
resolutions.push(this.sourceMap.baseLayer.resolutions[zoom]);
}, this)
@@ -117,11 +118,12 @@
this.fitMap();
this.printProvider.on("layoutchange", this.fitMap, this);
+ this.printPage.on("change", this.fitZoom, this);
this.map.events.register("moveend", this, this.updatePage);
},
/** private: method[fitMap]
- * fits this PrintMapPanel's size to the print extent.
+ * Fits this PrintMapPanel's size to the print extent.
*/
fitMap: function() {
this.updatePage();
@@ -134,6 +136,19 @@
);
},
+ /** private: method[fitZoom]
+ * Fits this PrintMapPanel's zoom to the print scale.
+ */
+ fitZoom: function() {
+ if(this.map) {
+ var zoom = this.map.getZoomForResolution(
+ OpenLayers.Util.getResolutionFromScale(
+ this.printPage.scale.get("value"),
+ this.map.baseLayer.units));
+ this.map && this.map.getZoom() != zoom && this.map.zoomTo(zoom);
+ }
+ },
+
/** private: method[updatePage]
* updates the print page to match this PrintMapPanel's center and scale.
*/
Modified: sandbox/ahocevar/playground/ux/Printing/ux/widgets/PrintPreview.js
===================================================================
--- sandbox/ahocevar/playground/ux/Printing/ux/widgets/PrintPreview.js 2010-01-11 14:23:55 UTC (rev 1713)
+++ sandbox/ahocevar/playground/ux/Printing/ux/widgets/PrintPreview.js 2010-01-12 00:24:21 UTC (rev 1714)
@@ -1,3 +1,16 @@
+/**
+ * Copyright (c) 2008-2009 The Open Source Geospatial Foundation
+ *
+ * Published under the BSD license.
+ * See http://svn.geoext.org/core/trunk/geoext/license.txt for the full text
+ * of the license.
+ */
+
+/**
+ * @include widgets/PrintMapPanel.js
+ * @include plugins/PrintProviderField.js
+ * @include plugins/PrintPageField.js
+ */
Ext.namespace("GeoExt.ux");
GeoExt.ux.PrintPreview = Ext.extend(Ext.Panel, {
@@ -21,10 +34,20 @@
printProvider: null,
+ mapTitleField: "mapTitle",
+
+ commentField: "comment",
+
sourceMap: null,
legend: null,
+ includeLegend: false,
+
+ mapTitle: null,
+
+ comment: null,
+
mapOptions: null,
/** api: config[busyMask]
@@ -59,60 +82,34 @@
});
this.printProvider = this.printMapPanel.printProvider;
- var titleField = new Ext.form.TextField({
- name: "mapTitle",
- emptyText: this.emptyTitleText,
- anchor: "100%",
- hideLabel: true,
- plugins: new GeoExt.ux.plugins.PrintProviderField({
- printProvider: this.printProvider
- })
- });
+ this.form = this.createForm();
+ this.tbar = this.createToolbar();
+
+ GeoExt.ux.PrintPreview.superclass.initComponent.call(this);
- var legendCheckbox = null;
- if(this.legend) {
- legendCheckbox = new Ext.form.Checkbox({
- name: "legend",
- boxLabel: this.includeLegendText,
- anchor: "100%",
- hideLabel: true
- });
- }
+ this.add(this.form);
+ this.add(this.printMapPanel);
+ this.printMapPanel.add(this.createMapOverlay());
- this.form = new Ext.form.FormPanel({
- autoHeight: true,
- border: false,
- defaults: {
- anchor: "100%"
+ this.on({
+ "render": function() {
+ if (!this.busyMask) {
+ this.busyMask = new Ext.LoadMask(this.getEl(), {
+ msg: this.creatingPdfText
+ });
+ }
+ this.printProvider.on({
+ "beforeprint": this.busyMask.show,
+ "print": this.busyMask.hide,
+ scope: this.busyMask
+ });
},
- items: [
- this.legend ? {
- xtype: "container",
- layout: "column",
- items: [{
- xtype: "container",
- layout: "form",
- columnWidth: 1,
- items: titleField
- }, {
- xtype: "container",
- layout: "form",
- style: "padding-left:8px",
- items: legendCheckbox
- }]
- } : titleField, {
- xtype: "textarea",
- name: "comment",
- emptyText: this.emptyCommentText,
- hideLabel: true,
- plugins: new GeoExt.ux.plugins.PrintProviderField({
- printProvider: this.printProvider
- })
- }
- ]
+ scope: this
});
-
- this.tbar = [this.paperSizeText, {
+ },
+
+ createToolbar: function() {
+ return [this.paperSizeText, {
xtype: "combo",
width: 98,
plugins: new GeoExt.ux.plugins.PrintProviderField({
@@ -147,44 +144,137 @@
text: this.printText,
iconCls: "icon-print",
handler: function(){
- this.printMapPanel.print(legendCheckbox.getValue() &&
+ this.printMapPanel.print(this.includeLegend &&
{legend: this.legend});
},
scope: this
}];
+ },
+
+ createForm: function() {
+ var titleCfg = {
+ xtype: "textfield",
+ name: this.mapTitleField,
+ value: this.mapTitle,
+ emptyText: this.emptyTitleText,
+ anchor: "100%",
+ hideLabel: true,
+ plugins: new GeoExt.ux.plugins.PrintProviderField({
+ printProvider: this.printProvider
+ })
+ };
+
+ if(this.legend) {
+ var legendCheckbox = new Ext.form.Checkbox({
+ name: "legend",
+ checked: this.includeLegend,
+ boxLabel: this.includeLegendText,
+ anchor: "100%",
+ hideLabel: true,
+ handler: function(cb, checked) {
+ this.includeLegend = checked;
+ },
+ scope: this
+ });
- GeoExt.ux.PrintPreview.superclass.initComponent.call(this);
-
- this.add(this.form);
- this.add(this.printMapPanel);
-
- var onCfg = {
- scope: this,
- "render": function() {
- if (!this.busyMask) {
- this.busyMask = new Ext.LoadMask(this.getEl(), {
- msg: this.creatingPdfText
- });
- }
- this.printProvider.on({
- "beforeprint": this.busyMask.show,
- "print": this.busyMask.hide,
- scope: this.busyMask
- });
- }
- };
- if(this.legend && Ext.isIE) {
- onCfg["afterlayout"] = function(){
- // fix for IE which has ColumnLayout problems when some
- // components don't have a size
+ // fix for IE which has ColumnLayout problems when some of the
+ // container's components don't have a size
+ Ext.isIE && this.on("afterlayout", function() {
var ct = legendCheckbox.ownerCt;
ct.setWidth(Ext.util.TextMetrics.measure(legendCheckbox.getEl(),
this.includeLegendText).width + 34);
- };
+ }, this)
}
- this.on(onCfg);
+
+ return new Ext.form.FormPanel({
+ autoHeight: true,
+ border: false,
+ defaults: {
+ anchor: "100%"
+ },
+ items: [
+ this.legend ? {
+ xtype: "container",
+ layout: "column",
+ items: [{
+ xtype: "container",
+ layout: "form",
+ columnWidth: 1,
+ items: titleCfg
+ }, {
+ xtype: "container",
+ layout: "form",
+ style: "padding-left:8px",
+ items: legendCheckbox
+ }]
+ } : titleCfg, {
+ xtype: "textarea",
+ name: this.commentField,
+ value: this.comment,
+ emptyText: this.emptyCommentText,
+ hideLabel: true,
+ plugins: new GeoExt.ux.plugins.PrintProviderField({
+ printProvider: this.printProvider
+ })
+ }
+ ]
+ });
},
+ createMapOverlay: function() {
+ var scaleLine = new OpenLayers.Control.ScaleLine();
+ this.printMapPanel.map.addControl(scaleLine);
+ scaleLine.activate();
+ return new Ext.Panel({
+ layout: "column",
+ width: 232,
+ cls: "gx-map-overlay",
+ bodyStyle: "padding:5px",
+ items: [{
+ xtype: "box",
+ el: scaleLine.div,
+ width: 100
+ }, {
+ xtype: "container",
+ layout: "form",
+ columnWidth: 1,
+ style: "padding: .2em 5px 0 0",
+ cls: "x-small-editor",
+ items: {
+ xtype: "combo",
+ anchor: "100%",
+ hideLabel: true,
+ store: this.printProvider.scales,
+ displayField: "name",
+ typeAhead: true,
+ mode: "local",
+ forceSelection: true,
+ triggerAction: "all",
+ selectOnFocus: true,
+ plugins: new GeoExt.ux.plugins.PrintPageField({
+ page: this.printMapPanel.printPage
+ })
+ }
+ }, {
+ xtype: "box",
+ autoEl: {
+ tag: "div",
+ cls: "gx-northarrow"
+ }
+ }],
+ listeners: {
+ "render": function() {
+ function stop(evt){evt.stopPropagation();}
+ this.getEl().on({
+ "click": stop,
+ "dblclick": stop,
+ "mousedown": stop
+ });
+ }
+ }
+ });
+ },
+
updateSize: function() {
this.suspendEvents();
var mapWidth = this.printMapPanel.getWidth();
More information about the Commits
mailing list