diff options
Diffstat (limited to 'gerbonara/cad/protoserve_data')
-rw-r--r-- | gerbonara/cad/protoserve_data/__init__.py | 0 | ||||
-rw-r--r-- | gerbonara/cad/protoserve_data/protoserve.html | 133 |
2 files changed, 121 insertions, 12 deletions
diff --git a/gerbonara/cad/protoserve_data/__init__.py b/gerbonara/cad/protoserve_data/__init__.py new file mode 100644 index 0000000..e69de29 --- /dev/null +++ b/gerbonara/cad/protoserve_data/__init__.py diff --git a/gerbonara/cad/protoserve_data/protoserve.html b/gerbonara/cad/protoserve_data/protoserve.html index c42ce6c..4da027a 100644 --- a/gerbonara/cad/protoserve_data/protoserve.html +++ b/gerbonara/cad/protoserve_data/protoserve.html @@ -177,11 +177,14 @@ input[type="text"]:focus:valid { position: relative; grid-area: main; padding: 20px; + display: flex; + flex-direction: column; + flex-wrap: wrap; + align-items: stretch; } -#preview-image { - width: 100%; - height: 100%; +#preview > img { + flex-grow: 1; object-fit: contain; } @@ -280,6 +283,12 @@ input[type="text"]:focus:valid { <span class="unit us">inch</span> </label> + <label>Margin + <input type="text" placeholder="margin" name="margin" value="2.0" pattern="[0-9]+\.?[0-9]*"/> + <span class="unit metric">mm</span> + <span class="unit us">inch</span> + </label> + <div class="group expand" data-group="round_corners"> <label>Round corners <input name="enabled" type="checkbox" checked/> @@ -316,7 +325,8 @@ input[type="text"]:focus:valid { </form> </div> <div id="preview"> - <img id="preview-image" alt="Automatically generated preview image"/> + <img id="preview-image-top" alt="Automatically generated top side preview image"/> + <img id="preview-image-bottom" alt="Automatically generated bottom side preview image"/> <div id="preview-message"></div> </div> <div id="links"> @@ -401,6 +411,8 @@ input[type="text"]:focus:valid { <a href="#" data-placeholder="rf" class="double-sided-only">RF THT area</a> <a href="#" data-placeholder="spiky" class="double-sided-only">Spiky hybrid area</a> <a href="#" data-placeholder="alio" class="double-sided-only">ALio hybrid area</a> + <a href="#" data-placeholder="starburst" class="double-sided-only">THT starburst area</a> + <a href="#" data-placeholder="breadboard" class="double-sided-only">Permanent breadboard area</a> </div> </div> </template> @@ -468,7 +480,7 @@ input[type="text"]:focus:valid { <span class="unit us">mil</span> </label> <label>Plating - <select name="plating" value="through"> + <select name="plating" value="plated"> <option value="plated">Double-sided, through-plated</option> <option value="nonplated">Double-sided, non-plated</option> <option value="singleside">Single-sided, non-plated</option> @@ -494,6 +506,34 @@ input[type="text"]:focus:valid { </div> </template> + <template id="tpl-g-breadboard"> + <div data-type="breadboard" class="group breadboard"> + <h4>Permanent breadboard area</h4> + <span class="content area-controls">(<a href="#" class="area-remove">Remove</a><a href="#" class="area-move">Move</a>)</span> + <label class="proportion">Proportion + <input type="text" name="layout_prop" value="1" pattern="[0-9]+\.?[0-9]*"/> + </label> + + <h5>Area Settings</h5> + <label>Direction + <select name="direction" value="v"> + <option value="v">Vertical</option> + <option value="h">Horizontal</option> + </select> + </label> + <label>Clearance + <input type="text" name="clearance" placeholder="length" value="0.5" pattern="[0-9]+\.?[0-9]*"/> + <span class="unit metric">mm</span> + <span class="unit us">mil</span> + </label> + <label>Hole diameter + <input type="text" name="hole_dia" placeholder="length" value="0.9" pattern="[0-9]+\.?[0-9]*"/> + <span class="unit metric">mm</span> + <span class="unit us">mil</span> + </label> + </div> + </template> + <template id="tpl-g-manhattan"> <div data-type="manhattan" class="group manhattan"> <h4>Manhattan area</h4> @@ -699,6 +739,58 @@ input[type="text"]:focus:valid { </div> </template> + <template id="tpl-g-starburst"> + <div data-type="starburst" class="group starburst"> + <h4>Starburst area</h4> + <span class="content area-controls">(<a href="#" class="area-remove">Remove</a><a href="#" class="area-move">Move</a>)</span> + <label class="proportion">Proportion + <input type="text" name="layout_prop" value="1" pattern="[0-9]+\.?[0-9]*"/> + </label> + + <h5>Area Settings</h5> + <label>Pitch X + <input type="text" name="pitch_x" placeholder="length" value="2.54" pattern="[0-9]+\.?[0-9]*"/> + <span class="unit metric">mm</span> + <span class="unit us">mil</span> + </label> + <label>Pitch Y + <input type="text" name="pitch_y" placeholder="length" value="2.54" pattern="[0-9]+\.?[0-9]*"/> + <span class="unit metric">mm</span> + <span class="unit us">mil</span> + </label> + <label>Drill diameter + <input type="text" name="drill" placeholder="length" value="0.9" pattern="[0-9]+\.?[0-9]*"/> + <span class="unit metric">mm</span> + <span class="unit us">mil</span> + </label> + <label>Annular ring + <input type="text" name="annular" placeholder="length" value="1.2" pattern="[0-9]+\.?[0-9]*"/> + <span class="unit metric">mm</span> + <span class="unit us">mil</span> + </label> + <label>Pad clearance + <input type="text" name="clearance" placeholder="length" value="0.4" pattern="[0-9]+\.?[0-9]*"/> + <span class="unit metric">mm</span> + <span class="unit us">mil</span> + </label> + <label>Soldermask wall + <input type="text" name="mask_width" placeholder="length" value="0.5" pattern="[0-9]+\.?[0-9]*"/> + <span class="unit metric">mm</span> + <span class="unit us">mil</span> + </label> + <label>Trace width X + <input type="text" name="trace_width_x" placeholder="length" value="1.40" pattern="[0-9]+\.?[0-9]*"/> + <span class="unit metric">mm</span> + <span class="unit us">mil</span> + </label> + <label>Trace width Y + <input type="text" name="trace_width_y" placeholder="length" value="1.40" pattern="[0-9]+\.?[0-9]*"/> + <span class="unit metric">mm</span> + <span class="unit us">mil</span> + </label> + </div> + </template> + <script> document.querySelectorAll('.expand').forEach((elem) => { const checkbox = elem.querySelector(':first-child > input'); @@ -985,26 +1077,43 @@ input[type="text"]:focus:valid { } } - let previewBlobURL = null; + let previewTopBlobURL = null; + let previewBotBlobURL = null; previewReloader = new RateLimiter(async () => { if (document.querySelector('form').checkValidity()) { document.querySelector('#preview-message').textContent = 'Reloading...'; document.querySelector('#preview-message').classList.add('loading'); - const response = await fetch('preview.svg', { + + const response_top = await fetch('preview_top.svg', { method: 'POST', mode: 'same-origin', cache: 'no-cache', headers: {'Content-Type': 'application/json'}, body: serialize(), }); - const data = await response.blob(); - if (previewBlobURL) { - URL.revokeObjectURL(previewBlobURL); + const data_top = await response_top.blob(); + if (previewTopBlobURL) { + URL.revokeObjectURL(previewTopBlobURL); } - previewBlobURL = URL.createObjectURL(data); - document.querySelector('#preview-image').src = previewBlobURL; + previewTopBlobURL = URL.createObjectURL(data_top); + document.querySelector('#preview-image-top').src = previewTopBlobURL; + document.querySelector('#preview-message').textContent = ''; document.querySelector('#preview-message').classList.remove('loading'); + + const response_bot = await fetch('preview_bottom.svg', { + method: 'POST', + mode: 'same-origin', + cache: 'no-cache', + headers: {'Content-Type': 'application/json'}, + body: serialize(), + }); + const data_bot = await response_bot.blob(); + if (previewBotBlobURL) { + URL.revokeObjectURL(previewBotBlobURL); + } + previewBotBlobURL = URL.createObjectURL(data_bot); + document.querySelector('#preview-image-bottom').src = previewBotBlobURL; } else { document.querySelector('#preview-message').classList.add('loading'); document.querySelector('#preview-message').textContent = 'Please correct any invalid fields.'; |