Jexcel has been renamed to Jspreadsheet

Jason-ZW · Feb 14, 2021 · c0a7dbc · c0a7dbc
1 parent 3bf2794
commit c0a7dbc
Show file tree

Hide file tree

Showing 5 changed files with 88 additions and 75 deletions.
diff --git a/README.md b/README.md
@@ -1,11 +1,13 @@
-![The JavaScript spreadsheet](https://bossanova.uk/templates/jexcel-v4/img/logo.png)
+![The JavaScript spreadsheet](https://bossanova.uk/templates/default/img/logo.png)
 
-[**jExcel CE**](https://bossanova.uk/jexcel/v4/) is a lightweight Vanilla JavaScript plugin to create amazing web-based interactive HTML tables and spreadsheets compatible
-with Excel or any other spreadsheet software. You can create an online spreadsheet table from a JS array,
-JSON, CSV or XSLX files. You can copy from excel and paste straight to your jExcel CE spreadsheet and vice versa.
+<b>Jexcel</b> has been renamed to <b>Jspreadsheet</b><br><br>
+
+[**Jspreadsheet CE**](https://bossanova.uk/jspreadsheet/v4/) is a lightweight Vanilla JavaScript plugin to create amazing web-based interactive HTML tables and spreadsheets compatible
+with other spreadsheet software. You can create an online spreadsheet table from a JS array,
+JSON, CSV or XSLX files. You can copy from excel and paste straight to your Jspreadsheet CE spreadsheet and vice versa.
 It is very easy to integrate any third party JavaScript plugins to create your own custom columns, custom editors, and customize any
-feature into your application. jExcel CE has plenty of different input options through its native column types to cover the most common web-based application
-requirements. It is a complete solution for web data management. Create amazing applications with jExcel CE JavaScript spreadsheet.
+feature into your application. Jspreadsheet CE has plenty of different input options through its native column types to cover the most common web-based application
+requirements. It is a complete solution for web data management. Create amazing applications with Jspreadsheet CE JavaScript spreadsheet.
 
 ## Main advantages
 
@@ -22,39 +24,39 @@ requirements. It is a complete solution for web data management. Create amazing
 
 ## Screenshot
 
-![The JavaScript spreadsheet](https://bossanova.uk/templates/jexcel-v2/img/jexcel.gif)
+![The JavaScript spreadsheet](https://bossanova.uk/templates/default/img/jexcel.gif)
 
 
 ## Installation
 
-% npm install jexcel
+% npm install jspreadsheet-ce
 
-[Download ZIP](https://github.com/jspreadsheet/jexcel/archive/master.zip)
+[Download ZIP](https://github.com/jspreadsheet/ce/archive/master.zip)
 
 ### Basic demo 
 
 A basic example to integrate the JavaScript spreadsheet in your website to create your first online spreadsheet.
 
 ```html
-<script src="https://bossanova.uk/jexcel/v4/jexcel.js"></script>
-<script src="https://jsuites.net/v3/jsuites.js"></script>
-<link rel="stylesheet" href="https://jsuites.net/v3/jsuites.css" type="text/css" />
-<link rel="stylesheet" href="https://bossanova.uk/jexcel/v4/jexcel.css" type="text/css" />
+<script src="https://bossanova.uk/jspreadsheet/v4/jexcel.js"></script>
+<script src="https://jsuites.net/v4/jsuites.js"></script>
+<link rel="stylesheet" href="https://jsuites.net/v4/jsuites.css" type="text/css" />
+<link rel="stylesheet" href="https://bossanova.uk/Jspreadsheet/v4/jexcel.css" type="text/css" />
 ```
 
 You should initiate your table based on a div container, such as:
 ```html
 <div id="spreadsheet"></div>
 ```
 
-To initialize a jExcel CE table you should run a JavaScript, such as:
+To initialize a Jspreadsheet CE table you should run a JavaScript, such as:
 ```javascript
 var data = [
     ['Jazz', 'Honda', '2019-02-12', '', true, '$ 2.000,00', '#777700'],
     ['Civic', 'Honda', '2018-07-11', '', true, '$ 4.000,01', '#007777'],
 ];
 
-jexcel(document.getElementById('spreadsheet'), {
+jspreadsheet(document.getElementById('spreadsheet'), {
     data:data,
     columns: [
         { type: 'text', title:'Car', width:120 },
@@ -70,66 +72,70 @@ jexcel(document.getElementById('spreadsheet'), {
 
 ## Examples
 
-- [React Implementation](https://bossanova.uk/jexcel/v4/examples/react)\
-A full example on how to integrate jExcel CE with React.
+- [React Implementation](https://bossanova.uk/jspreadsheet/v4/examples/react)\
+A full example on how to integrate Jspreadsheet CE with React.
 
-- [VUE Implementation](https://bossanova.uk/jexcel/v4/examples/vue)\
-A full example on how to integrate jExcel CE with Vue.
+- [VUE Implementation](https://bossanova.uk/jspreadsheet/v4/examples/vue)\
+A full example on how to integrate Jspreadsheet CE with Vue.
 
-- [Search and pagination](https://bossanova.uk/jexcel/v4/examples/datatables)\
+- [Search and pagination](https://bossanova.uk/jspreadsheet/v4/examples/datatables)\
 Full spreadsheet example with search and pagination to bring great compatibility for those who love datatables.
 
-- [Column types](https://bossanova.uk/jexcel/v4/examples/column-types)\
+- [Column types](https://bossanova.uk/jspreadsheet/v4/examples/column-types)\
 Learn more about the powerful column types. This example brings all native column types and how to create your own custom type.
 
-- [Javascript dropdown](https://bossanova.uk/jexcel/v4/examples/dropdown-and-autocomplete)\
+- [Javascript dropdown](https://bossanova.uk/jspreadsheet/v4/examples/dropdown-and-autocomplete)\
 Full examples on how to handle simple, advanced, multiple, autocomplete and conditional dropdowns. Create amazing JavaScript tables using categories and images in your dropdowns.
 
-- [Javascript calendar, date and datetime picker](https://bossanova.uk/jexcel/v4/examples/javascript-calendar)\
+- [Javascript calendar, date and datetime picker](https://bossanova.uk/jspreadsheet/v4/examples/javascript-calendar)\
 Example from basic to advanced calendar usage, date and datetime picker.
 
-- [Image upload](https://bossanova.uk/jexcel/v4/examples/image-upload)\
+- [Image upload](https://bossanova.uk/jspreadsheet/v4/examples/image-upload)\
 This examples shows how to upload images to your spreadsheet.
 
-- [Programmatically updates](https://bossanova.uk/jexcel/v4/examples/programmatically-updates)\
+- [Programmatically updates](https://bossanova.uk/jspreadsheet/v4/examples/programmatically-updates)\
 How to update your spreadsheet and its data by JavaScript.
 
-- [Table Style](https://bossanova.uk/jexcel/v4/examples/table-style)\
+- [Table Style](https://bossanova.uk/jspreadsheet/v4/examples/table-style)\
 Bring a very special touch to your applications customizing your JavaScript spreadsheet.
 
-- [Events](https://bossanova.uk/jexcel/v4/examples/events)\
-Learn how to handle events on jExcel CE.
+- [Events](https://bossanova.uk/jspreadsheet/v4/examples/events)\
+Learn how to handle events on Jspreadsheet CE.
 
-- [Importing data](https://bossanova.uk/jexcel/v4/examples/import-data)\
+- [Importing data](https://bossanova.uk/jspreadsheet/v4/examples/import-data)\
 How to import data from an external CSV, json file or XLSX.
 
-- [Formulas](https://bossanova.uk/jexcel/v4/examples/spreadsheet-formulas)\
-Unleash the power of your tables bringing formulas and custom JavaScript methods on your jExcel spreadsheet.
+- [Formulas](https://bossanova.uk/jspreadsheet/v4/examples/spreadsheet-formulas)\
+Unleash the power of your tables bringing formulas and custom JavaScript methods on your Jspreadsheet spreadsheet.
 
-- [Custom toolbars](https://bossanova.uk/jexcel/v4/examples/spreadsheet-toolbars)\
+- [Custom toolbars](https://bossanova.uk/jspreadsheet/v4/examples/spreadsheet-toolbars)\
 Full example on how to enable nor customize your JavaScript spreadsheet toolbar.
 
-- [Column comments](https://bossanova.uk/jexcel/v4/examples/comments)\
+- [Column comments](https://bossanova.uk/jspreadsheet/v4/examples/comments)\
 Allow comments in your table spreadsheet.
 
-- [Headers](https://bossanova.uk/jexcel/v4/examples/headers)\
+- [Headers](https://bossanova.uk/jspreadsheet/v4/examples/headers)\
 Enabled nested headers in your spreadsheet and learn how to set or get header values.
 
-- [Translations](https://bossanova.uk/jexcel/v4/examples/translations)\
-How to translate the default messages from jExcel.
+- [Translations](https://bossanova.uk/jspreadsheet/v4/examples/translations)\
+How to translate the default messages from Jspreadsheet.
 
-- [Merged cells](https://bossanova.uk/jexcel/v4/examples/merged-cells)\
+- [Merged cells](https://bossanova.uk/jspreadsheet/v4/examples/merged-cells)\
 Full example on how to handle merge cells in your JavaScript tables.
 
-- [Sorting columns](https://bossanova.uk/jexcel/v4/examples/sorting)\
+- [Sorting columns](https://bossanova.uk/jspreadsheet/v4/examples/sorting)\
 Example how to sort the table by a column via JavaScript.
 
-- [Lazy loading](https://bossanova.uk/jexcel/v4/examples/lazy-loading)\
+- [Lazy loading](https://bossanova.uk/jspreadsheet/v4/examples/lazy-loading)\
 This example brings a very nice feature to deal with large table datasets.
 
 
 
-## jExcel CE History
+## Jspreadsheet CE History
+
+### Jspreadsheet 4.6
+
+<b>Jexcel</b> has been renamed to <b>Jspreadsheet</b>
 
 ### Jexcel 4.0.0
 
@@ -241,15 +247,14 @@ We are glad to bring you the latest jQuery plugin version, with the following im
 
 
 ## Officials websites
-- [jExcel CE v4 - Javascript Spreasheet](https://bossanova.uk/jexcel/v4)
-- [jExcel CE v3 - Vanilla JavaScript](https://bossanova.uk/jexcel/v3)
-- [jExcel CE v2 - jQuery Plugin](https://bossanova.uk/jexcel/v2)
+- [jExcel CE v4 - Javascript Spreasheet](https://bossanova.uk/jspreadsheet/v4)
+- [jExcel CE v3 - Vanilla JavaScript](https://bossanova.uk/jspreadsheet/v3)
+- [jExcel CE v2 - jQuery Plugin](https://bossanova.uk/jspreadsheet/v2)
 
 - [jExcel Pro v7 - Javascript Spreasheet](https://jexcel.net/v7)
-- [jExcel Pro v5 - Javascript Spreasheet](https://jexcel.net/v5)
 
 ## Community
-- [GitHub](https://github.com/jspreadsheet/jexcel/issues)
+- [GitHub](https://github.com/jspreadsheet/ce/issues)
 
 ## Compilation
 
@@ -263,7 +268,7 @@ docker-compose exec bash php
 
 
 ## Copyright and license
-jExcel CE is released under the [MIT license]. Contact <[email protected]>
+Jspreadsheet CE is released under the [MIT license]. Contact <[email protected]>
 
 ## Other interesting tools
 - [jSuites - JavaScript plugins & Webcomponents](https://jsuites.net)

diff --git a/WEBCOMPONENT.md b/WEBCOMPONENT.md
@@ -1,13 +1,13 @@
-#Jexcel as a webcomponent
+#Jspreadsheet as a webcomponent
 
-Jexcel v4+ can run as a javascript webcomponent.
+Jspreadsheet v4+ can run as a javascript webcomponent.
 
 ```
 <html>
-<script type="text/javascript" src="/jexcel/v4/jexcel.js"></script>
-<script type="text/javascript" src="/jexcel/v4/jexcel.webcomponent.js"></script>
+<script type="text/javascript" src="https://bossanova.uk/jspreadsheet/v4/jexcel.js"></script>
+<script type="text/javascript" src="https://bossanova.uk/jspreadsheet/v4/jexcel.webcomponent.js"></script>
 
-<script type="text/javascript" src="/jsuites/v3/jsuites.js"></script>
+<script type="text/javascript" src="https://jsuites.net/v4/jsuites.js"></script>
 
 <!-- The configuration goes as a inline JSON string -->
 <j-spreadsheet>

diff --git a/dist/jexcel.css b/dist/jexcel.css
@@ -49,8 +49,8 @@
 }
 
 .jexcel_content::-webkit-scrollbar {
-    width: 5px;
-    height: 5px;
+    width: 8px;
+    height: 8px;
 }
 
 .jexcel_content::-webkit-scrollbar-track {
@@ -692,6 +692,7 @@
 
 .jexcel_hidden_index > tbody > tr > td:first-child,
 .jexcel_hidden_index > thead > tr > td:first-child, 
+.jexcel_hidden_index > tfoot > tr > td:first-child,
 .jexcel_hidden_index > colgroup > col:first-child
 {
     display:none;
@@ -733,7 +734,7 @@
     padding-right: 20px;
 }
 
-.jexcel thead .jexcel_freezed {
+.jexcel thead .jexcel_freezed, .jexcel tfoot .jexcel_freezed {
     left: 0px;
     z-index: 3 !important;
     box-shadow: 2px 0px 2px 0.2px #ccc !important;

diff --git a/dist/jexcel.js b/dist/jexcel.js
@@ -1,7 +1,7 @@
 /**
- * jExcel v4.5.3
+ * Jspreadsheet v4.6.0
  *
- * Website: https://bossanova.uk/jexcel/
+ * Website: https://bossanova.uk/jspreadsheet/
  * Description: Create amazing web based spreadsheets.
  *
  * This software is distribute under MIT License
@@ -15,20 +15,20 @@ if (! jSuites && typeof(require) === 'function') {
 ;(function (global, factory) {
     typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory() :
     typeof define === 'function' && define.amd ? define(factory) :
-    global.jexcel = factory();
+    global.jspreadsheet = global.jexcel = factory();
 }(this, (function () {
 
     'use strict';
 
-    // Jexcel core object
+    // Jspreadsheet core object
 
     var jexcel = (function(el, options) {
         // Create jexcel object
         var obj = {};
         obj.options = {};
 
         if (! (el instanceof Element || el instanceof HTMLDocument)) {
-            console.error('JEXCEL: el is not a valid DOM element');
+            console.error('Jspreadsheet: el is not a valid DOM element');
             return false;
         } else if (el.tagName == 'TABLE') {
             if (options = jexcel.createFromTable(el, options)) {
@@ -37,7 +37,7 @@ if (! jSuites && typeof(require) === 'function') {
                 el.remove();
                 el = div;
             } else {
-                console.error('JEXCEL: el is not a valid DOM element');
+                console.error('Jspreadsheet: el is not a valid DOM element');
                 return false;
             }
         }
@@ -308,7 +308,7 @@ if (! jSuites && typeof(require) === 'function') {
 
         // Lazy loading
         if (obj.options.lazyLoading == true && (obj.options.tableOverflow == false && obj.options.fullscreen == false)) {
-            console.error('JEXCEL: The lazyloading only works when tableOverflow = yes or fullscreen = yes');
+            console.error('Jspreadsheet: The lazyloading only works when tableOverflow = yes or fullscreen = yes');
             obj.options.lazyLoading = false;
         }
 
@@ -698,6 +698,7 @@ if (! jSuites && typeof(require) === 'function') {
                 if (obj.options.tableOverflow == true) {
                     if (obj.options.tableHeight) {
                         obj.content.style['overflow-y'] = 'auto';
+                        obj.content.style['box-shadow'] = 'rgb(221 221 221) 2px 2px 5px 0.1px';
                         obj.content.style.maxHeight = obj.options.tableHeight;
                     }
                     if (obj.options.tableWidth) {
@@ -856,7 +857,7 @@ if (! jSuites && typeof(require) === 'function') {
 
                 if (obj.options.pagination) {
                     obj.options.pagination = false;
-                    console.error('JEXCEL: Pagination will be disable due the lazyLoading');
+                    console.error('Jspreadsheet: Pagination will be disable due the lazyLoading');
                 }
             } else if (obj.options.pagination) {
                 // Pagination
@@ -1713,7 +1714,7 @@ if (! jSuites && typeof(require) === 'function') {
          */
         obj.openFilter = function(columnId) {
             if (! obj.options.filters) {
-                console.log('JEXCEL: filters not enabled.');
+                console.log('Jspreadsheet: filters not enabled.');
             } else {
                 // Make sure is integer
                 columnId = parseInt(columnId);
@@ -4359,6 +4360,12 @@ if (! jSuites && typeof(require) === 'function') {
                             var colspan = parseInt(obj.options.nestedHeaders[j][obj.options.nestedHeaders[j].length-1].colspan) + numOfColumns;
                             obj.options.nestedHeaders[j][obj.options.nestedHeaders[j].length-1].colspan = colspan;
                             obj.thead.children[j].children[obj.thead.children[j].children.length-1].setAttribute('colspan', colspan);
+                            var o = obj.thead.children[j].children[obj.thead.children[j].children.length-1].getAttribute('data-column');
+                            o = o.split(',');
+                            for (var col = columnIndex; col < (numOfColumns + columnIndex); col++) {
+                                o.push(col);
+                            }
+                            obj.thead.children[j].children[obj.thead.children[j].children.length-1].setAttribute('data-column', o);
                         }
                     } else {
                         var colspan = parseInt(obj.options.nestedHeaders[0].colspan) + numOfColumns;
@@ -7365,7 +7372,7 @@ if (! jSuites && typeof(require) === 'function') {
                             }
                         } else if (jexcel.current.options.columnDrag == true && info.height - e.offsetY < 6) {
                             if (jexcel.current.isColMerged(columnId).length) {
-                                console.error('JEXCEL: This column is part of a merged cell.');
+                                console.error('Jspreadsheet: This column is part of a merged cell.');
                             } else {
                                 // Reset selection
                                 jexcel.current.resetSelection();
@@ -7441,9 +7448,9 @@ if (! jSuites && typeof(require) === 'function') {
                             e.target.parentNode.classList.add('resizing');
                         } else if (jexcel.current.options.rowDrag == true && info.width - e.offsetX < 6) {
                             if (jexcel.current.isRowMerged(rowId).length) {
-                                console.error('JEXCEL: This row is part of a merged cell');
+                                console.error('Jspreadsheet: This row is part of a merged cell');
                             } else if (jexcel.current.options.search == true && jexcel.current.results) {
-                                console.error('JEXCEL: Please clear your search before perform this action');
+                                console.error('Jspreadsheet: Please clear your search before perform this action');
                             } else {
                                 // Reset selection
                                 jexcel.current.resetSelection();
@@ -7754,7 +7761,7 @@ if (! jSuites && typeof(require) === 'function') {
                     if (jexcel.current.dragging.column) {
                         if (columnId) {
                             if (jexcel.current.isColMerged(columnId).length) {
-                                console.error('JEXCEL: This column is part of a merged cell.');
+                                console.error('Jspreadsheet: This column is part of a merged cell.');
                             } else {
                                 for (var i = 0; i < jexcel.current.headers.length; i++) {
                                     jexcel.current.headers[i].classList.remove('dragging-left');
@@ -7785,7 +7792,7 @@ if (! jSuites && typeof(require) === 'function') {
                     } else {
                         if (rowId) {
                             if (jexcel.current.isRowMerged(rowId).length) {
-                                console.error('JEXCEL: This row is part of a merged cell.');
+                                console.error('Jspreadsheet: This row is part of a merged cell.');
                             } else {
                                 var target = (e.target.clientHeight / 2 > e.offsetY) ? e.target.parentNode.nextSibling : e.target.parentNode;
                                 if (jexcel.current.dragging.element != target) {