From 669be70f18e39d6325a6d76cba847c743e4d4e27 Mon Sep 17 00:00:00 2001 From: Keegan George Date: Thu, 14 Jul 2022 17:07:05 -0700 Subject: [PATCH] DEV: Add logic to build markdown table --- .../components/spreadsheet-editor.js | 20 ++++++- javascripts/discourse/lib/utilities.js | 58 ++++++++++++++++++- 2 files changed, 75 insertions(+), 3 deletions(-) diff --git a/javascripts/discourse/components/spreadsheet-editor.js b/javascripts/discourse/components/spreadsheet-editor.js index abd174a..92b9fd0 100644 --- a/javascripts/discourse/components/spreadsheet-editor.js +++ b/javascripts/discourse/components/spreadsheet-editor.js @@ -1,7 +1,7 @@ // import Controller from "@ember/controller"; import { action } from "@ember/object"; import loadScript from "discourse/lib/load-script"; -import { tableToObj } from "../lib/utilities"; +import { arrayToTable, tableToObj } from "../lib/utilities"; import Component from "@ember/component"; export default Component.extend({ @@ -25,6 +25,7 @@ export default Component.extend({ const tableObject = tableToObj(table); const headings = []; const tableData = []; + console.log(this.model.id); tableObject.forEach((object) => { // Build Headings if (!headings.includes(...Object.keys(object))) { @@ -62,7 +63,22 @@ export default Component.extend({ @action editTable() { // TODO: insert table edit submission logic - console.log("New Data:", this.spreadsheet.getData()); + const updatedHeaders = this.spreadsheet.getHeaders().split(","); // keys + const updatedData = this.spreadsheet.getData(); // values + + const markdownTable = this.buildTableMarkdown(updatedHeaders, updatedData); this.triggerModalClose(); }, + + buildTableMarkdown(headers, data) { + const table = []; + data.forEach((row) => { + const result = {}; + + headers.forEach((key, index) => (result[key] = row[index])); + table.push(result); + }); + + return arrayToTable(table); + }, }); diff --git a/javascripts/discourse/lib/utilities.js b/javascripts/discourse/lib/utilities.js index 7aca12b..966148a 100644 --- a/javascripts/discourse/lib/utilities.js +++ b/javascripts/discourse/lib/utilities.js @@ -1,6 +1,14 @@ -// SRC: https://gist.github.com/mattheo-gist/4151867 /* eslint-disable */ +/** + * Generate an object from an HTML table + * + * @see {@link https://gist.github.com/mattheo-gist/4151867|GitHub} + * + * @param {Table} table HTML Table element + * + * @return {Object} A JavaScript object + */ export function tableToObj(table) { var rows = table.rows; var propCells = rows[0].cells; @@ -29,3 +37,51 @@ export function tableToObj(table) { } return results; } + +/** + * Generate markdown table from an array of objects + * + * @see {@link https://github.com/Nijikokun/array-to-table|GitHub}: + * + * @param {Array} array Array of objects + * @param {Array} columns Optional, table column names, otherwise taken from the keys of the first object + * @param {String} alignment Optional table alignment. Can be 'center' (default), 'left' or 'right' + * + * @return {String} Markdown table + */ +export function arrayToTable(array, columns, alignment = "center") { + var table = ""; + var separator = { + left: ":---", + right: "---:", + center: "---", + }; + + // Generate column list + var cols = columns ? columns.split(",") : Object.keys(array[0]); + + // Generate table headers + table += cols.join(" | "); + table += "\r\n"; + + // Generate table header seperator + table += cols + .map(function () { + return separator[alignment] || separator.center; + }) + .join(" | "); + table += "\r\n"; + + // Generate table body + array.forEach(function (item) { + table += + cols + .map(function (key) { + return String(item[key] || ""); + }) + .join(" | ") + "\r\n"; + }); + + // Return table + return table; +}