mirror of
https://github.com/lleene/hugo-site.git
synced 2025-01-22 19:42:21 +01:00
content update regarding SVG integration.
This commit is contained in:
parent
8ddd5453d8
commit
3cfdbc4305
@ -1,23 +1,50 @@
|
||||
---
|
||||
title: "Welcome"
|
||||
title: "Hello friend 🐱👤"
|
||||
date: 2021-08-23T17:52:07+02:00
|
||||
draft: false
|
||||
---
|
||||
|
||||
Hello friend.
|
||||
|
||||
### About This Site
|
||||
## About This Site
|
||||
|
||||
This site shares a bit of informal documentation and more blog-based recod
|
||||
keeping. Providing commentary on design decisions should be just as useful as
|
||||
some of the technical documentation however included in my repositories.
|
||||
|
||||
### Setup
|
||||
## My Setup
|
||||
|
||||
| Environment | Development | Production |
|
||||
--- | --- | ---
|
||||
| Operating System | Fedora 33 | CentOS 8 |
|
||||
I mainly use RHEL flavours of linux having both CentOS and Fedora machines. Most
|
||||
hosted services run on CentOS 8 at the moment abiet they are approaching
|
||||
end-of-life. Overall the package repository for CentOS 7/8 is just right. I
|
||||
rarely need to compile anything from source and packages are very stable.
|
||||
I will eventually migrate to Fedora completely which is where I operate my
|
||||
development environment.
|
||||
|
||||
### About Me
|
||||
This is a list of my most used self-hosted services:
|
||||
- Gitea: Git server with web interface for repository mirrors and personal repos
|
||||
- Plex: mutlti-media hosting service for streaming movies and tv-shows
|
||||
- NextCloud: Cloud storage for synchronizing and sharing files
|
||||
- Cockpit: Web base administration portal managing linux boxes
|
||||
- RoundCube: Web based email client
|
||||
- Postfix/Dovcot: Email stack providing SMTP for my domain
|
||||
- NGINX: HTTP server serving as proxy for internal web services
|
||||
- Danbooru: Ruby-on-rails based image hosting and tagging service
|
||||
|
||||
There are several others that I have tried but these really have been the things
|
||||
I relied on the most in the past 5 years or so. I think the only thing that is
|
||||
possibly missing from this list is possibly the equivilent of a centralized LDAP
|
||||
service but I simply haven't had to manage more than handful of users.
|
||||
|
||||
Currently I develop quite a bit of python utilities for scraping, labeling, and
|
||||
managing media in an automated fashion. In part I am preparing data for one of
|
||||
my long term projects which is related to image classification based on
|
||||
structural decomposition rather than textural features. The main idea here is
|
||||
to analyse and extract structure in an image before performing in-depth analysis
|
||||
such that said analysis is most specific to its context.
|
||||
|
||||
This is some of the hardware that I use:
|
||||
- W10 Laptop: Intel i5-7200U CPU with 8 GB of memory
|
||||
- W10 Desktop: Intel i5-7200U CPU with 8 GB of memory
|
||||
|
||||
## About Me
|
||||
|
||||
I do mixed signal circuit design and a bit of software development as a hobby.
|
||||
|
86
content/posts/building-svg.md
Normal file
86
content/posts/building-svg.md
Normal file
@ -0,0 +1,86 @@
|
||||
---
|
||||
title: "Building With SVG"
|
||||
date: 2021-08-28T11:53:54+02:00
|
||||
draft: true
|
||||
---
|
||||
|
||||
# SVG Tools and Hugo Integration
|
||||
|
||||
SVG is generally the image container of choice having used it for illustrations,
|
||||
chip or device specifications, and visual outputs generated by code. SVG is
|
||||
plain xml that is structured with some top level object/properties followed by
|
||||
standardized objects that draw lines and shapes.
|
||||
The hope here is that we can call a predefined go proceedure that parses
|
||||
some section of markdown source code and instantiates the corresponding svg file
|
||||
under our static folder that is then referenced.
|
||||
|
||||
``` go
|
||||
{{/* a comment */}}
|
||||
```
|
||||
|
||||
## KGT: Kate's Grammar Tool
|
||||
|
||||
KGT is a pretty neat starting point to experiment with this kind of function.
|
||||
It is relatively self contained and produces compact SVG objects from simple
|
||||
statements.
|
||||
|
||||
### Build Instructions
|
||||
|
||||
Building `libfms` and `kgt` from source was not too much of a hassle although
|
||||
the build / dependancy documentation could be better. This was build with my
|
||||
WLS-Ubuntu environment.
|
||||
|
||||
``` bash
|
||||
apt install clang pmake
|
||||
git clone --recursive "https://$libfsm_REPO/libfsm"
|
||||
pushd libfsm; CC=clang PREFIX=$HOME pmake -r install; popd
|
||||
git clone --recursive "https://$KGT_REPO/kgt"
|
||||
pushd kgt/src; CC=clang PREFIX=$HOME pmake -r install; popd
|
||||
```
|
||||
|
||||
The main issue is noticed
|
||||
is the SVG being generated uses `path {rouded}` in its style definition which
|
||||
the svg rasterizer from `librsvg2 2.40.20` complained about. Getting the latest
|
||||
build however is quite involved requiring the latest cairo and proppler
|
||||
libraries as well. Ideally generating pngs or rasterizing won't be needed.
|
||||
|
||||
### Example
|
||||
|
||||
Just to show a typical use case for making an illustration using the KGT tool,
|
||||
below I generate the svg for one of the examples included by it's repository.
|
||||
|
||||
``` bash
|
||||
KGT_DEF="<personal-part> ::= <first-name> | <initial> \".\" "
|
||||
echo "$KGT_DEF" | kgt -l bnf -e svg | awk -vf1="$(<style.svg)" -f replace_style.awk > example_kgt.svg
|
||||
```
|
||||
|
||||
The style is automatically introduced in the xml header section which is mostly
|
||||
plain black. This has some legibility issues for dark themes so a short `awk`
|
||||
script is used to replace the style with one that we define for this theme.
|
||||
|
||||
``` awk
|
||||
BEGIN{style_flag=0}
|
||||
/<style>/{style_flag=1}
|
||||
{if(style_flag == 0) print $0}
|
||||
/<\/style>/{style_flag=0;print f1}
|
||||
```
|
||||
|
||||
For completeness we include the style definition below but this could be
|
||||
added directly to KGT as a feature in future releases.
|
||||
|
||||
``` xml
|
||||
<style>
|
||||
rect, line, path { stroke-width: 1.5px; stroke: white; fill: transparent; }
|
||||
rect, line, path { stroke-linecap: square; stroke-linejoin: rounded; }
|
||||
path { fill: transparent; }
|
||||
text { fill: white; }
|
||||
text.literal { font-family: monospace; }
|
||||
line.ellipsis { stroke-dasharray: 1 3.5; }
|
||||
tspan.hex { font-family: monospace; font-size: 90%; }
|
||||
path.arrow { fill: white; }
|
||||
</style>
|
||||
```
|
||||
|
||||
The final result is shown below.
|
||||
|
||||
![example_kgt.svg](/images/example_kgt.svg)
|
12
content/posts/mile-stones.md
Normal file
12
content/posts/mile-stones.md
Normal file
@ -0,0 +1,12 @@
|
||||
---
|
||||
title: "Mile Stones"
|
||||
date: 2021-08-28T16:13:52+02:00
|
||||
draft: true
|
||||
---
|
||||
|
||||
This is a list of topics that I may include at somepoint in time:
|
||||
1. SSL and NGINX setup guide
|
||||
2. Postfix setup guide
|
||||
3. Danbooru setup guide
|
||||
4. pyside notes from pyviewer project
|
||||
5. other notes
|
Loading…
x
Reference in New Issue
Block a user