diff --git a/src/bom2table.js b/src/bom2table.js deleted file mode 100644 index 6f7cd68..0000000 --- a/src/bom2table.js +++ /dev/null @@ -1,166 +0,0 @@ -/* eslint-disable array-callback-return */ -// Modules -const beautify = require('js-beautify').html; -const csv = require('csvtojson'); - -// Configuration -// Which components should we remove from the BOM? -const rejectedParts = [ - 'TP1', - 'TP2', - 'TP3', - 'G', - 'U$1', - 'S1', - 'J1', - 'J2', - 'JP1', - 'JP2', - 'V', - 'I', - 'O', - 'T1', - 'T2', - 'T3', - 'INPUT', -]; - -// Return false if the Part value of the object passed in is in the list to remove -function isJunk(element) { - return !rejectedParts.includes(element.Part); -} - -function getPartType(partName) { - // console.log(partName.Part); - if (partName.Part.match(/^C\d/) != null) { - return 'C'; - // eslint-disable-next-line no-else-return - } else if (partName.Part.match(/^R\d/) != null) { - return 'R'; - } - return 'Q'; -} - -function getJSONParts(allParts) { - const jsonParts = {}; - const C = {}; - const R = {}; - const Q = {}; - - allParts.map((partEntry) => { - switch (getPartType(partEntry)) { - case 'C': - C[partEntry.Part] = partEntry.Value; - break; - case 'R': - R[partEntry.Part] = partEntry.Value; - break; - default: - Q[partEntry.Part] = partEntry.Value; - } - }); - - jsonParts.C = C; - jsonParts.R = R; - jsonParts.Q = Q; - - return jsonParts; -} - -// Format the HTML nicely and output to a pre code block -function displayMarkup() { - const tableCode = document.querySelector('table').outerHTML; - const markup = document.getElementById('markup'); - markup.innerText = beautify(tableCode); -} - -// Table functions -function clearTable() { - document.querySelector('table').innerHTML = ''; -} - -function generateTableHead(table, data) { - const thead = table.createTHead(); - const row = thead.insertRow(); - // Populate Header row - data.map((key) => { - const th = document.createElement('th'); - const text = document.createTextNode(key); - th.appendChild(text); - row.appendChild(th); - }); -} - -function generateTableBody(table, data) { - data.map((component) => { - const row = table.insertRow(); - // Insert Part Name - const partName = row.insertCell(); - const partNameText = document.createTextNode(component.Part); - partName.appendChild(partNameText); - // Insert Part Value - const partVal = row.insertCell(); - const partValText = document.createTextNode(component.Value); - partVal.appendChild(partValText); - }); -} - -function makeTable(csvString) { - csv({ - delimiter: ';', - includeColumns: /(Part|Value)/, - ignoreEmpty: true, - }) - .fromString(csvString) - .then((jsonObj) => { - // Create array containing only relevant parts - const parts = jsonObj.filter(isJunk); - console.log(parts); - const table = document.querySelector('table'); - const headerData = Object.keys(parts[0]); - generateTableBody(table, parts); - generateTableHead(table, headerData); - displayMarkup(); - }) - .catch((e) => { - console.error(e); - }); -} - -// Create a JSON object for Contentful -function makeJSON(csvString) { - csv({ - delimiter: ';', - includeColumns: /(Part|Value)/, - ignoreEmpty: true, - }) - .fromString(csvString) - .then((res) => { - const object = res.filter(isJunk); - - const parts = getJSONParts(object); - - document.getElementById('jsonObject').innerText = JSON.stringify( - parts, - null, - 2, - ); - }) - .catch((e) => { - console.error(e); - }); -} - -function handleFiles() { - const csvFilePath = this.files[0]; - const reader = new FileReader(); - reader.readAsText(csvFilePath); - reader.onload = () => { - clearTable(); - makeTable(reader.result); - makeJSON(reader.result); - }; -} - -const csvPicker = document.getElementById('csvFile'); -csvPicker.addEventListener('change', handleFiles, false); diff --git a/src/bom2table.ts b/src/bom2table.ts new file mode 100644 index 0000000..c1d4486 --- /dev/null +++ b/src/bom2table.ts @@ -0,0 +1,163 @@ +/* eslint-disable @typescript-eslint/no-non-null-assertion */ +/* eslint-disable array-callback-return */ +// Modules +import { html as beautify } from 'js-beautify'; +import csv from 'csvtojson'; +import { Converter } from 'csvtojson/v2/Converter'; + +// Configuration +// Which components should we remove from the BOM? +const rejectedParts = [ + 'TP1', + 'TP2', + 'TP3', + 'G', + 'U$1', + 'S1', + 'J1', + 'J2', + 'JP1', + 'JP2', + 'V', + 'I', + 'O', + 'T1', + 'T2', + 'T3', + 'INPUT', +]; + +// Return false if the Part value of the object passed in is in the list to remove +function isJunk(element: part) { + return !rejectedParts.includes(element.Part); +} + +function getPartType(component: part) { + // console.log(partName.Part); + if (component.Part.match(/^C\d/) != null) { + return 'C'; + // eslint-disable-next-line no-else-return + } else if (component.Part.match(/^R\d/) != null) { + return 'R'; + } + return 'Q'; +} + +function getJSONParts(allParts: part[]) { + const jsonParts: structuredParts = { + C: {}, + R: {}, + Q: {}, + }; + + allParts.map((partEntry: part) => { + switch (getPartType(partEntry)) { + case 'C': + jsonParts.C[partEntry.Part] = partEntry.Value; + break; + case 'R': + jsonParts.R[partEntry.Part] = partEntry.Value; + break; + default: + jsonParts.Q[partEntry.Part] = partEntry.Value; + } + }); + return jsonParts; +} + +// Format the HTML nicely and output to a pre code block +function displayMarkup() { + const tableCode = document.querySelector('table')!.outerHTML; + const markup = document.getElementById('markup') as HTMLElement; + markup.innerText = beautify(tableCode); +} + +// Table functions +function clearTable() { + document.querySelector('table')!.innerHTML = ''; +} + +function generateTableHead(table: HTMLTableElement, data: Array) { + const thead = table.createTHead(); + const row = thead.insertRow(); + // Populate Header row + data.map((key) => { + const th = document.createElement('th'); + const text = document.createTextNode(key); + th.appendChild(text); + row.appendChild(th); + }); +} + +function generateTableBody(table: HTMLTableElement, data: part[]) { + data.map((component) => { + const row = table.insertRow(); + // Insert Part Name + const partName = row.insertCell(); + const partNameText = document.createTextNode(component.Part); + partName.appendChild(partNameText); + // Insert Part Value + const partVal = row.insertCell(); + const partValText = document.createTextNode(component.Value); + partVal.appendChild(partValText); + }); +} + +async function makeTable(csvString: string) { + + const converter: Converter = csv({ + delimiter: ';', + includeColumns: /(Part|Value)/, + ignoreEmpty: true, + }) + + const jsonArray = await converter.fromString(csvString); + // Filter out unwanted parts + const parts = jsonArray.filter(isJunk); + // Build table + const table = document.querySelector('table') as HTMLTableElement; + const headerData = Object.keys(parts[0]); + generateTableBody(table, parts); + generateTableHead(table, headerData); + displayMarkup(); +} + +// Create a JSON object for Contentful +function makeJSON(csvString: string) { + csv({ + delimiter: ';', + includeColumns: /(Part|Value)/, + ignoreEmpty: true, + }) + .fromString(csvString) + .then((res) => { + const object = res.filter(isJunk); + + const parts = getJSONParts(object); + + document.getElementById('jsonObject')!.innerText = JSON.stringify( + parts, + null, + 2, + ); + }); +} + +const csvPicker = document.getElementById('csvFile') as HTMLInputElement; +// csvPicker?.addEventListener('change', handleFiles, false); +csvPicker.onchange = function handleFiles(event: Event) { + // const csvFile = event.target.files[0]; + const target = event.target as HTMLInputElement; + const csvFile: File = (target.files as FileList)[0]; + const reader = new FileReader(); + reader.readAsText(csvFile); + reader.onload = () => { + if (reader.result == null) { + throw new Error('Something went wrong.'); + } + const csvString = reader.result.toString(); + clearTable(); + makeTable(csvString); + makeJSON(csvString); + }; +} diff --git a/src/boms2table.d.ts b/src/boms2table.d.ts index 94b7a4b..2f3b8cf 100644 --- a/src/boms2table.d.ts +++ b/src/boms2table.d.ts @@ -2,3 +2,15 @@ interface part { Part: string, Value: string, } + +interface structuredParts { + C: { + [key: string]: string + }, + R: { + [key: string]: string + }, + Q: { + [key: string]: string + } +} \ No newline at end of file