Free, Quick, and Easy Computer Tips and Tricks

It's Been a While

2024-08-23T03:25:00.005-03:00

It's been a while. A long while. And to some extent a happy detour from me writing as I have a lot more to write about these days.

I'm married, a masters in CS and Bachelors in Computer Engineering from a well known school for its technical rigor. What's more, I work in big tech and previously for financial and research companies. Would you believe me if I told you that 50% of what I needed technically was learned in high school? The technology landscape has changed a lot since 2010, but my desire to grow hasn't. While I'm unsure if anyone still follows this blog, I will be putting this message out to guage. Blogging is more saturated than it was when I started this. But why use that as a reason to stop trying. Screw robo blogs. He I am human as ever.

Memoization in Simple Terms

2016-11-28T19:08:00.001-04:00

w7r.blogspot.com

Memoization in real talk

Memoization is a strategy for solving a problem which requires repeated work in some manner. Instead of actually repeating the same work, we memorize it (by we I mean the running program). The program writes memos (reminders) to itself, and then before trying to perform work, it checks to see if there is a memo for the particular problem. The time spent looking at the memos is relatively small when using a special data structure known as the HashTable, but in many cases a flat array, or list of values suffices. If the memo-lookup doesn't exist for a set of parameters, then you will calculate the solution for that set of parameters and then store the result in the hashtable or list for any future calls with that same parameter set.

Why use memoization?

It can turn a recursive function from exponential runtime to something much simpler such as NlogN runtime. Big Oh of k O(k). It is important to remember that the decision of structure for holding "cached" (previously stored) results will effect the program runtime dramatically.

The Hidden Cost

The hidden cost of memoization is the space required to store all of the memos in their data structure. When space is scarce, memoization would not be a good solution.

Free Online Encrypt/Decrypt Tool for Securing Messages

2016-11-27T16:30:00.000-04:00

w7r.blogspot.com

A Good Tool Sits in the Front of the Drawer

So today, I stumbled upon a great tool that will allow me to message friends code without the risk of it being intercepted by someone browsing their messages.

The use cases for using encryption and decryption tools are endless and often specific, but boil down to one concern: PRIVACY.

Encryption: The Scrambler

Encryption tools utilize algorithms to jumble messages into an unrecognizable form. The unrecognizable text or data is known as an encrypted message.
There is no reason to encrypt a message without a means of restoring the message at some later time.

Decryption: The Descrambler

Decryption tools utilize a related algorithm to decode the encrypted message. In order for the decryption algorithm to properly restore the original message, a parameter for the algorithm, as well as which algorithm must be known. For example, you could use "Blowfish" algorithm and use they key "penguins".

Where Online?

Tools4Noobs Encryption tool (The message sender will need to use this)
Tools4Noobs Decryption tool (The message receiver will need this)

HOW TO

How To Use the the Tools

Go to the Tools4Noobs Encryption Tool and paste your original readable text in to the big box.
Select any encryption algorithm. Making the right selection will depend on if you think the output is hard to "decipher" or interpret without the use of decryption tool.
Enter a key to be used to unlock the message (just like a house key)
By any means (preferably not the same way you sent the decrypted message to your friend), send your friend the decryption tool website URL ( and let them know what KEY you used, and what algorithm you used for encryption.

Practice Makes Perfect

So, here is a message I have for you using key=penguins and the algorithm=Blowfish.

3a/dG/tW/IB8ve7j2VV0vCa33sk6RW0XKB1kj8qC7OoQe6kLtJCZoIMU1c0/MoWZYvvh8H6lTqwiUWeU/n4HdzFFE6iNyTgPdviSFl8DHVKVjtRLC4gZC+ByaWyDmuj+cBT21KXAlYncsIDOx4QVffOEAA4w0N1KssVU7h4j1Khchld6Rugn1WHhoazAL2C6Y7rc67zKbL9DySDjrpyj3pInhr9gta2ThC2xnLBLyZLxgJPMytlKjgx2YXKoIw+6L3gOp7L2EmA=

Double Equals Vs Triple Equals (Javascript)

2016-11-20T04:41:00.000-04:00

w7r.blogspot.com

Are == and === different in Javascript? YES THEY ARE DIFFERENT.

Alternative Syntax Exists for a Reason

The inventors and maintainers of the Javascript language did not include the triple equals to account for typing the '=' character one too many times...

Usage of Double Equals ==

The double equals, ==, is used to compare in a flexible manner. What I mean by a flexible comparison is that type-evaluation and conversion is performed before the expression returns a True or False boolean.

Usage of Triple Equals ===

The triple equals, ===, is used to compare in a strict manner. By strict, I mean that no type conversion will take place before comparing the two arguments to the expression (a === b). If the type of variable a and variable b are different, then the triple equals will return False, no matter what. Only when the triple equals expression has two arguments, a and b, of the same type will the comparison take place, in which if the values of argument a and argument b are the same, true is returned; otherwise false is returned.

View the Web in 3D Now!

2013-01-25T13:06:00.000-04:00

w7r.blogspot.com

Since When Did Firefox Support 3D Browsing!??

Personally, I never imagined that I would be able to view webpages in 3 dimensional space, and I am sure you did not either. The idea seems too fantastic to be true. Even now, you probably still have doubts that what I am about to tell you is true (so I wrote directions and left pictures), but you can now browse web pages in 3D through Mozilla Firefox.The directions are below!

3 Steps For 3-D Browsing

Download Mozilla Firefox internet browser Download Site!
Open firefox and visit your favorite website or even try on this site.
Right click the window and select "Inspect Element" followed by toggling the "3D View" option (blue button) on the bottom right corner of the browser.

Controlling the 3D Browser

The browser can be controlled by using the arrow keys, mouse, scroll bar, and keyboard keys. More up-to-date versions of Firefox have greater control in 3D View, so if any keys do not work, make sure you have the current version of Firefox.

Below is a nearly complete table of the controls for Mozilla Firefox's 3D View interface.

TASK	KEYBOARD CONTROL	MOUSE CONTROL
Zoom In / Out	[+] / [-]	Scroll wheel up/down
Rotate Left / Right	[A] / [D]	Mouse left/right
Rotate Upward / Downward	[W] / [S]	Mouse up/down
Pan Left / Right	[←] / [→]	Mouse left/right
Pan Upward / Downward	[↑] / [↓]	Mouse upward / downward
Reset Zoom	[0] (zero)
Focus Selected Node	[F]
Reset View	[R]
Hide Current Node	[X]

Some of the Newer Control Tasks

Reset Focus is new (Firefox 13)
Reset View is new (Firefox 12)

Huge Impact on Web Development!

Being able to view the source code of a website in 3d is an amazing way to visualize what is happening behind the words, boxes, links, and pictures we see. The tallest boxes in the 3D View represent the furthest child elements of the html element.

For web developers with a good understanding of this visualization even without the 3D View, the program can be used to find errors in the html tags that create the page. Also, the 3D view allows developers to select features that are layers not seen by the user.

What about the Other Browsers?

Chrome

I looked for a 3D view or plugin for Chrome internet browser however the overall answer to these searches was that Google Chrome does not have a 3D browsing feature. Chrome does support 3D accelerated graphics which are differ from the feature "3D View" from Firefox.
Internet Explorer

3D Javascript/HTML5 accelerated graphics is implemented here as well; however, a 3D structure to the IE browser is not present. 3D accelerated graphics are misleading because they are 3d elements within a window, instead of a 3D window along with the elements of the page.
Opera

Opera implemented WebGL, a Javascript extension, which enables the browser to render 3D graphics. Sadly, Opera does not support Element Inspection in 3D as seen in Mozilla Firefox's 3D View. WebGL is becoming a standard for 3D graphics rendering for internet browsers, so just about all browsers will include WebGL.
Safari

Unsurprisingly, Apple is patenting 3D features for its Safari browser; however, those features are not available on Safari as of this time. Click here for more info

W7R Tech in 3D View!

Hope for Sager/CLEVO Keyboard Users

2013-01-25T11:55:00.000-04:00

w7r.blogspot.com

The Goal of this Post

The goal of this post is to provide a collection of resources to address, fix, and understand your Sager Laptop Keyboard and its Issues. 99% chance your keyboard problem has nothing to do with Sager or the model of the custom computer.

This is an example of the keyboard light problem. The middle segment of the keyboard should be teal like the right and left segments.

Specifically, I bought the NP9150 (CLEVO P15xEMx) model laptop from AGearNotebooks for a hefty price of $2000+ (USA) with the keyboard upgrade in the of my order. The information on these keyboard problems is hard to find (trust me) so I hope this page helps you out!

List of Reported Keyboard Problems (Sager 9150)

'Q' key not responding to presses
Dim segment of backlit keyboard with all or certain colors
Shift, Fn, and Ctrl only responding to very hard presses

Solutions and Troubleshooting

BEST SOLUTION: Call Sager Support

Sager Support Telephone # 1 626-964-4849

Hours 11:00AM to 4:30PM EST

They will send you a new keyboard for FREE given that you send back your broken keyboard. Once they receive the defective keyboard the new keyboard charge will be voided. In order to help you detach your old keyboard and put in the new keyboard Sager Support will need your EMAIL ADDRESS so they can send you directions and pictures of how the procedure goes. (However, I have included some relavent pictures on the same procedure in this post.)

Unless you are willing to ship your whole laptop to Sager and wait on its return, you will have to replace the keyboard manually.
Replace the keyboard with another model that fits in the laptop
Open and use electrical tape to cover any points of unintended conductivity or shorting.
Straighten out or replace the ribbon connection
Fasten keyboard back light to keyboard panel so that there is no room between the two layers.

A Replacement for my Replacement???

The replacement keyboard I received in the mail had two physical defects, one was a the top right corner of the keyboard was bent upward, and the other was that the protective tape for the ribbon cable was incorrectly placed.

I called Sager Support again and they urged me to repack the keyboard and a delivery man would come pick it up for evaluation; however, Sager sent for another keyboard to be sent through the mail with faster shipping than the first replacement had. The first replacement keyboard was 3-day shipping, but this second one was 1-day shipping. Considering this is not Sagers fault directly they were very helpful and supportive in ensuring I got the perfect keyboard I had payed for. I did not have to mail back my original keyboard because I had not yet received a functional replacement keyboard.

If your keyboard replacement has defects,

DO NOT TRY TO FIX IT. TAKE PICTURES OF THE DEFECTS, EMAIL AND CALL SAGER, AND REPACK THE KEYBOARD TO BE PICKED UP.

Regex Tutorial 3: Phone Nums

2013-01-21T13:33:00.002-04:00

w7r.blogspot.com

Tutorial #2 Answers

"a{3}b{4}c{5}"
"kne{2}"
"cab{2}age"
"2{2}nd stre{2}t"

Typical Regex

Often times, the data we are trying to capture using Regex is not exactly clear. For example, with Regex you may want to capture all of the phone numbers on a website without knowing what actual numbers you will find.

Searching the literal text "333-333-3333" would not be a means of locating all of the phone numbers on a website. It would only capture results with that exact phone number.

So, we need to describe a pattern that follows: 3 digits + hyphen + 3 digits + hyphen + 4 digits.

The Digit Character

"\d" is the text to describe 1 digit. A digit character can only match: 0, 1, 2, 3, 4, 5, 6, 7, 8, 9.

So, "\d\d\d" could match the first three digits of a phone number; however, we can simplify this expression to be "\d{3}". The curly brackets surround the exact number of digits we want to target.

So far "\d{3}" matches the 1st of 5 parts in the phone number pattern we would like to describe. The part following the three digits is a hyphen "-". A hyphen is treated literally in regex because the hyphen has no other purpose in regex besides specifying ranges which appear only in the quantity specifying portion of a regular expression.

Congratulations! Our Work is Nearly Finished!

It so happens that the pattern "###-" (DIGIT + DIGIT + DIGIT + HYPHEN) occurs twice with no characters in between in a phone number (###-###-####) so we can simply repeat the 1st 2 parts of our regex.

Updated Regex: "(\d{3}-){2}"

What Do Parenthesis Do in Regular Expressions??

As shown in the 'Updated Regex' snippet above, parenthesis combine sub-expressions into a bigger expression. Combining the "\d{3}" and the hyphen "-" yields "(\d{3}-)" in which we can specify how many times this group should occur using repetition operators as we did with the "\d".

Parenthesis can do more than group a series of sub-expressions together; however, its purpose is out of the scope of this tutorial. Keep working hard and the answer will soon unveil! Or spoil the answer with the link I provided below.

In-Depth Look at Brackets in Regex

Ta Duh!

Updated Regex: "(\d{3}-){2}\d{4}"

By adding on a "\d{4} to the end of our regular expression we have finished the pattern. However, our regex can be easily tricked with text such as "333-333-55555" because it does not exlude results that have additional numbers on the end. And the same goes for extra digits before a set of 3 digits.

Although, this expression brings in new syntax to these tutorials, I want to make sure you have a strong feeling for the amount of thought necessary to construct a successful regex.

Keep this expression somewhere because it may come in handy some time! Regular expressions are like recipes because they require ingredients (characters, and quantifiers, ..) in a specific order to construct a meal (solution).

B.S. Capital Dee

BS = Backslash. A backslash capital D is an appropriate finish to this expression. "\D" matches any character that is not a digit.

Therefore the cases "333-333-55555" and "4444-333-4444" are ignored as they should be! We wanted only phone numbers in the format ###-###-#### in which this updated expression includes a first and last character case that can quickly determine whether text is a valid phone number (in terms of format ###-###-####).

My challenge for you is to comment text data that would break the expression below!

Updated Regex: "\D(\d{3}-){2}\d{4}\D"

HTML Comments

2013-01-19T23:35:00.001-04:00

w7r.blogspot.com

Who Would Waste Their Time Commenting their HTML???

Turns out, not too many people comment their HTML code, which is a shame because it causes a hellish amount of problems for website and program developers alike. If you have never heard of a 'comment' then no need to worry. A comment is literally a.. COMMENT; however, the comment acts as notes to you and other web developers as to what the code in a specific region does.

An Example of Practical HTML Commenting

Blogger templates provide beautiful website designs that have already been coded for you; however, when a blogger such as myself wants to make changes to the Template code, I have to dig into the source code for my template (which is a MESS). Blogger template codes are usually an eye-sore, so to make my template easier to maintain and tweak I labeled the different segments of my blog code with HTML comments.

For example, I label my additions of code into the template by placing a a line before the content I wrote. None of the comment will be displayed on the blog.

Real HTML Comment Samples

Supreme

Great

Good

Paragraph 1

Paragraph 2

Supreme

Great

Good

Paragraph 1

Paragraph 2

What To Remember!

HTML format for a comment is 
Comments are a concept that is much larger than HTML is itself. ALL PROGRAMMING LANGUAGES IMPLEMENT WAYS TO COMMENT!!!
Comments are programmers notes
Using comments in HTML saves you hours of time on large projects and website designs
Comments can span multiple lines and contain any characters you desire!
Incorrect Syntax of a comment could reveal your comment to your website visitors

Regex Tutorial 2: Repeat This, Repeat That

2013-01-16T10:22:00.001-04:00

w7r.blogspot.com

Let's Avoid Being Redundant!

Regular Expressions can save you a lot of time, by describing complicated patterns that would be ridiculous to search documents for with a standard Search and Replace.

Repeat Operators

Symbol

Quantity

Example

One or more

Regex	Captures	Ignores
"w+"	"w", "wwwww", "wkd", "switch"	"123", "mango", "smiley_faces", ""

Zero or more

Regex	Captures	Ignores
"a*"	"aab", "ab", "b", "LotsOfStuff", ""	NO CASES

one or zero

Regex	Captures	Ignores
"2?"	"2", "a", "2a", "a2"	"22", "0122", "a22b"

Practice Makes Perfect

Try and create the simplest regular expression to identify each text case below! Feel free to comment your answers. FYI: We are taking baby steps so if this is too easy (which it very well may be!) then feel free to skip this exercise.

aaabbbbccccc
knee
cabbage
22nd street

Answers to these questions will be in Regex Tutorial #3.

20 Goals for New Bloggers

2013-01-15T22:08:00.001-04:00

w7r.blogspot.com

Many Blog Expectations, But Many Problems to Address

Expectations are hard to meet, so let me guide you through some realistic and important milestones.

Listed on Google for a search term
Being above 50th item in Google results for your blog name
Being above 10th item in Google results for your blog name
Get more than 1000 pageviews in one month
Get your first user comment (that is not spam)

Have 3 or more pages provided in addition to your posts
Contain 50 pages or posts that contain links to valuable online resources
Get your blog its own domain name
Accumulate at least 10 blog posts that contain images, video, or sound that were uploaded to the web by you
Answer your first user email
Submit your blog to 2+ blog indexing sites
Have 3 friends take a look at your blog without knowing it was yours and use their feedback to enhance your blog
Create a navigation or index page or panel
Review 3 individual blog posts and make 3 changes to enhance each
Obtain a +1 from a Google+ user
Provide a link to your blog feed on your front page
Create a tiny image to be your web-icon
Create 5 posts containing no material other than your own (thus not needing sources and worrying about broken links, ect.)
Fill in the Search Description box for 10 posts

Regex Tutorial 1: Literal Text

2013-01-14T16:09:00.000-04:00

w7r.blogspot.com

What is Literal Text?

Literal text is what it sounds like "literal text". Literal text is kind of a WYSIWYG method of capturing data from documents. WYSIWYG stands for What You See is What You Get.

Example #1: Literal Text

Regular Expression Pattern	132
Document text	"abc123 321 132 1 3 2 1,32 1321321221"
Findings	"abc123 321 132 1 3 2 1,32 1321321221"
Caught text	"132", "132", "132"

Importance of Literal Text

You may be thinking, "That's not regex!"; however, literal text is the foundation for regular expressions, and understanding the idea of a literal piece of text is essential for understanding regular expressions.

Example #2: Literal Punctuation

Regular Expression Pattern	!!
Document text	"How does this work!!?? Is it working!? I hope so!!"
Findings	"How does this work!!?? Is it working!? I hope so!!"
Caught text	"!!", "!!"

20 Resources to Learn Regex

2013-01-14T00:30:00.002-04:00

w7r.blogspot.com

The order of the resources is insignificant. These are all great resources for learning Regular Expressions (Regex). All of these resources have been added to the web Resources page under the Regex category.

I hope this list helps you start or enhance your conquest of learning regular expressions! The rewards of regular expressions is immense and should not be overlooked. Please leave a comment if you benefited from this post - I'd like to know!

Python 3.2 Tutorial 1: Hello World!

2012-12-19T23:54:00.002-04:00

w7r.blogspot.com

Python 3.2 Tutorial #1: Hello World!

Tutorial 1 contents: Code, and explanation for HelloWorld.py followed by useful information about Python in general.


# HelloWorld.py
# Python 3.2 Tutorial Part 1
# w7r.blogspot.com
# Brian R. H.

# the main method/function
def main():
    print("Hello World!")

# Call to main function
main()

How to Run HelloWorld.py on Your Computer!

Download and Install Python version 3.2
Python Download Page
Create a text file
Highlight the HelloWorld.py code and Copy (Ctrl+C) and Paste (Ctrl+V) it into the text file
Correct indentation to look like the text on this page
Save as "HelloWorld.py"
Close the text file and locate the HelloWorld.py file that was created in the same directory as your original text file.
Double left click the HelloWorld.py file and you should see a window open and close in an instant. This behavior of the file is correct so there is nothing to worry about, unless you really want to see it print "Hello World!" to a console window which I will show you how to do soon!

Use the Online IDE provided in the red link box to run HelloWorld.py. Simply select Python on Online IDE and copy and paste the code and press execute!

About HelloWorld.py

In the file HelloWorld.py there are 5 specific elements to familiarize:

# The pound symbol denotes a line comment
def is a keyword used to define functions/methods
" Anything surrounded by quotation marks is a string literal "
() parenthesis often indicate functions such as main
Header are comments placed at the top of a program with the file name, purpose of program, author of program, project name, ect.

About Python and Version 3.2

Although often thought of as a programming language, python is a scripting language! Scripting language or not, it would be challenging to find a software developer that had not used Python regardless of the version. Python 3.3.X is the most recent version of python available; however, version 2.4.X and 2.7.X are still the in wide use.

Holiday Headache Relief

2012-12-18T14:05:00.002-04:00

w7r.blogspot.com

Calm down. It's the holidays! Be greatful for what you have and do not fight for the material possessions in stores like the general public! Perhaps, gracefully shopping online is a better option. Here are a handful of sites that can alleviate your holiday headache.

Seasons Greeting, eCards!

Popular Online Stores

This post will be undergoing frequent modification until Christmas Eve 2012.

Java "Hello World" Program

2012-09-30T11:32:00.004-03:00

w7r.blogspot.com

Traditionally, "Hello world" is the first program created in any programming language by new users to ensure they are able to compile and run their program in the given language. So I thought it'd be a good idea to post up the code for HelloWorld.java on the site for java beginners.


public static void main(String[] args){
    System.out.println("Hello, World!");
}

Breaking Down The Code

System.out.println(string): This statement (or line of Java code) informs the System to print the string (or text referred to by the variable, string) to the console (where output is displayed).
"Hello, World!": is a string literal. String literals are text that are actually written and displayed exactly as the programmer wrote them. You could replace the text inside the quotation marks with anything you would like to be outputted to the console.

Android/Eclipse Programming Solution "Failed to convert @drawable/image.png into a drawable"

2012-07-08T13:41:00.000-03:00

w7r.blogspot.com

While trying to set up an xml reference to an image file I placed in drawable-hdpi folder, the following error occured: EclipseFailed to convert @drawable/image.png into a drawable.

Chances are that you are reading this because you too ran into the same problem. Luckily, I've got your solution!

All you need to do is change the xml reference from "someimage.png" or "someimage.jpg" to "someimage". So simply, eliminate the file extension for whatever resource it was and the error should dissapear.

How to Rename Multiple Files in Windows 7

2012-07-07T12:11:00.001-03:00

w7r.blogspot.com

About this Tutorial

This tutorial will show you how to rename a set of images to the same name with a number representing their original order. This is also called batch renaming.

A Few Simple Steps

Find and highlight the files you wish to rename
Right click any of the highlighted files from the group. Then, select "rename".
Type a new name that the group of files will share, such as "Zoo Photos"
Click or press "Enter" once you have the desired group name for your files.

An Example

Start: 42124.jpg, 42125.jpg, 42126.jpg, 42127.jpg
Rename input: "Vacation"
End: Vacation (1).jpg, Vacation (2).jpg, Vacation (3).jpg, Vacation (4).jpg

Quick Tip:

If you want to select all files in a folder to group rename, simply press Ctrl and A simultaneously.

Turn Links into Buttons with CSS

2012-07-05T16:50:00.003-03:00

CSS Tags Decorate Stuff!

Using CSS you can turn dull links into attractive buttons. Let me show you how!

What an average link looks like...

Average link

Average link

What a link could look like...

Button link



Button link

By using CSS I am able to decorate the anchor tag! Before CSS buttons on websites were text in images between the anchor tags.

THIS WAS BAD. Loading images takes a significant amount of time, much more than the average visitor was willing to spend watching the page load. CSS is a way of decorating text based on selectors and classes which describe the style needed.

Thanks to CSS you don't have to compromise looks for speed. Take a look at some more examples of how CSS can decorate links to appear as buttons.

Don't Have the Time to learn CSS?

Although learning CSS would be ideal, there are many programs and websites that host programs to help you create buttons visually. The CSS for the buttons will be printed out to you once you reached a design you like! Try a CSS button creator now!

What a link could look like...

Button link 2



Button link 2

The Parts of a CSS Button

a:link - How non-visited links would appear.
a:visited - How visited links would appear.
a:hover - How links appear while the mouse hovers over them.
a:active - How links appear while they are clicking.

Java GUI Tutorials Archive

2012-07-03T23:42:00.002-03:00

All You Need in One Location

Bookmark this resource before you forget too! This useful post contains a link to every Java GUI tutorial post on W7R Tech. Even if you have completed all of the W7R Java GUI tutorials, you can use this post refresh and expand your understanding of Java GUIs. Enjoy!

Don't forget to bookmark this resource! And make sure to subscribe to W7R Tech!

Rage Compilation #4

2012-07-03T17:44:00.000-03:00

w7r.blogspot.com

If you have haven't had the opportunity yet the links for the first 3 rage compilations are at the bottom of this post. With a number of views far exceeding my expectations, they are worth a look! And enjoy!

Image Source

See more of W7R's Top Rage Comic Compilations!

Java GUI Tutorial 6 - JPanel as a Container

2012-07-01T23:37:00.004-03:00

w7r.blogspot.com

JPanel as a Container

In this tutorial, a new class (extension of JPanel), MainPanel.java has been added to the source files and is going to act as a common container for all instances of the ButtonPanel we create. The ButtonPanels are able to operate independently of one another.

The Source Codes for the Tutorial

MainPanel.java source code is in the code box below this paragraph. The rest of the classes: ButtonPanel.java, and ColorButton.java can be found in the last Java GUI tutorial #5. Click here to open the last tutorial

Runner.java

import java.awt.Dimension;

import javax.swing.JFrame;

/** Coded and designed by Brian R. H. 
 *    w7r.blogspot.com
 **/

public class Runner {
 public static void main(String[] args) {
  //where the program begins
  Dimension d = new Dimension(600,400);
  JFrame frame = new JFrame("W7R Java GUI Tutorail #6");
  MainPanel mainPanel = new MainPanel(d);
  frame.add(mainPanel);
  frame.setSize(d);
  frame.setVisible(true);
 }
}

IMPORTANT: Runner.java was updated for this tutorial. The version of Runner.java from tutorial 5 WILL NOT WORK the way we need it to for this tutorial.

MainPanel extends JPanel

import java.awt.Color;
import java.awt.Dimension;
import java.awt.event.ActionEvent;
import java.awt.event.ActionListener;

import javax.swing.JPanel;

/** Coded and designed by Brian R. H. 
 *    w7r.blogspot.com
 **/

public class MainPanel extends JPanel implements ActionListener{
 //main panel will store all sub panels.
 ButtonPanel buttonPanel1, buttonPanel2,
 buttonPanel3, buttonPanel4, buttonPanel5;
 MainPanel(Dimension d){
  setBackground(Color.white); //default background
  setSize(d);
  buttonPanel1 = new ButtonPanel(d);
  buttonPanel2 = new ButtonPanel(d);
  buttonPanel3 = new ButtonPanel(d);
  buttonPanel4 = new ButtonPanel(d);
  buttonPanel5 =  new ButtonPanel(d);
  this.add(buttonPanel1);
  this.add(buttonPanel2);
  this.add(buttonPanel3);
  this.add(buttonPanel4);
  this.add(buttonPanel5);
 }
}

Important Lines Of Code Explained

new ButtonPanel(d): creates a new instance of the ButtonPanel class with dimensions d.
this.add(buttonPanel1): adds the ButtonPanel to the MainPanel visually.
implements ActionListener: This snippet from the MainPanel.java class is not necessary for this tutorial, but is in preparation for Java GUI Tutorial #7.

Things to Note from the GUI

All of the ButtonPanels are not the correct dimension (Dimension d) they were passed in their constructor.
Color.orange appears to be the same color as Color.yellow
There seems to be a border around each ColorPanel that was added to the MainPanel.

See more of W7R's Java GUI Tutorials and Lessons!

Easy Ways to Decrease Home Page Load Time

2012-06-29T13:19:00.002-03:00

w7r.blogspot.com

The Sad, but True Facts	The Big Factors
Unfortunately, not everyone has the same internet provider, connection, and/or browser as you do. Any one of those differences can determine whether your website loads in 1 second or 120 seconds. As you know, page viewers do not like to wait. In fact most visitors would rather research and try a different resource than a website that does not load in under 5 seconds.	internet provider computer speed web browser device or computer location cache memory bandwidth

Obviously, you cannot buy all of your readers Alienware super computers so to decrease page load time you must focus on your websites' internals.

Is Less More?

To decrease your home page's load time, yes, less is most definitely more. In general, the less content on your home page, the faster the it can load. The problem is identifying how much each type of content is "worth". By "worth" I mean how much time will it add to your pages load time for the average visitor. Time is money.

Easy Ways to Decrease Home Page Load Time

Change .png files to .jpg or .gif using an image editor such as Paint, Fireworks, or Gimp. By decreasing the size of the files loaded on the home page it takes less time to load. In order of size (smallest to largest): .gif < .jpg < .png
Eliminate requests to other websites.
For example, I use Alex Gorbachev's SyntaxHighlighter to highlight code examples in 4 languages of the many in his library so I deleted all the references to resources I did not need at load time.
Eliminate excessive or unnecessary comments.
Compress your CSS to eliminate unused or duplicate lines. CSS Compressor
Replace text based images with literal text. This helps your website become smaller and faster in addition to being more search engine friendly (SEO).
Use CSS to replace excessive HTML tags.
Defer javascript to the end of the loading process.
Use free professional tools to determine the status of your websites load time. I like to use Pingdom but there are several others.
Remove excessive widgets
Remove excessive pictures
Remove LIVE content

How to Create Email Links with HTML

2012-06-27T20:21:00.001-03:00

w7r.blogspot.com

Copying and pasting an email address into the "To:" prompt of an email can be surprisingly unpleasant especially when the email benefits the receiver and not the sender.

In a blog such as W7R it is important to allow users to email you with as little effort as possible (without the copying and pasting).

Email me!

Result: Email me!

About the Email Link Syntax

The 'a' is the same anchor tag used with website links
href is an HTML attribute of the anchor tag, 'a'
After href comes an = sign and a destination in parenthesis
The format for email destinations is mailto: + an email
Replace AnEmailAddress@gmail.com with your own email
</a> is a closing tag for an anchor

Bulleted Lists in HTML

2012-06-25T02:09:00.000-03:00

w7r.blogspot.com

Bulleted Lists Quick Facts

The HTML opening tag <ul> and its matching closing tag </ul> create bulleted lists
The more formal name for bulleted lists is Unorganized Lists
These quick facts are list items of an unorganized list.
List item can contain
- pictures
- text
- video
- links
and combinations of those mentioned (pretty much anything)
Unorganized lists can have list items that contain unorganized lists lists inside them. Lists in lists are considered nested (previous list item)

Bulleted lists are called Unorganized lists and are used to display information that is to be treated equally (no rankings or order necessary).

Here is the source code for the Bulleted Lists Quick Facts!

HTML Entity [Case Sens.]	Symbol
>	>
<	<


  
  The HTML opening tag &lt;ul&gt; and its closing tag &lt;/ul&gt;  create bulleted lists 
  
  The more formal name for bulleted lists is Unorganized Lists
  
  These quick facts are list items of an unorganized list.
  List item can contain
    
      pictures
      text
      video
      links
     and combinations of those mentioned (pretty much anything)
  
  Unorganized lists can have list items that contain unorganized lists lists inside them. Lists in lists are considered nested (previous list item)

Numbered Lists in HTML

Regular Expressions

2012-06-23T21:47:00.000-03:00

w7r.blogspot.com

Regex Basics

Regex stands for regular expressions
Used to describe patterns in text files
Can detect dynamic patterns, such as phone numbers followed by a persons name
Supported in nearly every programming languages with minimal differences
A standard for efficient editing of text documents
A more powerful version of "Find and Replace"
Can save you a lot of time revising typed up work

Like Find and Replace on Roids

If you have heard of the Find, Replace, or Find and Replace feature on Microsoft Word or any other software, then you probably know that it can eliminate a lot of time spent on tedious and repetitive tasks such as changing every occurance of the word "he" with "she" or "Mr" to "Mrs" or "Ms".

Efficiency Is Key

No matter how large and complex a pattern becomes, the time spent finding/coding the correct regular expression will stay relatively the same. Regex code can be reused and altered to describe similar situations that do not match the original expressions criteria.

The reason Regex is efficient is ultimately because you are allowing a computer to repeat the pattern instead of you, your mouse, your eyes, your keyboard do manually.

An Example of Regex's Efficiency

A blogger, such as myself realizes that he has a lot of bold text tags instead of the preferred bold text. It was an easy mistake to make using the "Compose" tab in Blogger's post editor, but a very difficult problem to fix via the HTML tab in post editor.

The blogger spends 30 minutes fixing the format for one of his many posts and realizes he can't waste so much time on such a small detail. So, the next time he fixes the format of a post he utilizes the Find and Replace feature and spends only 8 minutes fixing the format of a post of similar length. He's satisfied, but does not want to waste 8 minutes each on all of his posts (8min/1post, 800min/100posts).

Using Regex the same blogger is able to apply the same edits to each post in 1 minute, because all he has to do is reuse his previously written expression (the same changes occur on each blog post). With practice regex code for these canges can be written in under 5 minutes.

Thus, the blogger could apply all the necessary format changes to his 100 blog posts in under 105 minutes. That is 1 hour and 45 minutes well spent!

Here is a regular expression I used to change my tags to tags

Find: <(\s*)b((>)|(\s+.*>))
Replace: 

Find: <(\s*)/(\s*)b((>)|(\s+.*>))
Replace: 

Regex Tutorials

Regex Cheatsheets and References

Regex Cheat Sheet

Sager Support Telephone #	1 626-964-4849
Hours	11:00AM to 4:30PM EST

Free, Quick, and Easy Computer Tips and Tricks

It's Been a While

Memoization in Simple Terms

Memoization in real talk

Why use memoization?

The Hidden Cost

Free Online Encrypt/Decrypt Tool for Securing Messages

A Good Tool Sits in the Front of the Drawer

Encryption: The Scrambler

Decryption: The Descrambler

Where Online?

HOW TO

How To Use the the Tools

Practice Makes Perfect

Double Equals Vs Triple Equals (Javascript)

Alternative Syntax Exists for a Reason

Usage of Double Equals ==

Usage of Triple Equals ===

View the Web in 3D Now!

Since When Did Firefox Support 3D Browsing!??

3 Steps For 3-D Browsing

Controlling the 3D Browser

Some of the Newer Control Tasks

Huge Impact on Web Development!

What about the Other Browsers?

Chrome

Internet Explorer

Opera

Safari

W7R Tech in 3D View!

Related Links

Hope for Sager/CLEVO Keyboard Users

The Goal of this Post

List of Reported Keyboard Problems (Sager 9150)

Solutions and Troubleshooting

BEST SOLUTION: Call Sager Support

A Replacement for my Replacement???

Related Links

Regex Tutorial 3: Phone Nums

Tutorial #2 Answers

Typical Regex

The Digit Character

Congratulations! Our Work is Nearly Finished!

What Do Parenthesis Do in Regular Expressions??

Ta Duh!

B.S. Capital Dee

HTML Comments

Who Would Waste Their Time Commenting their HTML???

An Example of Practical HTML Commenting

Real HTML Comment Samples

Supreme

Great

Good

Supreme

Great

Good

What To Remember!

More HTML Posts!

Regex Tutorial 2: Repeat This, Repeat That

Let's Avoid Being Redundant!

Repeat Operators

Practice Makes Perfect

20 Goals for New Bloggers

Many Blog Expectations, But Many Problems to Address

Regex Tutorial 1: Literal Text

What is Literal Text?

Example #1: Literal Text

Importance of Literal Text

Example #2: Literal Punctuation

20 Resources to Learn Regex

Python 3.2 Tutorial 1: Hello World!

Python 3.2 Tutorial #1: Hello World!

How to Run HelloWorld.py on Your Computer!

Use the Online IDE provided in the red link box to run HelloWorld.py. Simply select Python on Online IDE and copy and paste the code and press execute!

About HelloWorld.py

About Python and Version 3.2

Holiday Headache Relief

Seasons Greeting, eCards!

Popular Online Stores

This post will be undergoing frequent modification until Christmas Eve 2012.