This is really pretty short. Today I was looking at the Datse Multimedia Base theme, and saw several things that I felt I could update so that it is less likely to cause problems. I will be posting it here, but check out the github if you want that latest release.
I was working on setting up another emoticon for my Picarto stream and I wanted to go a bit more through the process of what I created through that. First, let’s look at what the finished product looks like:
So, there is where things ended for me. I am not sure why I don’t see it, but I don’t know where I have the original sketch that I started with, though I have an idea (goes to look)…
As with the previous time, I photographed the image, and I end up getting this sort of thing. As you can see, the colour is not what you would expect unless the paper is degrading, so I do a colour correction.
Here I have colour corrected it. I do this once I have the pictures in digiKam, and I click on the edit. I try not to have to do too much that way, and this time I think I did a pretty decent job of it.
Here we have that image after I have sharpened it. I’m not sure that it makes much, or any difference here, but it does enhance the finer details somewhat.
Then from there, I import it into Inkscape, and then start working on it in inkscape.
I have a few different versions of the SVG which I have available, but unfortunately I can’t display them in a post, and I *think* the only way to put them up would be to create an archive, and upload the archive. I am probably not going to do that until I really start to find good tools which I am really happy with (which probably won’t happen until I start to feel unhappy with the tools I am using, which in a way I’m unhappy with Inkscape, as it seems to run into a situation with how I’m doing things where it gets very sluggish on this computer).
So, after I have worked through the process with Inkscape, I have created the following images:
This is the picture as I start with things, and has everything all together (this is where I started in GIMP last time). This is very crude as you can see, it is a lot to get this to a reasonable place, as everything is on one layer. I realized that this doesn’t work to get my pictures in a nice editable form with the last one.
So this time, I had everything nicely in layers in Inkscape, and I exported those layers independently. I also made sure when I did that, that I exported the whole “page” so that everything lines up automagically when I import them into GIMP.
The following (out of order) is the layers individually (hmm… let’s try to fix that order). Let’s start with the topmost layer, and work down…
That is the stack as best I can remember it. The order these are in is pretty important. I may not have the order correct here, as I am working from memory and what I think makes sense. There is a layer that I really think I am going to need to create in the future which is a layer of “white background” which will go behind everything else for two purposes.
- To keep the background colours from bleeding through, as they do with this
- Provide a light outline to the image, so it will work better on a dark background
After I did that, I started working on cleaning up the messy nature of the image at this point. Even if you look at it all together:
it is really very messy. It needs to be cleaned up.
I have edited this in GIMP, and likewise with my editing process in Inkscape, the saved files of the process do not really work here (I don’t think).
Nope, you can’t see it directly…
So, I’m not going to post those, as unless someone wants to work with them, they probably won’t want them. I may put those files (or access to them) on my Patreon as a tier at the higher end, and they may not be as the usual CC-BY-SA that I use, but copyright, or something else. Not sure…
So, there is an editing process that goes on in GIMP that is difficult to express without the multiple versions which I end up creating them as.
In the end, I export it as a GIF file, as that is what Picarto uses for emoji. I think that animated ones will also work, but I don’t see myself creating any of those until I start to get the fairly extensive list of emoji I would like to use. So here (again) is the final gif image.
So, thank you for checking this out. I am getting bits and pieces better together with each new emoji I create. Please check out my Patreon, and either support me there (was stepping away due to a poorly considered change, which then got rolled back entirely), or support me over on LiberaPay.
A while ago, I started to look at installing ledgersmb on this new system (I already have it running on an older system, which I have been shutting down due to fan noise (perhaps more on that later when I find a solution)) and I was wanting to do a new install.
So, when I was doing that, I found out that there is now an official gentoo repository (hey, cool let’s install that, and see where that gets me). So I installed it, hoping I could have an
emerge ledgersmb or something work just like that.
I saw that was not an option for me. And I stepped away from it for a while.
Today, I looked again, and there seems to be more packages included now, but I’m not sure, and still no package for ledgersmb itself.
So, I started to look at what we currently have, and this will probably be a bit easier (or at least “more proper”) than installing entirely manually, I am installing from the sourcecode which is on github.
There are some packages that I failed to find in portage at that time, but perhaps… The problem was a matter of not knowing what I was looking for… So far, it has come together, but not in a simple manner. Maybe smoother than previously.
Today as part of my “Open Psychology” work stream, I ended up creating a custom emoji for Picarto, where I was streaming. I have been in the process of setting things up there, and I was just playing around with some stuff. So, I did a few different steps (that I can share). I started by drawing a really simple drawing.
I thought that this was close enough to what I want, that I went with that image as my start. Then I went through a few different steps to get that to how I would like to start working with it:
From there I was able to import that into Inkscape. And, let’s see what I still have hanging around to allow you to see my process…
A lot of what I did in Inkscape I feel that I will want to do differently in the future. This is a very flat PNG, this doesn’t really work for editing in GIMP. But I imported the SVG, which worked much better, but still, it didn’t work the way that I would like as that got imported as a transparent raster graphic.
From there, I did a bunch of editing in GIMP to end up with this GIF file:
This is what it ended up looking like before it went into Picatro, and it doesn’t look that bad. Well I don’t think it really looks all that bad…
I would like to in the future save more of the intermediate steps that I go through to produce these. I like how files end up showing up when I am using digiKam as I can just “save version” as I am editing it.
I have been working today at getting the Picarto stream up running. I was having very significant problems with what I was managing to stream and I see now, that I just need to drop my frame rate, or I’m going to have too low resolution. With running it at 10 frames per second (really not good for anything video like) I can have the resolution high enough that people can see stuff.
I had some help with looking at it from a Patreon supporter, so that was helpful. I think the one thing that still is bothering me with it is that the loading seems to “take forever”.
I also added some information I had from my twitch stream, specifically I have added a link to my Speq schedule. I will be streaming (at least the “creative” stuff) on Picarto, rather than Twitch.
The 10 fps seems like it will be good enough for most of what I do. Currently, I don’t know of any faster I can upload like that…
I got a book that is telling me most of what I need for getting my microphone pre-amp built. I hope that I can get it working fairly soon. I know it will be a few weeks before I have it. But I might be able to start working on it in a week or two. Wish me luck?
This was from the Arduino Project book I got, it’s not really much of a project as it’s mostly based on “assume nothing” type perspective.
When I start with a project I have the board setup something like this. I am currently between projects (as I’m writing this) and have left the existing project setup. This is how this ends up being setup from how The Arduino Starter Kit sets up your Arduino, and the working surface for it.
I took a fair number of pictures while I was working on this project, and most of them did not really work out that well. I am not all that happy with this one even.
The project that I am writing about is only using the Arduino as a power supply (though in a way that is an important place to start with it). So from this we connect the power to the breadboard.
These are the components which I used for project. Well, most of them. There is a resister that gets used, and there is another pushbutton which is used. Just a little bit of documenting some stuff.
From here I started to put things a bit together. I attach the power leads (red and black cables).
This is a nice start for the project. Connected from the power on the Arduino to the breadboard. It starts here. Not all that exciting. But it comes along.
The first “phase” of the completed project, is really very simple.
This is how the first version of first project works. It is really simple. About the simplest version that you can produce.
This unfortunately is the last picture I managed to get a good picture of. Once I completed this project (which includes two versions with two pushbuttons, one with them wired in series, and then one with them wired in parallel). Once I finished putting it all together, I worked on starting to get some circuit diagrams together and the first one is this version.
I will leave this post at this point right now. I’m going to pull this diagram up in KiCAD and see about drawing the other versions of the diagram.
I am not sure if this will end up split in multiple posts or not, but I have two broad topics being the hardware setup (which is basically, I mounted it, and I connected it to the computer with the USB cable provided) and the software setup (which has a bunch of things which I think are rather important to write about). So let’s start with the software setup, as even though you need to do the hardware setup first, it’s simple, and I didn’t really “learn” anything important there.
Arduino Software Setup (this was done on Gentoo)
OK, so, I expected to run into some problems with this, but I just was looking at the “project book” that I got with The Arduino Starter Kit and the Linux instructions are “please go to the website”. A bit of problem with even that instruction (and all of the instructions of that sort in the book) first being that arduino.org doesn’t exist as a domain that serves actual content. And second, some of the specific instructions just are not able to be followed at all.
Arduino provides an IDE (Integrated Development Environment) which needs to be installed (or something similar, which will provide needed tools for that, but we’re going with that, as so far the only alternative I have found is Eclipse, and I have had many problems with Eclipse) in order to work with the Arduino at all.
So, the instructions on the website, didn’t provide anything that looked like a good way on Gentoo (well, nothing specific to Gentoo, and everything else was specific to another distribution) so I looked to see what I could find in my portage directory (/usr/portage by default) and did find it, so dove in with that…
But, but, but… It isn’t working out of the box…
The instructions I found said some stuff with /dev/ttyACM* which isn’t showing up… OK so I need to figure that out, so I look at my kernel… yep, I need to do some stuff with that…
I update the kernel, and I install it in /boot but I don’t “tell grub about it” which is a total rookie mistake (I know to do that, but I just forgot) and reboot, and “darn that kernel isn’t working”… So i start looking for Gentoo instructions which I have found are often “old” and sometimes very outdated (ie. they not only don’t work as stated, but they flat out don’t work) but in this case, I can say yes, these are really pretty much correct.
I thought (having not realised at this point, that I wasn’t running the new one) that I needed to enable more stuff in the kernel, and enabled the other drivers that are listed on that page (I don’t think I needed them, but they don’t seem to be doing any harm) and then booted into the new kernel.
I can now see the device /dev/ttyACM0 but I still am not getting communication to the device. And I start digging further as I have missed a step (I hope that is all at this point) and it was setting up user permissions. I need to add the user I want to use to the group for the device, and that got the device showing up as available.
In the mean time, I start to work through the other options, and the first part says something about packages in “cross-avr” which I don’t have at this point, which actually ends up confusing me somewhat (because it doesn’t say “these may not be available at this time” oh look it actually says “these packages are not available until after you install crossdev” so I want to know why you are asking for something that will fail until such point as I’ve done that).
I have already done some stuff which is further down, so my process might be “somewhat broken” and I know I did stuff that I shouldn’t have needed to two twice, twice, or maybe more than that.
I tried to follow the instructions, but there are some problems that I ran into that they don’t get into, namely that you probably don’t want to install crossdev stuff into an overlay that already exists, and it was doing that for me (I haven’t seen if it ended up adding stuff to that overlay or not) and I had to figure this out through looking at the help for “crossdev”.
I had to run the command that is listed as
crossdev -s4 --stable --portage --verbose --target avr multiple times to get it to work correctly, but once it did, it simply did (though I have to say, it takes a *long* time for it to happen, and there is no running output to show that something is happening).
Here is a case where Gentoo seems to fail on the “don’t provide enough information” side of things. Or maybe more “don’t provide enough information in a way that it actually allows a person to look at what is being said, and readily find a solution to it from that source”.
I needed to tell crossdev exactly where I wanted it to “put stuff”. I see no clear place where that information exists on the Gentoo website. I don’t really know if where it was picking “automagically” was “wrong” other than it was putting stuff in an overlay which had no reference to…
Once that got installed, I then tried the “check this out” thing which failed earlier in the process looking at the crossdev-adm stuff. I’m not sure I needed to do that or not really…
In the end, I found that I needed to create a symlink that it says “you also need a workaround” which somehow I put a “may” in… Now it seems that everything is working (after once again trying to install the arduino ide, which I don’t know I need to do).
I then looked at the information they have with eclipse. I couldn’t really get it working “well enough” to want to switch unless I could do my existing stuff better with it, but actually getting any of that setup was a pain (it took “forever” for it to finally tell me what I needed to do, in fact I left it overnight and it was saying “hey why not do it this way”). So I am sticking (at least for now) with the arduino ide.
This was pretty much trivial. The issues I ran into were of the “dropping little bits, but finding them quickly” sort. Instructions that were in the “Project Book” which I found quite understandable, and it looks like (so far) I have done nothing problematic. So now to play more with this…
HTML are really nice files, they are straight text, but with it (well and a few other things) you get what you are looking at now. So, let’s take a look at what an HTML file consists of:
- Content encoding
- Doctype declaration
- HTML block
- HEAD block
- BODY block
So, let’s dive into that a bit, and go through this step by step.
HTML files are usually encoding in utf-8 unicode format. Which for “8-bit” characters is pretty close to ASCII (in fact all ASCII characters are coded identically in utf-8, though ASCII at times might have transferred them differently being only 7 bits of significant data) but also allows for “extra characters” due to the fact that the first “block” of characters (8 bits) is only part of the set. In fact, in utf-8, if you need to encode more than the 7 bits of ASCII you will need more bytes per character.
Using ASCII encoding (declaring it) is relatively rarely done these days. ASCII encoding was used in about 17% of websites in 2012, while utf-8 was used in about 63% of websites. Other encodings were used as well.
You probably don’t need to worry at all about this, unless you are using characters outside of the ASCII set, and not escaping them (so they can be represented as ASCII). I have seen some websites where the ‘ displays as 3 characters that don’t look correct. This is a problem that somewhere along the way utf-8 encoding has gotten shifted to ASCII encoding, and the result is that rather than a “left single quote” you get a meaningless series of characters.
So, save your file in text format, and be careful if you are transferring the file from one place to another, that the encoding isn’t getting broken. Then you need to look at what you put into the file itself.
The first part (first line) of an HTML file should be a doctype declaration. There are a number of options, and in the past the “correct” one was difficult to remeber as it was something like:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
which you can see is a lot of specific bits of things to remember, now the current version of the same thing is:
Which is a lot easier to remember.
While most browser don’t care much at all about this, in order to have things properly formatted it is “supposed” to be there. The w3schools says that it is “required” in their information about doctype declaration, and the W3C list of valid doctype declarations, has a list they consider valid (though I believe that there are other ones which can be used, as well). So, if you open with a proper doctype declaration, that’s a “bonus” in my book, but people who are even more pedantic say it’s “required”. And by the standard (w3c sets the standard) it is required.
You’re unlikely to have anything break if you forget it.
This is something which has not changed since I started working with web development. The doctype is not part of html, it is just part of the file. And it does look a lot like an html tag, but it’s not. It comes before any html, and the first tag (an opening one, which needs to be closed, but closing comes after opening) that you are required to use (again if it’s missing, probably no browser you’re likely to encounter will have any problems with the file as long as it can determine in other ways that it is an html file) is the html tag.
In its most basic form (and I usually don’t modify this myself until I start to look at finalizing stuff about a page, and mostly for accessibility reasons) is:
Which is really simple. There are a number of attributes you can add, such as:
in order to define your entire document (you can use the lang attribute on any tag, as it is a “global” attribute) as being in English. This is helpful in terms of screen reading, or other accessible technologies. It also can help (though usually not by much) search engines to better understand your website.
Once you have that defined (it can only occur once), it needs a closing tag (and also has two required blocks inside it the head and body blocks (again only one of each)), and the closing tag is:
And as with all closing tags, it is only the / and the tag name, and not all tags have required closing tags.
The HTML closing tag should be the last thing in your document, as anything after it is not supposed to be interpreted (I don’t know what the behaviour of any browsers are if there is a closing HTML tag, with content following it, they are not supposed to interpret it at all, or display anything with regard to it, but I can’t guarantee that all of them follow this behaviour.
Now let’s look at the first of the two required blocks within the html block.
Most of the information you need to know about the HEAD block, is mentioned regarding the HTML block. They have different attributes (global ones can be used on any html tag), but the basics are the same.
The HEAD block defines “header information”, most of this isn’t displayed (well it’s not displayed on the web page itself), but is used to define the entire document. The HEAD block starts with a:
tag. This is the minimum you will need to use for that, but as with the html tag, you can include attributes. I’m not going to go into that. If you have included an lang attribute in the html tag, unless you are “changing” it, you don’t need to repeat it, and it should only be used where you are changing it (if I use a French word, I might tag it as such, though it is rarely needed unless you are looking at the highest level of accessibility standards).
Likewise you will need to close your head tag. It’s the same as closing the html tag (though it’s a different tag):
Just that simple.
Now on to your main content in the BODY block.
The body block is where everything that you display goes. There are things which can go into the body block (and certain things may only belong in the body block) which aren’t usually displayed. But everything that is in the “web page” which gets displayed is in the BODY block. (Though there are cases where some of that display is at least partially defined elsewhere)
So, really, not much new to say here:
and likewise there are attributes that can be applied to it. This is where all your content will go.
Likewise you will want to put the closing tag:
after to close your BODY block. As this all falls in the HTML block, your HTML closing block is what you need to do right after that.
Here are a quick list of resources, both general sites (I am starting there) and specific resources for the topics which are included here:
- General Resources
- Doctype Declaration
- HTML Block
- HEAD Block
- BODY Block
- General Attributes
I have decided that I would like to look at the basics of web development, and I have a bit of an approach I would like to look at for this. I think that I will probably approach it in this order:
I think that makes a fair amount of sense. I’d like to create a new lesson every week:
I have been looking at the HTML basics, I’m not really sure where I would like to go with this for sure, but I am going to look at this starting in this order:
- HTML file format
- HTML <head> content
- HTML <body> content
- <head> tags
- <body> tags
I know that looks pretty brief, but I think several of these will end up being multiple lessons.
I also would like to be able to provide external resources for most of these things. In part because I refer to them on a regular basis myself.
I will do a similar thing with CSS:
- Inline CSS format
- Header CSS Format
- External CSS Format
- Including External CSS
- CSS selectors
- CSS declarations
- CSS properties
- CSS values
This is a much longer list, though I think it is more finely broken down.
PHP is my strongest programming language. I hear a lot of people complaining about it, so I keep trying to do things in different ways for a variety of things, but I think that it is a reasonable place to start learning a number of basic programming concepts:
- Writing output
- Getting input (forms)
- Processing input
- Displaying based on new input.
That’s really the very basic structures. I will probably need to look a variety of different things or not.
Just doing another daily sketch. 2 days in a row. That’s pretty good for me…
I think that starting with these expressions right now is a decent place to start. I can see that things aren’t really all that easy even keeping them as simple as I am doing them.
This turned out not bad at all. With the background from the original picture still there, it gives a bit of texture.
The transparent background for this might end up being a bit difficult to handle in some contexts. I’m not sure if there is a good way to handle it better.