[Libreoffice-commits] online.git: loleaflet/build loleaflet/dist loleaflet/src
Henry Castro
hcastro at collabora.com
Sun Nov 8 08:35:09 PST 2015
loleaflet/build/deps.js | 14 +++
loleaflet/dist/leaflet.css | 104 ++++++++++++++++++++++++++
loleaflet/src/control/Control.ColumnHeader.js | 64 ++++++++++++++++
loleaflet/src/control/Control.RowHeader.js | 61 +++++++++++++++
4 files changed, 243 insertions(+)
New commits:
commit fd6d0c2b53c862303c1f3f4244d7f16258a53dfd
Author: Henry Castro <hcastro at collabora.com>
Date: Sun Nov 8 12:29:58 2015 -0400
loleaflet: add ColumnHeader and RowHeader controls
Column and Row headers for spreadsheet documents, based
on html table tag
diff --git a/loleaflet/build/deps.js b/loleaflet/build/deps.js
index c9b3d1a..017b6bb 100644
--- a/loleaflet/build/deps.js
+++ b/loleaflet/build/deps.js
@@ -282,6 +282,20 @@ var deps = {
desc: 'Parts preview sidebar'
},
+ ControlColumnHeader: {
+ src: ['control/Control.js',
+ 'control/Control.ColumnHeader.js'],
+ heading: 'Controls',
+ desc: 'Column Header bar'
+ },
+
+ ControlRowHeader: {
+ src: ['control/Control.js',
+ 'control/Control.RowHeader.js'],
+ heading: 'Controls',
+ desc: 'Row Header bar'
+ },
+
ControlTabs: {
src: ['control/Control.js',
'control/Control.Tabs.js'],
diff --git a/loleaflet/dist/leaflet.css b/loleaflet/dist/leaflet.css
index 033e8ab..af534ee 100644
--- a/loleaflet/dist/leaflet.css
+++ b/loleaflet/dist/leaflet.css
@@ -733,9 +733,113 @@ a.leaflet-control-buttons:hover:first-child {
}
.spreadsheet-document {
+ border-top: 1px solid #B6B6B6 !important;
+ top: 100px !important;
+ left: 50px !important;
bottom: 20px !important;
}
+.spreadsheet-container-column {
+ position: absolute;
+ left: 0px;
+ top: 80px;
+ width: 100%;
+ height: 20px;
+ margin: 0px;
+ padding: 0px;
+ border-width: 0px;
+ overflow: hidden;
+}
+
+.spreadsheet-container-table {
+ table-layout: fixed;
+ width: 100%;
+ height: 100%;
+ border-spacing: 0px;
+ border-collapse: collapse;
+ border-width: 0px;
+ margin: 0px;
+ padding: 0px;
+}
+
+.spreadsheet-container-th-corner {
+ border: 1px solid black;
+ background-color: darkgrey;
+ padding: 0px;
+ margin: 0px;
+ border-width: 1px;
+ width: 47px; /* 50px - 2px (border) - 1px (border-collapse)*/
+ height: 19px;
+}
+
+.spreadsheet-container-th-column {
+ padding: 0px;
+ margin: 0px;
+ border-width: 0px;
+}
+
+.spreadsheet-container-column-inner {
+ width: 100%;
+ height: 100%;
+ overflow: hidden;
+}
+
+#spreadsheet-table-column {
+ table-layout: fixed;
+ left: 0px;
+ width: 100%;
+ height: 100%;
+ border-spacing: 0px !important;
+ border-collapse: collapse !important;
+ position: relative;
+ margin: 0px;
+ padding: 0px;
+}
+
+.spreadsheet-table-column-cell {
+ border: 1px solid black;
+ background-color: darkgrey;
+ overflow: hidden;
+ min-width: 1px;
+ text-overflow: ellipsis;
+ white-space: nowrap;
+ font-size: 90%;
+ padding: 0px;
+ margin: 0px;
+}
+
+.spreadsheet-container-row {
+ position: absolute;
+ left: 0;
+ top: 100px;
+ width: 50px;
+ bottom: 20px;
+ overflow: hidden;
+}
+
+.spreadsheet-container-row-inner {
+ width: 100%;
+}
+
+#spreadsheet-table-row {
+ table-layout: fixed;
+ width: 100%;
+ height: 100%;
+ border-spacing: 0px !important;
+ border-collapse: collapse !important;
+ position: relative;
+}
+
+.spreadsheet-table-row-cell {
+ border: 1px solid black;
+ background-color: darkgrey;
+ white-space: nowrap;
+ text-overflow: ellipsis;
+ font-size: 90%;
+ padding: 0px;
+ margin: 0px;
+}
+
.spreadsheet-tab {
margin: 0;
padding: 0;
diff --git a/loleaflet/src/control/Control.ColumnHeader.js b/loleaflet/src/control/Control.ColumnHeader.js
new file mode 100644
index 0000000..7280bc2
--- /dev/null
+++ b/loleaflet/src/control/Control.ColumnHeader.js
@@ -0,0 +1,64 @@
+/*
+* Control.ColumnHeader
+*/
+
+L.Control.ColumnHeader = L.Control.extend({
+ onAdd: function (map) {
+ var docContainer = L.DomUtil.get('document-container');
+ var divHeader = L.DomUtil.create('div', 'spreadsheet-container-column', docContainer.parentElement);
+ var tableContainer = L.DomUtil.create('table', 'spreadsheet-container-table', divHeader);
+ var tbodyContainer = L.DomUtil.create('tbody', '', tableContainer);
+ var trContainer = L.DomUtil.create('tr', '', tbodyContainer);
+ L.DomUtil.create('th', 'spreadsheet-container-th-corner', trContainer);
+ var thColumns = L.DomUtil.create('th', 'spreadsheet-container-th-column', trContainer);
+ var divInner = L.DomUtil.create('div', 'spreadsheet-container-column-inner', thColumns);
+ this._table = L.DomUtil.create('table', '', divInner);
+ this._table.id = 'spreadsheet-table-column';
+ L.DomUtil.create('tbody', '', this._table);
+ this._columns = L.DomUtil.create('tr','', this._table.firstChild);
+
+ // dummy initial header
+ L.DomUtil.create('th','spreadsheet-table-column-cell', this._columns);
+
+ return document.createElement('div');
+ },
+
+ clearColumns : function () {
+ L.DomUtil.remove(this._columns);
+ this._columns = L.DomUtil.create('tr', '', this._table.firstChild);
+ },
+
+ offsetColumn: function (point) {
+ L.DomUtil.setStyle(this._table, 'left', point + 'px');
+ },
+
+ fillColumns: function (columns, converter, context) {
+ var twip, width, column;
+
+ this.clearColumns();
+ for (iterator = 0; iterator < columns.length; iterator++) {
+ twip = new L.Point(parseInt(columns[iterator].size),
+ parseInt(columns[iterator].size));
+ width = Math.round(converter.call(context, twip).x) - 1;
+ column = L.DomUtil.create('th', 'spreadsheet-table-column-cell', this._columns);
+ column.innerHTML = columns[iterator].text;
+ column.twipWidth = columns[iterator].size;
+ column.width = width + "px";
+ }
+ },
+
+ updateColumns: function (converter, context) {
+ var iterator, twip, width, column;
+ for (iterator = 0; iterator < this._columns.childNodes.length; iterator++) {
+ column = this._columns.childNodes[iterator];
+ twip = new L.Point(parseInt(column.twipWidth),
+ parseInt(column.twipWidth));
+ width = Math.round(converter.call(context, twip).x) - 1;
+ column.width = width + "px";
+ }
+ }
+})
+
+L.control.columnHeader = function (options) {
+ return new L.Control.ColumnHeader(options);
+};
diff --git a/loleaflet/src/control/Control.RowHeader.js b/loleaflet/src/control/Control.RowHeader.js
new file mode 100644
index 0000000..141527f
--- /dev/null
+++ b/loleaflet/src/control/Control.RowHeader.js
@@ -0,0 +1,61 @@
+/*
+ * L.Control.RowHeader
+*/
+
+L.Control.RowHeader = L.Control.extend({
+ onAdd: function (map) {
+ var docContainer = L.DomUtil.get('document-container');
+ var divRowHeader = L.DomUtil.create('div', 'spreadsheet-container-row', docContainer.parentElement);
+ var divRowInner = L.DomUtil.create('div', 'spreadsheet-container-row-inner', divRowHeader);
+ this._table = L.DomUtil.create('table', '', divRowInner);
+ this._table.id = 'spreadsheet-table-row';
+ this._rows = L.DomUtil.create('tbody', '', this._table);
+
+ // dummy initial row header
+ var row = L.DomUtil.create('tr', '', this._rows);
+ L.DomUtil.create('th','spreadsheet-table-row-cell', row);
+
+ return document.createElement('div');
+ },
+
+ clearRows: function () {
+ L.DomUtil.remove(this._rows);
+ this._rows = L.DomUtil.create('tbody', '', this._table);
+ },
+
+ offsetRow: function (value) {
+ L.DomUtil.setStyle(this._table, 'top', value + 'px');
+ },
+
+ fillRows: function (rows, converter, context) {
+ var iterator, twip, height, row, cell;
+
+ this.clearRows();
+ for (iterator = 0; iterator < rows.length; iterator++) {
+ twip = new L.Point(parseInt(rows[iterator].size),
+ parseInt(rows[iterator].size));
+ height = Math.round(converter.call(context, twip).y) - 2;
+ row = L.DomUtil.create('tr', '', this._rows);
+ cell = L.DomUtil.create('th', 'spreadsheet-table-row-cell', row);
+ cell.innerHTML = rows[iterator].text;
+ cell.twipHeight = rows[iterator].size;
+ cell.height = height + "px";
+ }
+ },
+
+ updateRows: function (converter, context) {
+ var iterator, twip, height, row;
+
+ for (iterator = 0; iterator < this._rows.childNodes.length; iterator++) {
+ row = this._rows.childNodes[iterator].firstChild;
+ twip = new L.Point(parseInt(row.twipHeight),
+ parseInt(row.twipHeight));
+ height = Math.round(converter.call(context, twip).y) - 1;
+ row.height = height + "px";
+ }
+ }
+})
+
+L.control.rowHeader = function (options) {
+ return new L.Control.RowHeader(options);
+};
More information about the Libreoffice-commits
mailing list