Use Javascript event handlers and CSS styles to adjust the size of the text within the browser window in response to a certain keystroke from the user.Possible future enhancements for this project: It’s still a lot of work, but it sure beats copying and pasting each individual character of a quote by hand. The process after that involves typing text into the text box, running the Javascript, then resizing the window so that words are not broken between lines, taking a screenshot of the browser window, pasting it into GIMP, making the white part transparent and possibly changing the color of the black part as well, doing any necessary resizing, and then copying and pasting onto the target image. The “printing” is done by appending a string to the innerHTML property (I shouldn’t have to explain what that does). Lines 34-39 print a tag if the inputted character is a newline, and if the character is anything other than a newline an tag with the already constructed filename is printed. For the space and punctuation characters, a special filename is used for each one. gif (I had to vary it somehow because filenames aren’t case-sensitive). For capital letters (codes 65-90) the filename is the double character and then. For numbers (codes 48-57) and lowercase letters (codes 97-122) the filename is simply (that character).gif. It then proceeds through a decision statement to select a filename paradigm depending on what numerical range the character code is in. First it uses Javascript’s charCodeAt() function to get the ASCII value for the character (line 14). The loop in lines 13-40 goes through each character in the input and “prints” the corresponding image in the output region. The Javascript code first initializes these two variable (lines 8-9), clears the output region for the new message (line 10), gets the length of the input in characters (line 11), and initializes the filename for the image to display to an empty string (line 12). The HTML page is divided into two regions: the input region where text is entered (represented by the input variable in the Javascript) and the output region where the Papyrus version of the text appears when the Submit button is pressed (represented by the output variable). As usual I will paste my code here and explain what each part of the program does: 1 2 3 4 5 Papyrus 6 7 function submit() 48 49 50 51 52 53 Enter 54 55 56 57 I figured the best language to do this in would be Javascript. Now came the fun part: writing a program that would convert plain text into a string of those images. I figure if I only pirate the font for my own personal use and don’t distribute it to anyone, then the people selling it are less likely to come after me. It was a pain in the ass, but I eventually had a separate image for each glyph. To do this I had to make sure early on that I got them lined up. I wanted it to be as seamless as possible. My object was to create a program where I could simply type letters on the keyboard and those letters would appear on the screen in the Papyrus font, as if I were using a word processor. Now this was the really tedious nightmarish part: I had to painstakingly copy every glyph into its own image, making sure I copied exactly the right number of pixels so they would all line up when I pasted them together. Would have been nicer if I’d found separate images for each glyph, but I guess that would be making it too easy.Īfter downloading the image, I opened it up in GIMP. I found an image that showed all the letters and numbers and some punctuation in that font. First I did a simple image search for the Papyrus font. So how does one pirate a font, exactly? Well, basically you need two things: First you need 1337 h4xx0r skillz like mine second you need a ton of spare time and patience, because the process I went through was extremely lengthy and tedious. I was like, really? BUY fonts? Who the hell does that? I don’t even buy my music, so I’m definitely not buying a font. I went looking for a website where I could download it, but found that all the download pages on the Internet were paywalled. Naturally, you can imagine how disappointed I was when I found that the Windows version of GIMP doesn’t have that font. I find that for stuff that’s either serious or humorous but mocking something serious, Papyrus is the best typeface to use. Papyrus is a font that I commonly use for digital art that I post on DeviantArt – the mixed-media “inspirational” kind that has an image with a quote or other inset text.
0 Comments
Leave a Reply. |
AuthorWrite something about yourself. No need to be fancy, just an overview. ArchivesCategories |