protoboard: add split front/back view in webthing
This commit is contained in:
parent
21218239e4
commit
4aab344a18
3 changed files with 36 additions and 14 deletions
|
|
@ -135,6 +135,7 @@ class Board:
|
|||
force_bounds=force_bounds)
|
||||
|
||||
def pretty_svg(self, side='top', margin=0, arg_unit=MM, svg_unit=MM, force_bounds=None, inkscape=False, colors=None):
|
||||
print('Pretty svg', side)
|
||||
return self.layer_stack().to_pretty_svg(side=side, margin=margin, arg_unit=arg_unit, svg_unit=svg_unit,
|
||||
force_bounds=force_bounds, inkscape=inkscape, colors=colors)
|
||||
|
||||
|
|
|
|||
|
|
@ -159,11 +159,11 @@ def to_board(obj):
|
|||
mounting_hole_offset=mounting_hole_offset,
|
||||
unit=unit)
|
||||
|
||||
@app.route('/preview.svg', methods=['POST'])
|
||||
async def preview():
|
||||
@app.route('/preview_<side>.svg', methods=['POST'])
|
||||
async def preview(side):
|
||||
obj = await request.get_json()
|
||||
board = to_board(obj)
|
||||
return Response(str(board.pretty_svg()), mimetype='image/svg+xml')
|
||||
return Response(str(board.pretty_svg(side=side)), mimetype='image/svg+xml')
|
||||
|
||||
@app.route('/gerbers.zip', methods=['POST'])
|
||||
async def gerbers():
|
||||
|
|
|
|||
|
|
@ -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;
|
||||
}
|
||||
|
||||
|
|
@ -316,7 +319,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">
|
||||
|
|
@ -985,26 +989,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.';
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue