gcode-bed-measure-tool/index.html at master · schme16/gcode-bed-measure-tool · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
<!DOCTYPE html>
<html ng-app="bed-measurement-tool" ng-controller="master">

<head>

	<!--Fixes IE falling back to IE7 mode-->
		<meta http-equiv="X-UA-Compatible" content="IE=edge" >


	<!--Sets the text encoding-->
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8">


	<!--Stylesheets-->
		<link rel="stylesheet" type="text/css" href="sys/css/open-sans.css" >
		<link rel="stylesheet" type="text/css" href="sys/css/normalize.css" >
		<link rel="stylesheet" type="text/css" href="sys/css/font-awesome.min.css" >
		<link rel="stylesheet" type="text/css" href="sys/css/styles.css">
		<link rel="stylesheet" type="text/css" href="sys/css/mobile.css" media="screen and (max-width: 890px)">


	<!--Scripts-->
		<script src="sys/js/jquery.min.js"></script>
		<script src="sys/js/angular.min.js"></script>
		<script src="sys/js/plotly-latest.min.js"></script>
 		<script src="sys/js/main.js"></script>


	<!--The title-->
		<title>gcode Bed Measurement Tool</title>


	<!--For information about this job, please see: `sys/css/styles.css`-->


</head>
<body ng-controller="master" ng-cloak>
	<div class="left-content">

		<div class="connection-details">
			<label>Port: <select ng-options="a as a.comName for a in ports" ng-model="port" ng-disabled="!!conn"></select></label>
			<label>Speed: <select ng-options="a as a for a in speeds" ng-model="speed" ng-disabled="!!conn"></select></label>
			<button ng-show="conn" ng-click="connect(null,null, true)">Disconnect</button>
			<button ng-show="!conn" ng-disabled="!port || !speed" ng-click="connect(port, speed)">Connect</button>
		</div>

		<br>

		<form ng-disabled="!conn" class="custom-gcode" action="/" method="get" ng-submit="$event.preventDefault(); sendCommand(code)">
			<label>GCODE: <input ng-disabled="!conn" ng-model="code"></label> <button ng-disabled="!conn" type="submit">Send</button>
		</form>

		<br>

		<div ng-disabled="!conn || mode == 'mapping'" class="bed-measurement-tools">
			<label>Bed width: <input ng-disabled="!conn || mode == 'mapping'" ng-model="bed.width" type="number"></label><br>
			<label>Bed height: <input ng-disabled="!conn || mode == 'mapping'" ng-model="bed.height" type="number"></label><br>
			<label>Padding from edge of bed: <input ng-disabled="!conn || mode == 'mapping'" ng-model="bed.padding" type="number"></label><br>
			<label>Number of X/Y points: <input ng-disabled="!conn || mode == 'mapping'" ng-model="bed.points" min="3" step="2" type="number"></label><br>
			<!-- <label>Number of X points: <input ng-model="bed.pointsX" min="3" step="2" type="number"></label><br> -->
			<!-- <label>Number of Y points: <input ng-model="bed.pointsY" min="3" step="2" type="number"></label><br> -->
			<button ng-disabled="!conn || mode == 'mapping'" ng-click="runBedMeasurement(bed)">Run</button>
			<button ng-disabled="!conn" ng-click="probePoints = []">Cancel</button>
		</div>
		<br>

		<progress ng-show="mode == 'mapping' && currentProbePoint.mappingDetails.total" min="0" max="{{currentProbePoint.mappingDetails.total}}" value="{{currentProbePoint.mappingDetails.index}}"></progress>
		<div ng-show="mode == 'mapping' && currentProbePoint.mappingDetails.total" class="progress-text">Probing position {{currentProbePoint.mappingDetails.index}} of {{currentProbePoint.mappingDetails.total}} - X:{{currentProbePoint.x + currentProbePoint.mappingDetails.padding}} Y: {{currentProbePoint.y +  + currentProbePoint.mappingDetails.padding}}</div>

		<div ng-show="mode == 'mapping' && !currentProbePoint.mappingDetails.total" class="pre-mapping-text">Setting abosulute positioning, and homing machine</div>
		<br>
		<br>
		<br>
		<button ng-click="loadBedMap()">Load Bed map</button>
		<button ng-disabled="!bedMap" ng-click="saveBedMap()">Save Bed map</button>
	</div>


	<div class="right-content">
		<div id="heatmap"></div>
	</div>

</body>
</html>