4over-estimate

4over Estimates

Fields to create a 4over custom estimate for your clients to get a quote for their custom print jobs.

So far in beta mode, needs to access from the internal 4over Network over the VPN.

How to use

Currently, only web mode available, no NodeJS + WebPack.

Installation

Open the terminal and create a new folder

mkdir estimates-test
cd estimates-test 

Install the Node libs from inside the folder

npm install 4over-estimate jquery bootstrap --save

Usage

Create a new file index.html

touch index.html

Copy the following code into the index.html file

<!DOCTYPE html>
<html>
<head>
	<title>Estimate Fields</title>

	<!-- include libs -->
	<link href="node_modules/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet">
	<script src="node_modules/jquery/dist/jquery.min.js"></script>
	<script src="node_modules/4over-estimate/index.js"></script>
</head>
<body>
	<div class="container pt-3">
		<div class="row">
			<div class="col">
				<h1>Estimate Fields</h1>

				<!-- estimate fields will be added to this div -->
				<div id="estimate"></div>

				<!-- this button will return the results -->
				<button class="btn btn-dark" onclick="getEstimateResults()">Show Data</button>

				<!-- results will be displayed here -->
				<pre id="results" class="mt-3"></pre>
			</div>
	  </div>
	</div>	

	<script type="text/javascript">
		$(document).ready(function(){
			//
			// call lib to start estimates
			//
			$('#estimate').estimates('build')
		})

		function getEstimateResults() {
			// 
			// call lib to get estimates results
			//
			let results = $('#estimate').estimates('get')

			if(results) {
				$('#results').html(JSON.stringify(results, null, 4))
			} else {
				alert('Please fill the whole form')
			}
		}
	</script>
</body>
</html>

Double click the file index.html. This won't work from inside of the company's VPN.

The next version will come with WebPack support.