First draft

Doc999tor · Oct 6, 2016 · d0511cb · d0511cb
commit d0511cb
Show file tree

Hide file tree

Showing 7 changed files with 117 additions and 0 deletions.
diff --git a/.gitignore b/.gitignore
@@ -0,0 +1 @@
+/node_modules
diff --git a/gulpfile.js b/gulpfile.js
@@ -0,0 +1,18 @@
+var gulp        = require('gulp'),
+	watch       = require('gulp-watch'),
+	browserSync = require("browser-sync").create(),
+	reload      = browserSync.reload;
+
+var config = {
+	server: {baseDir: "./"},
+	port: 9000,
+	open: true
+};
+
+gulp.task('watch', function () {
+	gulp.watch(['index.html', 'main.js', 'style.css']).on('change', reload);
+});
+
+gulp.task('default', ['watch'], function () {
+	browserSync.init(config);
+});
diff --git a/index.html b/index.html
@@ -0,0 +1,47 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+	<meta charset="UTF-8">
+	<title></title>
+	<style>
+		body.ltr {direction: ltr;}
+		body.rtl {direction: rtl;}
+		section {
+			display: flex;
+			flex-wrap: wrap;
+			justify-content: space-between;
+			margin-top: 3px;
+		}
+		input {
+			width: 23%;
+			padding-left: 5px;
+		}
+	</style>
+</head>
+<body class="ltr">
+	<button onclick="
+		this.innerText = `Switch to ${document.body.classList[0]}`;
+		document.body.classList.toggle('ltr');
+		document.body.classList.toggle('rtl');
+		">Switch to rtl</button>
+	<section data-row="1">
+		<input data-row="row-0" data-column="cl-0" type="text" value="row-0 cl-0">
+		<input data-row="row-0" data-column="cl-1" type="text" value="row-0 cl-1">
+		<input data-row="row-0" data-column="cl-2" type="text" value="row-0 cl-2">
+		<input data-row="row-0" data-column="cl-3" type="text" value="row-0 cl-3">
+	</section>
+	<section data-row="2">
+		<input data-row="row-1" data-column="cl-0" type="text" value="row-1 cl-0">
+		<input data-row="row-1" data-column="cl-1" type="text" value="row-1 cl-1">
+		<input data-row="row-1" data-column="cl-2" type="text" value="row-1 cl-2">
+		<input data-row="row-1" data-column="cl-3" type="text" value="row-1 cl-3">
+	</section>
+	<section data-row="3">
+		<input data-row="row-2" data-column="cl-0" type="text" value="row-2 cl-0">
+		<input data-row="row-2" data-column="cl-1" type="text" value="row-2 cl-1">
+		<input data-row="row-2" data-column="cl-2" type="text" value="row-2 cl-2">
+		<input data-row="row-2" data-column="cl-3" type="text" value="row-2 cl-3">
+	</section>
+	<script type="text/javascript" src="main.js"></script>
+</body>
+</html>
diff --git a/main.js b/main.js
@@ -0,0 +1,35 @@
+Array.from(document.querySelectorAll('input')).forEach(input => {
+	input.addEventListener('paste', e => {
+		e.preventDefault();
+		e.stopPropagation();
+		addData(e.currentTarget, e.clipboardData.getData('Text'));
+		return false;
+	});
+});
+
+function addData (input, text) {
+	console.time('addData');
+	let [rowInput, columnInput] = [
+		parseInt(input.dataset.row.match(/\d/)[0]),
+		parseInt(input.dataset.column.match(/\d/)[0])
+	];
+
+	let cells = [];
+	let rows = text
+		.split('\n')
+		.forEach((row, index) => {
+			cells[index] = row.split('\t');
+		});
+	rows = null;
+
+	cells.forEach((rowData, indexRow) => {
+		rowData.forEach((value, indexColumn) => {
+			let query = `input[data-row=row-${indexRow + rowInput}][data-column=cl-${indexColumn + columnInput}]`;
+			let el = document.querySelector(query);
+			if (el) {
+				el.value = value;
+			}
+		});
+	});
+	console.timeEnd('addData');
+}
diff --git a/package.json b/package.json
@@ -0,0 +1,14 @@
+{
+  "name": "zoominfo-test-task",
+  "version": "1.0.0",
+  "description": "",
+  "main": "",
+  "scripts": {},
+  "author": "Victor",
+  "license": "ISC",
+  "devDependencies": {
+    "browser-sync": "^2.11.2",
+    "gulp": "^3.9.1",
+    "gulp-watch": "^4.3.5"
+  }
+}
diff --git a/start.bat b/start.bat
@@ -0,0 +1,2 @@
+subl .
+start cmd /k "gulp"
diff --git a/xls.xlsx b/xls.xlsx