[Libreoffice-commits] online.git: 5 commits - loleaflet/README loleaflet/reference.html loleaflet/src
Mihai Varga
mihai.varga at collabora.com
Thu Oct 15 09:34:16 PDT 2015
loleaflet/README | 37
loleaflet/reference.html | 7955 +++++++++++++-------------
loleaflet/src/control/Control.PartsPreview.js | 4
loleaflet/src/control/Parts.js | 76
loleaflet/src/layer/tile/CalcTileLayer.js | 5
loleaflet/src/layer/tile/ImpressTileLayer.js | 27
loleaflet/src/layer/tile/TileLayer.js | 72
loleaflet/src/layer/tile/WriterTileLayer.js | 42
8 files changed, 4132 insertions(+), 4086 deletions(-)
New commits:
commit 1588dd5f5d40c209d223fd7911af5c033991249a
Author: Mihai Varga <mihai.varga at collabora.com>
Date: Thu Oct 15 19:17:18 2015 +0300
loleaflet: map.getPageSizes - returns the size of each page
In twips and pixels
diff --git a/loleaflet/README b/loleaflet/README
index f961c79..24123a7 100644
--- a/loleaflet/README
+++ b/loleaflet/README
@@ -203,6 +203,8 @@ Writer pages:
+ options = {autoUpdate: true} - automatically updates the previews
map.removePreviewUpdate(id)
+ id = the preview's id
+ map.getPageSizes()
+ + returns {twips: [Bounds], pixels: [Bounds]}
- events
map.on('pagenumberchanged', function (e) {}) where:
diff --git a/loleaflet/reference.html b/loleaflet/reference.html
index 59a5605..2d79223 100644
--- a/loleaflet/reference.html
+++ b/loleaflet/reference.html
@@ -1422,6 +1422,12 @@ var map = L.map('map', {
<td>Returns the document type.</td>
</tr>
<tr>
+ <td><code><b>getPageSizes</b>()</code></td>
+ <td><code><nobr>{twips: <a href="#bounds">[Bounds]</a>,<br>
+ pixels: <a href="#bounds">[Bounds]</a>}</nobr></code></td>
+ <td>Returns an object describing the size of each page in twips and pixels.</td>
+ </tr>
+ <tr>
<td><code><b>scroll</b>(
<nobr><Number><i>x</i>,</nobr>
<nobr><Number><i>y</i>,</nobr>
diff --git a/loleaflet/src/control/Parts.js b/loleaflet/src/control/Parts.js
index f101995..88585bf 100644
--- a/loleaflet/src/control/Parts.js
+++ b/loleaflet/src/control/Parts.js
@@ -164,11 +164,10 @@ L.Map.include({
return this._docLayer._docPixelSize;
},
- getPageSize: function (page) {
- if (this._docLayer._partPageRectanglesPixels && this._docLayer._partPageRectanglesPixels.length > page) {
- return this._docLayer._partPageRectanglesPixels[page];
- }
- return null;
+ getPageSizes: function () {
+ return {
+ twips: this._docLayer._partPageRectanglesTwips,
+ pixels: this._docLayer._partPageRectanglesPixels};
},
getDocType: function () {
commit 3ba0bd6aebde2c62f79ac4c3b2a315b004c2f21f
Author: Mihai Varga <mihai.varga at collabora.com>
Date: Thu Oct 15 18:56:19 2015 +0300
loleaflet: mention reference.html in README
diff --git a/loleaflet/README b/loleaflet/README
index 6909915..f961c79 100644
--- a/loleaflet/README
+++ b/loleaflet/README
@@ -55,6 +55,10 @@ check the loolwsd console for the debugging output.
API & events
------------
+######################################################################
+# See /loleaflet/reference.html for a better formated documentation. #
+######################################################################
+
Search:
- API:
map.search(text, [backward])
commit 4d8169fa3b91aa2b09a181e22058a251734e3f0b
Author: Mihai Varga <mihai.varga at collabora.com>
Date: Thu Oct 15 18:54:59 2015 +0300
loleaflet: mention that some parameters are in twips
diff --git a/loleaflet/reference.html b/loleaflet/reference.html
index 67fd51f..59a5605 100644
--- a/loleaflet/reference.html
+++ b/loleaflet/reference.html
@@ -1486,10 +1486,10 @@ var map = L.map('map', {
<Number><i>part</i>,<br>
<Number><i>width</i>,<br>
<Number><i>height</i>,<br>
- <Number><i>tilePosX</i>,<br>
- <Number><i>tilePosY</i>,<br>
- <Number><i>tileWidth</i>,<br>
- <Number><i>tileHeight</i>,<br>
+ <Twips><i>tilePosX</i>,<br>
+ <Twips><i>tilePosY</i>,<br>
+ <Twips><i>tileWidth</i>,<br>
+ <Twips><i>tileHeight</i>,<br>
<nobr><<a href="#getpreview-options">PreviewOptions</a>><i>options?</i>)</nobr>
</code></td>
<td><code>undefined</code></td>
commit 113a312023f89bde70747cd32f9c10c94f2f43ad
Author: Mihai Varga <mihai.varga at collabora.com>
Date: Thu Oct 15 18:46:59 2015 +0300
loleaflet: we now have getPreview and getCustomPreview methods
getPreview can be used to request a preview of a page or a part while
getCustomPreview can be used to get a preview of a user defined section
of the document
diff --git a/loleaflet/README b/loleaflet/README
index 2011c33..6909915 100644
--- a/loleaflet/README
+++ b/loleaflet/README
@@ -93,13 +93,20 @@ Buttons like Bold, Italic, Strike through etc.
Parts (like slides in presentation, or sheets in spreadsheets):
- API:
map.setPart('next' | 'prev' | partNumber)
- map.getPartPreview(id, part, maxWidth, maxHeight, [options]) where:
- + id = the ID of the request so that the response can be identified
- + maxWidth / maxHeight are the desired dimensions of the preview, a smaller
- image might be returned in order to keep the original ratio of the document
- + options = {autoUpdate: true} - automatically updates the previews
map.getNumberOfParts()
map.getCurrentPartNumber()
+ map.getPreview(id, index, maxWidth, maxHeight, [options])
+ + id = the ID of the request so that the response can be identified
+ + index = the part / page 's number
+ + maxWidth / maxHeight = max dimensions so that the ratio is preserved
+ + options = {autoUpdate: true} - automatically updates the previews
+ map.getCustomPreview(id, part, width, height, tilePosX, tilePosY, tileWidth, tileHeight, [options])
+ + id = the ID of the request so that the response can be identified
+ + part = the part containing the desired preview
+ + width / height = the preview's size in pixels
+ + tilePosX / tilePosY = the rectangles's starting position in twips
+ + tileWidth / tileHeight = the rectangle's dimension in twips
+ + options = {autoUpdate: true} - automatically updates the previews
map.removePreviewUpdate(id)
+ id = the preview's id
@@ -178,11 +185,17 @@ Writer pages:
map.goToPage(page)
map.getNumberOfPages()
map.getCurrentPageNumber()
- map.getDocPreview(id, maxWidth, maxHeight, x, y, width, height, [options])
+ map.getPreview(id, index, maxWidth, maxHeight, [options])
+ + id = the ID of the request so that the response can be identified
+ + index = the part / page 's number
+ + maxWidth / maxHeight = max dimensions so that the ratio is preserved
+ + options = {autoUpdate: true} - automatically updates the previews
+ map.getCustomPreview(id, part, width, height, tilePosX, tilePosY, tileWidth, tileHeight, [options])
+ id = the ID of the request so that the response can be identified
- + maxWidth / maxHeight are the desired dimensions of the preview, a smaller
- image might be returned in order to keep the original ratio of the document
- + x/y = starting position, where to get the preview from
+ + part = the part containing the desired preview
+ + width / height = the preview's size in pixels
+ + tilePosX / tilePosY = the rectangles's starting position in twips
+ + tileWidth / tileHeight = the rectangle's dimension in twips
+ options = {autoUpdate: true} - automatically updates the previews
map.removePreviewUpdate(id)
+ id = the preview's id
diff --git a/loleaflet/src/control/Control.PartsPreview.js b/loleaflet/src/control/Control.PartsPreview.js
index 4112d01..5439b49 100644
--- a/loleaflet/src/control/Control.PartsPreview.js
+++ b/loleaflet/src/control/Control.PartsPreview.js
@@ -46,7 +46,7 @@ L.Control.PartsPreview = L.Control.extend({
.on(img, 'click', L.DomEvent.stop)
.on(img, 'click', this._setPart, this)
.on(img, 'click', this._refocusOnMap, this);
- this._map.getPartPreview(i, i, 180, 180, {autoUpdate: this.options.autoUpdate});
+ this._map.getPreview(i, i, 180, 180, {autoUpdate: this.options.autoUpdate});
}
this._previewInitialized = true;
}
@@ -61,7 +61,7 @@ L.Control.PartsPreview = L.Control.extend({
_updatePart: function (e) {
if (e.docType === 'presentation') {
- this._map.getPartPreview(e.part, e.part, 180, 180, {autoUpdate: this.options.autoUpdate});
+ this._map.getPreview(e.part, e.part, 180, 180, {autoUpdate: this.options.autoUpdate});
}
},
diff --git a/loleaflet/src/control/Parts.js b/loleaflet/src/control/Parts.js
index d710d47..f101995 100644
--- a/loleaflet/src/control/Parts.js
+++ b/loleaflet/src/control/Parts.js
@@ -40,64 +40,66 @@ L.Map.include({
}
},
- getPartPreview: function (id, part, maxWidth, maxHeight, options) {
+ getPreview: function (id, index, maxWidth, maxHeight, options) {
if (!this._docPreviews) {
this._docPreviews = {};
}
var autoUpdate = options ? options.autoUpdate : false;
- this._docPreviews[id] = {id: id, part: part, maxWidth: maxWidth, maxHeight: maxHeight, autoUpdate: autoUpdate};
+ this._docPreviews[id] = {id: id, index: index, maxWidth: maxWidth, maxHeight: maxHeight, autoUpdate: autoUpdate};
var docLayer = this._docLayer;
- var docRatio = docLayer._docWidthTwips / docLayer._docHeightTwips;
+ if (docLayer._docType === 'text') {
+ if (index >= docLayer._partPageRectanglesTwips.length) {
+ return;
+ }
+ var part = 0;
+ var tilePosX = docLayer._partPageRectanglesTwips[index].min.x;
+ var tilePosY = docLayer._partPageRectanglesTwips[index].min.y;
+ var tileWidth = docLayer._partPageRectanglesTwips[index].max.x - tilePosX;
+ var tileHeight = docLayer._partPageRectanglesTwips[index].max.y - tilePosY;
+ }
+ else {
+ part = index;
+ tilePosX = 0;
+ tilePosY = 0;
+ tileWidth = docLayer._docWidthTwips;
+ tileHeight = docLayer._docHeightTwips;
+ }
+ var docRatio = tileWidth / tileHeight;
var imgRatio = maxWidth / maxHeight;
// fit into the given rectangle while maintaining the ratio
if (imgRatio > docRatio) {
- maxWidth = Math.round(docLayer._docWidthTwips * maxHeight / docLayer._docHeightTwips);
+ maxWidth = Math.round(tileWidth * maxHeight / tileHeight);
}
else {
- maxHeight = Math.round(docLayer._docHeightTwips * maxWidth / docLayer._docWidthTwips);
+ maxHeight = Math.round(tileHeight * maxWidth / tileWidth);
}
L.Socket.sendMessage('tile ' +
'part=' + part + ' ' +
'width=' + maxWidth + ' ' +
'height=' + maxHeight + ' ' +
- 'tileposx=0 tileposy=0 ' +
- 'tilewidth=' + docLayer._docWidthTwips + ' ' +
- 'tileheight=' + docLayer._docHeightTwips + ' ' +
+ 'tileposx=' + tilePosX + ' ' +
+ 'tileposy=' + tilePosY + ' ' +
+ 'tilewidth=' + tileWidth + ' ' +
+ 'tileheight=' + tileHeight + ' ' +
'id=' + id);
},
- getDocPreview: function (id, maxWidth, maxHeight, x, y, width, height, options) {
+ getCustomPreview: function (id, part, width, height, tilePosX, tilePosY, tileWidth, tileHeight, options) {
if (!this._docPreviews) {
this._docPreviews = {};
}
var autoUpdate = options ? options.autoUpdate : false;
- this._docPreviews[id] = {id: id, maxWidth: maxWidth, maxHeight: maxHeight, x: x, y: y,
- width: width, height: height, autoUpdate: autoUpdate};
-
- var docLayer = this._docLayer;
- var docRatio = width / height;
- var imgRatio = maxWidth / maxHeight;
- // fit into the given rectangle while maintaining the ratio
- if (imgRatio > docRatio) {
- maxWidth = Math.round(width * maxHeight / height);
- }
- else {
- maxHeight = Math.round(height * maxWidth / width);
- }
- x = Math.round(x / docLayer._tileSize * docLayer._tileWidthTwips);
- width = Math.round(width / docLayer._tileSize * docLayer._tileWidthTwips);
- y = Math.round(y / docLayer._tileSize * docLayer._tileHeightTwips);
- height = Math.round(height / docLayer._tileSize * docLayer._tileHeightTwips);
-
+ this._docPreviews[id] = {id: id, part: part, width: width, height: height, tilePosX: tilePosX,
+ tilePosY: tilePosY, tileWidth: tileWidth, tileHeight: tileHeight, autoUpdate: autoUpdate};
L.Socket.sendMessage('tile ' +
- 'part=0 ' +
- 'width=' + maxWidth + ' ' +
- 'height=' + maxHeight + ' ' +
- 'tileposx=' + x + ' ' +
- 'tileposy=' + y + ' ' +
- 'tilewidth=' + width + ' ' +
- 'tileheight=' + height + ' ' +
+ 'part=' + part + ' ' +
+ 'width=' + width + ' ' +
+ 'height=' + height + ' ' +
+ 'tileposx=' + tilePosX + ' ' +
+ 'tileposy=' + tilePosY + ' ' +
+ 'tilewidth=' + tileWidth + ' ' +
+ 'tileheight=' + tileHeight + ' ' +
'id=' + id);
},
@@ -162,6 +164,13 @@ L.Map.include({
return this._docLayer._docPixelSize;
},
+ getPageSize: function (page) {
+ if (this._docLayer._partPageRectanglesPixels && this._docLayer._partPageRectanglesPixels.length > page) {
+ return this._docLayer._partPageRectanglesPixels[page];
+ }
+ return null;
+ },
+
getDocType: function () {
return this._docLayer._docType;
}
diff --git a/loleaflet/src/layer/tile/CalcTileLayer.js b/loleaflet/src/layer/tile/CalcTileLayer.js
index df1fe80..4e2963e 100644
--- a/loleaflet/src/layer/tile/CalcTileLayer.js
+++ b/loleaflet/src/layer/tile/CalcTileLayer.js
@@ -84,6 +84,11 @@ L.CalcTileLayer = L.TileLayer.extend({
delete this._tileCache[key];
}
}
+
+ this._previewInvalidations.push(invalidBounds);
+ // 1s after the last invalidation, update the preview
+ clearTimeout(this._previewInvalidator);
+ this._previewInvalidator = setTimeout(L.bind(this._invalidatePreviews, this), this.options.previewInvalidationTimeout);
},
_onSetPartMsg: function (textMsg) {
diff --git a/loleaflet/src/layer/tile/ImpressTileLayer.js b/loleaflet/src/layer/tile/ImpressTileLayer.js
index dfb00f3..0868c43 100644
--- a/loleaflet/src/layer/tile/ImpressTileLayer.js
+++ b/loleaflet/src/layer/tile/ImpressTileLayer.js
@@ -87,9 +87,10 @@ L.ImpressTileLayer = L.TileLayer.extend({
this._map.fire('updatepart', {part: command.part, docType: this._docType});
}
+ this._previewInvalidations.push(invalidBounds);
// 1s after the last invalidation, update the preview
clearTimeout(this._previewInvalidator);
- this._previewInvalidator = setTimeout(L.bind(this._invalidatePreview, this), 1000);
+ this._previewInvalidator = setTimeout(L.bind(this._invalidatePreviews, this), this.options.previewInvalidationTimeout);
},
_onSetPartMsg: function (textMsg) {
@@ -128,29 +129,5 @@ L.ImpressTileLayer = L.TileLayer.extend({
this._preFetchBorder = null;
}
}
- },
-
- _invalidatePreview: function () {
- if (this._map._docPreviews) {
- // invalidate part previews
- for (var key in this._map._docPreviews) {
- var preview = this._map._docPreviews[key];
- if (preview.part === this._selectedPart ||
- (preview.part === this._prevSelectedPart && this._prevSelectedPartNeedsUpdate)) {
- // if the current part needs its preview updated OR
- // the part has been changed and we need to update the previous part preview
- if (preview.part === this._prevSelectedPart) {
- this._prevSelectedPartNeedsUpdate = false;
- }
- if (preview.autoUpdate) {
- this._map.getPartPreview(preview.id, preview.part, preview.maxWidth, preview.maxHeight,
- {autoUpdate: true});
- }
- else {
- this._map.fire('invalidatepreview', {id: preview.id});
- }
- }
- }
- }
}
});
diff --git a/loleaflet/src/layer/tile/TileLayer.js b/loleaflet/src/layer/tile/TileLayer.js
index 95de103..6d2b73e 100644
--- a/loleaflet/src/layer/tile/TileLayer.js
+++ b/loleaflet/src/layer/tile/TileLayer.js
@@ -25,7 +25,8 @@ L.TileLayer = L.GridLayer.extend({
zoomReverse: false,
detectRetina: false,
crossOrigin: false,
- preFetchOtherParts: false
+ preFetchOtherParts: false,
+ previewInvalidationTimeout: 1000
},
initialize: function (url, options) {
@@ -85,6 +86,7 @@ L.TileLayer = L.GridLayer.extend({
this._emptyTilesCount = 0;
this._msgQueue = [];
this._toolbarCommandValues = {};
+ this._previewInvalidations = [];
},
onAdd: function (map) {
@@ -806,6 +808,74 @@ L.TileLayer = L.GridLayer.extend({
twipsRectangles: this._partPageRectanglesTwips
});
}
+ },
+
+ _invalidatePreviews: function () {
+ if (this._map._docPreviews && this._previewInvalidations.length > 0) {
+ var toInvalidate = {};
+ for (var i = 0; i < this._previewInvalidations.length; i++) {
+ var invalidBounds = this._previewInvalidations[i];
+ for (var key in this._map._docPreviews) {
+ // find preview tiles that need to be updated and add them in a set
+ var preview = this._map._docPreviews[key];
+ if (preview.index >= 0 && this._docType === 'text') {
+ // we have a preview for a page
+ if (this._partPageRectanglesTwips.length > preview.index &&
+ invalidBounds.intersects(this._partPageRectanglesTwips[preview.index])) {
+ toInvalidate[key] = true;
+ }
+ }
+ else if (preview.index >= 0) {
+ // we have a preview for a part
+ if (preview.index === this._selectedPart ||
+ (preview.index === this._prevSelectedPart && this._prevSelectedPartNeedsUpdate)) {
+ // if the current part needs its preview updated OR
+ // the part has been changed and we need to update the previous part preview
+ if (preview.index === this._prevSelectedPart) {
+ this._prevSelectedPartNeedsUpdate = false;
+ }
+ toInvalidate[key] = true;
+ }
+ }
+ else {
+ // we have a custom preview
+ var bounds = new L.Bounds(
+ new L.Point(preview.tilePosX, preview.tilePosY),
+ new L.Point(preview.tilePosX + preview.tileWidth, preview.tilePosY + preview.tileHeight));
+ if ((preview.part === this._selectedPart ||
+ (preview.part === this._prevSelectedPart && this._prevSelectedPartNeedsUpdate)) &&
+ invalidBounds.intersects(bounds)) {
+ // if the current part needs its preview updated OR
+ // the part has been changed and we need to update the previous part preview
+ if (preview.index === this._prevSelectedPart) {
+ this._prevSelectedPartNeedsUpdate = false;
+ }
+ toInvalidate[key] = true;
+ }
+
+ }
+ }
+
+ }
+
+ for (key in toInvalidate) {
+ // update invalid preview tiles
+ preview = this._map._docPreviews[key];
+ if (preview.autoUpdate) {
+ if (preview.index >= 0) {
+ this._map.getPreview(preview.id, preview.index, preview.maxWidth, preview.maxHeight, {autoUpdate: true});
+ }
+ else {
+ this._map.getCustomPreview(preview.id, preview.part, preview.width, preview.height, preview.tilePosX,
+ preview.tilePosY, preview.tileWidth, preview.tileHeight, {autoUpdate: true});
+ }
+ }
+ else {
+ this._map.fire('invalidatepreview', {id: preview.id});
+ }
+ }
+ }
+ this._previewInvalidations = [];
}
});
diff --git a/loleaflet/src/layer/tile/WriterTileLayer.js b/loleaflet/src/layer/tile/WriterTileLayer.js
index 5686727..dd04890 100644
--- a/loleaflet/src/layer/tile/WriterTileLayer.js
+++ b/loleaflet/src/layer/tile/WriterTileLayer.js
@@ -79,13 +79,11 @@ L.WriterTileLayer = L.TileLayer.extend({
delete this._tileCache[key];
}
}
- if (!this._previewInvalidations) {
- this._previewInvalidations = [];
- }
+
this._previewInvalidations.push(invalidBounds);
// 1s after the last invalidation, update the preview
clearTimeout(this._previewInvalidator);
- this._previewInvalidator = setTimeout(L.bind(this._invalidatePreview, this), 1000);
+ this._previewInvalidator = setTimeout(L.bind(this._invalidatePreviews, this), this.options.previewInvalidationTimeout);
},
_onSetPartMsg: function (textMsg) {
@@ -118,41 +116,5 @@ L.WriterTileLayer = L.TileLayer.extend({
this._resetPreFetching(true);
this._update();
}
- },
-
- _invalidatePreview: function () {
- // invalidate writer page previews
- if (this._map._docPreviews && this._previewInvalidations) {
- var toInvalidate = {};
- for (var i = 0; i < this._previewInvalidations.length; i++) {
- var invalidBounds = this._previewInvalidations[i];
- var invalidPixBounds = new L.Bounds(
- invalidBounds.min.divideBy(this.options.tileWidthTwips).multiplyBy(this._tileSize),
- invalidBounds.max.divideBy(this.options.tileWidthTwips).multiplyBy(this._tileSize));
-
- for (var key in this._map._docPreviews) {
- // find preview tiles that need to be updated and add them in a set
- var preview = this._map._docPreviews[key];
- var bounds = new L.Bounds(new L.Point(preview.x, preview.y),
- new L.Point(preview.x + preview.width, preview.y + preview.height));
- if (invalidPixBounds.intersects(bounds)) {
- toInvalidate[key] = true;
- }
- }
-
- for (key in toInvalidate) {
- // update invalid preview tiles
- preview = this._map._docPreviews[key];
- if (preview.autoUpdate) {
- this._map.getDocPreview(preview.id, preview.maxWidth, preview.maxHeight,
- preview.x, preview.y, preview.width, preview.height, {autoUpdate: true});
- }
- else {
- this._map.fire('invalidatepreview', {id: preview.id});
- }
- }
- }
- }
- this._previewInvalidations = [];
}
});
commit 21028a7500f5d92e9745cf30ffca9ff36f181155
Author: Mihai Varga <mihai.varga at collabora.com>
Date: Thu Oct 15 18:46:03 2015 +0300
loleaflet: updated and reorganized the html documentation
diff --git a/loleaflet/reference.html b/loleaflet/reference.html
index 9a7b3e8..67fd51f 100644
--- a/loleaflet/reference.html
+++ b/loleaflet/reference.html
@@ -55,12 +55,14 @@
</ul>
</div>
<div class="toc-col">
- <h4>LoLeaflet API</h4>
+ <h4 style="color:red;">LoLeaflet API</h4>
<ul>
<li><a href="#loleaflet-general">General</a></li>
<li><a href="#loleaflet-toolbar">Toolbar</a></li>
<li><a href="#loleaflet-page">Page oriented</a></li>
<li><a href="#loleaflet-part">Part oriented</a></li>
+ <li><a href="#loleaflet-events">Events</a></li>
+ <li><a href="#loleaflet-object-values">Object values</a></li>
</ul>
<h4>UI Layers</h4>
<ul>
@@ -147,7 +149,6 @@
<h4>Misc</h4>
<ul>
<li><a href="#event-objects">Event objects</a></li>
- <li><a href="#object-values">Object values</a></li>
<li><a href="#global">global switches</a></li>
<li><a href="#noconflict">noConflict</a></li>
<li><a href="#version">version</a></li>
@@ -1466,6 +1467,44 @@ var map = L.map('map', {
<td><code><nobr><a href="#point">Point</a></nobr></code></td>
<td>Returns the scroll offset relative to the beginning of the document.</td>
</tr>
+ <tr>
+ <td><code><b>getPreview</b>(
+ <Object><i>id</i>,<br>
+ <Number><i>index</i>,<br>
+ <Number><i>maxWidth</i>,<br>
+ <Number><i>maxHeight</i>,<br>
+ <nobr><<a href="#getpreview-options">PreviewOptions</a>><i>options?</i>)</nobr>
+ </code></td>
+ <td><code>undefined</code></td>
+ <td>Triggers the creation of a preview with the given id, of maximum maxWidth X maxHeight size, of the
+ page / part with number 'index', keeping the original ration. By passing an
+ optional parameter {autoUpdate: true}, the preview will be automatically invalidated.</td>
+ </tr>
+ <tr>
+ <td><code><b>getCustomPreview</b>(
+ <Object><i>id</i>,<br>
+ <Number><i>part</i>,<br>
+ <Number><i>width</i>,<br>
+ <Number><i>height</i>,<br>
+ <Number><i>tilePosX</i>,<br>
+ <Number><i>tilePosY</i>,<br>
+ <Number><i>tileWidth</i>,<br>
+ <Number><i>tileHeight</i>,<br>
+ <nobr><<a href="#getpreview-options">PreviewOptions</a>><i>options?</i>)</nobr>
+ </code></td>
+ <td><code>undefined</code></td>
+ <td>Triggers the creation of a preview with the given id, of width X height size, of the
+ [(tilePosX,tilePosY), (tilePosX + tileWidth, tilePosY + tileHeight)] section of the document. By passing an
+ optional parameter {autoUpdate: true}, the preview will be automatically invalidated.</td>
+ </tr>
+ <tr>
+ <td><code><b>removePreviewUpdate</b>(
+ <nobr><Object><i>id</i>)</nobr>
+ </code></td>
+ <td><code>undfined</code></td>
+ <td>Cancels the automatic update for the preview defined by 'id'.</td>
+ </tr>
+
</table>
<h3 id="scroll-options">ScrollOptions</h3>
@@ -1483,6 +1522,21 @@ var map = L.map('map', {
</tr>
</table>
+<h3 id="getpreview-options">PreviewOptions</h3>
+
+<table data-id='values'>
+ <tr>
+ <th class="width100">property</th>
+ <th class="width100">type</th>
+ <th>description</th>
+ </tr>
+ <tr>
+ <td><code><b>autoUpdate</b></code></td>
+ <td><code>Boolean</code></td>
+ <td>Whether a new preview is generated automatically when it becomes invalid.</td>
+ </tr>
+</table>
+
<h2 id="loleaflet-toolbar">Toolbar</h2>
<p>Toolbar methods.</p>
@@ -1554,29 +1608,6 @@ var map = L.map('map', {
<td><code>undfined</code></td>
<td>Scrolls to the beginning of the given page.</td>
</tr>
- <tr>
- <td><code><b>getDocPreview</b>(
- <Object><i>id</i>,<br>
- <Number><i>maxWidth</i>,<br>
- <Number><i>maxHeight</i>,<br>
- <Number><i>x</i>,<br>
- <Number><i>y</i>,<br>
- <Number><i>width</i>,<br>
- <Number><i>height</i>,<br>
- <nobr><<a href="#getpreview-options">PreviewOptions</a>><i>options?</i>)</nobr>
- </code></td>
- <td><code>undefined</code></td>
- <td>Triggers the creation of a preview with the given id, of maximum maxWidth X maxHeight size, of the
- [(x,y), (x + width, y + height)] section of the document keeping the original ration. By passing an
- optional parameter {autoUpdate: true}, the preview will be automatically invalidated.</td>
- </tr>
- <tr>
- <td><code><b>removePreviewUpdate</b>(
- <nobr><Object><i>id</i>)</nobr>
- </code></td>
- <td><code>undfined</code></td>
- <td>Cancels the automatic update for the preview defined by 'id'.</td>
- </tr>
</table>
<h2 id="loleaflet-part">Part oriented</h2>
@@ -1606,1298 +1637,1087 @@ var map = L.map('map', {
<td><code>undfined</code></td>
<td>Select a specific part.</td>
</tr>
- <tr>
- <td><code><b>getPartPreview</b>(
- <Object><i>id</i>,<br>
- <Number><i>part</i>,<br>
- <Number><i>maxWidth</i>,<br>
- <Number><i>maxHeight</i>,<br>
- <nobr><<a href="#getpreview-options">PreviewOptions</a>><i>options?</i>)</nobr>
- </code></td>
- <td><code>undefined</code></td>
- <td>Triggers the creation of a preview with the given id, of maximum maxWidth X maxHeight size, of the
- specified part keeping the original ration. By passing an
- optional parameter {autoUpdate: true}, the preview will be automatically invalidated.</td>
- </tr>
- <tr>
- <td><code><b>removePreviewUpdate</b>(
- <nobr><Object><i>id</i>)</nobr>
- </code></td>
- <td><code>undfined</code></td>
- <td>Cancels the automatic update for the preview defined by 'id'.</td>
- </tr>
</table>
-<h3 id="getpreview-options">PreviewOptions</h3>
+<h2 id="loleaflet-events">Events</h2>
-<table data-id='values'>
+<h3 id="search-event">SearchEvent</h3>
+
+<table data-id='events'>
<tr>
<th class="width100">property</th>
- <th class="width100">type</th>
+ <th>type</th>
<th>description</th>
</tr>
<tr>
- <td><code><b>autoUpdate</b></code></td>
- <td><code>Boolean</code></td>
- <td>Whether a new preview is generated automatically when it becomes invalid.</td>
+ <td><code><b>originalPhrase</b></code></td>
+ <td><code>String</code></td>
+ <td>The phrase that has been searched for</td>
+ </tr>
+ <tr>
+ <td><code><b>count</b></code></td>
+ <td><code>Number</code></td>
+ <td>Number of search results</td>
+ </tr>
+ <tr>
+ <td><code><b>results</b></code></td>
+ <td><code><a href="#bounds">Bounds[]</a></code></td>
+ <td>An array of bounds representing the selections of the search results in the document.</td>
</tr>
</table>
-<h2 id="marker">Marker</h2>
-
-<p>Used to put markers on the map. Extends <a href="#layer">Layer</a>.</p>
-
-<pre><code class="javascript">L.marker([50.5, 30.5]).addTo(map);</code></pre>
-
-<h3>Creation</h3>
+<h3 id="partpagerectangles-event">PartPageRectangles</h3>
-<table data-id='marker'>
+<table data-id='events'>
<tr>
- <th class="width200">Factory</th>
-
- <th>Description</th>
+ <th class="width100">property</th>
+ <th>type</th>
+ <th>description</th>
</tr>
<tr>
- <td><code><b>L.marker</b>(
- <nobr><<a href="#latlng">LatLng</a>> <i>latlng</i>,</nobr>
- <nobr><<a href="#marker-options">Marker options</a>> <i>options?</i> )</nobr>
- </code></td>
-
- <td>Instantiates a Marker object given a geographical point and optionally an options object.</td>
+ <td><code><b>pixelRectangles</b></code></td>
+ <td><code><a href="#bounds">Bounds[]</a></code></td>
+ <td>An array of bounds representing each page's dimension in pixels on the current zoom level.</td>
+ </tr>
+ <tr>
+ <td><code><b>twipsRectangles</b></code></td>
+ <td><code><a href="#bounds">Bounds[]</a></code></td>
+ <td>An array of bounds representing each page's dimension in twips.</td>
</tr>
</table>
-<h3 id="marker-options">Options</h3>
+<h3 id="permission-event">PermissionEvent</h3>
-<table data-id='marker'>
+<table data-id='events'>
<tr>
- <th>Option</th>
- <th>Type</th>
- <th>Default</th>
- <th>Description</th>
+ <th class="width100">property</th>
+ <th>type</th>
+ <th>description</th>
</tr>
<tr>
- <td><code><b>icon</b></code></td>
- <td><code><a href="#icon">L.Icon</a></code></td>
- <td>*</td>
- <td>Icon class to use for rendering the marker. See <a href="#icon">Icon documentation</a> for details on how to customize the marker icon. Set to <code>new L.Icon.Default()</code> by default.</td>
+ <td><code><b>perm</b></code></td>
+ <td><code><a href="#documentpermission-values">DocumentPermission</a></code></td>
+ <td>Document permission.</td>
</tr>
+</table>
+
+<h3 id="commandstatechanged-event">CommandStateChangedEvent</h3>
+
+<table data-id='events'>
<tr>
- <td><code><b>interactive</b></code></td>
- <td><code>Boolean</code></td>
- <td><code><span class="literal">true</span></code></td>
- <td>If <code><span class="literal">false</span></code>, the marker will not emit mouse events and will act as a part of the underlying map.</td>
+ <th class="width100">property</th>
+ <th>type</th>
+ <th>description</th>
</tr>
<tr>
- <td><code><b>draggable</b></code></td>
- <td><code>Boolean</code></td>
- <td><code><span class="literal">false</span></code></td>
- <td>Whether the marker is draggable with mouse/touch or not.</td>
+ <td><code><b>commandName</b></code></td>
+ <td><code><a href="#commandstatechanged-values">CommandStateChangedValues</a></code></td>
+ <td>UNO command.</td>
</tr>
<tr>
- <td><code><b>keyboard</b></code></td>
- <td><code>Boolean</code></td>
- <td><code><span class="literal">true</span></code></td>
- <td>Whether the marker can be tabbed to with a keyboard and clicked by pressing enter.</td>
+ <td><code><b>state</b></code></td>
+ <td><code><a href="#commandstate-values">CommandStateValues</a></code></td>
+ <td>UNO command state.</td>
</tr>
+</table>
+
+<h3 id="updateparts-event">UpdatePartsEvent</h3>
+
+<table data-id='events'>
<tr>
- <td><code><b>title</b></code></td>
- <td><code>String</code></td>
- <td><code><span class="string">''</span></code></td>
- <td>Text for the browser tooltip that appear on marker hover (no tooltip by default).</td>
+ <th class="width100">property</th>
+ <th>type</th>
+ <th>description</th>
</tr>
<tr>
- <td><code><b>alt</b></code></td>
- <td><code>String</code></td>
- <td><code><span class="string">''</span></code></td>
- <td>Text for the <code>alt</code> attribute of the icon image (useful for accessibility).</td>
- </tr>
- <tr id="marker-zindexoffset">
- <td><code><b>zIndexOffset</b></code></td>
+ <td><code><b>selectedPart</b></code></td>
<td><code>Number</code></td>
- <td><code><span class="number">0</span></code></td>
- <td>By default, marker images zIndex is set automatically based on its latitude. Use this option if you want to put the marker on top of all others (or below), specifying a high value like <code>1000</code> (or high negative value, respectively).</td>
+ <td>The currently selected part.</td>
</tr>
<tr>
- <td><code><b>opacity</b></code></td>
+ <td><code><b>parts</b></code></td>
<td><code>Number</code></td>
- <td><code><span class="number">1.0</span></code></td>
- <td>The opacity of the marker.</td>
+ <td>The number of parts in the document.</td>
</tr>
<tr>
- <td><code><b>riseOnHover</b></code></td>
- <td><code>Boolean</code></td>
- <td><code><span class="literal">false</span></code></td>
- <td>If <code><span class="literal">true</span></code>, the marker will get on top of others when you hover the mouse over it.</td>
+ <td><code><b>docType</b></code></td>
+ <td><code><a href="#documenttype-values">DocumentTypeValues</a></code></td>
+ <td>The document type.</td>
</tr>
<tr>
- <td><code><b>riseOffset</b></code></td>
- <td><code>Number</code></td>
- <td><code><span class="number">250</span></code></td>
- <td>The z-index offset used for the <code>riseOnHover</code> feature.</td>
+ <td><code><b>partNames</b></code></td>
+ <td><code>String[]</code></td>
+ <td>If present, an array containing slides' / spreadsheets' names.</td>
</tr>
+</table>
+
+<h3 id="invalidatepreview-event">InvalidatePreviewEvent</h3>
+<p>Loleaflet specific events.</p>
+
+<table data-id='events'>
<tr>
- <td><code><b>pane</b></code></td>
- <td><code>String</code></td>
- <td><code><span class="string">'markerPane'</span></code></td>
- <td><a href="#map-panes">Map pane</a> where the markers icon will be added.</td>
+ <th class="width100">property</th>
+ <th>type</th>
+ <th>description</th>
</tr>
<tr>
- <td><code><b>shadowPane</b></code></td>
- <td><code>String</code></td>
- <td><code><span class="string">'shadowPane'</span></code></td>
- <td><a href="#map-panes">Map pane</a> where the markers shadow will be added.</td>
+ <td><code><b>id</b></code></td>
+ <td><code>Object</code></td>
+ <td>Preview's id that needs to be invalidated.</td>
</tr>
</table>
-<h3>Events</h3>
-
-<p>You can subscribe to the following events using <a href="#events">these methods</a>.</p>
+<h3 id="tilepreview-event">TilePreviewEvent</h3>
-<table data-id='marker'>
+<table data-id='events'>
<tr>
- <th class="width100">Event</th>
- <th class="width100">Data</th>
- <th>Description</th>
+ <th class="width100">property</th>
+ <th>type</th>
+ <th>description</th>
</tr>
<tr>
- <td><code><b>click</b></code></td>
- <td><code><a href="#mouse-event">MouseEvent</a></code></td>
- <td>Fired when the user clicks (or taps) the marker.</td>
+ <td><code><b>tile</b></code></td>
+ <td><code>Image</code></td>
+ <td>The actual preview.</td>
</tr>
<tr>
- <td><code><b>dblclick</b></code></td>
- <td><code><a href="#mouse-event">MouseEvent</a></code></td>
- <td>Fired when the user double-clicks (or double-taps) the marker.</td>
+ <td><code><b>id</b></code></td>
+ <td><code>Object</code></td>
+ <td>Preview id.</td>
</tr>
<tr>
- <td><code><b>mousedown</b></code></td>
- <td><code><a href="#mouse-event">MouseEvent</a></code></td>
- <td>Fired when the user pushes the mouse button on the marker.</td>
+ <td><code><b>width</b></code></td>
+ <td><code>Number</code></td>
+ <td>Image width.</td>
</tr>
<tr>
- <td><code><b>mouseover</b></code></td>
- <td><code><a href="#mouse-event">MouseEvent</a></code></td>
- <td>Fired when the mouse enters the marker.</td>
+ <td><code><b>height</b></code></td>
+ <td><code>Number</code></td>
+ <td>Image height.</td>
</tr>
<tr>
- <td><code><b>mouseout</b></code></td>
- <td><code><a href="#mouse-event">MouseEvent</a></code></td>
- <td>Fired when the mouse leaves the marker.</td>
+ <td><code><b>docType</b></code></td>
+ <td><code><a href="#documenttype-values">DocumentTypeValues</a></code></td>
+ <td>The document type.</td>
</tr>
<tr>
- <td><code><b>contextmenu</b></code></td>
- <td><code><a href="#mouse-event">MouseEvent</a></code>
- <td>Fired when the user right-clicks on the marker.</td>
+ <td><code><b>part</b></code></td>
+ <td><code>Number</code></td>
+ <td>If the preview is for a whole part.</td>
</tr>
+</table>
+
+<h3 id="statusindicator-event">StatusIndicatorEvent</h3>
+
+<table data-id='events'>
<tr>
- <td><code><b>dragstart</b></code></td>
- <td><code><a href="#event">Event</a></code></td>
- <td>Fired when the user starts dragging the marker.</td>
+ <th class="width100">property</th>
+ <th>type</th>
+ <th>description</th>
</tr>
<tr>
- <td><code><b>drag</b></code></td>
- <td><code><a href="#event">Event</a></code></td>
- <td>Fired repeatedly while the user drags the marker.</td>
+ <td><code><b>statusType</b></code></td>
+ <td><code><a href="#statusindicator-values">StatusIndicatorValues</a></code></td>
+ <td>Status type.</td>
</tr>
<tr>
- <td><code><b>dragend</b></code></td>
- <td><code><a href="#dragend-event">DragEndEvent</a></code></td>
- <td>Fired when the user stops dragging the marker.</td>
+ <td><code><b>value</b></code></td>
+ <td><code>Number</code></td>
+ <td>If present, a number for 0 to 100 represending the loading status.<td>
</tr>
+</table>
+
+<h3 id="docsize-event">DocumentSizeEvent</h3>
+
+<table data-id='events'>
<tr>
- <td><code><b>move</b></code></td>
- <td><code><a href="#event">Event</a></code></td>
- <td>Fired when the marker is moved via setLatLng. Old and new coordinates are included in event arguments as <code>oldLatLng, latlng</code>.</td>
+ <th class="width100">property</th>
+ <th>type</th>
+ <th>description</th>
</tr>
<tr>
- <td><code><b>add</b></code></td>
- <td><code><a href="#event">Event</a></code></td>
- <td>Fired when the marker is added to the map.</td>
+ <td><code><b>x</b></code></td>
+ <td><code>Number</code></td>
+ <td>Document width in pixels.</td>
</tr>
<tr>
- <td><code><b>remove</b></code></td>
- <td><code><a href="#event">Event</a></code></td>
- <td>Fired when the marker is removed from the map.</td>
+ <td><code><b>y</b></code></td>
+ <td><code>Number</code></td>
+ <td>Document height in pixels.</td>
+ </tr>
+</table>
+
+<h3 id="updatescrolloffset-event">UpdateScrollOffsetEvent</h3>
+
+<table data-id='events'>
+ <tr>
+ <th class="width100">property</th>
+ <th>type</th>
+ <th>description</th>
</tr>
<tr>
- <td><code><b>popupopen</b></code></td>
- <td><code><a href="#popup-event">PopupEvent</a></code></td>
- <td>Fired when a popup bound to the marker is open.</td>
+ <td><code><b>x</b></code></td>
+ <td><code>Number</code></td>
+ <td>Difference in pixels between the document's left border and view's left border.</td>
</tr>
<tr>
- <td><code><b>popupclose</b></code></td>
- <td><code><a href="#popup-event">PopupEvent</a></code></td>
- <td>Fired when a popup bound to the marker is closed.</td>
+ <td><code><b>y</b></code></td>
+ <td><code>Number</code></td>
+ <td>Difference in pixels between the document's top border and view's top border.</td>
</tr>
</table>
-<h3>Methods</h3>
-
-<p>In addition to <a href="#layers">shared layer methods</a> like <code>addTo()</code> and <code>remove()</code> and <a href="#popups">popup methods</a> like <code>bindPopup()</code> you can also use the following methods:</p>
+<h3 id="scrollto-event">ScrollToEvent</h3>
-<table data-id='marker'>
+<table data-id='events'>
<tr>
- <th class="width250">Method</th>
- <th>Returns</th>
- <th>Description</th>
+ <th class="width100">property</th>
+ <th>type</th>
+ <th>description</th>
</tr>
<tr>
- <td><code><b>getLatLng</b>()</code></td>
- <td><code><a href="#latlng">LatLng</a></code></td>
- <td>Returns the current geographical position of the marker.</td>
+ <td><code><b>x</b></code></td>
+ <td><code>Number</code></td>
+ <td>View's left border position in pixels.</td>
</tr>
<tr>
- <td><code><b>setLatLng</b>(
- <nobr><<a href="#latlng">LatLng</a>> <i>latlng</i> )</nobr>
- </code></td>
-
- <td><code><span class="keyword">this</span></code></td>
- <td>Changes the marker position to the given point.</td>
+ <td><code><b>y</b></code></td>
+ <td><code>Number</code></td>
+ <td>View's top border position in pixels.</td>
</tr>
- <tr>
- <td><code><b>setIcon</b>(
- <nobr><<a href="#icon">Icon</a>> <i>icon</i> )</nobr>
- </code></td>
+</table>
- <td><code><span class="keyword">this</span></code></td>
- <td>Changes the marker icon.</td>
- </tr>
- <tr>
- <td><code><b>setZIndexOffset</b>(
- <nobr><Number> <i>offset</i> )</nobr>
- </code></td>
+<h3 id="scrollby-event">ScrollByEvent</h3>
- <td><code><span class="keyword">this</span></code></td>
- <td>Changes the <a href="#marker-zindexoffset">zIndex offset</a> of the marker.</td>
- </tr>
+<table data-id='events'>
<tr>
- <td><code><b>setOpacity</b>(
- <nobr><Number> <i>opacity</i> )</nobr>
- </code></td>
- <td><code><span class="keyword">this</span></code></td>
- <td>Changes the opacity of the marker.</td>
+ <th class="width100">property</th>
+ <th>type</th>
+ <th>description</th>
</tr>
<tr>
- <td><code><b>update</b>()</nobr>
- </code></td>
-
- <td><code><span class="keyword">this</span></code></td>
- <td>Updates the marker position, useful if coordinates of its <code>latLng</code> object were changed directly.</td>
+ <td><code><b>x</b></code></td>
+ <td><code>Number</code></td>
+ <td>Scroll right by x pixels, or left if negative.</td>
</tr>
- <tr id="marker-togeojson">
- <td><code><b>toGeoJSON</b>()</code></td>
- <td><code>Object</code></td>
- <td>Returns a <a href="http://en.wikipedia.org/wiki/GeoJSON">GeoJSON</a> representation of the marker (GeoJSON Point Feature).</td>
+ <tr>
+ <td><code><b>y</b></code></td>
+ <td><code>Number</code></td>
+ <td>Scroll down by y pixels, or up if negative.</td>
</tr>
</table>
-<h3 id="marker-interaction-handlers">Interaction handlers</h3>
-
-<p>Interaction handlers are properties of a marker instance that allow you to control interaction behavior in runtime, enabling or disabling certain features such as dragging (see <a href="#handler">IHandler</a> methods). Example:</p>
-
-<pre><code class="javascript">marker.dragging.disable();</code></pre>
+<h3 id="pagenumberchanged-event">PageNumberChangedEvent</h3>
-<table data-id='marker'>
+<table data-id='events'>
<tr>
- <th class="width100">Property</th>
- <th class="width100">Type</th>
- <th>Description</th>
+ <th class="width100">property</th>
+ <th>type</th>
+ <th>description</th>
</tr>
<tr>
- <td>dragging</td>
- <td><a href="#handler"><code>IHandler</code></a></td>
- <td>Marker dragging handler (by both mouse and touch).</td>
+ <td><code><b>currentPage</b></code></td>
+ <td><code>Number</code></td>
+ <td>The current page in the document.</td>
</tr>
-</table>
-
-
-
-<h2 id="popup">Popup</h2>
-
-<p>Used to open popups in certain places of the map. Use <a href="#map-openpopup">Map#openPopup</a> to open popups while making sure that only one popup is open at one time (recommended for usability), or use <a href="#map-addlayer">Map#addLayer</a> to open as many as you want.</p>
-
-<h3>Usage example</h3>
-<p>If you want to just bind a popup to marker click and then open it, it's really easy:</p>
-<pre><code class="javascript">marker.bindPopup(popupContent).openPopup();</code></pre>
-<p>Path overlays like polylines also have a <code>bindPopup</code> method. Here's a more complicated way to open a popup on a map:</p>
-
-<pre><code class="javascript">var popup = L.popup()
- .setLatLng(latlng)
- .setContent('<p>Hello world!<br />This is a nice popup.</p>')
- .openOn(map);</code></pre>
-
-<h3>Creation</h3>
-
-<table data-id='popup'>
<tr>
- <th>Factory</th>
-
- <th>Description</th>
+ <td><code><b>pages</b></code></td>
+ <td><code>Number</code></td>
+ <td>The number of pages.</td>
</tr>
<tr>
- <td><code><b>L.popup</b>(
- <nobr><<a href="#popup-options">Popup options</a>> <i>options?</i>,</nobr>
- <nobr><<a href="#layer">Layer</a>> <i>source?</i> )</nobr>
- </code></td>
-
-
- <td>Instantiates a Popup object given an optional options object that describes its appearance and location and an optional source object that is used to tag the popup with a reference to the Layer to which it refers.</td>
+ <td><code><b>docType</b></code></td>
+ <td><code><a href="#documenttype-values">DocumentTypeValues</a></code></td>
+ <td>The document type.</td>
</tr>
</table>
-<h3 id="popup-options">Options</h3>
+<h3 id="error-event">ErrorEvent</h3>
-<table data-id='popup'>
+<table data-id='events'>
<tr>
- <th>Option</th>
- <th>Type</th>
- <th>Default</th>
- <th>Description</th>
+ <th class="width100">property</th>
+ <th>type</th>
+ <th>description</th>
</tr>
<tr>
- <td><code><b>maxWidth</b></code></td>
- <td><code>Number</code></td>
- <td><code><span class="number">300</span></code></td>
- <td>Max width of the popup.</td>
+ <td><code><b>msg</b></code></td>
+ <td><code>String</code></td>
+ <td>If present, the error message.</td>
</tr>
<tr>
- <td><code><b>minWidth</b></code></td>
- <td><code>Number</code></td>
- <td><code><span class="number">50</span></code></td>
- <td>Min width of the popup.</td>
+ <td><code><b>cmd</b></code></td>
+ <td><code>String</code></td>
+ <td>If present, the server command that caused the error.</td>
</tr>
<tr>
- <td><code><b>maxHeight</b></code></td>
- <td><code>Number</code></td>
- <td><code><span class="literal">null</span></code></td>
- <td>If set, creates a scrollable container of the given height inside a popup if its content exceeds it.</td>
- </tr>
- <tr>
- <td><code><b>autoPan</b></code></td>
- <td><code>Boolean</code></td>
- <td><code><span class="literal">true</span></code></td>
- <td>Set it to <code><span class="literal">false</span></code> if you don't want the map to do panning animation to fit the opened popup.</td>
+ <td><code><b>kind</b></code></td>
+ <td><code>String</code></td>
+ <td>If present, the kind of error associated with the command.</td>
</tr>
+</table>
+
+<h3 id="updatetoolbarcommandvalues-event">UpdateToolbarCommandValuesEvent</h3>
+
+<table data-id='events'>
<tr>
- <td><code><b>keepInView</b></code></td>
- <td><code>Boolean</code></td>
- <td><code><span class="literal">false</span></code></td>
- <td>Set it to <code><span class="literal">true</span></code> if you want to prevent users from panning the popup off of the screen while it is open.</td>
+ <th class="width100">property</th>
+ <th>type</th>
+ <th>description</th>
</tr>
<tr>
- <td><code><b>closeButton</b></code></td>
- <td><code>Boolean</code></td>
- <td><code><span class="literal">true</span></code></td>
- <td>Controls the presense of a close button in the popup.</td>
+ <td><code><b>commandName</b></code></td>
+ <td><code><a href="#toolbarcommand-values">ToolbarCommandValues</a></code></td>
+ <td>UNO command.</td>
</tr>
<tr>
- <td><code><b>offset</b></code></td>
- <td><code><a href="#point">Point</a></code></td>
- <td><code><nobr>Point(<span class="number">0</span>, <span class="number">6</span>)</nobr>
- </code></td>
- <td>The offset of the popup position. Useful to control the anchor of the popup when opening it on some overlays.</td>
+ <td><code><b>commandValues</b></code></td>
+ <td><code>Object</code></td>
+ <td>JSON mapping of the possible values.</td>
</tr>
+</table>
+
+<h2 id="loleaflet-object-values">Object values</h2>
+
+<p>A list of possible values for different event object properties.</p>
+
+<h3 id="documentpermission-values">DocumentPermissionValues</h3>
+
+<table data-id='values'>
<tr>
- <td><code><b>autoPanPaddingTopLeft</b></code></td>
- <td><code><a href="#point">Point</a></code></td>
- <td><code><span class="literal">null</span></code></td>
- </code></td>
- <td>The margin between the popup and the top left corner of the map view after autopanning was performed.</td>
+ <th class="width100">value</th>
+ <th class="width100">type</th>
+ <th>description</th>
</tr>
<tr>
- <td><code><b>autoPanPaddingBottomRight</b></code></td>
- <td><code><a href="#point">Point</a></code></td>
- <td><code><span class="literal">null</span></code></td>
- </code></td>
- <td>The margin between the popup and the bottom right corner of the map view after autopanning was performed.</td>
+ <td><code><b>'edit'</b></code></td>
+ <td><code>String</code></td>
+ <td>The document can be edited, dragging is disabled and mouse selection is active.</td>
</tr>
<tr>
- <td><code><b>autoPanPadding</b></code></td>
- <td><code><a href="#point">Point</a></code></td>
- <td><code><nobr>Point(<span class="number">5</span>, <span class="number">5</span>)</nobr>
- </code></td>
- <td>Equivalent of setting both top left and bottom right autopan padding to the same value.</td>
+ <td><code><b>'view'</b></code></td>
+ <td><code>String</code></td>
+ <td>The document is in viewing mode, dragging is enabled by default and by clicking in it, editing mode is entered.</td>
</tr>
- <tr>
- <td><code><b>zoomAnimation</b></code></td>
- <td><code>Boolean</code></td>
- <td><code><span class="literal">true</span></code></td>
- <td>Whether to animate the popup on zoom. Disable it if you have problems with Flash content inside popups.</td>
+ <tr>
+ <td><code><b>'readonly'</b></code></td>
+ <td><code>String</code></td>
+ <td>The document is in read-only mode, dragging is enabled by default.</td>
</tr>
+</table>
+
+<h3 id="commandstatechanged-values">CommandStateChangedValues</h3>
+
+<table data-id='values'>
<tr>
- <td><code><b>closeOnClick</b></code></td>
- <td><code>Boolean</code></td>
- <td><code><span class="literal">null</span></code></td>
- <td>Set it to <code><span class="literal">false</span></code> if you want to override the default behavior of the popup closing when user clicks the map (set globally by the <code>Map</code> <code>closePopupOnClick</code> option).</td>
+ <th class="width100">value</th>
+ <th class="width100">type</th>
+ <th>description</th>
</tr>
<tr>
- <td><code><b>className</b></code></td>
+ <td><code><b>'.uno:Bold'</b></code></td>
<td><code>String</code></td>
- <td><code class="javascript"><span class="string">''</span></code></td>
- <td>A custom class name to assign to the popup.</td>
+ <td>Bold.</td>
</tr>
-</table>
-
-<h3>Events</h3>
-
-<table data-id='popup'>
<tr>
- <th>Event</th>
- <th>Data</th>
- <th>Description</th>
+ <td><code><b>'.uno:Italic'</b></code></td>
+ <td><code>String</code></td>
+ <td>Italic.</td>
</tr>
<tr>
- <td><code><b>add</b></code></td>
- <td><code><a href="#popup-event">PopupEvent</a></code></td>
- <td>Fired when the popup is added to the map.</td>
+ <td><code><b>'.uno:Underline'</b></code></td>
+ <td><code>String</code></td>
+ <td>Underline.</td>
</tr>
<tr>
- <td><code><b>remove</b></code></td>
- <td><code><a href="#popup-event">PopupEvent</a></code></td>
- <td>Fired when the popup is removed from the map.</td>
+ <td><code><b>'.uno:Strikeout'</b></code></td>
+ <td><code>String</code></td>
+ <td>Strikeout.</td>
</tr>
-</table>
-
-<h3>Methods</h3>
-
-<p>In addition to <a href="#layers">shared layer methods</a> like <code>addTo()</code> and <code>remove()</code> you can also use the following methods:</p>
-
-<table data-id='popup'>
<tr>
- <th class="width250">Method</th>
- <th class="minwidth">Returns</th>
- <th>Description</th>
+ <td><code><b>'.uno:LeftPara'</b></code></td>
+ <td><code>String</code></td>
+ <td>Align left.</td>
</tr>
<tr>
- <td><code><b>openOn</b>(
- <nobr><<a href="#map-class">Map</a>> <i>map</i> )</nobr>
- </code></td>
-
- <td><code><span class="keyword">this</span></code></td>
- <td>Adds the popup to the map and closes the previous one. The same as <code>map.openPopup(popup)</code>.</td>
+ <td><code><b>'.uno:CenterPara'</b></code></td>
+ <td><code>String</code></td>
+ <td>Center horizontaly.</td>
</tr>
<tr>
- <td><code><b>setLatLng</b>(
- <nobr><<a href="#latlng">LatLng</a>> <i>latlng</i> )</nobr>
- </code></td>
-
- <td><code><span class="keyword">this</span></code></td>
- <td>Sets the geographical point where the popup will open.</td>
+ <td><code><b>'.uno:RightPara'</b></code></td>
+ <td><code>String</code></td>
+ <td>Align right.</td>
</tr>
<tr>
- <td><code><b>getLatLng</b>()</code></td>
- <td><code><a href="#latlng">LatLng</a></code></td>
- <td>Returns the geographical point of popup.</td>
+ <td><code><b>'.uno:JustifyPara'</b></code></td>
+ <td><code>String</code></td>
+ <td>Justified.</td>
</tr>
<tr>
- <td><code><b>setContent</b>(
- <nobr><String|HTMLElement|Function> <i>htmlContent</i> )</nobr>
- </code></td>
-
- <td><code><span class="keyword">this</span></code></td>
- <td>Sets the HTML content of the popup. If a function is passed the source layer will be passed to the function. The function should return a <code>String</code> or <code>HTMLElement</code> to be used in the popup.</td>
+ <td><code><b>'.uno:IncrementIndent'</b></code></td>
+ <td><code>String</code></td>
+ <td>Increment indent.</td>
</tr>
<tr>
- <td><code><b>getContent</b>()</code></td>
- <td><code><String|HTMLElement></code></td>
- <td>Returns the content of the popup.</td>
+ <td><code><b>'.uno:DecrementIndent'</b></code></td>
+ <td><code>String</code></td>
+ <td>Decrement indent.</td>
</tr>
<tr>
- <td><code><b>update</b>()</code></td>
-
- <td><code><span class="keyword">this</span></code></td>
- <td>Updates the popup content, layout and position. Useful for updating the popup after something inside changed, e.g. image loaded.</td>
+ <td><code><b>'.uno:StyleApply'</b></code></td>
+ <td><code>String</code></td>
+ <td>Style related uno command.</td>
</tr>
-</table>
-
-
-
-<h2 id="tilelayer">TileLayer</h2>
-
-<p>Used to load and display tile layers on the map. Extends <a href="#layer">Layer</a>.</p>
-
-<h3>Usage example</h3>
-
-<pre><code class="javascript">L.tileLayer('http://{s}.tile.osm.org/{z}/{x}/{y}.png?{foo}', {foo: 'bar'}).addTo(map);</code></pre>
-
-<h3>Creation</h3>
-
-<table data-id='tilelayer'>
<tr>
- <th class="width250">Factory</th>
-
- <th>Description</th>
+ <td><code><b>'.uno:CharFontName'</b></code></td>
+ <td><code>String</code></td>
+ <td>Font related uno command.</td>
</tr>
<tr>
- <td><code><b>L.tileLayer</b>(
- <nobr><String> <i><a href="#url-template">urlTemplate</a></i>,</nobr>
- <nobr><<a href="#tilelayer-options">TileLayer options</a>> <i>options?</i> )</nobr>
- </code></td>
-
-
- <td>Instantiates a tile layer object given a <a href="#url-template">URL template</a> and optionally an options object.</td>
+ <td><code><b>'.uno:FontHeight'</b></code></td>
+ <td><code>String</code></td>
+ <td>Font size related uno command.</td>
</tr>
</table>
-<h3 id="url-template">URL template</h3>
-
-<p>A string of the following form:</p>
-
-<pre><code class="javascript">'http://{s}.somedomain.com/blabla/{z}/{x}/{y}{r}.png'</code></pre>
-
-<p><code>{s}</code> means one of the available subdomains (used sequentially to help with browser parallel requests per domain limitation; subdomain values are specified in options; <code>a</code>, <code>b</code> or <code>c</code> by default, can be omitted), <code>{z}</code> — zoom level, <code>{x}</code> and <code>{y}</code> — tile coordinates. <code>{r}</code> can be used to add <code>@2x</code> to the URL to load retina tiles.</p>
-
-<p>You can use custom keys in the template, which will be <a href="#util-template">evaluated</a> from TileLayer options, like this:</p>
-
-<pre><code class="javascript">L.tileLayer('http://{s}.somedomain.com/{foo}/{z}/{x}/{y}.png', {foo: 'bar'});</code></pre>
-
-<h3 id="tilelayer-options">Options</h3>
+<h3 id="commandstate-values">CommandStateValues</h3>
-<table data-id='tilelayer'>
+<table data-id='values'>
<tr>
- <th>Option</th>
- <th>Type</th>
- <th>Default</th>
- <th>Description</th>
+ <th class="width100">value</th>
+ <th class="width100">type</th>
+ <th>description</th>
</tr>
<tr>
- <td><code><b>minZoom</b></code></td>
- <td><code>Number</code></td>
- <td><code><span class="number">0</span></code></td>
- <td>Minimum zoom number.</td>
+ <td><code><b>'true'</b></code></td>
+ <td><code>String</code></td>
+ <td>For '.uno:Bold', '.uno:Italic', etc.</td>
</tr>
<tr>
- <td><code><b>maxZoom</b></code></td>
- <td><code>Number</code></td>
- <td><code><span class="number">18</span></code></td>
- <td>Maximum zoom number.</td>
+ <td><code><b>'false'</b></code></td>
+ <td><code>String</code></td>
+ <td>For '.uno:Bold', '.uno:Italic', etc.</td>
</tr>
<tr>
- <td><code><b>maxNativeZoom</b></code></td>
- <td><code>Number</code></td>
- <td><code><span class="literal">null</span></code></td>
- <td>Maximum zoom number the tiles source has available. If it is specified, the tiles on all zoom levels higher than <code>maxNativeZoom</code> will be loaded from <code>maxZoom</code> level and auto-scaled.</td>
+ <td><code><b>styleName</b></code></td>
+ <td><code>String</code></td>
+ <td>For '.uno:StyleApply'.</td>
</tr>
<tr>
- <td><code><b>tileSize</b></code></td>
- <td><code>Number</code></td>
- <td><code><span class="number">256</span></code></td>
- <td>Tile size (width and height in pixels, assuming tiles are square).</td>
+ <td><code><b>fontName</b></code></td>
+ <td><code>String</code></td>
+ <td>For '.uno:CharFontName'.</td>
</tr>
<tr>
- <td><code><b>subdomains</b></code></td>
- <td><code>String</code> or <code>String[]</code></td>
- <td><code><span class="string">'abc'</span></code></td>
- <td>Subdomains of the tile service. Can be passed in the form of one string (where each letter is a subdomain name) or an array of strings.</td>
+ <td><code><b>fontSize</b></code></td>
+ <td><code>String</code></td>
+ <td>For '.uno:FontHeight'.</td>
</tr>
+</table>
+
+<h3 id="documenttype-values">DocumentTypeValues</h3>
+
+<table data-id='values'>
<tr>
- <td><code><b>errorTileUrl</b></code></td>
- <td><code>String</code></td>
- <td><code><span class="string">''</span></code></td>
- <td>URL to the tile image to show in place of the tile that failed to load.</td>
+ <th class="width100">value</th>
+ <th class="width100">type</th>
+ <th>description</th>
</tr>
<tr>
- <td><code><b>attribution</b></code></td>
+ <td><code><b>'text'</b></code></td>
<td><code>String</code></td>
- <td><code><span class="string">''</span></code></td>
- <td>e.g. "© Mapbox" — the string used by the attribution control, describes the layer data.</td>
+ <td>Text document, usually handled by Writer.</td>
</tr>
<tr>
- <td><code><b>tms</b></code></td>
- <td><code>Boolean</code></td>
- <td><code><span class="literal">false</span></code></td>
- <td>If <code><span class="literal">true</span></code>, inverses Y axis numbering for tiles (turn this on for TMS services).</td>
+ <td><code><b>'presentation'</b></code></td>
+ <td><code>String</code></td>
+ <td>Text document, usually handled by Impress.</td>
</tr>
<tr>
- <td><code><b>continuousWorld</b></code></td>
- <td><code>Boolean</code></td>
- <td><code><span class="literal">false</span></code></td>
- <td>If set to <code><span class="literal">true</span></code>, the tile coordinates won't be wrapped by world width (-180 to 180 longitude) or clamped to lie within world height (-90 to 90). Use this if you use Leaflet for maps that don't reflect the real world (e.g. game, indoor or photo maps).</td>
+ <td><code><b>'spreadsheet'</b></code></td>
+ <td><code>String</code></td>
+ <td>Text document, usually handled by Calc.</td>
</tr>
<tr>
- <td><code><b>noWrap</b></code></td>
- <td><code>Boolean</code></td>
- <td><code><span class="literal">false</span></code></td>
- <td>If set to <code><span class="literal">true</span></code>, the tiles just won't load outside the world width (-180 to 180 longitude) instead of repeating.</td>
+ <td><code><b>'drawing'</b></code></td>
+ <td><code>String</code></td>
+ <td>Text document, usually handled by Draw.</td>
</tr>
<tr>
- <td><code><b>zoomOffset</b></code></td>
- <td><code>Number</code></td>
- <td><code><span class="number">0</span></code></td>
- <td>The zoom number used in tile URLs will be offset with this value.</td>
+ <td><code><b>'other'</b></code></td>
+ <td><code>String</code></td>
+ <td>Other document type.</td>
</tr>
+</table>
+
+<h3 id="statusindicator-values">StatusIndicatorValues</h3>
+
+<table data-id='values'>
<tr>
- <td><code><b>zoomReverse</b></code></td>
- <td><code>Boolean</code></td>
- <td><code><span class="literal">false</span></code></td>
- <td>If set to <code><span class="literal">true</span></code>, the zoom number used in tile URLs will be reversed (<code>maxZoom - zoom</code> instead of <code>zoom</code>)</td>
+ <th class="width100">value</th>
+ <th class="width100">type</th>
+ <th>description</th>
</tr>
<tr>
- <td><code><b>opacity</b></code></td>
- <td><code>Number</code></td>
- <td><code><span class="number">1.0</span></code></td>
- <td>The opacity of the tile layer.</td>
+ <td><code><b>'start'</b></code></td>
+ <td><code>String</code></td>
+ <td>Fired when the progress broadcast is being started.</td>
</tr>
<tr>
- <td><code><b>zIndex</b></code></td>
- <td><code>Number</code></td>
- <td><code><span class="literal">null</span></code></td>
- <td>The explicit zIndex of the tile layer. Not set by default.</td>
+ <td><code><b>'setvalue'</b></code></td>
+ <td><code>String</code></td>
+ <td>Set a value between 0 and 100.</td>
</tr>
<tr>
- <td><code><b>updateInterval</b></code></td>
- <td><code>Number</code></td>
- <td><code class="javascript"><span class="number">200</span></code></td>
- <td>Tiles will not update more then once every <code>updateInterval</code>.</td>
+ <td><code><b>'finish'</b></code></td>
+ <td><code>String</code></td>
+ <td>The progress is at 100%.</td>
</tr>
<tr>
- <td><code><b>unloadInvisibleTiles</b></code></td>
- <td><code>Boolean</code></td>
- <td>depends</td>
- <td>If <code><span class="literal">true</span></code>, all the tiles that are not visible after panning are removed (for better performance). <code><span class="literal">true</span></code> by default on mobile WebKit, otherwise <code><span class="literal">false</span></code>.</td>
+ <td><code><b>'loleafletloaded'</b></code></td>
+ <td><code>String</code></td>
+ <td>Fired when the code has been initialized.</td>
</tr>
<tr>
- <td><code><b>updateWhenIdle</b></code></td>
- <td><code>Boolean</code></td>
- <td>depends</td>
- <td>If <code><span class="literal">false</span></code>, new tiles are loaded during panning, otherwise only after it (for better performance). <code><span class="literal">true</span></code> by default on mobile WebKit, otherwise <code><span class="literal">false</span></code>.</td>
+ <td><code><b>'alltilesloaded'</b></code></td>
+ <td><code>String</code></td>
+ <td>Fired when all empty tiles have been loaded (fired several times).</td>
</tr>
+</table>
+
+<h3 id="toolbarcommand-values">ToolbarCommandValues</h3>
+
+<table data-id='values'>
<tr>
- <td><code><b>detectRetina</b></code></td>
- <td><code><code>Boolean</code></code></td>
- <td><code><span class="literal">false</span></code></td>
- <td>If <code><span class="literal">true</span></code> and user is on a retina display, it will request four tiles of half the specified size and a bigger zoom level in place of one to utilize the high resolution.</td>
+ <th class="width100">value</th>
+ <th class="width100">type</th>
+ <th>description</th>
</tr>
<tr>
- <td><code><b>reuseTiles</b></code></td>
- <td><code><code>Boolean</code></code></td>
- <td><code><span class="literal">false</span></code></td>
- <td>If <code><span class="literal">true</span></code>, all the tiles that are not visible after panning are placed in a reuse queue from which they will be fetched when new tiles become visible (as opposed to dynamically creating new ones). This will in theory keep memory usage low and eliminate the need for reserving new memory whenever a new tile is needed.</td>
+ <td><code><b>'.uno:StyleApply'</b></code></td>
+ <td><code>String</code></td>
+ <td>Style related uno command.</td>
</tr>
<tr>
- <td><code><b>bounds</b></code></td>
- <td><code><a href="#latlngbounds">LatLngBounds</a></code></td>
- <td><code><span class="literal">null</span></code></td>
- <td>When this option is set, the TileLayer only loads tiles that are in the given geographical bounds.</td>
- </tr>
- <tr>
- <td><code><b>crossOrigin</b></code></td>
- <td><code><code>Boolean</code></code></td>
- <td><code><span class="literal">false</span></code></td>
- <td>If <code><span class="literal">true</span></code>, all tiles will have their <code>crossOrigin</code> attribute set to <code>''</code>. This is needed if you want to access tile pixel data.</td>
+ <td><code><b>'.uno:CharFontName'</b></code></td>
+ <td><code>String</code></td>
+ <td>Font related uno command.</td>
</tr>
</table>
-<h3>Events</h3>
+<h2 id="marker">Marker</h2>
-<p>You can subscribe to the following events using <a href="#events">these methods</a>.</p>
+<p>Used to put markers on the map. Extends <a href="#layer">Layer</a>.</p>
-<table data-id='tilelayer'>
+<pre><code class="javascript">L.marker([50.5, 30.5]).addTo(map);</code></pre>
+
+<h3>Creation</h3>
+
+<table data-id='marker'>
<tr>
- <th class="width100">Event</th>
- <th class="width100">Data</th>
+ <th class="width200">Factory</th>
+
<th>Description</th>
</tr>
<tr>
- <td><code><b>loading</b></code></td>
- <td><code><a href="#event">Event</a></code></td>
- <td>Fired when the tile layer starts loading tiles.</td>
+ <td><code><b>L.marker</b>(
+ <nobr><<a href="#latlng">LatLng</a>> <i>latlng</i>,</nobr>
+ <nobr><<a href="#marker-options">Marker options</a>> <i>options?</i> )</nobr>
+ </code></td>
+
+ <td>Instantiates a Marker object given a geographical point and optionally an options object.</td>
</tr>
+</table>
+
+<h3 id="marker-options">Options</h3>
+
+<table data-id='marker'>
<tr>
- <td><code><b>load</b></code></td>
- <td><code><a href="#event">Event</a></code></td>
- <td>Fired when the tile layer loaded all visible tiles.</td>
- </tr>
- <tr>
- <td><code><b>tileloadstart</b></code></td>
- <td><code><a href="#tile-event">TileEvent</a></code></td>
- <td>Fired when a tile is requested and starts loading.</td>
+ <th>Option</th>
+ <th>Type</th>
+ <th>Default</th>
+ <th>Description</th>
</tr>
<tr>
- <td><code><b>tileload</b></code></td>
- <td><code><a href="#tile-event">TileEvent</a></code></td>
- <td>Fired when a tile loads.</td>
+ <td><code><b>icon</b></code></td>
+ <td><code><a href="#icon">L.Icon</a></code></td>
+ <td>*</td>
+ <td>Icon class to use for rendering the marker. See <a href="#icon">Icon documentation</a> for details on how to customize the marker icon. Set to <code>new L.Icon.Default()</code> by default.</td>
</tr>
<tr>
- <td><code><b>tileunload</b></code></td>
- <td><code><a href="#tile-event">TileEvent</a></code></td>
- <td>Fired when a tile is removed (e.g. when you have <code>unloadInvisibleTiles</code> on).</td>
+ <td><code><b>interactive</b></code></td>
+ <td><code>Boolean</code></td>
+ <td><code><span class="literal">true</span></code></td>
+ <td>If <code><span class="literal">false</span></code>, the marker will not emit mouse events and will act as a part of the underlying map.</td>
</tr>
<tr>
- <td><code><b>tileerror</b></code></td>
- <td><code><a href="#tileerror-event">TileEvent</a></code></td>
- <td>Fired when there is an error loading a tile.</td>
+ <td><code><b>draggable</b></code></td>
+ <td><code>Boolean</code></td>
+ <td><code><span class="literal">false</span></code></td>
+ <td>Whether the marker is draggable with mouse/touch or not.</td>
</tr>
-</table>
-
-<h3>Methods</h3>
-
-<table data-id='tilelayer'>
<tr>
- <th>Method</th>
- <th>Returns</th>
- <th>Description</th>
+ <td><code><b>keyboard</b></code></td>
+ <td><code>Boolean</code></td>
+ <td><code><span class="literal">true</span></code></td>
+ <td>Whether the marker can be tabbed to with a keyboard and clicked by pressing enter.</td>
</tr>
<tr>
- <td><code><b>addTo</b>(
- <nobr><<a href="#map-class">Map</a>> <i>map</i> )</nobr>
- </code></td>
-
- <td><code><span class="keyword">this</span></code></td>
- <td>Adds the layer to the map.</td>
+ <td><code><b>title</b></code></td>
+ <td><code>String</code></td>
+ <td><code><span class="string">''</span></code></td>
+ <td>Text for the browser tooltip that appear on marker hover (no tooltip by default).</td>
</tr>
<tr>
- <td><code><b>bringToFront</b>()</code></td>
- <td><code><span class="keyword">this</span></code></td>
- <td>Brings the tile layer to the top of all tile layers.</td>
+ <td><code><b>alt</b></code></td>
+ <td><code>String</code></td>
+ <td><code><span class="string">''</span></code></td>
+ <td>Text for the <code>alt</code> attribute of the icon image (useful for accessibility).</td>
</tr>
- <tr>
- <td><code><b>bringToBack</b>()</code></td>
- <td><code><span class="keyword">this</span></code></td>
- <td>Brings the tile layer to the bottom of all tile layers.</td>
+ <tr id="marker-zindexoffset">
+ <td><code><b>zIndexOffset</b></code></td>
+ <td><code>Number</code></td>
+ <td><code><span class="number">0</span></code></td>
+ <td>By default, marker images zIndex is set automatically based on its latitude. Use this option if you want to put the marker on top of all others (or below), specifying a high value like <code>1000</code> (or high negative value, respectively).</td>
</tr>
<tr>
- <td><code><b>setOpacity</b>(
- <nobr><Number> <i>opacity</i> )</nobr>
- </code></td>
-
- <td><code><span class="keyword">this</span></code></td>
- <td>Changes the opacity of the tile layer.</td>
+ <td><code><b>opacity</b></code></td>
+ <td><code>Number</code></td>
+ <td><code><span class="number">1.0</span></code></td>
+ <td>The opacity of the marker.</td>
</tr>
<tr>
- <td><code><b>setZIndex</b>(
- <nobr><Number> <i>zIndex</i> )</nobr>
- </code></td>
-
- <td><code><span class="keyword">this</span></code></td>
- <td>Sets the zIndex of the tile layer.</td>
+ <td><code><b>riseOnHover</b></code></td>
+ <td><code>Boolean</code></td>
+ <td><code><span class="literal">false</span></code></td>
+ <td>If <code><span class="literal">true</span></code>, the marker will get on top of others when you hover the mouse over it.</td>
</tr>
<tr>
- <td><code><b>redraw</b>()</code></td>
- <td><code><span class="keyword">this</span></code></td>
- <td>Causes the layer to clear all the tiles and request them again.</td>
+ <td><code><b>riseOffset</b></code></td>
+ <td><code>Number</code></td>
+ <td><code><span class="number">250</span></code></td>
+ <td>The z-index offset used for the <code>riseOnHover</code> feature.</td>
</tr>
<tr>
- <td><code><b>setUrl</b>(
- <nobr><String> <i><a href="#url-template">urlTemplate</a></i> )</nobr>
- </code></td>
- <td><code><span class="keyword">this</span></code></td>
- <td>Updates the layer's URL template and redraws it.</td>
- </tr>
- <tr>
- <td><code><b>getContainer</b>()</nobr>
- </code></td>
- <td><code>HTMLElement</code></td>
- <td>Returns the HTML element that contains the tiles for this layer.</td>
- </tr>
-</table>
-
-
-
-<h2 id="tilelayer-wms">TileLayer.WMS</h2>
-
-<p>Used to display WMS services as tile layers on the map. Extends <a href="#tilelayer">TileLayer</a>.</p>
-
-<h3>Usage example</h3>
-
-<pre><code class="javascript">var nexrad = L.tileLayer.wms("http://mesonet.agron.iastate.edu/cgi-bin/wms/nexrad/n0r.cgi", {
- layers: 'nexrad-n0r-900913',
- format: 'image/png',
- transparent: true,
- attribution: "Weather data © 2012 IEM Nexrad"
-});</code></pre>
-
-<h3>Creation</h3>
-
-<table data-id='tilelayer-wms'>
- <tr>
- <th class="width250">Factory</th>
-
- <th>Description</th>
+ <td><code><b>pane</b></code></td>
+ <td><code>String</code></td>
+ <td><code><span class="string">'markerPane'</span></code></td>
+ <td><a href="#map-panes">Map pane</a> where the markers icon will be added.</td>
</tr>
<tr>
- <td><code><b>L.tileLayer.wms</b>(
- <nobr><String> <i>baseUrl</i></nobr>,
- <nobr><<a href="#tilelayer-wms-options">TileLayer.WMS options</a>> <i>options</i> )</nobr>
-
-
- <td>Instantiates a WMS tile layer object given a base URL of the WMS service and a WMS parameters/options object.</td>
+ <td><code><b>shadowPane</b></code></td>
+ <td><code>String</code></td>
+ <td><code><span class="string">'shadowPane'</span></code></td>
+ <td><a href="#map-panes">Map pane</a> where the markers shadow will be added.</td>
</tr>
</table>
-<h3 id="tilelayer-wms-options">Options</h3>
+<h3>Events</h3>
-<p>Includes all <a href="#tilelayer-options">TileLayer options</a> and additionally:</p>
+<p>You can subscribe to the following events using <a href="#events">these methods</a>.</p>
-<table data-id='tilelayer-wms'>
+<table data-id='marker'>
<tr>
- <th class="width100">Option</th>
- <th class="width100">Type</th>
- <th class="width100">Default</th>
+ <th class="width100">Event</th>
+ <th class="width100">Data</th>
<th>Description</th>
</tr>
<tr>
- <td><code><b>layers</b></code></td>
- <td><code>String</code></td>
- <td><code><span class="string">''</span></code></td>
- <td><b>(required)</b> Comma-separated list of WMS layers to show.</td>
+ <td><code><b>click</b></code></td>
+ <td><code><a href="#mouse-event">MouseEvent</a></code></td>
+ <td>Fired when the user clicks (or taps) the marker.</td>
</tr>
<tr>
- <td><code><b>styles</b></code></td>
- <td><code>String</code></td>
- <td><code><span class="string">''</span></code></td>
- <td>Comma-separated list of WMS styles.</td>
+ <td><code><b>dblclick</b></code></td>
+ <td><code><a href="#mouse-event">MouseEvent</a></code></td>
+ <td>Fired when the user double-clicks (or double-taps) the marker.</td>
</tr>
<tr>
- <td><code><b>format</b></code></td>
- <td><code>String</code></td>
- <td><code><span class="string">'image/jpeg'</span></code></td>
- <td>WMS image format (use <code><span class="string">'image/png'</span></code> for layers with transparency).</td>
+ <td><code><b>mousedown</b></code></td>
+ <td><code><a href="#mouse-event">MouseEvent</a></code></td>
+ <td>Fired when the user pushes the mouse button on the marker.</td>
</tr>
<tr>
- <td><code><b>transparent</b></code></td>
- <td><code>Boolean</code></td>
- <td><code><span class="literal">false</span></code></td>
- <td>If <code><span class="literal">true</span></code>, the WMS service will return images with transparency.</td>
+ <td><code><b>mouseover</b></code></td>
+ <td><code><a href="#mouse-event">MouseEvent</a></code></td>
+ <td>Fired when the mouse enters the marker.</td>
</tr>
<tr>
- <td><code><b>version</b></code></td>
- <td><code>String</code></td>
- <td><code><span class="string">'1.1.1'</span></code></td>
- <td>Version of the WMS service to use.</td>
+ <td><code><b>mouseout</b></code></td>
+ <td><code><a href="#mouse-event">MouseEvent</a></code></td>
+ <td>Fired when the mouse leaves the marker.</td>
</tr>
<tr>
- <td><code><b>crs</b></code></td>
- <td><code><a href="#crs">CRS</a></code></td>
- <td><code><span class="literal">null</span></code></td>
- <td>Coordinate Reference System to use for the WMS requests, defaults to map CRS. Don't change this if you're not sure what it means.</td>
+ <td><code><b>contextmenu</b></code></td>
+ <td><code><a href="#mouse-event">MouseEvent</a></code>
+ <td>Fired when the user right-clicks on the marker.</td>
</tr>
<tr>
- <td><code><b>uppercase</b></code></td>
- <td><code>Boolean</code></td>
- <td><code><span class="literal">false</span></code></td>
- <td>If <code><span class="literal">true</span></code>, WMS request parameter keys will be uppercase.</td>
+ <td><code><b>dragstart</b></code></td>
+ <td><code><a href="#event">Event</a></code></td>
+ <td>Fired when the user starts dragging the marker.</td>
</tr>
-</table>
-
-<h3>Methods</h3>
-
-<table data-id='tilelayer-wms'>
<tr>
- <th>Method</th>
- <th>Returns</th>
- <th>Description</th>
+ <td><code><b>drag</b></code></td>
+ <td><code><a href="#event">Event</a></code></td>
+ <td>Fired repeatedly while the user drags the marker.</td>
</tr>
<tr>
- <td><code><b>setParams</b>(
- <nobr><<a href="#tilelayer-wms-options">WMS parameters</a>> <i>params</i></nobr>,
- <nobr><Boolean> <i>noRedraw?</i> )</nobr>
- </code></td>
- <td><code><span class="keyword">this</span></code></td>
- <td>Merges an object with the new parameters and re-requests tiles on the current screen (unless <code>noRedraw</code> was set to <code><span class="literal">true</span></code>).</td>
+ <td><code><b>dragend</b></code></td>
+ <td><code><a href="#dragend-event">DragEndEvent</a></code></td>
+ <td>Fired when the user stops dragging the marker.</td>
</tr>
-</table>
-
-
-<h2 id="imageoverlay">ImageOverlay</h2>
-
-<p>Used to load and display a single image over specific bounds of the map. Extends <a href="#layer">Layer</a>.</p>
-
-<h3>Usage example</h3>
-
-<pre><code class="javascript">var imageUrl = 'http://www.lib.utexas.edu/maps/historical/newark_nj_1922.jpg',
- imageBounds = [[40.712216, -74.22655], [40.773941, -74.12544]];
-
-L.imageOverlay(imageUrl, imageBounds).addTo(map);</code></pre>
-
-<h3>Creation</h3>
-
-<table data-id='imageoverlay'>
<tr>
- <th class="width250">Factory</th>
-
- <th>Description</th>
+ <td><code><b>move</b></code></td>
+ <td><code><a href="#event">Event</a></code></td>
+ <td>Fired when the marker is moved via setLatLng. Old and new coordinates are included in event arguments as <code>oldLatLng, latlng</code>.</td>
</tr>
<tr>
- <td><code><b>L.ImageOverlay</b>(
- <nobr><String> <i>imageUrl</i></nobr>,
- <nobr><<a href="#latlngbounds">LatLngBounds</a>> <i>bounds</i></nobr>,
- <nobr><<a href="#imageoverlay-options">ImageOverlay options</a>> <i>options?</i> )</nobr>
- </code></td>
-
-
- <td>Instantiates an image overlay object given the URL of the image and the geographical bounds it is tied to.</td>
+ <td><code><b>add</b></code></td>
+ <td><code><a href="#event">Event</a></code></td>
+ <td>Fired when the marker is added to the map.</td>
</tr>
-</table>
-
-<h3 id="imageoverlay-options">Options</h3>
-<table data-id='imageoverlay'>
<tr>
- <th>Option</th>
- <th>Type</th>
- <th class="minwidth">Default</th>
- <th>Description</th>
+ <td><code><b>remove</b></code></td>
+ <td><code><a href="#event">Event</a></code></td>
+ <td>Fired when the marker is removed from the map.</td>
</tr>
<tr>
- <td><code><b>opacity</b></code></td>
- <td><code>Number</code></td>
- <td><code><span class="number">1.0</span></code></td>
- <td>The opacity of the image overlay.</td>
+ <td><code><b>popupopen</b></code></td>
+ <td><code><a href="#popup-event">PopupEvent</a></code></td>
+ <td>Fired when a popup bound to the marker is open.</td>
</tr>
<tr>
- <td><code><b>attribution</b></code></td>
- <td><code>String</code></td>
- <td><code><span class="string">''</span></code></td>
- <td>The attribution text of the image overlay.</td>
+ <td><code><b>popupclose</b></code></td>
+ <td><code><a href="#popup-event">PopupEvent</a></code></td>
+ <td>Fired when a popup bound to the marker is closed.</td>
</tr>
</table>
-<h3 id="imageoverlay-methods">Methods</h3>
-<table data-id='imageoverlay'>
+<h3>Methods</h3>
+
+<p>In addition to <a href="#layers">shared layer methods</a> like <code>addTo()</code> and <code>remove()</code> and <a href="#popups">popup methods</a> like <code>bindPopup()</code> you can also use the following methods:</p>
+
+<table data-id='marker'>
<tr>
<th class="width250">Method</th>
<th>Returns</th>
<th>Description</th>
</tr>
<tr>
- <td><code><b>addTo</b>(
- <nobr><<a href="#map-class">Map</a>> <i>map</i> )</nobr>
+ <td><code><b>getLatLng</b>()</code></td>
+ <td><code><a href="#latlng">LatLng</a></code></td>
+ <td>Returns the current geographical position of the marker.</td>
+ </tr>
+ <tr>
+ <td><code><b>setLatLng</b>(
+ <nobr><<a href="#latlng">LatLng</a>> <i>latlng</i> )</nobr>
</code></td>
<td><code><span class="keyword">this</span></code></td>
- <td>Adds the overlay to the map.</td>
+ <td>Changes the marker position to the given point.</td>
</tr>
<tr>
- <td><code><b>setOpacity</b>(
- <nobr><Number> <i>opacity</i> )</nobr>
+ <td><code><b>setIcon</b>(
+ <nobr><<a href="#icon">Icon</a>> <i>icon</i> )</nobr>
</code></td>
<td><code><span class="keyword">this</span></code></td>
- <td>Sets the opacity of the overlay.</td>
+ <td>Changes the marker icon.</td>
</tr>
<tr>
- <td><code><b>setUrl</b>(
- <nobr><String> <i>imageUrl</i> )</nobr>
+ <td><code><b>setZIndexOffset</b>(
+ <nobr><Number> <i>offset</i> )</nobr>
</code></td>
<td><code><span class="keyword">this</span></code></td>
- <td>Changes the URL of the image.</td>
+ <td>Changes the <a href="#marker-zindexoffset">zIndex offset</a> of the marker.</td>
</tr>
<tr>
- <td><code><b>bringToFront</b>()</code></td>
+ <td><code><b>setOpacity</b>(
+ <nobr><Number> <i>opacity</i> )</nobr>
+ </code></td>
<td><code><span class="keyword">this</span></code></td>
- <td>Brings the layer to the top of all overlays.</td>
+ <td>Changes the opacity of the marker.</td>
</tr>
<tr>
- <td><code><b>bringToBack</b>()</code></td>
+ <td><code><b>update</b>()</nobr>
+ </code></td>
+
<td><code><span class="keyword">this</span></code></td>
- <td>Brings the layer to the bottom of all overlays.</td>
+ <td>Updates the marker position, useful if coordinates of its <code>latLng</code> object were changed directly.</td>
+ </tr>
+ <tr id="marker-togeojson">
+ <td><code><b>toGeoJSON</b>()</code></td>
+ <td><code>Object</code></td>
+ <td>Returns a <a href="http://en.wikipedia.org/wiki/GeoJSON">GeoJSON</a> representation of the marker (GeoJSON Point Feature).</td>
</tr>
</table>
+<h3 id="marker-interaction-handlers">Interaction handlers</h3>
-<h2 id="path">Path</h2>
-<p>An abstract class that contains options and constants shared between vector overlays (Polygon, Polyline, Circle). Do not use it directly. Extends <a href="#layer">Layer</a>.
+<p>Interaction handlers are properties of a marker instance that allow you to control interaction behavior in runtime, enabling or disabling certain features such as dragging (see <a href="#handler">IHandler</a> methods). Example:</p>
-<h3 id="path-options">Options</h3>
-<table data-id='path'>
+<pre><code class="javascript">marker.dragging.disable();</code></pre>
+
+<table data-id='marker'>
<tr>
- <th>Option</th>
- <th>Type</th>
- <th class="minwidth">Default</th>
+ <th class="width100">Property</th>
+ <th class="width100">Type</th>
<th>Description</th>
</tr>
<tr>
- <td><code><b>stroke</b></code></td>
- <td><code>Boolean</code></td>
- <td><code><span class="literal">true</span></code></td>
- <td>Whether to draw stroke along the path. Set it to <code><span class="literal">false</span></code> to disable borders on polygons or circles.</td>
+ <td>dragging</td>
+ <td><a href="#handler"><code>IHandler</code></a></td>
+ <td>Marker dragging handler (by both mouse and touch).</td>
</tr>
+</table>
+
+
+
+<h2 id="popup">Popup</h2>
+
+<p>Used to open popups in certain places of the map. Use <a href="#map-openpopup">Map#openPopup</a> to open popups while making sure that only one popup is open at one time (recommended for usability), or use <a href="#map-addlayer">Map#addLayer</a> to open as many as you want.</p>
+
+<h3>Usage example</h3>
+<p>If you want to just bind a popup to marker click and then open it, it's really easy:</p>
+<pre><code class="javascript">marker.bindPopup(popupContent).openPopup();</code></pre>
+<p>Path overlays like polylines also have a <code>bindPopup</code> method. Here's a more complicated way to open a popup on a map:</p>
+
+<pre><code class="javascript">var popup = L.popup()
+ .setLatLng(latlng)
+ .setContent('<p>Hello world!<br />This is a nice popup.</p>')
+ .openOn(map);</code></pre>
+
+<h3>Creation</h3>
+
+<table data-id='popup'>
<tr>
- <td><code><b>color</b></code></td>
- <td><code>String</code></td>
- <td><code><span class="string">'#3388ff'</span></code></td>
- <td>Stroke color.</td>
+ <th>Factory</th>
+
+ <th>Description</th>
</tr>
<tr>
- <td><code><b>weight</b></code></td>
+ <td><code><b>L.popup</b>(
+ <nobr><<a href="#popup-options">Popup options</a>> <i>options?</i>,</nobr>
+ <nobr><<a href="#layer">Layer</a>> <i>source?</i> )</nobr>
+ </code></td>
+
+
+ <td>Instantiates a Popup object given an optional options object that describes its appearance and location and an optional source object that is used to tag the popup with a reference to the Layer to which it refers.</td>
+ </tr>
+</table>
+
+<h3 id="popup-options">Options</h3>
+
+<table data-id='popup'>
+ <tr>
+ <th>Option</th>
+ <th>Type</th>
+ <th>Default</th>
+ <th>Description</th>
+ </tr>
+ <tr>
+ <td><code><b>maxWidth</b></code></td>
<td><code>Number</code></td>
- <td><code><span class="number">3</span></code></td>
- <td>Stroke width in pixels.</td>
+ <td><code><span class="number">300</span></code></td>
+ <td>Max width of the popup.</td>
</tr>
<tr>
- <td><code><b>opacity</b></code></td>
+ <td><code><b>minWidth</b></code></td>
<td><code>Number</code></td>
- <td><code><span class="number">1</span></code></td>
- <td>Stroke opacity.</td>
+ <td><code><span class="number">50</span></code></td>
+ <td>Min width of the popup.</td>
</tr>
<tr>
- <td><code><b>fill</b></code></td>
+ <td><code><b>maxHeight</b></code></td>
+ <td><code>Number</code></td>
+ <td><code><span class="literal">null</span></code></td>
+ <td>If set, creates a scrollable container of the given height inside a popup if its content exceeds it.</td>
+ </tr>
+ <tr>
+ <td><code><b>autoPan</b></code></td>
<td><code>Boolean</code></td>
- <td>depends</td>
- <td>Whether to fill the path with color. Set it to <code><span class="literal">false</span></code> to disable filling on polygons or circles.</td>
+ <td><code><span class="literal">true</span></code></td>
+ <td>Set it to <code><span class="literal">false</span></code> if you don't want the map to do panning animation to fit the opened popup.</td>
</tr>
<tr>
- <td><code><b>fillColor</b></code></td>
- <td><code>String</code></td>
- <td>same as color</td>
- <td>Fill color.</td>
+ <td><code><b>keepInView</b></code></td>
+ <td><code>Boolean</code></td>
+ <td><code><span class="literal">false</span></code></td>
+ <td>Set it to <code><span class="literal">true</span></code> if you want to prevent users from panning the popup off of the screen while it is open.</td>
</tr>
<tr>
- <td><code><b>fillOpacity</b></code></td>
- <td><code>Number</code></td>
- <td><code><span class="number">0.2</span></code></td>
- <td>Fill opacity.</td>
+ <td><code><b>closeButton</b></code></td>
+ <td><code>Boolean</code></td>
+ <td><code><span class="literal">true</span></code></td>
+ <td>Controls the presense of a close button in the popup.</td>
</tr>
<tr>
- <td><code><b>fillRule</b></code></td>
- <td><code>String</code></td>
- <td><code><span class="string">'evenodd'</span></code></td>
- <td>A string that defines <a href="https://developer.mozilla.org/docs/Web/SVG/Attribute/fill-rule">how the inside of a shape</a> is determined.</td>
+ <td><code><b>offset</b></code></td>
+ <td><code><a href="#point">Point</a></code></td>
+ <td><code><nobr>Point(<span class="number">0</span>, <span class="number">6</span>)</nobr>
+ </code></td>
+ <td>The offset of the popup position. Useful to control the anchor of the popup when opening it on some overlays.</td>
</tr>
<tr>
- <td><code><b>dashArray</b></code></td>
- <td><code>String</code></td>
+ <td><code><b>autoPanPaddingTopLeft</b></code></td>
+ <td><code><a href="#point">Point</a></code></td>
<td><code><span class="literal">null</span></code></td>
- <td>A string that defines the stroke <a href="https://developer.mozilla.org/en/SVG/Attribute/stroke-dasharray">dash pattern</a>. Doesn't work on canvas-powered layers (e.g. Android 2).</td>
+ </code></td>
+ <td>The margin between the popup and the top left corner of the map view after autopanning was performed.</td>
</tr>
<tr>
- <td><code><b>lineCap</b></code></td>
- <td><code>String</code></td>
- <td><code><span class="string">'round'</span></code></td>
- <td>A string that defines <a href="https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/stroke-linecap">shape to be used at the end</a> of the stroke.</td>
+ <td><code><b>autoPanPaddingBottomRight</b></code></td>
+ <td><code><a href="#point">Point</a></code></td>
+ <td><code><span class="literal">null</span></code></td>
+ </code></td>
+ <td>The margin between the popup and the bottom right corner of the map view after autopanning was performed.</td>
</tr>
<tr>
- <td><code><b>lineJoin</b></code></td>
- <td><code>String</code></td>
- <td><code><span class="string">'round'</span></code></td>
- <td>A string that defines <a href="https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/stroke-linejoin">shape to be used at the corners</a> of the stroke.</td>
+ <td><code><b>autoPanPadding</b></code></td>
+ <td><code><a href="#point">Point</a></code></td>
+ <td><code><nobr>Point(<span class="number">5</span>, <span class="number">5</span>)</nobr>
+ </code></td>
+ <td>Equivalent of setting both top left and bottom right autopan padding to the same value.</td>
</tr>
<tr>
- <td><code><b>interactive</b></code></td>
+ <td><code><b>zoomAnimation</b></code></td>
<td><code>Boolean</code></td>
<td><code><span class="literal">true</span></code></td>
- <td>If <code><span class="literal">false</span></code>, the vector will not emit mouse events and will act as a part of the underlying map.</td>
- </tr>
- <tr>
- <td><code><b>renderer</b></code></td>
- <td><code>Renderer</code></td>
- <td><code>depends</code></td>
- <td><code>L.SVG</code> or <code>L.Canvas</code> by default depending on browser support.</td>
+ <td>Whether to animate the popup on zoom. Disable it if you have problems with Flash content inside popups.</td>
</tr>
<tr>
- <td><code><b>pointerEvents</b></code></td>
- <td><code>String</code></td>
+ <td><code><b>closeOnClick</b></code></td>
+ <td><code>Boolean</code></td>
<td><code><span class="literal">null</span></code></td>
- <td>Sets the <code>pointer-events</code> attribute on the path if SVG renderer is used.</td>
+ <td>Set it to <code><span class="literal">false</span></code> if you want to override the default behavior of the popup closing when user clicks the map (set globally by the <code>Map</code> <code>closePopupOnClick</code> option).</td>
</tr>
<tr>
<td><code><b>className</b></code></td>
<td><code>String</code></td>
- <td><code><span class="string">''</span></code></td>
- <td>Custom class name set on an element.</td>
+ <td><code class="javascript"><span class="string">''</span></code></td>
+ <td>A custom class name to assign to the popup.</td>
</tr>
</table>
<h3>Events</h3>
-<p>You can subscribe to the following events using <a href="#events">these methods</a>.</p>
-
-<table data-id='path'>
+<table data-id='popup'>
<tr>
- <th class="width100">Event</th>
- <th class="width100">Data</th>
+ <th>Event</th>
+ <th>Data</th>
<th>Description</th>
</tr>
<tr>
- <td><code><b>click</b></code></td>
- <td><code><a href="#mouse-event">MouseEvent</a></code></td>
- <td>Fired when the user clicks (or taps) the object.</td>
- </tr>
- <tr>
- <td><code><b>dblclick</b></code></td>
- <td><code><a href="#mouse-event">MouseEvent</a></code></td>
- <td>Fired when the user double-clicks (or double-taps) the object.</td>
- </tr>
- <tr>
- <td><code><b>mousedown</b></code></td>
- <td><code><a href="#mouse-event">MouseEvent</a></code></td>
- <td>Fired when the user pushes the mouse button on the object.</td>
- </tr>
- <tr>
- <td><code><b>mouseover</b></code></td>
- <td><code><a href="#mouse-event">MouseEvent</a></code></td>
- <td>Fired when the mouse enters the object.</td>
- </tr>
- <tr>
- <td><code><b>mouseout</b></code></td>
- <td><code><a href="#mouse-event">MouseEvent</a></code></td>
- <td>Fired when the mouse leaves the object.</td>
- </tr>
- <tr>
- <td><code><b>contextmenu</b></code></td>
- <td><code><a href="#mouse-event">MouseEvent</a></code></td>
- <td>Fired when the user pushes the right mouse button on the object, prevents default browser context menu from showing if there are listeners on this event.</td>
- </tr>
- <tr>
<td><code><b>add</b></code></td>
- <td><code><a href="#event">Event</a></code>
- <td>Fired when the path is added to the map.</td>
- </tr>
- <tr>
- <td><code><b>remove</b></code></td>
- <td><code><a href="#event">Event</a></code></td>
- <td>Fired when the path is removed from the map.</td>
- </tr>
- <tr>
- <td><code><b>popupopen</b></code></td>
<td><code><a href="#popup-event">PopupEvent</a></code></td>
- <td>Fired when a popup bound to the path is open.</td>
+ <td>Fired when the popup is added to the map.</td>
</tr>
<tr>
- <td><code><b>popupclose</b></code></td>
+ <td><code><b>remove</b></code></td>
<td><code><a href="#popup-event">PopupEvent</a></code></td>
- <td>Fired when a popup bound to the path is closed.</td>
+ <td>Fired when the popup is removed from the map.</td>
</tr>
</table>
-<h3 id="path-methods">Methods</h3>
+<h3>Methods</h3>
-<p>In addition to <a href="#layers">shared layer methods</a> like <code>addTo()</code> and <code>remove()</code> and <a href="#popups">popup methods</a> like <code>bindPopup()</code> you can also use the following methods:</p>
+<p>In addition to <a href="#layers">shared layer methods</a> like <code>addTo()</code> and <code>remove()</code> you can also use the following methods:</p>
-<table data-id='path'>
+<table data-id='popup'>
<tr>
<th class="width250">Method</th>
- <th>Returns</th>
+ <th class="minwidth">Returns</th>
<th>Description</th>
</tr>
- <tr id="path-openpopup">
- <td><code><b>openPopup</b>(
- <nobr><<a href="#latlng">LatLng</a>> <i>latlng?</i> )</nobr>
+ <tr>
+ <td><code><b>openOn</b>(
+ <nobr><<a href="#map-class">Map</a>> <i>map</i> )</nobr>
</code></td>
<td><code><span class="keyword">this</span></code></td>
- <td>Opens the popup previously bound by the <a href="#path-bindpopup">bindPopup</a> method in the given point, or in one of the path's points if not specified.</td>
+ <td>Adds the popup to the map and closes the previous one. The same as <code>map.openPopup(popup)</code>.</td>
</tr>
- <tr id="path-setstyle">
- <td><code><b>setStyle</b>(
- <nobr><<a href="#path-options">Path options</a>> <i>object</i> )</nobr>
+ <tr>
+ <td><code><b>setLatLng</b>(
+ <nobr><<a href="#latlng">LatLng</a>> <i>latlng</i> )</nobr>
</code></td>
<td><code><span class="keyword">this</span></code></td>
- <td>Changes the appearance of a Path based on the options in the <a href="#path-options">Path options</a> object.</td>
+ <td>Sets the geographical point where the popup will open.</td>
</tr>
- <tr id="path-getbounds">
- <td><code><b>getBounds</b>()</code></td>
- <td><code><a href="#latlngbounds">LatLngBounds</a></code></td>
- <td>Returns the LatLngBounds of the path.</td>
+ <tr>
+ <td><code><b>getLatLng</b>()</code></td>
+ <td><code><a href="#latlng">LatLng</a></code></td>
+ <td>Returns the geographical point of popup.</td>
</tr>
<tr>
- <td><code><b>bringToFront</b>()</code></td>
+ <td><code><b>setContent</b>(
+ <nobr><String|HTMLElement|Function> <i>htmlContent</i> )</nobr>
+ </code></td>
+
<td><code><span class="keyword">this</span></code></td>
- <td>Brings the layer to the top of all path layers.</td>
+ <td>Sets the HTML content of the popup. If a function is passed the source layer will be passed to the function. The function should return a <code>String</code> or <code>HTMLElement</code> to be used in the popup.</td>
</tr>
<tr>
- <td><code><b>bringToBack</b>()</code></td>
- <td><code><span class="keyword">this</span></code></td>
- <td>Brings the layer to the bottom of all path layers.</td>
+ <td><code><b>getContent</b>()</code></td>
+ <td><code><String|HTMLElement></code></td>
+ <td>Returns the content of the popup.</td>
</tr>
<tr>
- <td><code><b>redraw</b>()</code></td>
+ <td><code><b>update</b>()</code></td>
+
<td><code><span class="keyword">this</span></code></td>
- <td>Redraws the layer. Sometimes useful after you changed the coordinates that the path uses.</td>
+ <td>Updates the popup content, layout and position. Useful for updating the popup after something inside changed, e.g. image loaded.</td>
</tr>
</table>
-<h3>Static properties</h3>
-<table data-id='path'>
- <tr>
- <th>Constant</th>
- <th>Type</th>
- <th>Value</th>
- <th>Description</th>
- </tr>
- <tr>
- <td><code>SVG</code></td>
- <td><code>Boolean</code></td>
- <td>depends</td>
- <td>True if SVG is used for vector rendering (true for most modern browsers).</td>
- </tr>
- <tr>
- <td><code>VML</code></td>
- <td><code>Boolean</code></td>
- <td>depends</td>
- <td>True if VML is used for vector rendering (IE 6-8).</td>
- </tr>
- <tr>
- <td><code>CANVAS</code></td>
- <td><code>Boolean</code></td>
- <td>depends</td>
- <td>True if Canvas is used for vector rendering (Android 2). You can also force this by setting global variable <code>L_PREFER_CANVAS</code> to <code><span class="literal">true</span></code> <em>before</em> the Leaflet include on your page — sometimes it can increase performance dramatically when rendering thousands of circle markers, but currently suffers from a bug that causes removing such layers to be extremely slow.</td>
- </tr>
- <tr>
- <td><code>CLIP_PADDING</code></td>
- <td><code>Number</code></td>
- <td><nobr><code><span class="number">0.5</span></code> for SVG</nobr><br /><nobr><code><span class="number">0.02</span></code> for VML</nobr></td>
- <td>How much to extend the clip area around the map view (relative to its size, e.g. 0.5 is half the screen in each direction). Smaller values mean that you will see clipped ends of paths while you're dragging the map, and bigger values decrease drawing performance.</td>
- </tr>
-</table>
-<h2 id="polyline">Polyline</h2>
+<h2 id="tilelayer">TileLayer</h2>
-<p>A class for drawing polyline overlays on a map. Extends <a href="#path">Path</a>. Use <a href="#map-addlayer">Map#addLayer</a> to add it to the map.</p>
+<p>Used to load and display tile layers on the map. Extends <a href="#layer">Layer</a>.</p>
<h3>Usage example</h3>
-<pre><code class="javascript">// create a red polyline from an array of LatLng points
-var latlngs = [
- [-122.68, 45.51],
- [-122.43, 37.77],
- [-118.2, 34.04]
-];
-
-var polyline = L.polyline(latlngs, {color: 'red'}).addTo(map);
-
-// zoom the map to the polyline
-map.fitBounds(polyline.getBounds());</code></pre>
-
... etc. - the rest is truncated
More information about the Libreoffice-commits
mailing list