├── .prettierignore ├── .husky └── pre-commit ├── src ├── shared │ ├── data.js │ └── elements.js ├── assets │ ├── demo.gif │ ├── icon.png │ ├── styles │ │ ├── sass │ │ │ ├── printMedia.scss │ │ │ ├── message.scss │ │ │ ├── uploadBtn.scss │ │ │ ├── labelForm.scss │ │ │ ├── container.scss │ │ │ ├── init.scss │ │ │ ├── utils.scss │ │ │ ├── buttons.scss │ │ │ ├── card.scss │ │ │ └── configForm.scss │ │ ├── main.scss │ │ ├── main.min.css.map │ │ └── main.min.css │ └── libs │ │ ├── papaparse.min.js │ │ └── qrcode.min.js ├── functions │ ├── configForm.js │ ├── utils.js │ ├── csv.js │ └── card.js └── index.js ├── .prettierrc.json ├── .gitignore ├── LICENSE.md ├── package.json ├── README.md ├── index.html └── yarn.lock /.prettierignore: -------------------------------------------------------------------------------- 1 | *.svg 2 | *.png 3 | /assets/libs/* -------------------------------------------------------------------------------- /.husky/pre-commit: -------------------------------------------------------------------------------- 1 | #!/bin/sh 2 | . "$(dirname "$0")/_/husky.sh" 3 | 4 | yarn pretty 5 | -------------------------------------------------------------------------------- /src/shared/data.js: -------------------------------------------------------------------------------- 1 | let DATA = []; 2 | let COLS_TITLE = []; 3 | let MERGED_DATA = []; 4 | -------------------------------------------------------------------------------- /src/assets/demo.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/raminr77/csv-row-printer/HEAD/src/assets/demo.gif -------------------------------------------------------------------------------- /src/assets/icon.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/raminr77/csv-row-printer/HEAD/src/assets/icon.png -------------------------------------------------------------------------------- /src/assets/styles/sass/printMedia.scss: -------------------------------------------------------------------------------- 1 | @media print { 2 | .container, .u-loading, .label-form-container { 3 | display: none; 4 | } 5 | } -------------------------------------------------------------------------------- /.prettierrc.json: -------------------------------------------------------------------------------- 1 | { 2 | "trailingComma": "all", 3 | "tabWidth": 2, 4 | "semi": true, 5 | "arrowParens": "always", 6 | "bracketSpacing": true, 7 | "printWidth": 90, 8 | "useTabs": false 9 | } 10 | -------------------------------------------------------------------------------- /src/assets/styles/sass/message.scss: -------------------------------------------------------------------------------- 1 | .js-message { 2 | width: 90%; 3 | color: #f03; 4 | font-size: 16px; 5 | max-width: 300px; 6 | margin-bottom: 10px; 7 | text-align: justify; 8 | .is-warning { 9 | color: #FF6F00; 10 | } 11 | } -------------------------------------------------------------------------------- /src/assets/styles/main.scss: -------------------------------------------------------------------------------- 1 | // inits 2 | @import "./sass/init.scss"; 3 | 4 | // files 5 | @import "./sass/card.scss"; 6 | @import "./sass/message.scss"; 7 | @import "./sass/buttons.scss"; 8 | @import "./sass/labelForm.scss"; 9 | @import "./sass/uploadBtn.scss"; 10 | @import "./sass/container.scss"; 11 | @import "./sass/configForm.scss"; 12 | 13 | // config 14 | @import "./sass/utils.scss"; 15 | @import "./sass/printMedia.scss"; -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | # See https://help.github.com/articles/ignoring-files/ for more about ignoring files. 2 | 3 | # dependencies 4 | /node_modules 5 | /.pnp 6 | .pnp.js 7 | 8 | # testing 9 | /coverage 10 | 11 | # production 12 | /build 13 | 14 | # code editor 15 | /.vscode 16 | 17 | # misc 18 | .DS_Store 19 | .env.local 20 | .env.development.local 21 | .env.test.local 22 | .env.production.local 23 | 24 | npm-debug.log* 25 | yarn-debug.log* 26 | yarn-error.log* 27 | package-lock.json -------------------------------------------------------------------------------- /src/assets/styles/sass/uploadBtn.scss: -------------------------------------------------------------------------------- 1 | form { 2 | width: 90%; 3 | display: flex; 4 | flex-wrap: wrap; 5 | max-width: 300px; 6 | align-items: center; 7 | justify-content: center; 8 | } 9 | .custom-upload-btn { 10 | input { 11 | display: none; 12 | } 13 | width: 100%; 14 | display: flex; 15 | cursor: pointer; 16 | font-size: 18px; 17 | min-height: 60px; 18 | padding: 8px 16px; 19 | border-radius: 8px; 20 | align-items: center; 21 | margin-bottom: 16px; 22 | justify-content: center; 23 | transition-duration: 0.3s; 24 | border: 1px dashed #2C3E50; 25 | &:hover { 26 | background-color: #ECEFF1; 27 | } 28 | } 29 | .custom-upload-btn.is-active { 30 | background-color: #E8F5E9; 31 | } 32 | -------------------------------------------------------------------------------- /src/assets/styles/sass/labelForm.scss: -------------------------------------------------------------------------------- 1 | .label-form-container { 2 | width: 90%; 3 | display: flex; 4 | padding: 16px; 5 | max-width: 600px; 6 | margin: 16px auto; 7 | border-radius: 8px; 8 | flex-direction: column; 9 | background-color: #FFF3E0; 10 | border: 1px dashed #2C3E50; 11 | p { 12 | color: #EF6C00; 13 | font-weight: bold; 14 | margin-bottom: 16px; 15 | span { 16 | margin-left: 4px; 17 | color: #EF6C00; 18 | } 19 | } 20 | } 21 | .label-edit-row { 22 | width: 100%; 23 | display: flex; 24 | input { 25 | width: 100%; 26 | border: none; 27 | font-size: 14px; 28 | padding: 8px 10px; 29 | background-color: transparent; 30 | border-bottom: 2px solid #CCC; 31 | &:focus { 32 | border-bottom-color: #EF6C00; 33 | } 34 | } 35 | } 36 | -------------------------------------------------------------------------------- /src/assets/styles/sass/container.scss: -------------------------------------------------------------------------------- 1 | .container { 2 | width: 100%; 3 | display: flex; 4 | padding-top: 50px; 5 | align-items: center; 6 | flex-direction: column; 7 | justify-content: center; 8 | h1 { 9 | font-size: 40px; 10 | font-weight: bold; 11 | margin-bottom: 6px; 12 | } 13 | img { 14 | width: 80px; 15 | margin-bottom: 10px; 16 | } 17 | span { 18 | width: 90%; 19 | color: #999; 20 | font-size: 14px; 21 | max-width: 300px; 22 | line-height: 20px; 23 | text-align: justify; 24 | margin-bottom: 10px; 25 | margin-bottom: 16px; 26 | } 27 | strong { 28 | margin: 0 2px; 29 | font-size: 16px; 30 | font-weight: bold; 31 | } 32 | a { 33 | margin: 0 2px; 34 | font-size: 14px; 35 | color: #1E88E5; 36 | font-weight: bold; 37 | text-decoration: none; 38 | } 39 | } 40 | -------------------------------------------------------------------------------- /src/assets/styles/sass/init.scss: -------------------------------------------------------------------------------- 1 | @import url('https://fonts.googleapis.com/css2?family=Baloo+Chettan+2&display=swap'); 2 | 3 | * { 4 | margin: 0; 5 | padding: 0; 6 | outline: none; 7 | color: #2C3E50; 8 | user-select: none; 9 | box-sizing: border-box; 10 | font-family: 'Baloo Chettan 2', 'Vazir', cursive; 11 | } 12 | 13 | html { 14 | scroll-behavior: smooth; 15 | } 16 | body { 17 | position: relative; 18 | background-color: #FFF; 19 | } 20 | 21 | /* scroll bar */ 22 | ::-webkit-scrollbar { 23 | width: 4px; 24 | } 25 | ::-webkit-scrollbar-track { 26 | background: #FFF; 27 | } 28 | ::-webkit-scrollbar-thumb { 29 | background: #d3d3d3; 30 | border-radius: 8px; 31 | } 32 | ::-webkit-scrollbar-thumb:hover { 33 | cursor: pointer; 34 | background: #acacac; 35 | } -------------------------------------------------------------------------------- /src/assets/styles/sass/utils.scss: -------------------------------------------------------------------------------- 1 | .u-hidden { 2 | display: none; 3 | } 4 | .u-loading { 5 | top: 0; 6 | left: 0; 7 | right: 0; 8 | bottom: 0; 9 | opacity: 0; 10 | z-index: -1; 11 | width: 100%; 12 | height: 100vh; 13 | display: flex; 14 | position: fixed; 15 | align-items: center; 16 | flex-direction: column; 17 | justify-content: center; 18 | transition-duration: 0.5s; 19 | background-color: rgba(0,0,0,0.8); 20 | p { 21 | color: #FFF; 22 | font-size: 14px; 23 | margin-top: 16px; 24 | } 25 | img { 26 | width: 50px; 27 | animation: loading-animation 2s infinite ease; 28 | } 29 | } 30 | .u-loading.is-active { 31 | opacity: 1; 32 | z-index: 10; 33 | } 34 | 35 | @keyframes loading-animation { 36 | 0% { 37 | transform: scale(1); 38 | } 39 | 50% { 40 | transform: scale(0.8); 41 | } 42 | 100% { 43 | transform: scale(1); 44 | } 45 | } -------------------------------------------------------------------------------- /LICENSE.md: -------------------------------------------------------------------------------- 1 | MIT License 2 | 3 | Copyright (c) 2020 Ramin Rezaei 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NON-INFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. 22 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "csv-row-printer", 3 | "license": "ISC", 4 | "version": "1.0.0", 5 | "main": "./src/index.js", 6 | "author": "Ramin Rezaei - ramin.rezaei77@gmail.com", 7 | "description": "Create & Print Card from CSV Row Data", 8 | "scripts": { 9 | "husky": "husky install", 10 | "pretty": "npx prettier src/**/*.js --write", 11 | "sass": "sass --watch src/assets/styles/main.scss:src/assets/styles/main.min.css --style compressed --update" 12 | }, 13 | "husky": { 14 | "hooks": { 15 | "pre-commit": "lint-staged" 16 | } 17 | }, 18 | "lint-staged": { 19 | "src/**/*.{js,scss}": [ 20 | "prettier --write" 21 | ] 22 | }, 23 | "repository": { 24 | "type": "git", 25 | "url": "git+https://github.com/raminr77/csv-row-printer.git" 26 | }, 27 | "keywords": [ 28 | "CSV", 29 | "CSV", 30 | "row", 31 | "printer" 32 | ], 33 | "bugs": { 34 | "url": "https://github.com/raminr77/csv-row-printer/issues" 35 | }, 36 | "homepage": "https://github.com/raminr77/csv-row-printer#readme", 37 | "devDependencies": { 38 | "husky": "^7.0.1", 39 | "prettier": "2.3.2", 40 | "sass": "^1.36.0" 41 | } 42 | } 43 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | 2 | 3 | # CSV Row Printer 4 | 5 | [![GitHub stars](https://img.shields.io/github/stars/raminr77/csv-row-printer?style=social)](https://github.com/raminr77/csv-row-printer/) 6 | 7 | 8 | 9 | 10 | 11 | 12 |

13 | CSV Row Printer is a tool that helps you upload your CSV files to it and separate the information in each row and print it as a card or output it. 14 |

15 |

16 | Your CSV file information is never sent to the server. No tracking, analytics, or fingerprinting are used on this website. 17 |

18 | 19 | [Demo](https://raminr77.github.io/csv-row-printer/) 20 | 21 | ## Capabilities: 22 | 34 | 35 | ## Development 36 | 1. Make sure you have `yarn` installed. 37 | 2. Run `yarn` for install **devDependencies** command. 38 | 3. Run `yarn sass` to compile SCSS files. 39 | 4. Run **index.html** with the [live Server](https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer) 40 | -------------------------------------------------------------------------------- /src/assets/styles/sass/buttons.scss: -------------------------------------------------------------------------------- 1 | .btn-row { 2 | width: 100%; 3 | display: flex; 4 | flex-wrap: wrap; 5 | margin-top: 16px; 6 | align-items: center; 7 | justify-content: center; 8 | } 9 | .print-btn { 10 | border: none; 11 | color: #FFF; 12 | cursor: pointer; 13 | font-size: 16px; 14 | margin-top: 16px; 15 | margin-left: 8px; 16 | padding: 6px 30px; 17 | border-radius: 8px; 18 | transition-duration: 0.3s; 19 | background-color: #66BB6A; 20 | &:hover { 21 | background-color: #4CAF50; 22 | } 23 | } 24 | .show-btn { 25 | border: none; 26 | color: #FFF; 27 | cursor: pointer; 28 | font-size: 16px; 29 | margin-top: 16px; 30 | margin-left: 8px; 31 | padding: 6px 30px; 32 | border-radius: 8px; 33 | transition-duration: 0.3s; 34 | background-color: #1E88E5; 35 | &:hover { 36 | background-color: #1565C0; 37 | } 38 | } 39 | .cancel-btn { 40 | border: none; 41 | color: #FFF; 42 | cursor: pointer; 43 | font-size: 16px; 44 | margin-top: 16px; 45 | margin-left: 8px; 46 | padding: 6px 30px; 47 | border-radius: 8px; 48 | transition-duration: 0.3s; 49 | background-color: #E91E63; 50 | &:hover { 51 | background-color: #D81B60; 52 | } 53 | } 54 | 55 | .top-btn { 56 | right: 30px; 57 | bottom: 30px; 58 | position: fixed; 59 | cursor: pointer; 60 | line-height: 30px; 61 | padding: 8px 16px; 62 | border-radius: 8px; 63 | background: #fff; 64 | text-decoration: none; 65 | border: 1px dashed #eee; 66 | transition-duration: 300ms; 67 | &:hover { 68 | border-color: #ddd; 69 | background: rgba(238, 238, 238, 0.5); 70 | } 71 | } -------------------------------------------------------------------------------- /src/assets/styles/sass/card.scss: -------------------------------------------------------------------------------- 1 | .cards-container { 2 | width: 90%; 3 | margin: 20px auto; 4 | max-width: 600px; 5 | } 6 | .card { 7 | display: flex; 8 | padding: 16px; 9 | min-height: 110px; 10 | border-radius: 8px; 11 | margin-bottom: 16px; 12 | flex-direction: column; 13 | border: 1px dashed #2C3E50; 14 | h3 { 15 | width: 100%; 16 | font-size: 22px; 17 | text-align: center; 18 | margin-bottom: 14px; 19 | padding-bottom: 8px; 20 | border-bottom: 1px solid #ddd; 21 | } 22 | p { 23 | color: #ddd; 24 | font-size: 14px; 25 | margin-top: 8px; 26 | padding-top: 8px; 27 | text-align: center; 28 | border-top: 1px solid #ddd; 29 | } 30 | } 31 | .card-content { 32 | width: 100%; 33 | display: flex; 34 | align-items: flex-start; 35 | } 36 | .card-content.is-rtl { 37 | direction: rtl; 38 | } 39 | 40 | .card-content.is-col { 41 | flex-direction: column-reverse; 42 | .qr-div { 43 | margin-bottom: 16px; 44 | } 45 | } 46 | 47 | .card-row-container { 48 | width: 100%; 49 | display: flex; 50 | flex-direction: column; 51 | } 52 | .card-row { 53 | display: flex; 54 | margin-bottom: 8px; 55 | align-items: center; 56 | } 57 | .card-row.is-rtl { 58 | direction: rtl; 59 | } 60 | .card-item-label { 61 | font-size: 14px; 62 | font-weight: bold; 63 | white-space: nowrap; 64 | } 65 | .card-item-value { 66 | font-size: 16px; 67 | padding: 0 10px; 68 | } 69 | 70 | // QR Code 71 | .qr-div { 72 | height: 100px; 73 | overflow: hidden; 74 | min-width: 100px; 75 | max-width: 100px; 76 | max-height: 100px; 77 | } 78 | .qr-data { 79 | margin-bottom: 22px; 80 | } 81 | -------------------------------------------------------------------------------- /src/shared/elements.js: -------------------------------------------------------------------------------- 1 | const QRData = document.querySelector(".qr-data"); 2 | const showBtn = document.querySelector(".show-btn"); 3 | const loading = document.querySelector(".u-loading"); 4 | const message = document.querySelector(".js-message"); 5 | const printBtn = document.querySelector(".print-btn"); 6 | const cancelBtn = document.querySelector(".cancel-btn"); 7 | const fileInput = document.querySelector(".file-input"); 8 | const selector = document.querySelector(".js-selector"); 9 | const searchInput = document.querySelector(".search-input"); 10 | const footerInput = document.querySelector(".footer-input"); 11 | const headerInput = document.querySelector(".header-input"); 12 | const rangeEndInput = document.querySelector(".js-range-end"); 13 | const resultCount = document.querySelector(".js-result-count"); 14 | const colsContainer = document.querySelector(".cols-container"); 15 | const cardWidthInput = document.querySelector(".js-card-width"); 16 | const uploadBtnText = document.querySelector(".upload-btn-text"); 17 | const rangeStartInput = document.querySelector(".js-range-start"); 18 | const cardsContainer = document.querySelector(".cards-container"); 19 | const QRCheckbox = document.querySelector(".js-qr-checkbox input"); 20 | const cardMinHeightInput = document.querySelector(".js-card-height"); 21 | const RTLCheckbox = document.querySelector(".js-rtl-checkbox input"); 22 | const customUploadInput = document.querySelector(".custom-upload-btn"); 23 | const configContainer = document.querySelector(".print-config-container"); 24 | const labelFormContainer = document.querySelector(".label-form-container"); 25 | const labelItemsContainer = document.querySelector(".label-form-container__items"); 26 | const QRColLayoutCheckbox = document.querySelector(".js-col-layout-checkbox input"); 27 | const advancedSettingsContainer = document.querySelector( 28 | ".js-advanced-settings-ccontainer", 29 | ); 30 | const advancedSettingsCheckbox = document.querySelector( 31 | ".js-advanced-settings-checkbox input", 32 | ); 33 | -------------------------------------------------------------------------------- /src/functions/configForm.js: -------------------------------------------------------------------------------- 1 | import { changeLabel, debounce, toggleLoading } from "./utils.js"; 2 | 3 | export function createSelectorItem() { 4 | const noneOption = document.createElement("option"); 5 | noneOption.value = ""; 6 | noneOption.innerHTML = "None"; 7 | selector.appendChild(noneOption); 8 | 9 | COLS_TITLE.map((cols, index) => { 10 | const option = document.createElement("option"); 11 | option.value = index; 12 | option.innerHTML = cols; 13 | selector.appendChild(option); 14 | }); 15 | selector.disabled = false; 16 | } 17 | 18 | export function createColItem(text, value) { 19 | const label = document.createElement("label"); 20 | const input = document.createElement("input"); 21 | input.value = value; 22 | input.type = "checkbox"; 23 | label.classList = "js-checkbox"; 24 | label.appendChild(input); 25 | label.append(text); 26 | colsContainer.appendChild(label); 27 | } 28 | 29 | export function createLabelsInput(label) { 30 | const labelRow = document.createElement("div"); 31 | const labelInput = document.createElement("input"); 32 | 33 | labelInput.value = label; 34 | labelRow.classList = "label-edit-row"; 35 | 36 | labelRow.appendChild(labelInput); 37 | labelItemsContainer.appendChild(labelRow); 38 | 39 | labelInput.addEventListener( 40 | "keyup", 41 | debounce((e) => { 42 | changeLabel(label, e.target.value); 43 | }, 500), 44 | ); 45 | } 46 | 47 | export function mergeRow(colIndex) { 48 | const keys = {}; 49 | const tempData = []; 50 | DATA.forEach((item) => { 51 | if (keys[item[colIndex]]) { 52 | let tempDataIndex = Object.keys(keys).indexOf(item[colIndex]); 53 | item.forEach((col, index) => { 54 | if (item[index] !== tempData[tempDataIndex][index]) { 55 | tempData[tempDataIndex][index] += `, ${item[index]}`; 56 | } 57 | }); 58 | } else { 59 | keys[item[colIndex]] = true; 60 | tempData.push(item); 61 | } 62 | }); 63 | rangeStartInput.value = 1; 64 | rangeEndInput.value = tempData.length; 65 | return tempData; 66 | } 67 | -------------------------------------------------------------------------------- /src/assets/styles/sass/configForm.scss: -------------------------------------------------------------------------------- 1 | .cols-item-form { 2 | width: 100%; 3 | display: flex; 4 | padding: 10px; 5 | overflow: auto; 6 | max-height: 140px; 7 | border-radius: 4px; 8 | flex-direction: column; 9 | align-items: flex-start; 10 | border: 1px solid #ddd; 11 | } 12 | .print-config-container { 13 | width: 90%; 14 | padding: 16px; 15 | display: flex; 16 | max-width: 600px; 17 | border-radius: 8px; 18 | margin-bottom: 16px; 19 | flex-direction: column; 20 | border: 1px dashed #2C3E50; 21 | p { 22 | width: 100%; 23 | font-size: 16px; 24 | font-weight: bold; 25 | margin-bottom: 10px; 26 | } 27 | input[type=text] { 28 | width: 100%; 29 | border: none; 30 | margin-top: 8px; 31 | font-size: 14px; 32 | padding: 8px 10px; 33 | border-bottom: 2px solid #CCC; 34 | &:focus { 35 | border-bottom-color: #1E88E5; 36 | } 37 | } 38 | label { 39 | width: 100%; 40 | display: flex; 41 | cursor: pointer; 42 | font-size: 14px; 43 | margin-bottom: 8px; 44 | align-items: center; 45 | justify-content: flex-start; 46 | input { 47 | margin-right: 8px; 48 | } 49 | } 50 | } 51 | .config-form-label { 52 | min-width: 140px; 53 | } 54 | .range { 55 | width: 100%; 56 | display: flex; 57 | font-size: 14px; 58 | align-items: center; 59 | white-space: nowrap; 60 | justify-content: space-between; 61 | } 62 | .range-inputs { 63 | width: 100%; 64 | display: grid; 65 | grid-gap: 16px; 66 | grid-template-columns: 1fr 1fr; 67 | input { 68 | width: 100%; 69 | border: none; 70 | font-size: 14px; 71 | padding: 8px 10px; 72 | border-bottom: 2px solid #ccc; 73 | &:focus { 74 | border-bottom-color: #1E88E5; 75 | } 76 | } 77 | } 78 | .selector { 79 | white-space: nowrap; 80 | select { 81 | width: 100%; 82 | padding: 4px 16px; 83 | border: 2px solid #CCC; 84 | background-color: transparent; 85 | } 86 | } 87 | .config-row { 88 | display: flex; 89 | margin-top: 22px; 90 | flex-direction: column; 91 | } 92 | .input-row { 93 | width: 100%; 94 | display: grid; 95 | grid-gap: 16px; 96 | grid-template-columns: 1fr 1fr; 97 | &.is-one-col { 98 | grid-template-columns: 1fr; 99 | } 100 | } 101 | -------------------------------------------------------------------------------- /src/assets/styles/main.min.css.map: -------------------------------------------------------------------------------- 1 | {"version":3,"sourceRoot":"","sources":["sass/init.scss","sass/card.scss","sass/message.scss","sass/buttons.scss","sass/labelForm.scss","sass/uploadBtn.scss","sass/container.scss","sass/configForm.scss","sass/utils.scss","sass/printMedia.scss"],"names":[],"mappings":"AAAQ,+EAER,EACI,SACA,UACA,aACA,cACA,iBACA,sBACA,8CAGJ,KACI,uBAEJ,KACI,kBACA,sBAIJ,oBACI,UAEJ,0BACI,gBAEJ,0BACI,mBACA,kBAEJ,gCACI,eACA,mBCjCJ,iBACC,UACA,iBACA,gBAED,MACC,aACA,aACA,iBACA,kBACA,mBACA,sBACA,0BACA,SACC,WACA,eACA,kBACA,mBACA,mBACA,6BAED,QACC,WACA,eACA,eACA,gBACA,kBACA,0BAGF,cACC,WACA,aACA,uBAED,qBACC,cAGD,qBACC,8BACA,6BACC,mBAIF,oBACC,WACA,aACA,sBAED,UACC,aACA,kBACA,mBAED,iBACC,cAED,iBACC,eACA,iBACA,mBAED,iBACC,eACA,eAID,QACC,aACA,gBACA,gBACA,gBACA,iBAED,SACC,mBC9ED,YACE,UACA,WACA,eACA,gBACA,mBACA,mBACA,wBACE,cCRJ,SACC,WACA,aACA,eACA,gBACA,mBACA,uBAED,WACC,YACA,WACA,eACA,eACA,gBACA,gBACA,iBACA,kBACA,wBACA,yBACA,iBACC,yBAGF,UACC,YACA,WACA,eACA,eACA,gBACA,gBACA,iBACA,kBACA,wBACA,yBACA,gBACC,yBAGF,YACC,YACA,WACA,eACA,eACA,gBACA,gBACA,iBACA,kBACA,wBACA,yBACA,kBACC,yBAIF,SACI,WACH,YACA,eACG,eACA,iBACA,iBACA,kBACH,gBACG,qBACH,uBACG,0BACH,eACC,kBACA,gCCpEF,sBACC,UACA,aACA,aACA,gBACA,iBACA,kBACA,sBACA,yBACA,0BACA,wBACC,cACA,iBACA,mBACA,6BACC,gBACA,cAIH,gBACC,WACA,aACA,sBACC,WACA,YACA,eACA,iBACA,+BACA,6BACA,4BACC,4BC/BH,KACC,UACA,aACA,eACA,gBACA,mBACA,uBAED,mBAIC,WACA,aACA,eACA,eACA,gBACA,iBACA,kBACA,mBACA,mBACA,uBACA,wBACA,0BAdA,yBACC,aAcD,yBACC,yBAGF,6BACC,yBC7BD,WACC,WACA,aACA,iBACA,mBACA,sBACA,uBACA,cACC,eACA,iBACA,kBAED,eACC,WACA,mBAED,gBACC,UACA,WACA,eACA,gBACA,iBACA,mBACA,mBACA,mBAED,kBACC,aACA,eACA,iBAED,aACC,aACA,eACA,cACA,iBACA,qBCpCF,gBACC,WACA,aACA,aACA,cACA,iBACA,kBACA,sBACA,uBACA,sBAED,wBACC,UACA,aACA,aACA,gBACA,kBACA,mBACA,sBACA,0BACA,0BACC,WACA,eACA,iBACA,mBAED,yCACC,WACA,YACA,eACA,eACA,iBACA,6BACA,+CACC,4BAGF,8BACC,WACA,aACA,eACA,eACA,kBACA,mBACA,2BACA,oCACC,iBAIH,mBACC,gBAED,OACC,WACA,aACA,eACA,mBACA,mBACA,8BAED,cACC,WACA,aACA,cACA,8BACA,oBACC,WACA,YACA,eACA,iBACA,6BACA,0BACC,4BAIH,UACC,mBACA,iBACC,WACA,iBACA,sBACA,+BAGF,YACC,aACA,gBACA,sBAED,WACC,WACA,aACA,cACA,8BACA,sBACC,0BCjGF,UACC,aAED,WACC,MACA,OACA,QACA,SACA,UACA,WACA,WACA,aACA,aACA,eACA,mBACA,sBACA,uBACA,wBACA,gCACA,aACC,WACA,eACA,gBAED,eACC,WACA,6CAGF,qBACC,UACA,WAGD,6BACC,GACC,mBAED,IACC,qBAED,KACC,oBC1CF,aACE,4CACI","file":"main.min.css"} -------------------------------------------------------------------------------- /src/functions/utils.js: -------------------------------------------------------------------------------- 1 | export function toggleLoading() { 2 | loading.classList.toggle("is-active"); 3 | } 4 | 5 | export function showMessage(text, isWarning = false) { 6 | if (isWarning) { 7 | message.classList.add("is-warning"); 8 | message.innerHTML = `Warning: ${text}`; 9 | } else { 10 | message.classList.remove("is-warning"); 11 | message.innerHTML = `Error: ${text}`; 12 | } 13 | message.classList.remove("u-hidden"); 14 | } 15 | 16 | export function activeUploadButton(isActive = true) { 17 | const UPLOAD_BTN_TEXTS = { 18 | false: "Select Your CSV File", 19 | true: "Selected Your File", 20 | }; 21 | if (isActive) { 22 | customUploadInput.classList.add("is-active"); 23 | } else { 24 | customUploadInput.classList.remove("is-active"); 25 | } 26 | uploadBtnText.innerHTML = UPLOAD_BTN_TEXTS[isActive]; 27 | } 28 | 29 | export function changeLabel(labelId, newLabel) { 30 | const labels = document.querySelectorAll(`[data-label-id='${labelId}']`); 31 | labels.forEach((label) => { 32 | label.innerHTML = `${newLabel} : `; 33 | }); 34 | } 35 | 36 | export function debounce(func, wait, immediate) { 37 | let timeout; 38 | return function executedFunction() { 39 | let context = this; 40 | let args = arguments; 41 | let later = function () { 42 | timeout = null; 43 | if (!immediate) func.apply(context, args); 44 | }; 45 | let callNow = immediate && !timeout; 46 | clearTimeout(timeout); 47 | timeout = setTimeout(later, wait); 48 | if (callNow) func.apply(context, args); 49 | }; 50 | } 51 | 52 | export function searchInCards(searchValue = "") { 53 | document.querySelectorAll(".card").forEach((card) => { 54 | let filteredCards = Array.from(card.querySelectorAll(".card-item-value")).filter( 55 | (value) => value.innerHTML.match(searchValue), 56 | ); 57 | if (filteredCards.length > 0) { 58 | card.classList.remove("u-hidden"); 59 | } else { 60 | card.classList.add("u-hidden"); 61 | } 62 | }); 63 | } 64 | 65 | export function resetAllCheckboxes() { 66 | const allCheckboxes = document.querySelectorAll("input[type=checkbox]:checked"); 67 | if (allCheckboxes.length === 0) return; 68 | allCheckboxes.forEach((checkbox) => { 69 | checkbox.checked = false; 70 | }); 71 | } 72 | -------------------------------------------------------------------------------- /src/functions/csv.js: -------------------------------------------------------------------------------- 1 | import { createCard } from "./card.js"; 2 | import { showMessage, toggleLoading } from "./utils.js"; 3 | import { createColItem, createLabelsInput, createSelectorItem } from "./configForm.js"; 4 | 5 | export function readCSV(csv) { 6 | if (!Papa || !Papa.parse) { 7 | showMessage("Server Error"); 8 | return; 9 | } 10 | toggleLoading(); 11 | Papa.parse(csv, { 12 | step: (results) => { 13 | if (results.errors?.lenght > 0) { 14 | showMessage("Your File Has A Problem."); 15 | console.error("Error: ", results.errors); 16 | } 17 | DATA.push(results.data); 18 | }, 19 | complete: () => { 20 | COLS_TITLE = DATA.shift(); 21 | colsContainer.innerHTML = ""; 22 | COLS_TITLE.map((item, index) => createColItem(item, index)); 23 | configContainer.classList.remove("u-hidden"); 24 | toggleLoading(); 25 | createSelectorItem(); 26 | DATA.pop(); // remove empty row 27 | rangeStartInput.value = 1; 28 | rangeEndInput.max = DATA.length; 29 | rangeStartInput.max = DATA.length; 30 | rangeEndInput.value = DATA.length; 31 | }, 32 | }); 33 | } 34 | 35 | export function filterCSVData(selectedCols = []) { 36 | if (selectedCols.length === 0) { 37 | showMessage("Select the columns you want!"); 38 | return; 39 | } 40 | cardsContainer.innerHTML = ""; 41 | labelItemsContainer.innerHTML = ""; 42 | const footerText = footerInput.value; 43 | const headerText = headerInput.value; 44 | const CSV_DATA = MERGED_DATA.length > 0 ? MERGED_DATA : DATA; 45 | 46 | let dataTemp = CSV_DATA.slice( 47 | parseInt(rangeStartInput.value) - 1, 48 | parseInt(rangeEndInput.value), 49 | ); 50 | let labels = []; 51 | dataTemp.forEach((dataItem) => { 52 | let filteredRowData = dataItem.filter((itemCol, itemIndex) => 53 | selectedCols.includes(itemIndex), 54 | ); 55 | if (filteredRowData.length > 0) { 56 | labels = filteredRowData; 57 | createCard(filteredRowData, selectedCols, headerText, footerText); 58 | } else { 59 | showMessage("Some of your lines do not have the columns value!", true); 60 | } 61 | }); 62 | labels.forEach((value, index) => { 63 | createLabelsInput(COLS_TITLE[selectedCols[index]]); 64 | }); 65 | labelFormContainer.classList.remove("u-hidden"); 66 | resultCount.innerHTML = dataTemp.length; 67 | labelFormContainer.scrollIntoView({ behavior: "smooth" }); 68 | } 69 | -------------------------------------------------------------------------------- /src/functions/card.js: -------------------------------------------------------------------------------- 1 | import { showMessage } from "./utils.js"; 2 | import { filterCSVData } from "./csv.js"; 3 | 4 | export function showCards() { 5 | if (QRCheckbox.checked && !QRData.value) { 6 | showMessage("Type Your QR Data!"); 7 | return; 8 | } 9 | let checkedItem = []; 10 | searchInput.value = ""; 11 | let allCheckBoxes = document.querySelectorAll(".js-checkbox input:checked"); 12 | allCheckBoxes.forEach((item) => checkedItem.push(parseInt(item.value))); 13 | filterCSVData(checkedItem); 14 | } 15 | 16 | export function createCard(cardData = [], selectedCols = [], headerText, footerText) { 17 | const card = document.createElement("div"); 18 | const footer = document.createElement("p"); 19 | const header = document.createElement("h3"); 20 | const qrDiv = document.createElement("div"); 21 | const cardContent = document.createElement("div"); 22 | const cardRowContainer = document.createElement("div"); 23 | 24 | footer.innerHTML = footerText; 25 | header.innerHTML = headerText; 26 | 27 | card.classList = "card"; 28 | qrDiv.classList = "qr-div"; 29 | cardRowContainer.classList = "card-row-container"; 30 | cardContent.classList = "card-content"; 31 | if (RTLCheckbox.checked) { 32 | cardContent.classList.add("is-rtl"); 33 | } 34 | if (QRColLayoutCheckbox.checked) { 35 | cardContent.classList.add("is-col"); 36 | } 37 | 38 | if (headerText) { 39 | card.appendChild(header); 40 | } 41 | let QRColData = ""; 42 | cardData.forEach((value, index) => { 43 | const row = document.createElement("div"); 44 | const label = COLS_TITLE[selectedCols[index]]; 45 | const labelElm = document.createElement("label"); 46 | const valueElm = document.createElement("label"); 47 | row.classList = RTLCheckbox.checked ? "card-row is-rtl" : "card-row"; 48 | labelElm.setAttribute("data-label-id", label); 49 | labelElm.classList = "card-item-label"; 50 | valueElm.classList = "card-item-value"; 51 | labelElm.innerHTML = label + " : "; 52 | valueElm.innerHTML = value; 53 | row.appendChild(labelElm); 54 | row.appendChild(valueElm); 55 | cardRowContainer.appendChild(row); 56 | 57 | if (QRData.value === label) { 58 | QRColData = value; 59 | } else { 60 | QRColData = QRData.value; 61 | } 62 | }); 63 | 64 | cardContent.appendChild(cardRowContainer); 65 | if (QRCheckbox.checked) { 66 | new QRCode(qrDiv, { 67 | width: 100, 68 | height: 100, 69 | text: QRColData, 70 | colorDark: "#000000", 71 | colorLight: "#ffffff", 72 | correctLevel: QRCode.CorrectLevel.H, 73 | }); 74 | cardContent.appendChild(qrDiv); 75 | } 76 | card.appendChild(cardContent); 77 | if (footerText) { 78 | card.appendChild(footer); 79 | } 80 | cardsContainer.appendChild(card); 81 | } 82 | -------------------------------------------------------------------------------- /src/index.js: -------------------------------------------------------------------------------- 1 | import { readCSV } from "./functions/csv.js"; 2 | import { showCards } from "./functions/card.js"; 3 | import { mergeRow } from "./functions/configForm.js"; 4 | import { activeUploadButton, debounce, resetAllCheckboxes, searchInCards, showMessage, toggleLoading } from "./functions/utils.js"; 5 | 6 | // Events 7 | fileInput.addEventListener("change", (e) => { 8 | DATA = []; 9 | COLS_TITLE = []; 10 | e.preventDefault(); 11 | resetAllCheckboxes(); 12 | searchInput.value = ""; 13 | selector.innerHTML = ""; 14 | selector.disabled = true; 15 | cardsContainer.innerHTML = ""; 16 | message.classList.add("u-hidden"); 17 | labelItemsContainer.innerHTML = ""; 18 | configContainer.classList.add("u-hidden"); 19 | labelFormContainer.classList.add("u-hidden"); 20 | const file = e.target.files[0]; 21 | if (!file) { 22 | activeUploadButton(false); 23 | showMessage("First Select Your CSV File."); 24 | return; 25 | } 26 | activeUploadButton(true); 27 | readCSV(file); 28 | }); 29 | 30 | showBtn.addEventListener("click", (e) => { 31 | e.preventDefault(); 32 | showCards(); 33 | }); 34 | 35 | cancelBtn.addEventListener("click", (e) => { 36 | e.preventDefault(); 37 | window.location.reload(); 38 | }); 39 | 40 | printBtn.addEventListener("click", (e) => { 41 | e.preventDefault(); 42 | if(document.querySelectorAll(".card").length > 0){ 43 | window.print(); 44 | } else { 45 | showMessage("First Click On the Show Button."); 46 | } 47 | }); 48 | 49 | selector.addEventListener("change", (e) => { 50 | const value = e.target.value; 51 | if (!value) { 52 | MERGED_DATA = []; 53 | return; 54 | } 55 | MERGED_DATA = mergeRow(value); 56 | }); 57 | 58 | QRCheckbox.addEventListener("change", () => { 59 | QRData.classList.toggle("u-hidden"); 60 | }); 61 | 62 | advancedSettingsCheckbox.addEventListener("change", () => { 63 | advancedSettingsContainer.classList.toggle("u-hidden"); 64 | }); 65 | 66 | cardWidthInput.addEventListener( 67 | "keyup", 68 | debounce((e) => { 69 | const value = e.target.value; 70 | const cardMaxWidth = `${value}px`; 71 | if (value < 200 || value > window.innerWidth) { 72 | showMessage("Your width is invalid!"); 73 | return; 74 | } 75 | cardsContainer.style.maxWidth = cardMaxWidth; 76 | }, 500), 77 | ); 78 | 79 | cardMinHeightInput.addEventListener( 80 | "keyup", 81 | debounce((e) => { 82 | const value = e.target.value; 83 | const cardMinHeight = `${value}px`; 84 | if (value < 110 || value > window.innerHeight) { 85 | showMessage("Your width is invalid!"); 86 | return; 87 | } 88 | document.querySelectorAll(".card").forEach(card => card.style.minHeight = cardMinHeight); 89 | }, 500), 90 | ); 91 | 92 | searchInput.addEventListener( 93 | "keyup", 94 | debounce((e) => { 95 | searchInCards(e.target.value); 96 | }, 500), 97 | ); 98 | -------------------------------------------------------------------------------- /index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | CSV Row Printer 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 |
21 | CSV Printer 22 |

CSV Row Printer

23 | 24 | After uploading your file, select the columns you want and Print or Save PDF them as organized and designed pages. 25 |
26 | You can viwe the GitHub page. 27 | 28 | 29 | 30 |

31 | 32 | 33 |
34 | 38 |
39 | 40 | 41 |
42 |

Select Your Cols

43 |
44 |
45 | 46 |
47 |

Advanced Settings

48 | 49 | 50 | 51 | 52 | 53 |
54 |
Card Width:
55 |
56 | 57 |
58 |
59 |
60 |
Card Min Height:
61 |
62 | 63 |
64 |
65 | 66 | 70 | 71 |
72 |
Row Range:
73 |
74 | 75 | 76 |
77 |
78 | 79 |
80 | 81 | 82 |
83 |
84 |
85 | 86 | 87 | 88 |
89 |
90 |
91 | 92 | 93 |
94 |

Search Your Text ( Rows ):

95 |
96 | 97 |
98 |
99 |

Change Your Labels Text:

100 |
101 |
102 | 103 | 104 |
105 | 106 | 107 |
108 | CSV Printer 109 |

Loading ...

110 |
111 | 112 | TOP 113 | 114 | 115 | 119 | 120 | -------------------------------------------------------------------------------- /src/assets/styles/main.min.css: -------------------------------------------------------------------------------- 1 | @import"https://fonts.googleapis.com/css2?family=Baloo+Chettan+2&display=swap";*{margin:0;padding:0;outline:none;color:#2c3e50;user-select:none;box-sizing:border-box;font-family:"Baloo Chettan 2","Vazir",cursive}html{scroll-behavior:smooth}body{position:relative;background-color:#fff}::-webkit-scrollbar{width:4px}::-webkit-scrollbar-track{background:#fff}::-webkit-scrollbar-thumb{background:#d3d3d3;border-radius:8px}::-webkit-scrollbar-thumb:hover{cursor:pointer;background:#acacac}.cards-container{width:90%;margin:20px auto;max-width:600px}.card{display:flex;padding:16px;min-height:110px;border-radius:8px;margin-bottom:16px;flex-direction:column;border:1px dashed #2c3e50}.card h3{width:100%;font-size:22px;text-align:center;margin-bottom:14px;padding-bottom:8px;border-bottom:1px solid #ddd}.card p{color:#ddd;font-size:14px;margin-top:8px;padding-top:8px;text-align:center;border-top:1px solid #ddd}.card-content{width:100%;display:flex;align-items:flex-start}.card-content.is-rtl{direction:rtl}.card-content.is-col{flex-direction:column-reverse}.card-content.is-col .qr-div{margin-bottom:16px}.card-row-container{width:100%;display:flex;flex-direction:column}.card-row{display:flex;margin-bottom:8px;align-items:center}.card-row.is-rtl{direction:rtl}.card-item-label{font-size:14px;font-weight:bold;white-space:nowrap}.card-item-value{font-size:16px;padding:0 10px}.qr-div{height:100px;overflow:hidden;min-width:100px;max-width:100px;max-height:100px}.qr-data{margin-bottom:22px}.js-message{width:90%;color:#f03;font-size:16px;max-width:300px;margin-bottom:10px;text-align:justify}.js-message .is-warning{color:#ff6f00}.btn-row{width:100%;display:flex;flex-wrap:wrap;margin-top:16px;align-items:center;justify-content:center}.print-btn{border:none;color:#fff;cursor:pointer;font-size:16px;margin-top:16px;margin-left:8px;padding:6px 30px;border-radius:8px;transition-duration:.3s;background-color:#66bb6a}.print-btn:hover{background-color:#4caf50}.show-btn{border:none;color:#fff;cursor:pointer;font-size:16px;margin-top:16px;margin-left:8px;padding:6px 30px;border-radius:8px;transition-duration:.3s;background-color:#1e88e5}.show-btn:hover{background-color:#1565c0}.cancel-btn{border:none;color:#fff;cursor:pointer;font-size:16px;margin-top:16px;margin-left:8px;padding:6px 30px;border-radius:8px;transition-duration:.3s;background-color:#e91e63}.cancel-btn:hover{background-color:#d81b60}.top-btn{right:30px;bottom:30px;position:fixed;cursor:pointer;line-height:30px;padding:8px 16px;border-radius:8px;background:#fff;text-decoration:none;border:1px dashed #eee;transition-duration:300ms}.top-btn:hover{border-color:#ddd;background:rgba(238,238,238,.5)}.label-form-container{width:90%;display:flex;padding:16px;max-width:600px;margin:16px auto;border-radius:8px;flex-direction:column;background-color:#fff3e0;border:1px dashed #2c3e50}.label-form-container p{color:#ef6c00;font-weight:bold;margin-bottom:16px}.label-form-container p span{margin-left:4px;color:#ef6c00}.label-edit-row{width:100%;display:flex}.label-edit-row input{width:100%;border:none;font-size:14px;padding:8px 10px;background-color:rgba(0,0,0,0);border-bottom:2px solid #ccc}.label-edit-row input:focus{border-bottom-color:#ef6c00}form{width:90%;display:flex;flex-wrap:wrap;max-width:300px;align-items:center;justify-content:center}.custom-upload-btn{width:100%;display:flex;cursor:pointer;font-size:18px;min-height:60px;padding:8px 16px;border-radius:8px;align-items:center;margin-bottom:16px;justify-content:center;transition-duration:.3s;border:1px dashed #2c3e50}.custom-upload-btn input{display:none}.custom-upload-btn:hover{background-color:#eceff1}.custom-upload-btn.is-active{background-color:#e8f5e9}.container{width:100%;display:flex;padding-top:50px;align-items:center;flex-direction:column;justify-content:center}.container h1{font-size:40px;font-weight:bold;margin-bottom:6px}.container img{width:80px;margin-bottom:10px}.container span{width:90%;color:#999;font-size:14px;max-width:300px;line-height:20px;text-align:justify;margin-bottom:10px;margin-bottom:16px}.container strong{margin:0 2px;font-size:16px;font-weight:bold}.container a{margin:0 2px;font-size:14px;color:#1e88e5;font-weight:bold;text-decoration:none}.cols-item-form{width:100%;display:flex;padding:10px;overflow:auto;max-height:140px;border-radius:4px;flex-direction:column;align-items:flex-start;border:1px solid #ddd}.print-config-container{width:90%;padding:16px;display:flex;max-width:600px;border-radius:8px;margin-bottom:16px;flex-direction:column;border:1px dashed #2c3e50}.print-config-container p{width:100%;font-size:16px;font-weight:bold;margin-bottom:10px}.print-config-container input[type=text]{width:100%;border:none;margin-top:8px;font-size:14px;padding:8px 10px;border-bottom:2px solid #ccc}.print-config-container input[type=text]:focus{border-bottom-color:#1e88e5}.print-config-container label{width:100%;display:flex;cursor:pointer;font-size:14px;margin-bottom:8px;align-items:center;justify-content:flex-start}.print-config-container label input{margin-right:8px}.config-form-label{min-width:140px}.range{width:100%;display:flex;font-size:14px;align-items:center;white-space:nowrap;justify-content:space-between}.range-inputs{width:100%;display:grid;grid-gap:16px;grid-template-columns:1fr 1fr}.range-inputs input{width:100%;border:none;font-size:14px;padding:8px 10px;border-bottom:2px solid #ccc}.range-inputs input:focus{border-bottom-color:#1e88e5}.selector{white-space:nowrap}.selector select{width:100%;padding:4px 16px;border:2px solid #ccc;background-color:rgba(0,0,0,0)}.config-row{display:flex;margin-top:22px;flex-direction:column}.input-row{width:100%;display:grid;grid-gap:16px;grid-template-columns:1fr 1fr}.input-row.is-one-col{grid-template-columns:1fr}.u-hidden{display:none}.u-loading{top:0;left:0;right:0;bottom:0;opacity:0;z-index:-1;width:100%;height:100vh;display:flex;position:fixed;align-items:center;flex-direction:column;justify-content:center;transition-duration:.5s;background-color:rgba(0,0,0,.8)}.u-loading p{color:#fff;font-size:14px;margin-top:16px}.u-loading img{width:50px;animation:loading-animation 2s infinite ease}.u-loading.is-active{opacity:1;z-index:10}@keyframes loading-animation{0%{transform:scale(1)}50%{transform:scale(0.8)}100%{transform:scale(1)}}@media print{.container,.u-loading,.label-form-container{display:none}}/*# sourceMappingURL=main.min.css.map */ 2 | -------------------------------------------------------------------------------- /yarn.lock: -------------------------------------------------------------------------------- 1 | # THIS IS AN AUTOGENERATED FILE. DO NOT EDIT THIS FILE DIRECTLY. 2 | # yarn lockfile v1 3 | 4 | 5 | anymatch@~3.1.2: 6 | version "3.1.3" 7 | resolved "https://registry.yarnpkg.com/anymatch/-/anymatch-3.1.3.tgz#790c58b19ba1720a84205b57c618d5ad8524973e" 8 | integrity sha512-KMReFUr0B4t+D+OBkjR3KYqvocp2XaSzO55UcB6mgQMd3KbcE+mWTyvVV7D/zsdEbNnV6acZUutkiHQXvTr1Rw== 9 | dependencies: 10 | normalize-path "^3.0.0" 11 | picomatch "^2.0.4" 12 | 13 | binary-extensions@^2.0.0: 14 | version "2.2.0" 15 | resolved "https://registry.yarnpkg.com/binary-extensions/-/binary-extensions-2.2.0.tgz#75f502eeaf9ffde42fc98829645be4ea76bd9e2d" 16 | integrity sha512-jDctJ/IVQbZoJykoeHbhXpOlNBqGNcwXJKJog42E5HDPUwQTSdjCHdihjj0DlnheQ7blbT6dHOafNAiS8ooQKA== 17 | 18 | braces@~3.0.2: 19 | version "3.0.2" 20 | resolved "https://registry.yarnpkg.com/braces/-/braces-3.0.2.tgz#3454e1a462ee8d599e236df336cd9ea4f8afe107" 21 | integrity sha512-b8um+L1RzM3WDSzvhm6gIz1yfTbBt6YTlcEKAvsmqCZZFw46z626lVj9j1yEPW33H5H+lBQpZMP1k8l+78Ha0A== 22 | dependencies: 23 | fill-range "^7.0.1" 24 | 25 | "chokidar@>=3.0.0 <4.0.0": 26 | version "3.5.3" 27 | resolved "https://registry.yarnpkg.com/chokidar/-/chokidar-3.5.3.tgz#1cf37c8707b932bd1af1ae22c0432e2acd1903bd" 28 | integrity sha512-Dr3sfKRP6oTcjf2JmUmFJfeVMvXBdegxB0iVQ5eb2V10uFJUCAS8OByZdVAyVb8xXNz3GjjTgj9kLWsZTqE6kw== 29 | dependencies: 30 | anymatch "~3.1.2" 31 | braces "~3.0.2" 32 | glob-parent "~5.1.2" 33 | is-binary-path "~2.1.0" 34 | is-glob "~4.0.1" 35 | normalize-path "~3.0.0" 36 | readdirp "~3.6.0" 37 | optionalDependencies: 38 | fsevents "~2.3.2" 39 | 40 | fill-range@^7.0.1: 41 | version "7.0.1" 42 | resolved "https://registry.yarnpkg.com/fill-range/-/fill-range-7.0.1.tgz#1919a6a7c75fe38b2c7c77e5198535da9acdda40" 43 | integrity sha512-qOo9F+dMUmC2Lcb4BbVvnKJxTPjCm+RRpe4gDuGrzkL7mEVl/djYSu2OdQ2Pa302N4oqkSg9ir6jaLWJ2USVpQ== 44 | dependencies: 45 | to-regex-range "^5.0.1" 46 | 47 | fsevents@~2.3.2: 48 | version "2.3.2" 49 | resolved "https://registry.yarnpkg.com/fsevents/-/fsevents-2.3.2.tgz#8a526f78b8fdf4623b709e0b975c52c24c02fd1a" 50 | integrity sha512-xiqMQR4xAeHTuB9uWm+fFRcIOgKBMiOBP+eXiyT7jsgVCq1bkVygt00oASowB7EdtpOHaaPgKt812P9ab+DDKA== 51 | 52 | glob-parent@~5.1.2: 53 | version "5.1.2" 54 | resolved "https://registry.yarnpkg.com/glob-parent/-/glob-parent-5.1.2.tgz#869832c58034fe68a4093c17dc15e8340d8401c4" 55 | integrity sha512-AOIgSQCepiJYwP3ARnGx+5VnTu2HBYdzbGP45eLw1vr3zB3vZLeyed1sC9hnbcOc9/SrMyM5RPQrkGz4aS9Zow== 56 | dependencies: 57 | is-glob "^4.0.1" 58 | 59 | husky@^7.0.1: 60 | version "7.0.4" 61 | resolved "https://registry.yarnpkg.com/husky/-/husky-7.0.4.tgz#242048245dc49c8fb1bf0cc7cfb98dd722531535" 62 | integrity sha512-vbaCKN2QLtP/vD4yvs6iz6hBEo6wkSzs8HpRah1Z6aGmF2KW5PdYuAd7uX5a+OyBZHBhd+TFLqgjUgytQr4RvQ== 63 | 64 | immutable@^4.0.0: 65 | version "4.3.0" 66 | resolved "https://registry.yarnpkg.com/immutable/-/immutable-4.3.0.tgz#eb1738f14ffb39fd068b1dbe1296117484dd34be" 67 | integrity sha512-0AOCmOip+xgJwEVTQj1EfiDDOkPmuyllDuTuEX+DDXUgapLAsBIfkg3sxCYyCEA8mQqZrrxPUGjcOQ2JS3WLkg== 68 | 69 | is-binary-path@~2.1.0: 70 | version "2.1.0" 71 | resolved "https://registry.yarnpkg.com/is-binary-path/-/is-binary-path-2.1.0.tgz#ea1f7f3b80f064236e83470f86c09c254fb45b09" 72 | integrity sha512-ZMERYes6pDydyuGidse7OsHxtbI7WVeUEozgR/g7rd0xUimYNlvZRE/K2MgZTjWy725IfelLeVcEM97mmtRGXw== 73 | dependencies: 74 | binary-extensions "^2.0.0" 75 | 76 | is-extglob@^2.1.1: 77 | version "2.1.1" 78 | resolved "https://registry.yarnpkg.com/is-extglob/-/is-extglob-2.1.1.tgz#a88c02535791f02ed37c76a1b9ea9773c833f8c2" 79 | integrity sha512-SbKbANkN603Vi4jEZv49LeVJMn4yGwsbzZworEoyEiutsN3nJYdbO36zfhGJ6QEDpOZIFkDtnq5JRxmvl3jsoQ== 80 | 81 | is-glob@^4.0.1, is-glob@~4.0.1: 82 | version "4.0.3" 83 | resolved "https://registry.yarnpkg.com/is-glob/-/is-glob-4.0.3.tgz#64f61e42cbbb2eec2071a9dac0b28ba1e65d5084" 84 | integrity sha512-xelSayHH36ZgE7ZWhli7pW34hNbNl8Ojv5KVmkJD4hBdD3th8Tfk9vYasLM+mXWOZhFkgZfxhLSnrwRr4elSSg== 85 | dependencies: 86 | is-extglob "^2.1.1" 87 | 88 | is-number@^7.0.0: 89 | version "7.0.0" 90 | resolved "https://registry.yarnpkg.com/is-number/-/is-number-7.0.0.tgz#7535345b896734d5f80c4d06c50955527a14f12b" 91 | integrity sha512-41Cifkg6e8TylSpdtTpeLVMqvSBEVzTttHvERD741+pnZ8ANv0004MRL43QKPDlK9cGvNp6NZWZUBlbGXYxxng== 92 | 93 | normalize-path@^3.0.0, normalize-path@~3.0.0: 94 | version "3.0.0" 95 | resolved "https://registry.yarnpkg.com/normalize-path/-/normalize-path-3.0.0.tgz#0dcd69ff23a1c9b11fd0978316644a0388216a65" 96 | integrity sha512-6eZs5Ls3WtCisHWp9S2GUy8dqkpGi4BVSz3GaqiE6ezub0512ESztXUwUB6C6IKbQkY2Pnb/mD4WYojCRwcwLA== 97 | 98 | picomatch@^2.0.4, picomatch@^2.2.1: 99 | version "2.3.1" 100 | resolved "https://registry.yarnpkg.com/picomatch/-/picomatch-2.3.1.tgz#3ba3833733646d9d3e4995946c1365a67fb07a42" 101 | integrity sha512-JU3teHTNjmE2VCGFzuY8EXzCDVwEqB2a8fsIvwaStHhAWJEeVd1o1QD80CU6+ZdEXXSLbSsuLwJjkCBWqRQUVA== 102 | 103 | prettier@2.3.2: 104 | version "2.3.2" 105 | resolved "https://registry.yarnpkg.com/prettier/-/prettier-2.3.2.tgz#ef280a05ec253712e486233db5c6f23441e7342d" 106 | integrity sha512-lnJzDfJ66zkMy58OL5/NY5zp70S7Nz6KqcKkXYzn2tMVrNxvbqaBpg7H3qHaLxCJ5lNMsGuM8+ohS7cZrthdLQ== 107 | 108 | readdirp@~3.6.0: 109 | version "3.6.0" 110 | resolved "https://registry.yarnpkg.com/readdirp/-/readdirp-3.6.0.tgz#74a370bd857116e245b29cc97340cd431a02a6c7" 111 | integrity sha512-hOS089on8RduqdbhvQ5Z37A0ESjsqz6qnRcffsMU3495FuTdqSm+7bhJ29JvIOsBDEEnan5DPu9t3To9VRlMzA== 112 | dependencies: 113 | picomatch "^2.2.1" 114 | 115 | sass@^1.36.0: 116 | version "1.61.0" 117 | resolved "https://registry.yarnpkg.com/sass/-/sass-1.61.0.tgz#d1f6761bb833887b8fdab32a24e052c40531d02b" 118 | integrity sha512-PDsN7BrVkNZK2+dj/dpKQAWZavbAQ87IXqVvw2+oEYI+GwlTWkvbQtL7F2cCNbMqJEYKPh1EcjSxsnqIb/kyaQ== 119 | dependencies: 120 | chokidar ">=3.0.0 <4.0.0" 121 | immutable "^4.0.0" 122 | source-map-js ">=0.6.2 <2.0.0" 123 | 124 | "source-map-js@>=0.6.2 <2.0.0": 125 | version "1.0.2" 126 | resolved "https://registry.yarnpkg.com/source-map-js/-/source-map-js-1.0.2.tgz#adbc361d9c62df380125e7f161f71c826f1e490c" 127 | integrity sha512-R0XvVJ9WusLiqTCEiGCmICCMplcCkIwwR11mOSD9CR5u+IXYdiseeEuXCVAjS54zqwkLcPNnmU4OeJ6tUrWhDw== 128 | 129 | to-regex-range@^5.0.1: 130 | version "5.0.1" 131 | resolved "https://registry.yarnpkg.com/to-regex-range/-/to-regex-range-5.0.1.tgz#1648c44aae7c8d988a326018ed72f5b4dd0392e4" 132 | integrity sha512-65P7iz6X5yEr1cwcgvQxbbIw7Uk3gOy5dIdtZ4rDveLqhrdJP+Li/Hx6tyK0NEb+2GCyneCMJiGqrADCSNk8sQ== 133 | dependencies: 134 | is-number "^7.0.0" 135 | -------------------------------------------------------------------------------- /src/assets/libs/papaparse.min.js: -------------------------------------------------------------------------------- 1 | /* @license 2 | Papa Parse 3 | v5.0.2 4 | https://github.com/mholt/PapaParse 5 | License: MIT 6 | */ 7 | !function(e,t){"function"==typeof define&&define.amd?define([],t):"object"==typeof module&&"undefined"!=typeof exports?module.exports=t():e.Papa=t()}(this,function s(){"use strict";var f="undefined"!=typeof self?self:"undefined"!=typeof window?window:void 0!==f?f:{};var n=!f.document&&!!f.postMessage,o=n&&/blob:/i.test((f.location||{}).protocol),a={},h=0,b={parse:function(e,t){var r=(t=t||{}).dynamicTyping||!1;q(r)&&(t.dynamicTypingFunction=r,r={});if(t.dynamicTyping=r,t.transform=!!q(t.transform)&&t.transform,t.worker&&b.WORKERS_SUPPORTED){var i=function(){if(!b.WORKERS_SUPPORTED)return!1;var e=(r=f.URL||f.webkitURL||null,i=s.toString(),b.BLOB_URL||(b.BLOB_URL=r.createObjectURL(new Blob(["(",i,")();"],{type:"text/javascript"})))),t=new f.Worker(e);var r,i;return t.onmessage=_,t.id=h++,a[t.id]=t}();return i.userStep=t.step,i.userChunk=t.chunk,i.userComplete=t.complete,i.userError=t.error,t.step=q(t.step),t.chunk=q(t.chunk),t.complete=q(t.complete),t.error=q(t.error),delete t.worker,void i.postMessage({input:e,config:t,workerId:i.id})}var n=null;b.NODE_STREAM_INPUT,"string"==typeof e?n=t.download?new l(t):new p(t):!0===e.readable&&q(e.read)&&q(e.on)?n=new m(t):(f.File&&e instanceof File||e instanceof Object)&&(n=new c(t));return n.stream(e)},unparse:function(e,t){var i=!1,_=!0,g=",",v="\r\n",n='"',s=n+n,r=!1,a=null;!function(){if("object"!=typeof t)return;"string"!=typeof t.delimiter||b.BAD_DELIMITERS.filter(function(e){return-1!==t.delimiter.indexOf(e)}).length||(g=t.delimiter);("boolean"==typeof t.quotes||Array.isArray(t.quotes))&&(i=t.quotes);"boolean"!=typeof t.skipEmptyLines&&"string"!=typeof t.skipEmptyLines||(r=t.skipEmptyLines);"string"==typeof t.newline&&(v=t.newline);"string"==typeof t.quoteChar&&(n=t.quoteChar);"boolean"==typeof t.header&&(_=t.header);if(Array.isArray(t.columns)){if(0===t.columns.length)throw new Error("Option columns is empty");a=t.columns}void 0!==t.escapeChar&&(s=t.escapeChar+n)}();var o=new RegExp(U(n),"g");"string"==typeof e&&(e=JSON.parse(e));if(Array.isArray(e)){if(!e.length||Array.isArray(e[0]))return u(null,e,r);if("object"==typeof e[0])return u(a||h(e[0]),e,r)}else if("object"==typeof e)return"string"==typeof e.data&&(e.data=JSON.parse(e.data)),Array.isArray(e.data)&&(e.fields||(e.fields=e.meta&&e.meta.fields),e.fields||(e.fields=Array.isArray(e.data[0])?e.fields:h(e.data[0])),Array.isArray(e.data[0])||"object"==typeof e.data[0]||(e.data=[e.data])),u(e.fields||[],e.data||[],r);throw new Error("Unable to serialize unrecognized input");function h(e){if("object"!=typeof e)return[];var t=[];for(var r in e)t.push(r);return t}function u(e,t,r){var i="";"string"==typeof e&&(e=JSON.parse(e)),"string"==typeof t&&(t=JSON.parse(t));var n=Array.isArray(e)&&0=this._config.preview;if(o)f.postMessage({results:n,workerId:b.WORKER_ID,finished:a});else if(q(this._config.chunk)&&!t){if(this._config.chunk(n,this._handle),this._handle.paused()||this._handle.aborted())return void(this._halted=!0);n=void 0,this._completeResults=void 0}return this._config.step||this._config.chunk||(this._completeResults.data=this._completeResults.data.concat(n.data),this._completeResults.errors=this._completeResults.errors.concat(n.errors),this._completeResults.meta=n.meta),this._completed||!a||!q(this._config.complete)||n&&n.meta.aborted||(this._config.complete(this._completeResults,this._input),this._completed=!0),a||n&&n.meta.paused||this._nextChunk(),n}this._halted=!0},this._sendError=function(e){q(this._config.error)?this._config.error(e):o&&this._config.error&&f.postMessage({workerId:b.WORKER_ID,error:e,finished:!1})}}function l(e){var i;(e=e||{}).chunkSize||(e.chunkSize=b.RemoteChunkSize),u.call(this,e),this._nextChunk=n?function(){this._readChunk(),this._chunkLoaded()}:function(){this._readChunk()},this.stream=function(e){this._input=e,this._nextChunk()},this._readChunk=function(){if(this._finished)this._chunkLoaded();else{if(i=new XMLHttpRequest,this._config.withCredentials&&(i.withCredentials=this._config.withCredentials),n||(i.onload=y(this._chunkLoaded,this),i.onerror=y(this._chunkError,this)),i.open("GET",this._input,!n),this._config.downloadRequestHeaders){var e=this._config.downloadRequestHeaders;for(var t in e)i.setRequestHeader(t,e[t])}if(this._config.chunkSize){var r=this._start+this._config.chunkSize-1;i.setRequestHeader("Range","bytes="+this._start+"-"+r)}try{i.send()}catch(e){this._chunkError(e.message)}n&&0===i.status?this._chunkError():this._start+=this._config.chunkSize}},this._chunkLoaded=function(){4===i.readyState&&(i.status<200||400<=i.status?this._chunkError():(this._finished=!this._config.chunkSize||this._start>function(e){var t=e.getResponseHeader("Content-Range");if(null===t)return-1;return parseInt(t.substr(t.lastIndexOf("/")+1))}(i),this.parseChunk(i.responseText)))},this._chunkError=function(e){var t=i.statusText||e;this._sendError(new Error(t))}}function c(e){var i,n;(e=e||{}).chunkSize||(e.chunkSize=b.LocalChunkSize),u.call(this,e);var s="undefined"!=typeof FileReader;this.stream=function(e){this._input=e,n=e.slice||e.webkitSlice||e.mozSlice,s?((i=new FileReader).onload=y(this._chunkLoaded,this),i.onerror=y(this._chunkError,this)):i=new FileReaderSync,this._nextChunk()},this._nextChunk=function(){this._finished||this._config.preview&&!(this._rowCount=this._input.size,this.parseChunk(e.target.result)},this._chunkError=function(){this._sendError(i.error)}}function p(e){var r;u.call(this,e=e||{}),this.stream=function(e){return r=e,this._nextChunk()},this._nextChunk=function(){if(!this._finished){var e=this._config.chunkSize,t=e?r.substr(0,e):r;return r=e?r.substr(e):"",this._finished=!r,this.parseChunk(t)}}}function m(e){u.call(this,e=e||{});var t=[],r=!0,i=!1;this.pause=function(){u.prototype.pause.apply(this,arguments),this._input.pause()},this.resume=function(){u.prototype.resume.apply(this,arguments),this._input.resume()},this.stream=function(e){this._input=e,this._input.on("data",this._streamData),this._input.on("end",this._streamEnd),this._input.on("error",this._streamError)},this._checkIsFinished=function(){i&&1===t.length&&(this._finished=!0)},this._nextChunk=function(){this._checkIsFinished(),t.length?this.parseChunk(t.shift()):r=!0},this._streamData=y(function(e){try{t.push("string"==typeof e?e:e.toString(this._config.encoding)),r&&(r=!1,this._checkIsFinished(),this.parseChunk(t.shift()))}catch(e){this._streamError(e)}},this),this._streamError=y(function(e){this._streamCleanUp(),this._sendError(e)},this),this._streamEnd=y(function(){this._streamCleanUp(),i=!0,this._streamData("")},this),this._streamCleanUp=y(function(){this._input.removeListener("data",this._streamData),this._input.removeListener("end",this._streamEnd),this._input.removeListener("error",this._streamError)},this)}function r(g){var a,o,h,i=Math.pow(2,53),n=-i,s=/^\s*-?(\d*\.?\d+|\d+\.?\d*)(e[-+]?\d+)?\s*$/i,u=/(\d{4}-[01]\d-[0-3]\dT[0-2]\d:[0-5]\d:[0-5]\d\.\d+([+-][0-2]\d:[0-5]\d|Z))|(\d{4}-[01]\d-[0-3]\dT[0-2]\d:[0-5]\d:[0-5]\d([+-][0-2]\d:[0-5]\d|Z))|(\d{4}-[01]\d-[0-3]\dT[0-2]\d:[0-5]\d([+-][0-2]\d:[0-5]\d|Z))/,t=this,r=0,f=0,d=!1,e=!1,l=[],c={data:[],errors:[],meta:{}};if(q(g.step)){var p=g.step;g.step=function(e){if(c=e,_())m();else{if(m(),0===c.data.length)return;r+=e.data.length,g.preview&&r>g.preview?o.abort():p(c,t)}}}function v(e){return"greedy"===g.skipEmptyLines?""===e.join("").trim():1===e.length&&0===e[0].length}function m(){if(c&&h&&(k("Delimiter","UndetectableDelimiter","Unable to auto-detect delimiting character; defaulted to '"+b.DefaultDelimiter+"'"),h=!1),g.skipEmptyLines)for(var e=0;e=l.length?"__parsed_extra":l[r]),g.transform&&(s=g.transform(s,n)),s=y(n,s),"__parsed_extra"===n?(i[n]=i[n]||[],i[n].push(s)):i[n]=s}return g.header&&(r>l.length?k("FieldMismatch","TooManyFields","Too many fields: expected "+l.length+" fields but parsed "+r,f+t):r=i.length/2?"\r\n":"\r"}(e,i)),h=!1,g.delimiter)q(g.delimiter)&&(g.delimiter=g.delimiter(e),c.meta.delimiter=g.delimiter);else{var n=function(e,t,r,i,n){var s,a,o,h;n=n||[",","\t","|",";",b.RECORD_SEP,b.UNIT_SEP];for(var u=0;u=L)return R(!0)}else for(g=M,M++;;){if(-1===(g=a.indexOf(O,g+1)))return t||u.push({type:"Quotes",code:"MissingQuotes",message:"Quoted field unterminated",row:h.length,index:M}),w();if(g===i-1)return w(a.substring(M,g).replace(_,O));if(O!==z||a[g+1]!==z){if(O===z||0===g||a[g-1]!==z){var y=E(-1===m?p:Math.min(p,m));if(a[g+1+y]===D){f.push(a.substring(M,g).replace(_,O)),a[M=g+1+y+e]!==O&&(g=a.indexOf(O,M)),p=a.indexOf(D,M),m=a.indexOf(I,M);break}var k=E(m);if(a.substr(g+1+k,n)===I){if(f.push(a.substring(M,g).replace(_,O)),C(g+1+k+n),p=a.indexOf(D,M),g=a.indexOf(O,M),o&&(S(),j))return R();if(L&&h.length>=L)return R(!0);break}u.push({type:"Quotes",code:"InvalidQuotes",message:"Trailing quote on quoted field is malformed",row:h.length,index:M}),g++}}else g++}return w();function b(e){h.push(e),d=M}function E(e){var t=0;if(-1!==e){var r=a.substring(g+1,e);r&&""===r.trim()&&(t=r.length)}return t}function w(e){return t||(void 0===e&&(e=a.substr(M)),f.push(e),M=i,b(f),o&&S()),R()}function C(e){M=e,b(f),f=[],m=a.indexOf(I,M)}function R(e,t){return{data:t||!1?h[0]:h,errors:u,meta:{delimiter:D,linebreak:I,aborted:j,truncated:!!e,cursor:d+(r||0)}}}function S(){A(R(void 0,!0)),h=[],u=[]}function x(e,t,r){var i={nextDelim:void 0,quoteSearch:void 0},n=a.indexOf(O,t+1);if(td;d++){var f=this.data.charCodeAt(d);f>65536?(b[0]=240|(1835008&f)>>>18,b[1]=128|(258048&f)>>>12,b[2]=128|(4032&f)>>>6,b[3]=128|63&f):f>2048?(b[0]=224|(61440&f)>>>12,b[1]=128|(4032&f)>>>6,b[2]=128|63&f):f>128?(b[0]=192|(1984&f)>>>6,b[1]=128|63&f):b[0]=f,this.parsedData=this.parsedData.concat(b)}this.parsedData.length!=this.data.length&&(this.parsedData.unshift(191),this.parsedData.unshift(187),this.parsedData.unshift(239))}function b(a,b){this.typeNumber=a,this.errorCorrectLevel=b,this.modules=null,this.moduleCount=0,this.dataCache=null,this.dataList=[]}function i(a,b){if(void 0==a.length)throw new Error(a.length+"/"+b);for(var c=0;c=f;f++){var h=0;switch(b){case d.L:h=l[f][0];break;case d.M:h=l[f][1];break;case d.Q:h=l[f][2];break;case d.H:h=l[f][3]}if(h>=e)break;c++}if(c>l.length)throw new Error("Too long data");return c}function s(a){var b=encodeURI(a).toString().replace(/\%[0-9a-fA-F]{2}/g,"a");return b.length+(b.length!=a?3:0)}a.prototype={getLength:function(){return this.parsedData.length},write:function(a){for(var b=0,c=this.parsedData.length;c>b;b++)a.put(this.parsedData[b],8)}},b.prototype={addData:function(b){var c=new a(b);this.dataList.push(c),this.dataCache=null},isDark:function(a,b){if(0>a||this.moduleCount<=a||0>b||this.moduleCount<=b)throw new Error(a+","+b);return this.modules[a][b]},getModuleCount:function(){return this.moduleCount},make:function(){this.makeImpl(!1,this.getBestMaskPattern())},makeImpl:function(a,c){this.moduleCount=4*this.typeNumber+17,this.modules=new Array(this.moduleCount);for(var d=0;d=7&&this.setupTypeNumber(a),null==this.dataCache&&(this.dataCache=b.createData(this.typeNumber,this.errorCorrectLevel,this.dataList)),this.mapData(this.dataCache,c)},setupPositionProbePattern:function(a,b){for(var c=-1;7>=c;c++)if(!(-1>=a+c||this.moduleCount<=a+c))for(var d=-1;7>=d;d++)-1>=b+d||this.moduleCount<=b+d||(this.modules[a+c][b+d]=c>=0&&6>=c&&(0==d||6==d)||d>=0&&6>=d&&(0==c||6==c)||c>=2&&4>=c&&d>=2&&4>=d?!0:!1)},getBestMaskPattern:function(){for(var a=0,b=0,c=0;8>c;c++){this.makeImpl(!0,c);var d=f.getLostPoint(this);(0==c||a>d)&&(a=d,b=c)}return b},createMovieClip:function(a,b,c){var d=a.createEmptyMovieClip(b,c),e=1;this.make();for(var f=0;f=g;g++)for(var h=-2;2>=h;h++)this.modules[d+g][e+h]=-2==g||2==g||-2==h||2==h||0==g&&0==h?!0:!1}},setupTypeNumber:function(a){for(var b=f.getBCHTypeNumber(this.typeNumber),c=0;18>c;c++){var d=!a&&1==(1&b>>c);this.modules[Math.floor(c/3)][c%3+this.moduleCount-8-3]=d}for(var c=0;18>c;c++){var d=!a&&1==(1&b>>c);this.modules[c%3+this.moduleCount-8-3][Math.floor(c/3)]=d}},setupTypeInfo:function(a,b){for(var c=this.errorCorrectLevel<<3|b,d=f.getBCHTypeInfo(c),e=0;15>e;e++){var g=!a&&1==(1&d>>e);6>e?this.modules[e][8]=g:8>e?this.modules[e+1][8]=g:this.modules[this.moduleCount-15+e][8]=g}for(var e=0;15>e;e++){var g=!a&&1==(1&d>>e);8>e?this.modules[8][this.moduleCount-e-1]=g:9>e?this.modules[8][15-e-1+1]=g:this.modules[8][15-e-1]=g}this.modules[this.moduleCount-8][8]=!a},mapData:function(a,b){for(var c=-1,d=this.moduleCount-1,e=7,g=0,h=this.moduleCount-1;h>0;h-=2)for(6==h&&h--;;){for(var i=0;2>i;i++)if(null==this.modules[d][h-i]){var j=!1;g>>e));var k=f.getMask(b,d,h-i);k&&(j=!j),this.modules[d][h-i]=j,e--,-1==e&&(g++,e=7)}if(d+=c,0>d||this.moduleCount<=d){d-=c,c=-c;break}}}},b.PAD0=236,b.PAD1=17,b.createData=function(a,c,d){for(var e=j.getRSBlocks(a,c),g=new k,h=0;h8*l)throw new Error("code length overflow. ("+g.getLengthInBits()+">"+8*l+")");for(g.getLengthInBits()+4<=8*l&&g.put(0,4);0!=g.getLengthInBits()%8;)g.putBit(!1);for(;;){if(g.getLengthInBits()>=8*l)break;if(g.put(b.PAD0,8),g.getLengthInBits()>=8*l)break;g.put(b.PAD1,8)}return b.createBytes(g,e)},b.createBytes=function(a,b){for(var c=0,d=0,e=0,g=new Array(b.length),h=new Array(b.length),j=0;j=0?p.get(q):0}}for(var r=0,m=0;mm;m++)for(var j=0;jm;m++)for(var j=0;j=0;)b^=f.G15<=0;)b^=f.G18<>>=1;return b},getPatternPosition:function(a){return f.PATTERN_POSITION_TABLE[a-1]},getMask:function(a,b,c){switch(a){case e.PATTERN000:return 0==(b+c)%2;case e.PATTERN001:return 0==b%2;case e.PATTERN010:return 0==c%3;case e.PATTERN011:return 0==(b+c)%3;case e.PATTERN100:return 0==(Math.floor(b/2)+Math.floor(c/3))%2;case e.PATTERN101:return 0==b*c%2+b*c%3;case e.PATTERN110:return 0==(b*c%2+b*c%3)%2;case e.PATTERN111:return 0==(b*c%3+(b+c)%2)%2;default:throw new Error("bad maskPattern:"+a)}},getErrorCorrectPolynomial:function(a){for(var b=new i([1],0),c=0;a>c;c++)b=b.multiply(new i([1,g.gexp(c)],0));return b},getLengthInBits:function(a,b){if(b>=1&&10>b)switch(a){case c.MODE_NUMBER:return 10;case c.MODE_ALPHA_NUM:return 9;case c.MODE_8BIT_BYTE:return 8;case c.MODE_KANJI:return 8;default:throw new Error("mode:"+a)}else if(27>b)switch(a){case c.MODE_NUMBER:return 12;case c.MODE_ALPHA_NUM:return 11;case c.MODE_8BIT_BYTE:return 16;case c.MODE_KANJI:return 10;default:throw new Error("mode:"+a)}else{if(!(41>b))throw new Error("type:"+b);switch(a){case c.MODE_NUMBER:return 14;case c.MODE_ALPHA_NUM:return 13;case c.MODE_8BIT_BYTE:return 16;case c.MODE_KANJI:return 12;default:throw new Error("mode:"+a)}}},getLostPoint:function(a){for(var b=a.getModuleCount(),c=0,d=0;b>d;d++)for(var e=0;b>e;e++){for(var f=0,g=a.isDark(d,e),h=-1;1>=h;h++)if(!(0>d+h||d+h>=b))for(var i=-1;1>=i;i++)0>e+i||e+i>=b||(0!=h||0!=i)&&g==a.isDark(d+h,e+i)&&f++;f>5&&(c+=3+f-5)}for(var d=0;b-1>d;d++)for(var e=0;b-1>e;e++){var j=0;a.isDark(d,e)&&j++,a.isDark(d+1,e)&&j++,a.isDark(d,e+1)&&j++,a.isDark(d+1,e+1)&&j++,(0==j||4==j)&&(c+=3)}for(var d=0;b>d;d++)for(var e=0;b-6>e;e++)a.isDark(d,e)&&!a.isDark(d,e+1)&&a.isDark(d,e+2)&&a.isDark(d,e+3)&&a.isDark(d,e+4)&&!a.isDark(d,e+5)&&a.isDark(d,e+6)&&(c+=40);for(var e=0;b>e;e++)for(var d=0;b-6>d;d++)a.isDark(d,e)&&!a.isDark(d+1,e)&&a.isDark(d+2,e)&&a.isDark(d+3,e)&&a.isDark(d+4,e)&&!a.isDark(d+5,e)&&a.isDark(d+6,e)&&(c+=40);for(var k=0,e=0;b>e;e++)for(var d=0;b>d;d++)a.isDark(d,e)&&k++;var l=Math.abs(100*k/b/b-50)/5;return c+=10*l}},g={glog:function(a){if(1>a)throw new Error("glog("+a+")");return g.LOG_TABLE[a]},gexp:function(a){for(;0>a;)a+=255;for(;a>=256;)a-=255;return g.EXP_TABLE[a]},EXP_TABLE:new Array(256),LOG_TABLE:new Array(256)},h=0;8>h;h++)g.EXP_TABLE[h]=1<h;h++)g.EXP_TABLE[h]=g.EXP_TABLE[h-4]^g.EXP_TABLE[h-5]^g.EXP_TABLE[h-6]^g.EXP_TABLE[h-8];for(var h=0;255>h;h++)g.LOG_TABLE[g.EXP_TABLE[h]]=h;i.prototype={get:function(a){return this.num[a]},getLength:function(){return this.num.length},multiply:function(a){for(var b=new Array(this.getLength()+a.getLength()-1),c=0;cf;f++)for(var g=c[3*f+0],h=c[3*f+1],i=c[3*f+2],k=0;g>k;k++)e.push(new j(h,i));return e},j.getRsBlockTable=function(a,b){switch(b){case d.L:return j.RS_BLOCK_TABLE[4*(a-1)+0];case d.M:return j.RS_BLOCK_TABLE[4*(a-1)+1];case d.Q:return j.RS_BLOCK_TABLE[4*(a-1)+2];case d.H:return j.RS_BLOCK_TABLE[4*(a-1)+3];default:return void 0}},k.prototype={get:function(a){var b=Math.floor(a/8);return 1==(1&this.buffer[b]>>>7-a%8)},put:function(a,b){for(var c=0;b>c;c++)this.putBit(1==(1&a>>>b-c-1))},getLengthInBits:function(){return this.length},putBit:function(a){var b=Math.floor(this.length/8);this.buffer.length<=b&&this.buffer.push(0),a&&(this.buffer[b]|=128>>>this.length%8),this.length++}};var l=[[17,14,11,7],[32,26,20,14],[53,42,32,24],[78,62,46,34],[106,84,60,44],[134,106,74,58],[154,122,86,64],[192,152,108,84],[230,180,130,98],[271,213,151,119],[321,251,177,137],[367,287,203,155],[425,331,241,177],[458,362,258,194],[520,412,292,220],[586,450,322,250],[644,504,364,280],[718,560,394,310],[792,624,442,338],[858,666,482,382],[929,711,509,403],[1003,779,565,439],[1091,857,611,461],[1171,911,661,511],[1273,997,715,535],[1367,1059,751,593],[1465,1125,805,625],[1528,1190,868,658],[1628,1264,908,698],[1732,1370,982,742],[1840,1452,1030,790],[1952,1538,1112,842],[2068,1628,1168,898],[2188,1722,1228,958],[2303,1809,1283,983],[2431,1911,1351,1051],[2563,1989,1423,1093],[2699,2099,1499,1139],[2809,2213,1579,1219],[2953,2331,1663,1273]],o=function(){var a=function(a,b){this._el=a,this._htOption=b};return a.prototype.draw=function(a){function g(a,b){var c=document.createElementNS("http://www.w3.org/2000/svg",a);for(var d in b)b.hasOwnProperty(d)&&c.setAttribute(d,b[d]);return c}var b=this._htOption,c=this._el,d=a.getModuleCount();Math.floor(b.width/d),Math.floor(b.height/d),this.clear();var h=g("svg",{viewBox:"0 0 "+String(d)+" "+String(d),width:"100%",height:"100%",fill:b.colorLight});h.setAttributeNS("http://www.w3.org/2000/xmlns/","xmlns:xlink","http://www.w3.org/1999/xlink"),c.appendChild(h),h.appendChild(g("rect",{fill:b.colorDark,width:"1",height:"1",id:"template"}));for(var i=0;d>i;i++)for(var j=0;d>j;j++)if(a.isDark(i,j)){var k=g("use",{x:String(i),y:String(j)});k.setAttributeNS("http://www.w3.org/1999/xlink","href","#template"),h.appendChild(k)}},a.prototype.clear=function(){for(;this._el.hasChildNodes();)this._el.removeChild(this._el.lastChild)},a}(),p="svg"===document.documentElement.tagName.toLowerCase(),q=p?o:m()?function(){function a(){this._elImage.src=this._elCanvas.toDataURL("image/png"),this._elImage.style.display="block",this._elCanvas.style.display="none"}function d(a,b){var c=this;if(c._fFail=b,c._fSuccess=a,null===c._bSupportDataURI){var d=document.createElement("img"),e=function(){c._bSupportDataURI=!1,c._fFail&&_fFail.call(c)},f=function(){c._bSupportDataURI=!0,c._fSuccess&&c._fSuccess.call(c)};return d.onabort=e,d.onerror=e,d.onload=f,d.src="data:image/gif;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAFCAYAAACNbyblAAAAHElEQVQI12P4//8/w38GIAXDIBKE0DHxgljNBAAO9TXL0Y4OHwAAAABJRU5ErkJggg==",void 0}c._bSupportDataURI===!0&&c._fSuccess?c._fSuccess.call(c):c._bSupportDataURI===!1&&c._fFail&&c._fFail.call(c)}if(this._android&&this._android<=2.1){var b=1/window.devicePixelRatio,c=CanvasRenderingContext2D.prototype.drawImage;CanvasRenderingContext2D.prototype.drawImage=function(a,d,e,f,g,h,i,j){if("nodeName"in a&&/img/i.test(a.nodeName))for(var l=arguments.length-1;l>=1;l--)arguments[l]=arguments[l]*b;else"undefined"==typeof j&&(arguments[1]*=b,arguments[2]*=b,arguments[3]*=b,arguments[4]*=b);c.apply(this,arguments)}}var e=function(a,b){this._bIsPainted=!1,this._android=n(),this._htOption=b,this._elCanvas=document.createElement("canvas"),this._elCanvas.width=b.width,this._elCanvas.height=b.height,a.appendChild(this._elCanvas),this._el=a,this._oContext=this._elCanvas.getContext("2d"),this._bIsPainted=!1,this._elImage=document.createElement("img"),this._elImage.style.display="none",this._el.appendChild(this._elImage),this._bSupportDataURI=null};return e.prototype.draw=function(a){var b=this._elImage,c=this._oContext,d=this._htOption,e=a.getModuleCount(),f=d.width/e,g=d.height/e,h=Math.round(f),i=Math.round(g);b.style.display="none",this.clear();for(var j=0;e>j;j++)for(var k=0;e>k;k++){var l=a.isDark(j,k),m=k*f,n=j*g;c.strokeStyle=l?d.colorDark:d.colorLight,c.lineWidth=1,c.fillStyle=l?d.colorDark:d.colorLight,c.fillRect(m,n,f,g),c.strokeRect(Math.floor(m)+.5,Math.floor(n)+.5,h,i),c.strokeRect(Math.ceil(m)-.5,Math.ceil(n)-.5,h,i)}this._bIsPainted=!0},e.prototype.makeImage=function(){this._bIsPainted&&d.call(this,a)},e.prototype.isPainted=function(){return this._bIsPainted},e.prototype.clear=function(){this._oContext.clearRect(0,0,this._elCanvas.width,this._elCanvas.height),this._bIsPainted=!1},e.prototype.round=function(a){return a?Math.floor(1e3*a)/1e3:a},e}():function(){var a=function(a,b){this._el=a,this._htOption=b};return a.prototype.draw=function(a){for(var b=this._htOption,c=this._el,d=a.getModuleCount(),e=Math.floor(b.width/d),f=Math.floor(b.height/d),g=[''],h=0;d>h;h++){g.push("");for(var i=0;d>i;i++)g.push('');g.push("")}g.push("
"),c.innerHTML=g.join("");var j=c.childNodes[0],k=(b.width-j.offsetWidth)/2,l=(b.height-j.offsetHeight)/2;k>0&&l>0&&(j.style.margin=l+"px "+k+"px")},a.prototype.clear=function(){this._el.innerHTML=""},a}();QRCode=function(a,b){if(this._htOption={width:256,height:256,typeNumber:4,colorDark:"#000000",colorLight:"#ffffff",correctLevel:d.H},"string"==typeof b&&(b={text:b}),b)for(var c in b)this._htOption[c]=b[c];"string"==typeof a&&(a=document.getElementById(a)),this._android=n(),this._el=a,this._oQRCode=null,this._oDrawing=new q(this._el,this._htOption),this._htOption.text&&this.makeCode(this._htOption.text)},QRCode.prototype.makeCode=function(a){this._oQRCode=new b(r(a,this._htOption.correctLevel),this._htOption.correctLevel),this._oQRCode.addData(a),this._oQRCode.make(),this._el.title=a,this._oDrawing.draw(this._oQRCode),this.makeImage()},QRCode.prototype.makeImage=function(){"function"==typeof this._oDrawing.makeImage&&(!this._android||this._android>=3)&&this._oDrawing.makeImage()},QRCode.prototype.clear=function(){this._oDrawing.clear()},QRCode.CorrectLevel=d}(); --------------------------------------------------------------------------------