X-Git-Url: https://dev.renevier.net/gitweb.cgi?p=syp.git;a=blobdiff_plain;f=js%2Fsyp.js;h=8ebc30237507f2c6a6af0985cb59194db5af3895;hp=6c59dcdd3bbe55d5a7866530ae73eb0c879a3b33;hb=441da3baad4720c4ff62f2b6eda1cc6af08ab1b8;hpb=cb05788dc6a9bca81f5536143a7be3d1f6d36236
diff --git a/js/syp.js b/js/syp.js
index 6c59dcd..8ebc302 100644
--- a/js/syp.js
+++ b/js/syp.js
@@ -212,8 +212,9 @@ var SYP = {
}
var contentHTML;
if (feature.cluster[0].attributes.name) {
+ // escaping name is necessary because it's not enclosed in another html tag.
contentHTML = "
" +
- feature.cluster[0].attributes.name +
+ SYP.Utils.escapeHTML(feature.cluster[0].attributes.name) +
"
" +
feature.cluster[0].attributes.description;
} else {
@@ -241,11 +242,12 @@ var SYP = {
},
showBigImage: function (href) {
- try {
- document.getElementById('bigimg_container').style.display = "table";
- } catch(e) {
+ if (OpenLayers.Util.getBrowserName() == "msie") {
document.getElementById('bigimg_container').style.display = "block";
+ } else {
+ document.getElementById('bigimg_container').style.display = "table";
}
+
var maxHeight = document.body.clientHeight * 0.9;
var maxWidth = document.body.clientWidth * 0.9;
document.getElementById('bigimg').style.height = "";
@@ -383,6 +385,18 @@ var SYP = {
}
div.style.display = "block";
div.appendChild(textNode);
+ },
+
+ escapeHTML: function (str) {
+ if (!str) {
+ return "";
+ }
+ return str.
+ replace(/&/gm, '&').
+ replace(/'/gm, ''').
+ replace(/"/gm, '"').
+ replace(/>/gm, '>').
+ replace(/" +
+ this.contentDiv.innerHTML +
+ "";
+
+ var containerElement = (this.map) ? this.map.layerContainerDiv
+ : document.body;
+ var realSize = OpenLayers.Util.getRenderedDimensions(
+ preparedHTML, null, {
+ displayClass: this.displayClass,
+ containerElement: containerElement
+ }
+ );
+
+ /*
+ * XXX: next four lines are added by SYP!
+ */
+ if (this.contentDiv) {
+ realSize.w = Math.max (realSize.w, this.contentDiv.scrollWidth);
+ realSize.h = Math.max (realSize.h, this.contentDiv.scrollHeight);
+ }
+
+ // is the "real" size of the div is safe to display in our map?
+ var safeSize = this.getSafeContentSize(realSize);
+
+ var newSize = null;
+ if (safeSize.equals(realSize)) {
+ //real size of content is small enough to fit on the map,
+ // so we use real size.
+ newSize = realSize;
+
+ } else {
+
+ //make a new OL.Size object with the clipped dimensions
+ // set or null if not clipped.
+ var fixedSize = new OpenLayers.Size();
+ fixedSize.w = (safeSize.w < realSize.w) ? safeSize.w : null;
+ fixedSize.h = (safeSize.h < realSize.h) ? safeSize.h : null;
+
+ if (fixedSize.w && fixedSize.h) {
+ //content is too big in both directions, so we will use
+ // max popup size (safeSize), knowing well that it will
+ // overflow both ways.
+ newSize = safeSize;
+ } else {
+ //content is clipped in only one direction, so we need to
+ // run getRenderedDimensions() again with a fixed dimension
+ var clippedSize = OpenLayers.Util.getRenderedDimensions(
+ preparedHTML, fixedSize, {
+ displayClass: this.contentDisplayClass,
+ containerElement: containerElement
+ }
+ );
+
+ //if the clipped size is still the same as the safeSize,
+ // that means that our content must be fixed in the
+ // offending direction. If overflow is 'auto', this means
+ // we are going to have a scrollbar for sure, so we must
+ // adjust for that.
+ //
+ var currentOverflow = OpenLayers.Element.getStyle(
+ this.contentDiv, "overflow"
+ );
+ if ( (currentOverflow != "hidden") &&
+ (clippedSize.equals(safeSize)) ) {
+ var scrollBar = OpenLayers.Util.getScrollbarWidth();
+ if (fixedSize.w) {
+ clippedSize.h += scrollBar;
+ } else {
+ clippedSize.w += scrollBar;
+ }
+ }
+
+ newSize = this.getSafeContentSize(clippedSize);
+ }
+ }
+ this.setSize(newSize);
}