Tag Archives: github

tech

Generating Images from HTML

Editing images is hard. Moving things to the right location, adding other elements, going back to the first one and readjusting the location or size. And if you want to create multiple images with just a slightly different bit of text, or a different subject in the foreground…..

I’ve known people who can create masterpieces of art with PhotoShop and the like, but I’ve never developed the knack.

A while back, it occurred to me that I could do all kinds of fancy “this-goes-in-front-of-that” and rearranging things in a web page. Then I could just take a screenshot, do a little cropping and resizing (the secret to some of my best photos) and voilà, exactly the kind of image I wanted! And if I needed to make several such photos, well, web pages are just plain text and very easy to edit.

That’s great for a small number of images, but if you want to make a bunch of images (say, social media previews for 40 biographies), that would get tedious quickly.

The best way to deal with tedious tasks is automation.

So I created an automated HTML to Image Generator (it really needs a better name).

The idea behind it is you start off with a simple web page like this one:

<body>
	<div class="container">
		<img src="image/frog.png">
		<p class="name">Green</p>
	</div>
</body>

which creates a page looking like this:

Replace a few elements in the HTML with placeholders

<body>
	<div class="container">
		<img src="{{image}}">
		<p class="name">{{name}}</p>
	</div>
</body>

and then create a set of data files containing other values for those those placeholders. For example, this data file

{
    "name": "Yellow",
    "image": "image/sun.png",
    "colorCode": "#cccc00"
}

Creates this image

You can check out the whole thing in the HTML to Image Generator’s GitHub repository.

I hope someone finds it useful, and if you have suggestions for a better name, leave a message in the comments below.

Uncategorized

git error: Permission to user-B/repo.git denied to user-A

I have two GitHub accounts: UserA and UserB. Over time I’ve been switching to working with UserB, but the switchover was a bit difficult.

I created a test repository on GitHub at https://github.com/UserB/test

On the local system, from the command prompt

cd \git
git clone https://UserB@github.com/UserB/test
cd test
# make some changes to README.md, add a new foo.txt
git add *
git commit -m "Banana!" # In real life, you'll probably want a more useful comment.

And that’s where the train went off the rails…

C:\git\test>git push
remote: Permission to UserB/test.git denied to UserA.
fatal: unable to access 'https://UserB@github.com/UserB/test/': The requested URL returned error: 403

So git’s saying that even though I expressly got this as UserB, it still thinks I’m UserA

Google came back with lots of stuff about making sure you have the right SSH key (apparently the cool kids do everything over SSH).

A few search results make reference to the Windows Credential Manager. Apparently the Windows version of Git hooks into that somehow. What’s the Windows Credential Manager? Well, from the name, it sounds like something that might be used for storing userids and passwords.

OK, so how do I invoke it? Dunno. Let’s try the search box on the START menu. Aha! Two entries. One for “Credential Manager” and one for “Manage Windows Credentials.”

So let’s try the first one. Hey! This looks promising:

About halfway down the list, there’s one labeled “git:https://github.com” Let’s expand that.

Oh, looky there! Username and password.

Now what I did was to remove the entry and then push again. I was prompted to enter a userid and password. I still had to type the password at the command prompt, but IT STUCK.

C:\git\test>git push
Counting objects: 3, done.
Delta compression using up to 8 threads.
Compressing objects: 100% (2/2), done.
Writing objects: 100% (3/3), 304 bytes | 0 bytes/s, done.
Total 3 (delta 0), reused 0 (delta 0)
To https://github.com/UserB/test
5e74c47..cf2ca13 master -> master

I probably could have clicked “Edit” and changed the userid and password, and just kept going, but I didn’t notice the “Edit” right away.

It looks as though you might actually be able to have multiple entries for git:https://github.com, but I haven’t tried that yet.

(Public domain photo from PublicDomainPictures.net)