[Libreoffice-commits] online.git: loleaflet/build loleaflet/debug loleaflet/dist loleaflet/src
Ozcan Esen
ozcan.esen at collabora.com
Tue Dec 22 05:04:56 PST 2015
loleaflet/build/deps.js | 7 +
loleaflet/debug/document/document_simple_example.html | 2
loleaflet/dist/images/deletepage.png |binary
loleaflet/dist/images/duplicatepage.png |binary
loleaflet/dist/images/insertpage.png |binary
loleaflet/src/control/Control.PartsPreview.js | 82 +++++++++----
loleaflet/src/control/Control.Presentation.js | 107 ++++++++++++++++++
7 files changed, 174 insertions(+), 24 deletions(-)
New commits:
commit e78d65c199f23766a035cd9cf181e449e38e6e33
Author: Ozcan Esen <ozcan.esen at collabora.com>
Date: Tue Dec 22 14:47:36 2015 +0200
loleaflet: add presentation controls
Change-Id: Ied2c8d0700d95ad628ad9634b1736839c90bd313
diff --git a/loleaflet/build/deps.js b/loleaflet/build/deps.js
index 1cc21bf..b525cbf 100644
--- a/loleaflet/build/deps.js
+++ b/loleaflet/build/deps.js
@@ -281,6 +281,13 @@ var deps = {
heading: 'Controls',
desc: 'Parts preview sidebar'
},
+
+ ControlPresentation: {
+ src: ['control/Control.js',
+ 'control/Control.Presentation.js'],
+ heading: 'Controls',
+ desc: 'Common commands for slides.'
+ },
ControlColumnHeader: {
src: ['control/Control.js',
diff --git a/loleaflet/debug/document/document_simple_example.html b/loleaflet/debug/document/document_simple_example.html
index 861b05f..744be8c 100644
--- a/loleaflet/debug/document/document_simple_example.html
+++ b/loleaflet/debug/document/document_simple_example.html
@@ -97,5 +97,7 @@
globalMap.addControl(L.control.tabs());
globalMap.addControl(L.control.columnHeader());
globalMap.addControl(L.control.rowHeader());
+ globalMap.addControl(L.control.presentation());
+
</script>
</body></html>
diff --git a/loleaflet/dist/images/deletepage.png b/loleaflet/dist/images/deletepage.png
new file mode 100644
index 0000000..e12688a
Binary files /dev/null and b/loleaflet/dist/images/deletepage.png differ
diff --git a/loleaflet/dist/images/duplicatepage.png b/loleaflet/dist/images/duplicatepage.png
new file mode 100644
index 0000000..234a362
Binary files /dev/null and b/loleaflet/dist/images/duplicatepage.png differ
diff --git a/loleaflet/dist/images/insertpage.png b/loleaflet/dist/images/insertpage.png
new file mode 100644
index 0000000..612251d
Binary files /dev/null and b/loleaflet/dist/images/insertpage.png differ
diff --git a/loleaflet/src/control/Control.PartsPreview.js b/loleaflet/src/control/Control.PartsPreview.js
index 9630373..df9a36f 100644
--- a/loleaflet/src/control/Control.PartsPreview.js
+++ b/loleaflet/src/control/Control.PartsPreview.js
@@ -10,13 +10,15 @@ L.Control.PartsPreview = L.Control.extend({
onAdd: function (map) {
this._previewInitialized = false;
- this._previewTiles = {};
+ this._previewTiles = [];
var docContainer = map.options.documentContainer;
this._partsPreviewCont = L.DomUtil.create('div', 'parts-preview', docContainer.parentElement);
map.on('updateparts', this._updateDisabled, this);
map.on('updatepart', this._updatePart, this);
map.on('tilepreview', this._updatePreview, this);
+ map.on('insertpage', this._insertPreview, this);
+ map.on('deletepage', this._deletePreview, this);
},
_updateDisabled: function (e) {
@@ -38,38 +40,39 @@ L.Control.PartsPreview = L.Control.extend({
$('.scroll-container').mCustomScrollbar('update');
}, this), 500);
for (var i = 0; i < parts; i++) {
- var id = 'preview-tile' + i;
- var frame = L.DomUtil.create('div', 'preview-frame', this._partsPreviewCont);
- L.DomUtil.create('span', 'preview-helper', frame);
- var imgClassName = 'preview-img';
- if (i == 0) {
- imgClassName += ' preview-img-selected';
- }
- var img = L.DomUtil.create('img', imgClassName, frame);
- img.id = id;
- this._previewTiles[id] = img;
- L.DomEvent
- .on(img, 'click', L.DomEvent.stopPropagation)
- .on(img, 'click', L.DomEvent.stop)
- .on(img, 'click', this._setPart, this)
- .on(img, 'click', this._refocusOnMap, this);
- this._map.getPreview(i, i, 180, 180, {autoUpdate: this.options.autoUpdate});
+ this._previewTiles.push(this._createPreview(i));
}
+ L.DomUtil.addClass(this._previewTiles[selectedPart], 'preview-img-selected');
this._previewInitialized = true;
}
else
{
// change the border style of the selected preview.
for (var i = 0; i < parts; i++) {
- var img = L.DomUtil.get('preview-tile' + i);
- L.DomUtil.removeClass(img, 'preview-img-selected');
+ L.DomUtil.removeClass(this._previewTiles[i], 'preview-img-selected');
}
- var img = L.DomUtil.get('preview-tile' + selectedPart);
- L.DomUtil.addClass(img, 'preview-img-selected');
+ L.DomUtil.addClass(this._previewTiles[selectedPart], 'preview-img-selected');
}
}
},
+ _createPreview: function (i) {
+ var id = 'preview-tile' + i;
+ var frame = L.DomUtil.create('div', 'preview-frame', this._partsPreviewCont);
+ L.DomUtil.create('span', 'preview-helper', frame);
+ var imgClassName = 'preview-img';
+ var img = L.DomUtil.create('img', imgClassName, frame);
+ img.id = id;
+ L.DomEvent
+ .on(img, 'click', L.DomEvent.stopPropagation)
+ .on(img, 'click', L.DomEvent.stop)
+ .on(img, 'click', this._setPart, this)
+ .on(img, 'click', this._refocusOnMap, this);
+ this._map.getPreview(i, i, 180, 180, {autoUpdate: this.options.autoUpdate});
+
+ return img;
+ },
+
_setPart: function (e) {
var part = e.target.id.match(/\d+/g)[0];
if (part !== null) {
@@ -84,10 +87,9 @@ L.Control.PartsPreview = L.Control.extend({
},
_updatePreview: function (e) {
- var id = 'preview-tile' + e.id;
// the scrollbar has to be re-initialized here else it doesn't work
// probably a bug from the scrollbar
- this._previewTiles[id].onload = function () {
+ this._previewTiles[e.id].onload = function () {
$('.parts-preview').mCustomScrollbar({
axis: 'y',
theme: 'dark-thick',
@@ -95,7 +97,39 @@ L.Control.PartsPreview = L.Control.extend({
alwaysShowScrollbar: 1});
};
- this._previewTiles[id].src = e.tile;
+ this._previewTiles[e.id].src = e.tile;
+ },
+
+ _updatePreviewIds: function () {
+ // TO DO: preview-tileX prefix is unneccessary, can be removed completely
+ // since we have them in this._previewTiles[]
+ for (var i=0; i < this._previewTiles.length; i++) {
+ this._previewTiles[i].id = 'preview-tile' + i;
+ }
+ $('.parts-preview').mCustomScrollbar('update');
+ },
+
+ _insertPreview: function (e) {
+ var newIndex = e.selectedPart + 1;
+ var newPreview = this._createPreview(newIndex);
+
+ // insert newPreview to newIndex position
+ this._previewTiles.splice(newIndex, 0, newPreview);
+
+ var selectedFrame = this._previewTiles[e.selectedPart].parentNode;
+ var newFrame = newPreview.parentNode;
+
+ // insert after selectedFrame
+ selectedFrame.parentNode.insertBefore(newFrame, selectedFrame.nextSibling);
+ this._updatePreviewIds();
+ },
+
+ _deletePreview: function (e) {
+ var selectedFrame = this._previewTiles[e.selectedPart].parentNode;
+ L.DomUtil.remove(selectedFrame);
+
+ this._previewTiles.splice(e.selectedPart, 1);
+ this._updatePreviewIds();
}
});
diff --git a/loleaflet/src/control/Control.Presentation.js b/loleaflet/src/control/Control.Presentation.js
new file mode 100644
index 0000000..944d51c
--- /dev/null
+++ b/loleaflet/src/control/Control.Presentation.js
@@ -0,0 +1,107 @@
+/*
+ * L.Control.Presentation is used for common commands for slides.
+ */
+
+L.Control.Presentation = L.Control.extend({
+ options: {
+ position: 'topleft',
+ },
+
+ onAdd: function (map) {
+ var buttonsName = 'leaflet-control-presentation',
+ container = L.DomUtil.create('div', buttonsName + '-container' + ' leaflet-bar');
+
+ this._buttons = {
+ 'insertpage': {title: 'Insert Page', uno: 'InsertPage', iconName: 'insertpage.png'},
+ 'duplicatepage': {title: 'Duplicate Page', uno: 'DuplicatePage', iconName: 'duplicatepage.png'},
+ 'deletepage': {title: 'Delete Page', uno: 'DeletePage', iconName: 'deletepage.png'},
+ }
+
+ for (var key in this._buttons) {
+ var button = this._buttons[key];
+ button.el = this._createButton(key, button.title, button.iconName,
+ buttonsName, container, this._onButtonClick);
+ }
+
+ map.on('updateparts', this._updateDisabled, this)
+
+ return container;
+ },
+
+ _updateDisabled: function (e) {
+ if (e.docType === 'presentation') {
+ return;
+ }
+
+ for (var key in this._buttons) {
+ var button = this._buttons[key];
+ L.DomUtil.addClass(button.el, 'leaflet-disabled');
+ L.DomUtil.addClass(button.el, 'leaflet-control-buttons-disabled');
+ }
+ },
+
+ _createButton: function (id, title, iconName, className, container, fn) {
+ var link = L.DomUtil.create('a', className, container);
+ link.href = '#';
+ link.title = title;
+ var img = L.DomUtil.create('img', className, link);
+ img.id = id;
+ img.src = L.Icon.Default.imagePath + '/' + iconName;
+
+ L.DomEvent
+ .on(link, 'mousedown dblclick', L.DomEvent.stopPropagation)
+ .on(link, 'click', L.DomEvent.stop)
+ .on(link, 'click', fn, this)
+ .on(link, 'click', this._refocusOnMap, this);
+
+ return link;
+ },
+
+ _onButtonClick: function (e) {
+ if (L.DomUtil.hasClass(e.target.parentNode, 'leaflet-disabled')) {
+ return;
+ }
+ var id = e.target.id;
+ var button = this._buttons[id];
+ var docLayer = this._map._docLayer;
+
+ // TO DO: Deleting all the pages causes problem.
+ if (id === 'deletepage' && docLayer._parts === 1) {
+ return;
+ }
+
+ if (button.uno) {
+ L.Socket.sendMessage('uno .uno:' + button.uno);
+ }
+
+ // TO DO: We should fire these events after server response
+ // Unfortunately server does not send any response.
+ if (id === 'insertpage' || id === 'duplicatepage') {
+ this._map.fire('insertpage', {
+ selectedPart: docLayer._selectedPart,
+ parts: docLayer._parts,
+ });
+
+ docLayer._parts++;
+ this._map.setPart('next');
+ }
+ else if (id === 'deletepage') {
+ this._map.fire('deletepage', {
+ selectedPart: docLayer._selectedPart,
+ parts: docLayer._parts,
+ });
+
+ docLayer._parts--;
+
+ if (docLayer._selectedPart >= docLayer._parts) {
+ docLayer._selectedPart--;
+ }
+
+ this._map.setPart(docLayer._selectedPart);
+ }
+ },
+});
+
+L.control.presentation = function (options) {
+ return new L.Control.Presentation(options);
+};
More information about the Libreoffice-commits
mailing list