Fancy Text
By Richard Rost
3 years ago
Subdatasheets in MS Access - What, How, & Why
In this ASP tutorial, I'm going to show you how I created my FancyText function which takes one letter of a string and makes it black. And then after that I'm going to show you how I used both Google Bard and ChatGPT to create a function to slightly darken that color instead of making it black. We'll see which one is the winner in today's coding challenge.
Pre-Requisite
Links
Members
Recommended Courses
Details
In this tutorial, you will learn how to create a function called FancyText that takes a string and makes one character in that string black for aesthetic reasons. I will then demonstrate how I used Bard from Google and ChatGPT to create a function that darkens the color slightly instead of making it black. You will see that ChatGPT's function worked better, and I will walk you through the code. This tutorial is for VBScript and classic ASP.
Keywords
#asp, #classicasp, #help, #howto, #tutorial, #learn, #lesson, #training, #webdesign, #VBScript, classic ASP, function creation, FancyText, string manipulation, character colorization, Bard from Google, ChatGPT, color adjustment, course page design
Subscribe to Fancy Text
Get notifications when this page is updated
Intro In this video, I will show you how I created a FancyText function in classic ASP that highlights a random character in a string using either black or a slightly darker color for aesthetic effect. I'll walk you through writing the original function, discuss how I used both Google Bard and ChatGPT to improve the color customization, and explain the challenges with hex color conversion in VBScript and JavaScript. Even if you are not an ASP programmer, this video includes some useful Visual Basic concepts and tips for manipulating text and colors in your own projects.Transcript Welcome to another Fast Tips video brought to you by ASPLearningZone.com. I am your instructor, Richard Rost.
In today's video, I'm going to show you how I created a function that I call FancyText, which takes a string and makes one character in that string black. Why? Purely aesthetic reasons. I was just having fun on my website, but it's a cool function.
Then, I'm going to show you how I used both Bard from Google and ChatGPT to create a function that, instead of making that character black, would just slightly darken the color. Again, why? I don't know, just messing around, but it's really cool. You will see which one is the winner of today's coding challenge.
Now, even if you don't program in ASP or have an ASP website, this is still a cool Visual Basic lesson. I thought about making it a VB thing, but that's ASP because I did it on my website. So, you get the point.
If you've been to my website in the last year or so, you may have noticed if you go to a page, and some people have caught me on this without me ever saying anything, that one letter is usually a darker color. It's usually black. If you go to any one of my articles on my site or any course page, you'll see that. That's just me trying to be artistic. I'm just being silly, whatever, but I just thought it'd be nice. Actually, I thought it'd be cool to do something like that, but that's a little too obtrusive. That's a lot, that's a little too "in your face." That's too artsy-fartsy for me.
But I always thought that it just kind of looked neat. Alex is releasing a new course on Rubber Duck, which is a VBA program, and his is yellow. The yellow with the black there just looks like too much contrast. So, I thought, how about I take my FancyText code and write it so that instead of going black, it just makes it subtly a little darker.
Here's the final product. That's a slightly darker shade of red for Access and green for another example, and it looks much better with the yellow.
I've had the classic FancyText in the code vault for a while. I think I briefly mentioned it in a video a while back, about six months ago. Originally, it did that. There's the code. Gold members, you can find it in the code vault if you search for "fancy." I did just search for "fancy fancy."
This one swapped the foreground and background colors. Basically, it just generates a random number from one to the size of the string, and then it just replaces that particular character. It could be a different character each time, and that's the whole point of it.
Then I thought that was too dramatic, so then I swapped it to black.
Now, I'm thinking to myself, to make it so that this guy is just slightly darker in color than the surrounding color, you have to break the value up into its constituent parts, because the first two characters represent red, then the next two are green, and the next two are blue.
Then, you have to convert that to an integer or long. Then you have to drop that value down a bit, then convert it back to hex. I know how to do all of that, but I didn't feel like looking up the code.
So, what I decided to do was challenge my good friends, the AI bots. I tried both Bard and ChatGPT, and I started with Bard.
So I said to Bard, I need a function in VBScript, which is what classic ASP is written in, for classic ASP, that takes a hex color and makes it a slightly darker color.
It replied, "Sure, here's a function for VBScript, classic ASP," and there's the code. It looked pretty good at first sight. But then I realized that there were a couple of issues with it. First, classic ASP doesn't support ByRef and ByVal. Those are Visual Basic commands.
So I said classic ASP doesn't support ByVal. It responded, "Oh, you're correct. Classic ASP does not support ByVal, but it'll still work if you remove ByVal." Not a problem, so then I removed that.
Then I realized it also doesn't support data typing in the parameters, or an "Endim" statement, which I know. So, everything is a variant, but you can't tell it that, either.
So then I said no, because it tries to tell me to declare it as a variant. I said, "Nope, classic ASP doesn't support declaring a variable as a type. You can't declare something as Long or as String or whatever in classic ASP VBScript. You just leave that off. You declare your variables, and they're all variants by default."
So Bard apologized: "I apologize, previous versions are correct, classic ASP does not support declaring variables as types." Fine. So I removed all that.
Then I discovered another problem. If you look at the code, it's using "hexcolor.substring." That's a JavaScript function. That's how you do it in JavaScript. In VB or in ASP, you have to use the Mid, Left, Right, and Mid functions, which I then told to Bard.
I said classic ASP doesn't support "substring," and at that point Bard gave up on me. It said, "It looks like you might need help with coding, but I'm not trained to do that yet. I can do things like summarize long text, write an email, or even make a poem, or something else you'd like to try." So Bard gave up after about four attempts of me saying, "No, that's not quite right." But it's getting there. I can tell it's getting there. I love me some Google, but you've got a little bit of work to do on Bard.
So then I went over to my good buddy ChatGPT. I said the same thing: need a function in JavaScript. It knocked it out of the park the first time. This code works perfectly, and it even told me what to do. It simply darkened it by 20 percent and drops it down by 0.8. I'll walk you through the code in just a minute to explain what's going on here.
Then I fed it what I had, and I said, "This line is giving me an error." I didn't tell it what the error was. I just wanted to see if it could figure it out. It said, "If you're getting an error on that line, it's likely because the hex color parameter is not a valid hex color value." And you know what? It was not, because in my code, I was sending it the hex value with the pound symbol in front of it. So, all I had to do was remove that and it worked.
But what I did was, because I know I've got code all over my website that calls FancyText, I just added this line to the darkenHexColor function that it wrote for me. This just says, if I do send you a hex color where the left character is '#', then just remove it by saying hexColor = Right(hexColor, 6). Grab those six right characters.
That's it. This was basically written just by ChatGPT.
It says you are going to convert the hex color to RGB values. We have R, G, and B. It's going to be the Long of Mid(hexColor, 1, 2) which sets the left two characters, then the middle two characters, then the right two characters. Put an "&H" in front of them so you get hex values and then convert that to a long integer. Now, we have a number representing each one of those.
Then, take that number and multiply it by 0.8. When you bring the values down closer to zero, they get darker, and when you bring them up closer to "F" (zero through nine and then A, B, C, D, E, F, it's hex), if you bring those values down by 0.8, it will make it darker for each one. Zero is the darkest, so if you send it black, you're just going to get black back. You can't get darker than black.
Then, we take these values and convert them back into a string. The right two, the right two of that, and that's how you basically make a darker version of the color that you send into it.
Of course, then there is FancyText, which basically says, give me L, R, and F. L is the length of the string. This line says, while R is going to be a random number, it starts at one. It will loop while R is one or R is L, and what that means is I don't want to change the first character or the last character of the string. I guess you could get rid of the "R = 1" check, but then this won't run. So you could set R = L at the beginning if you want that first character to change. I always wanted it to be one of the characters in the middle.
Also, if Mid(S, R, 1) equals a space, obviously don't change the foreground color of a space character; that would just be meaningless. So it's going to loop until it finds an inner character, basically.
R is a random number. Then when you're done, build a string out of it: the left of that string, the Mid is going to be that one character that you picked, and that's going to be color2, which is your fancy darkened color, and then the end of the string here. That's it.
To use it in your code, you just do that. You send it a string and then the color that you want as your base color, and this will pick a random character in the middle of it. Then, darkenHexColor will make it darker. And that's that.
Kudos to ChatGPT for coming up with near perfect code. Well, no, the code was perfect; it was me that sent it something wrong on the first shot. So there you go.
For my Access nerds out there, this will work fine in Access too. If you want to do the same thing with a value from a text box that's using rich text, you can do the same thing with text codes. If you really want to see it, let me know. I'll make a future tip video out of it.
The result with Alex's Rubber Duck looks like that. See, nice little subtle change - it's not quite the black, it's just a little darker. I think it looks really nice. Alex's Rubber Duck course isn't ready yet, but as soon as it is, I will make sure to post a note so you can check it out.
That's your Fast Tip for today. Hope you learned something. Live long and prosper.
If you want to see more ASP videos, make sure you post a comment down below. Alright, thanks. We'll see you next time.
Gold members, you will find the code for all of this in the code vault. I'll put a link down below on my website.
Thanks for watching. If you'd like to learn more ASP, visit my website at ASPLearningZone.com and watch my free 90-minute ASP 101 class. It will teach you everything you need to know to get your website up and running with ASP. After that, I've got lots more advanced topics, including connecting your website to a database.
Of course, I've got lots of additional lessons on all kinds of topics, including my personal specialty, Microsoft Access, but also Word, Windows, Excel, and lots more at ComputerLearningZone.com.
If you're watching this video on YouTube, make sure you subscribe to my channel, which is completely free. Click on the bell icon and select "All" to receive notifications when new videos are posted.Quiz Q1. What is the main purpose of the FancyText function described in the video?
A. To display a random image on a webpage.
B. To make one character in a string black or slightly darker for aesthetic effect.
C. To increase the font size of a word.
D. To check for spelling errors in a string.
Q2. Why did Richard decide to adjust the FancyText function from making a letter black to making it just a little bit darker?
A. Because the black letter made the text unreadable.
B. To enhance security on his website.
C. Because the contrast was too strong, and he wanted a subtler effect.
D. To save memory on his server.
Q3. What was one of the main issues Richard encountered when using Bard to create a color-darkening function in classic ASP?
A. Bard provided code with too many comments.
B. Bard used ByRef, ByVal, and data typing not supported in VBScript for ASP.
C. Bard generated code in Python instead of VBScript.
D. Bard forgot to include any code at all.
Q4. Which character functions must be used in classic ASP instead of JavaScript's substring method?
A. Upper and Lower
B. Split and Join
C. Mid, Left, and Right
D. Slice and Splice
Q5. What mathematical operation does the code use to darken a hex color?
A. Adds a random number to the RGB values.
B. Divides the RGB values by 2.
C. Multiplies the RGB values by 0.8 to decrease their intensity.
D. Converts all values to zero.
Q6. What crucial adjustment did Richard have to make for the hex color value being passed to the function?
A. Add a space at the beginning of the string.
B. Remove the pound "#" symbol from the hex color value.
C. Replace all "A" characters with "F".
D. Change the string to uppercase characters.
Q7. In the final FancyText function, which characters in the string are typically NOT chosen for color adjustment?
A. The first and last characters, as well as any space characters.
B. All vowels in the string.
C. Characters that are uppercase.
D. Characters that appear more than once.
Q8. According to the video, will the technique described work in Microsoft Access if used with rich text?
A. No, it only works in ASP.
B. Yes, with minor modifications using text codes.
C. Only on Windows XP.
D. Only on Gold member accounts.
Q9. What statement accurately reflects the outcome of using ChatGPT for the coding challenge?
A. ChatGPT failed completely to generate useful code.
B. ChatGPT provided correct code, and only a minor input error needed fixing.
C. ChatGPT refused to answer the question.
D. ChatGPT only provided a summary, not any code.
Answers: 1-B; 2-C; 3-B; 4-C; 5-C; 6-B; 7-A; 8-B; 9-B
DISCLAIMER: Quiz questions are AI generated. If you find any that are wrong, don't make sense, or aren't related to the video topic at hand, then please post a comment and let me know. Thanks.Summary Today's video from the ASP Learning Zone demonstrates how I created a function called FancyText. This function takes a string and makes one character in that string a different color, usually black, just for visual effect. The idea came about simply because I wanted to try something fun and visually interesting on my website.
My original implementation of FancyText just swapped colors for a specific character in a string, picking a random character each time for a splash of creativity. Later, I modified it so the special character would be black. However, I found that this strong contrast did not always look good, especially against lighter background colors like yellow. So, I decided to improve it by making the highlighted character just slightly darker than the base color, resulting in a more subtle effect that blends better with the overall design.
To do this, I had to take a hex color value, break it up into its red, green, and blue components, reduce their brightness, and then reassemble them into a hex value. Even though I know how to do this manually, I decided to challenge Bard from Google and ChatGPT to see which artificial intelligence could generate the needed function for me.
First, I asked Bard. While Bard offered up some code that looked promising, it used features that classic ASP doesn't support, like ByVal and explicit data types in parameter lists. Classic ASP only works with variants and doesn't use these constructs. After several rounds of corrections, Bard's solution kept missing key details, eventually falling back to its more generic advice.
Next, I tried ChatGPT. Its response was much more accurate and complete. The code generated by ChatGPT worked well out of the gate. The function simply multiplies each red, green, and blue value by 0.8, making the color about 20 percent darker. I also made one minor adjustment for my own use. Since some of my code passed the hex color value with a pound sign at the beginning, I added a quick check to strip that out, ensuring consistent results.
After breaking down the hex values, converting them to integers, darkening them, and then reassembling the values into a hex string, the function produces the desired darker shade. The process involves using Mid to extract substrings, converting them using numeric conversion functions, adjusting the values, and then building the final color string.
The FancyText function itself finds a random character within the string, avoiding the first and last characters and any spaces, and replaces it with a span that uses the darker color generated earlier. This subtle effect gives a pleasing visual touch, especially in cases like Alex's Rubber Duck course, where the classic yellow is accented by a darkened character that blends attractively.
Everything works by passing your string and a base color to FancyText, and it handles the rest, including the color manipulation through the helper function.
If you're an Access developer, you can adapt these concepts to work with text box values using rich text formatting. If there's interest, I can create a video specifically about using this in Access.
Overall, ChatGPT produced code that worked well. Any initial issues were because of how I passed in the color value, not the AI's code. With a small tweak, it performed perfectly.
If you want the full step-by-step breakdown, including all the code and a demonstration of how the functions work, you'll find the complete video tutorial over on my website. Live long and prosper, my friends.Topic List Creating the FancyText function to stylize text
Randomly selecting a character within a string
Excluding first and last characters and spaces from styling
Changing a single character color to black for emphasis
Modifying foreground and background colors for a character
Breaking down hex color values into RGB components
Converting hex color string to RGB integer values in VBScript
Darkening an RGB color by reducing each channel value
Reconstructing a hex color string from modified RGB values
Handling hex color input with or without pound sign prefix
Using AI tools Bard and ChatGPT to assist with coding in VBScript
Identifying VBScript and classic ASP syntax limitations with ByVal, ByRef, and data typing
Adjusting AI-generated code to work in classic ASP environment
Implementing the darkenHexColor function in VBScript
Integrating the darkenHexColor function with FancyText for subtle color changes
Using the Mid, Left, and Right functions for string manipulation in VBScript
Ensuring compatibility with Access for similar styled text effects |
