From 874adce8f4efdda653c1e60d5b353a3bc816af93 Mon Sep 17 00:00:00 2001 From: jaseg Date: Wed, 27 Mar 2019 18:28:57 +0900 Subject: gerboweb: Initial commit The functionality is there, no design yet --- gerboweb/templates/index.html | 86 +++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 86 insertions(+) create mode 100644 gerboweb/templates/index.html (limited to 'gerboweb/templates/index.html') diff --git a/gerboweb/templates/index.html b/gerboweb/templates/index.html new file mode 100644 index 0000000..c5c8503 --- /dev/null +++ b/gerboweb/templates/index.html @@ -0,0 +1,86 @@ + + + + Gerbolyze Raster image to PCB renderer + + +
+

Raster image to PCB converter

+

+ Gerbolyze is a tool for rendering black and white raster (PNG) images directly onto gerber layers. You can + use this to put art on a PCB's silkscreen, solder mask or copper layers. The input is a black-and-white PNG + image that is vectorized and rendered into an existing gerber file. Gerbolyze works with gerber files + produced with any EDA toolchain and has been tested to work with both Altium and KiCAD. +

+
+ +
+

Step 1: Upload zipped gerber files

+

+ First, upload a zip file containing all your gerber files. The default file names used by KiCAD, Eagle + and Altium are supported. +

+ +
+ {{gerber_form.csrf_token}} + {{gerber_form.upload_file.label}} {{gerber_form.upload_file(size=20)}} + +
+
+ + {% if 'render_job' in session or has_renders %} +
+

Step 2: Download the target side's preview image

+

+ Second, download either the top or bottom preview image and use it to align and scale your own artwork + in an image editing program such as Gimp. Then upload your overlay image below. + + Note that you will have to convert grayscale images into binary images yourself. Gerbolyze can't do this + for you since there are lots of variables involved. Our Guideline on image processing gives an overview on + one way to produce agreeable binary images from grayscale source material. +

+ {% if 'render_job' in session %} + Processing... (this may take several minutes!) + {% else %} + Download + Download + {% endif %} +
+ {{reset_form.csrf_token}} + +
+
+ +
+

Step 3: Upload overlay image

+

+ Now, upload your binary overlay image as a PNG and let gerbolyze render it onto the target layer. The PNG + file should be a black and white binary file with details generally above about 10px size. Antialiased + edges are supported. +

+
+ {{overlay_form.csrf_token}} + {{overlay_form.upload_file.label}} {{overlay_form.upload_file(size=20)}} + {{overlay_form.side.label}} {{overlay_form.side()}} + +
+
+ + {% if 'vector_job' in session or has_output %} +
+

Step 4: Download the processed gerber files

+ {% if 'vector_job' in session %} + Processing... (this may take several minutes!) + {% else %} + Download + {% endif %} +
+ {{reset_form.csrf_token}} + +
+
+ {% endif %} {# vector job #} + {% endif %} {# render job #} + + -- cgit From 23d392c2f7a744d38a369f8bc91cfd0f215f82b0 Mon Sep 17 00:00:00 2001 From: jaseg Date: Fri, 29 Mar 2019 22:09:16 +0900 Subject: Working on the design --- gerboweb/templates/index.html | 217 +++++++++++++++++++++++++++--------------- 1 file changed, 139 insertions(+), 78 deletions(-) (limited to 'gerboweb/templates/index.html') diff --git a/gerboweb/templates/index.html b/gerboweb/templates/index.html index c5c8503..3e4c255 100644 --- a/gerboweb/templates/index.html +++ b/gerboweb/templates/index.html @@ -1,86 +1,147 @@ - - - Gerbolyze Raster image to PCB renderer - - -
-

Raster image to PCB converter

-

- Gerbolyze is a tool for rendering black and white raster (PNG) images directly onto gerber layers. You can - use this to put art on a PCB's silkscreen, solder mask or copper layers. The input is a black-and-white PNG - image that is vectorized and rendered into an existing gerber file. Gerbolyze works with gerber files - produced with any EDA toolchain and has been tested to work with both Altium and KiCAD. -

-
+ + + Gerbolyze Raster image to PCB renderer + + + +
+
+

Raster image to PCB converter

+

+ Gerbolyze is a tool for rendering black and white raster (PNG) images directly onto gerber layers. You can + use this to put art on a PCB's silkscreen, solder mask or copper layers. The input is a black-and-white PNG + image that is vectorized and rendered into an existing gerber file. Gerbolyze works with gerber files + produced with any EDA toolchain and has been tested to work with both Altium and KiCAD. +

+
-
-

Step 1: Upload zipped gerber files

-

- First, upload a zip file containing all your gerber files. The default file names used by KiCAD, Eagle - and Altium are supported. -

+ {% with messages = get_flashed_messages(with_categories=True) %} + {% if messages %} +
+ {% for category, message in messages %} +
{{ message }}
+ {% endfor %} +
+ {% endif %} + {% endwith %} -
- {{gerber_form.csrf_token}} - {{gerber_form.upload_file.label}} {{gerber_form.upload_file(size=20)}} - -
-
+
{{reset_form.csrf_token}}
- {% if 'render_job' in session or has_renders %} -
-

Step 2: Download the target side's preview image

-

- Second, download either the top or bottom preview image and use it to align and scale your own artwork - in an image editing program such as Gimp. Then upload your overlay image below. +

+
+
+

Step 1: Upload zipped gerber files

+

+ First, upload a zip file containing all your gerber files. The default file names used by KiCAD, Eagle + and Altium are supported. +

+
- Note that you will have to convert grayscale images into binary images yourself. Gerbolyze can't do this - for you since there are lots of variables involved. Our Guideline on image processing gives an overview on - one way to produce agreeable binary images from grayscale source material. -

- {% if 'render_job' in session %} - Processing... (this may take several minutes!) - {% else %} - Download - Download - {% endif %} -
- {{reset_form.csrf_token}} - -
-
+
+
+ {{gerber_form.csrf_token}} +
+
+
Upload Gerber file:
+ +
+
+ + +
+
+
-
-

Step 3: Upload overlay image

-

- Now, upload your binary overlay image as a PNG and let gerbolyze render it onto the target layer. The PNG - file should be a black and white binary file with details generally above about 10px size. Antialiased - edges are supported. -

-
- {{overlay_form.csrf_token}} - {{overlay_form.upload_file.label}} {{overlay_form.upload_file(size=20)}} - {{overlay_form.side.label}} {{overlay_form.side()}} - -
-
+ {% if 'render_job' in session or has_renders %} +
+
+

Step 2: Download the target side's preview image

+

+ Second, download either the top or bottom preview image and use it to align and scale your own artwork + in an image editing program such as Gimp. Then upload your overlay image below. - {% if 'vector_job' in session or has_output %} -

-

Step 4: Download the processed gerber files

- {% if 'vector_job' in session %} - Processing... (this may take several minutes!) - {% else %} - Download - {% endif %} -
- {{reset_form.csrf_token}} - -
-
- {% endif %} {# vector job #} - {% endif %} {# render job #} - + Note that you will have to convert grayscale images into binary images yourself. Gerbolyze can't do this + for you since there are lots of variables involved. Our Guideline on image processing gives an overview on + one way to produce agreeable binary images from grayscale source material. +

+
+
+ {% if 'render_job' in session %} + Processing... (this may take several minutes!) + {% else %} + + {% endif %} +
+ +
+
+
+ +
+
+

Step 3: Upload overlay image

+

+ Now, upload your binary overlay image as a PNG and let gerbolyze render it onto the target layer. The PNG + file should be a black and white binary file with details generally above about 10px size. Antialiased + edges are supported. +

+
+
+
+ {{overlay_form.csrf_token}} +
+
+
Upload Overlay PNG file:
+ +
+
+
Target layer:
+ + + + +
+
+ + +
+
+
+ + {% if 'vector_job' in session or has_output %} +
+
+

Step 4: Download the processed gerber files

+
+
+ {# if 'vector_job' in session FIXME #} + {% if True %} +
+
+
Processing...
+
(this may take several minutes!)
+
+ {% else %} + + {% endif %} +
+ +
+
+
+ {% endif %} {# vector job #} + {% endif %} {# render job #} +
+
+ -- cgit From 6b4eac36d6ff46881b26a36556a07280ccd69783 Mon Sep 17 00:00:00 2001 From: jaseg Date: Sat, 30 Mar 2019 04:01:03 +0900 Subject: gerboweb: Initial design revision --- gerboweb/templates/index.html | 63 +++++++++++++++++++++++++++---------------- 1 file changed, 40 insertions(+), 23 deletions(-) (limited to 'gerboweb/templates/index.html') diff --git a/gerboweb/templates/index.html b/gerboweb/templates/index.html index 3e4c255..eeece65 100644 --- a/gerboweb/templates/index.html +++ b/gerboweb/templates/index.html @@ -6,14 +6,16 @@
-
-

Raster image to PCB converter

-

- Gerbolyze is a tool for rendering black and white raster (PNG) images directly onto gerber layers. You can - use this to put art on a PCB's silkscreen, solder mask or copper layers. The input is a black-and-white PNG - image that is vectorized and rendered into an existing gerber file. Gerbolyze works with gerber files - produced with any EDA toolchain and has been tested to work with both Altium and KiCAD. -

+
+
+

Raster image to PCB converter

+

+ Gerbolyze is a tool for rendering black and white raster (PNG) images directly onto gerber layers. You can + use this to put art on a PCB's silkscreen, solder mask or copper layers. The input is a black-and-white PNG + image that is vectorized and rendered into an existing gerber file. Gerbolyze works with gerber files + produced with any EDA toolchain and has been tested to work with both Altium and KiCAD. +

+
{% with messages = get_flashed_messages(with_categories=True) %} @@ -31,7 +33,7 @@
-

Step 1: Upload zipped gerber files

+

Upload zipped gerber files

First, upload a zip file containing all your gerber files. The default file names used by KiCAD, Eagle and Altium are supported. @@ -39,7 +41,7 @@

-
+ {{gerber_form.csrf_token}}
@@ -56,7 +58,7 @@ {% if 'render_job' in session or has_renders %}
-

Step 2: Download the target side's preview image

+

Download the target side's preview image

Second, download either the top or bottom preview image and use it to align and scale your own artwork in an image editing program such as Gimp. Then upload your overlay image below. @@ -68,15 +70,19 @@

{% if 'render_job' in session %} - Processing... (this may take several minutes!) +
+
+
Processing...
+
(this may take several minutes!)
+
{% else %} {% endif %}
@@ -87,7 +93,7 @@
-

Step 3: Upload overlay image

+

Upload overlay image

Now, upload your binary overlay image as a PNG and let gerbolyze render it onto the target layer. The PNG file should be a black and white binary file with details generally above about 10px size. Antialiased @@ -95,7 +101,7 @@

-
+ {{overlay_form.csrf_token}}
@@ -119,11 +125,10 @@ {% if 'vector_job' in session or has_output %}
-

Step 4: Download the processed gerber files

+

Download the processed gerber files

- {# if 'vector_job' in session FIXME #} - {% if True %} + {% if 'vector_job' in session %}
Processing...
@@ -137,11 +142,23 @@
+
{% endif %} {# vector job #} {% endif %} {# render job #}
+
+

Sample images

+ + + +
-- cgit From bd146dd1636116680f7d9a4e1a85adc3d803a7c5 Mon Sep 17 00:00:00 2001 From: jaseg Date: Sun, 31 Mar 2019 21:52:12 +0900 Subject: gerboweb: Add favicon --- gerboweb/templates/index.html | 2 ++ 1 file changed, 2 insertions(+) (limited to 'gerboweb/templates/index.html') diff --git a/gerboweb/templates/index.html b/gerboweb/templates/index.html index eeece65..4dca6dc 100644 --- a/gerboweb/templates/index.html +++ b/gerboweb/templates/index.html @@ -3,6 +3,8 @@ Gerbolyze Raster image to PCB renderer + +
-- cgit From bf4620e3bf83cc332eace157ee73924b134ee5a3 Mon Sep 17 00:00:00 2001 From: jaseg Date: Mon, 15 Apr 2019 10:32:34 +0900 Subject: gerboweb: Add viewport meta --- gerboweb/templates/index.html | 1 + 1 file changed, 1 insertion(+) (limited to 'gerboweb/templates/index.html') diff --git a/gerboweb/templates/index.html b/gerboweb/templates/index.html index 4dca6dc..a19fc88 100644 --- a/gerboweb/templates/index.html +++ b/gerboweb/templates/index.html @@ -5,6 +5,7 @@ +
-- cgit