2014-02-08

Level Up - Webmaster: Installing Laravel and Composer on Bluehost

These steps will get you though getting Laravel up and running on your Bluehost server, though these instructions should be a good enough how-to for other shared hosting providers as well.

This was my first time experiencing (and hearing of) Laravel and Composer and had to look at many websites to figure this information out. Below is a walkthrough of all the steps I would have needed in one location. For more advanced and specific informations, I provide links at the end. But, the steps shown should be enough to get going quickly from scratch.

1.  SSH into your server at ~/bin/
2. Ensure that you have PHP 5.3.7+ on your server. Composer requires 5.3.2+ and Laravel requires PHP 5.3.7+. You can check with which php and which php-cli
3. Install Composer: Run the command curl -s http://getcomposer.org/installer | php
4. Test that the installation worked by running php-cli composer.phar
5. Install Laravel: Run the command php-cli composer.phar create-project laravel/laravel --prefer-dist
Note: Step 5 may take a minute or two, there are many dependencies that have to also be installed for Laravel.

Extra steps
6. Look at this file for project-specific adjustable values: app/config/app.php and bootstrap/paths.php
7. See my next post for more walkthrough

More info:
- Laravel installation instructions
- Laravel configuration instructions
- Then, the Quickstart


Error: "warning: composer should be invoked via the CLI version of PHP, not the cgi-fcgi SAPI"
Fix: Use the command php-cli instead of php.


~ Danial Goodwin ~



2014-02-07

Level Up - Windows 8: How to Copy/Move Files From Many Subfolders To Just One Folder

Long Title: How to Transfer Files From Many Subfolders To Just One Folder and Rename Them All Easily and Quickly.

Example: I had about 100 images that were all neatly organized into 100 different subfolders. I wanted to put them in just five different subfolder as painless as possible. Manually moving each image one-by-one was not ideal, so here's what I did, using the Windows Command Prompt and a Batch file:

1. Create a BAT file.
2. Add the following code:
FOR /L %%i IN (0,1,19) DO (
copy %cd%\ic_launcher(%%i)\res\drawable-mdpi\ic_launcher.png %cd%\_mdpi\data_cycle_%%i.png
copy %cd%\ic_launcher(%%i)\res\drawable-hdpi\ic_launcher.png %cd%\_hdpi\data_cycle_%%i.png
copy %cd%\ic_launcher(%%i)\res\drawable-xhdpi\ic_launcher.png %cd%\_xhdpi\data_cycle_%%i.png
copy %cd%\ic_launcher(%%i)\res\drawable-xxhdpi\ic_launcher.png %cd%\_xxhdpi\data_cycle_%%i.png
copy %cd%\ic_launcher(%%i)\res\drawable-xxxhdpi\ic_launcher.png %cd%\_xxxhdpi\data_cycle_%%i.png
)
3. Run the BAT by double-clicking the file (or right-click->Open) (or run via command prompt).

Note:
- The parenthesis after "DO" must go on the same line. Putting it on the next line will cause the file to not work properly.
- If you want to move files rather than copy, then change "copy" to "move".
- If you want to keep the same file names, then you don't have to specify the file name on the second parameter.

Now in a simpler English, what this batch file does:
- There are five "copy" commands with a source and destination.
- These commands are each ran 20 times because of the "FOR" command.
- The "FOR" line says do the following commands within the parentheses 20 times. The first time will have the variable "%%i" equal to 0. The second run will have "%%i" equal to 1. The variable will keep incrementing until "%%i" is equal to 19. This behavior is defined at "%%i IN (0,1,19)", where 0 is the starting number, 19 is the ending number, and 1 is the increment number (which could also be negative).


For more information about for-loops, then type "for /?" into the command prompt.


Here's some more commands that you can try: Windows Command Prompt Cheat Sheet
~ Danial Goodwin ~



2014-02-02

Level Up - Windows 8: How to Create a Batch File

Batch (*.bat) files are useful because they allow you to save and reuse commands for the command prompt (or CLI, command-line interface). Also, it is easier to send multiple commands at once, fix typos, and edit the commands.

Batch files are available for Windows 7, 8, and 8.1. Any command that you can put in the CLI, you should be able to put into the BAT file.


Method 1:
- Right-click on your desktop (or in File Explorer), and select New->Text Document. Now, rename the file to something ending with .bat.


Method 2:
- Open Notepad, then when you save the file, make sure to end it with ".bat".

Saving a Batch file requires a .bat ending.
Test the Batch file:
Now that you have the BAT file, you can easily test that it works by putting in the following code, then double-click to run the file.
echo Hello, World!


Here's some more things you can try out: Windows Command Prompt Cheat Sheet


Note: If method 1 didn't work for you, then try method 2.

~ Danial Goodwin ~



2014-02-01

Level Up - WP Dev: How to Remove Debug Information From Windows Phone Emulator

(This post is for developers of the Windows Phone platform.)

Ever find the frame rate counters and other debug information on the Windows Phone emulator more annoying than useful? It always appears there, whether in debug mode or release mode.

What if you want to get a clean screenshot without having to edit the image later? The red and white performance information on the side of the emulator screen is a nice feature, but I haven't needed to use it much in my recent apps.

It's possible. And, you only have to change one word.

How To:
1. Open App.xaml.cs.
2. Find the line that says `Application.Current.Host.Settings.EnableFrameRateCounter = true;`.
3. Change `true` to `false`.

That's it!

Now, you can get the full/real experience that end users would get when using your app, emulator style.

Feel free to share this with other WP devs that you know.

By default, the emulator has debug information on it.


Source: http://msdn.microsoft.com/en-us/library/windowsphone/develop/gg588380(v=vs.105).aspx


~ Danial Goodwin ~



2014-01-31

Structure Allows Spontaneity and Creativity

Having structure in your life allows you to worry less about the menial aspects of daily tasks. For example, you don't have to spend time thinking when you are going to do something if you already have a specific time for it. By not wasting any precious brain power on the menial tasks, it opens up space and time to use the brain for higher functionality.

My Two Cents.

~ Danial Goodwin ~

ps - Originally not planned for this post, a great example of this concept being put into practice will come from Google. They do all the menial tasks for their employees, including food, laundry, baby sitting, gym, transportation, and more. This may seem like it costs a lot to have, but if you consider the well-being of the employees (less sick days) and while at work employees can put their full minds onto the work, rather than having any nagging sensation, like what/where to eat, how the kids are doing, or even transportation worries (Google shuttles/buses).



2014-01-30

Knowledge Really Is Power

It's been happening quite a bit recently.

Ever get the feeling that everything you're doing seems really easy or smooth? That's knowledge at work. It allows the completion of many tasks to become easier. The more knowledge you have, the more tasks that are available.

Originally, when I first thought of this post idea, the above was pretty much all that I wanted to write about. But, now I'm seeing another side to this story...

Maybe, when one has reached the point of everything being easy, it means that the person isn't being challenged anymore, thus isn't growing or learning... So, it might be time for a change.

Because, after all knowledge really is power. ;)

Random image by Schoolhouse Rocks!


~ Danial Goodwin ~



2014-01-29

Level Up - Android: How To Connected a Full-Sized Keyboard to Android Device?

In this post, I will walk you through connecting a computer keyboard to an Android phone or tablet, via WiFi (or USB cable).

Estimated time of completion: About five to ten minutes the first time, and less than minute after your first run through.

Why is this useful?
There are many great apps on smartphones, but some people find it much more comfortable to use a full-sized keyboard for typing, especially for long periods of time. After going through this post, you will be able to use your computer keyboard like an advanced user:
1. For text messages (SMS), WhatsApp, and any other app with an input field.
2. You will be able to copy&paste text.
3. Speeddial. You can set the function keys on keyboard to open any app on the phone.
and more..


You will need:
- A Telnet program, like PuTTY
- A app on your device, called "Remote Keyboard" created by Onyxbits.
- A WiFi connection


Step 1: Download app to your Android device
1.1. Link: https://play.google.com/store/apps/details?id=de.onyxbits.remotekeyboard
1.2. When you open the app, it should look something like the following. Note the host address on there, it will be different for you.
1.3. Click the "Select Keyboard" button on the Action Bar, at the top of the screen and choose "Remote Keyboard"
Remote Keyboard, Android app


Step 2: Download PuTTY to your computer
2.1. Link: http://www.putty.org/
2.2. When you open PuTTY, change your configurations in three different places: Host, Port, and Connection type. You will get the port number and host address from the Remote Keyboard app. The connection type should be set to Telnet.
2.3. Click Open.
How to set up a Telnet connection


Step 3: Connect to device via Telnet on the computer
3.1. You should now see a window that looks like the following. And, you when you type into this window, key presses will go straight to your device rather than showing up on this window. Just click on any input field on Android to have the key presses sent there.

A Telnet connection to an Android smartphone.


Notes:
- For step 3, if you only see a blank screen, then wait a little longer for the connection. Then, possibly try sending a few keystrokes into the window and the Enter key.
- Windows does have a Telnet client, but I didn't get it to work. Using PuTTY was much simpler.
- Telnet connections are not secure. Each input is sent unencrypted.
- To connect more securely over USB, here are some instructions.

~ Danial Goodwin ~



2014-01-28

Level Up - Paint.NET: How To Create Sprite Sheet From Layers In Paint.NET

Need an easy way to create sprite sheets in Paint.NET? Don't want to create a new file for every image of your animation? Want to experiment with cool new plugins to make your graphic design skills better?

All you need is one plugin combine all your layers into an evenly-spaced sprite sheet.

Difficulty: Easy
Estimated time of completion: Less than five minutes.

Step 1: Download this plugin for Paint.NET: Spritesheet Export Plugin

Step 2: Make sure that Paint.NET isn't running, then copy the "SpriteSheet.dll" file into your Paint.NET installation folder, i.e. Program Files/Paint.NET/FileTypes/ subfolder.

Step 3: Now, when you open Paint.NET, you should have the extra ability to save as SpriteSheet (*.ss.png)



And, if you would like to do the opposite - Spritesheet to images, then check out Sprite Animation Helper Plugin

~ Danial Goodwin ~



2014-01-24

The Progression of Learning How To Write Code

Quote:

"The ugliest code I ever saw was the junk I wrote two months ago. The greatest code I ever saw is the stuff I'm writing today. This statement will still be true two months from now."

Unfortunately, I haven't been able to find a good source to reference this quote to.

~ Danial Goodwin ~



2014-01-22

Construct 2 Bug Export To Windows 8: Too many characters in description.

Here's the full error message in Visual Studio:

"The 'Description' attribute is invalid - The value '' is invalid according to its datatype 'http://WPTokens:ST_String' - The actual length is greater than the MaxLength value"

Basically, this error says that your description is too long.

Through trial and error, I've found out that the max allowable length of the Windows 8 app description in WMAppManifest.xml is 256 characters. So, in order to fix this problem, all you have to do open "WMAppManifest.xml", which can be found in the Properties folder of your app's project. Then, edit your description so that it is not as long. I used Notepad++ to count the number of characters in the description.

I spent a few minutes looking for the official documentation for this file, but didn't find it. I found many official resources for Windows 8 that was close, but weren't for the exact file WMAppManifest.xml. Here's one of the links that is something that I'm looking for <link>.

If you know where the official page for this documentation of max length of 256 characters for the description, then please let me know. This bug still hasn't been reported to the developers of Construct 2 yet, because I think there will be other areas around this spot that also has bugs, and I would like to report them all in one go. This will make things much easier for the developer also. And, it's always good to source fixes.



A picture of the error message.


~ Danial Goodwin ~



2014-01-16

Updated! Google Chrome Finally Adds A Sound Icon For Tabs!

I spy a sound icon

This has been a long wanted feature from many people.

And, as always, Google slowly rolls out new features. So, you may have gotten your already, or will soon be able to see which tab sound is playing in. I found a news article from way back on November 13th, 2013 mentioning this update, where it was in beta.

And, there should be a link to the XKCD comic/article that mentions this feature. That comic was written a long time ago. Hopefully, I can find it again.

~ Danial Goodwin ~



2014-01-15

Why Would I Want To Scale Up Images And Keep Them Pixelated?

A few days ago I wrote a blog post on how to scale up images and keep them pixelated using Paint.NET. Today, I expand on that a little further, using more images to showcase differences.

First, here are some reasons to keep images pixelated as you resize them:
1. Creating a pixelated/retro game and you would like to scale up one of the images to be an icon that accurately represents the game.
2. Prototyping or creating a MVP.
3. Better compression and/or smaller file sizes. This in turn creates a slightly smaller file for users to download an app/game.
4. Not enough time (or skill) to create a full-fidelity/smooth image. So, you determine that a pixelated and crisp icon looks much better than a large blurry icon. (Screenshots for comparison below)

Initial image. 34x24 pixels.
A "regular" scale up resizing causes image to be blurry. 1000 x 1000 pixels with some margin.

This is how the stretched image looks if I didn't first add the margin for the gem to "grow" into. 1000 x 1000 px.



Using "nearest neighbor" scaling. 1000 x 1000 px.

Now, let's randomly compare image sizes of each of the above four images. Each of them were saved in the same PNG, 32-bit format.
1. 542 bytes
2. 137 KB
3. 174 KB
4. 17.6 KB

The pixelated scaled-up image has about a 10x smaller file size as a regular PNG. Using any more compression techniques, the difference would be even larger.

Though, admittedly, this example is small and simple enough that any modern computer will be able to handle these. A complication would arise more probably in a small embedded system or old phones/processors with bad data connections.

Bonus tip: Instead of choosing the different scaling options in Paint.NET or Photoshop. If you want to create a large pixelated image, the regular Microsoft Paint by default already does that.

~ Danial Goodwin ~

ps - A special thanks goes out to reader Spence for the great blog idea suggestion.



2014-01-14

Level Up: Paint.NET: Create Large Image From Small Image Source

In trying to create a logo for my newest game, I had a few images that were 32x32 pixels. So, my first thought for the logo was just a mash up with all of them. And, that looked something horrific, like:

A mashup of small pixelated icons
And, if that were scaled up to the size I needed, it would be even more pixelated, which I did not want for this game. So, I thought for a few seconds to determine what I were to do if I weren't lazy. Using my design background and my like for being minimal, I've decided to just create an image of my own that wouldn't be pixelated. If I were to just blow up an 32x32 image to 1000x1000, here's what it would look like:

This is worse than pixelation
Solution, in order to capture the essence of the game in just a single simple icon, I determined that the bomb disguised as a coin would best represent most of the game. Hopefully, it would also provide a little bit of intrigue to get users to click on it.

Final image, using only my own circles, lines, and rounded rectangles. Oh, and the practical use of Gaussian Blur for the level up! =]




Btw, you can play the free beta version at Simply Advanced Games. Coinqueror is coming soon for Windows 8 and Windows Phone 8.

~ Danial Goodwin ~



2014-01-13

Level Up: Nerdiness: Mod Japanese Super Famicom Games to Play in US Super Nintendo Consoles

Thus, my Nerd level has once again increased after today's completion of modding my Super Nintendo Entertainment System (SNES) so that I can play my ~20 Famicom games on there.

Thanks to MakeUseOf for pointing me in the right direction.

I learned that there was no software restricting the pay of the Japanese games on the American consoles. There was just two small pieces of plastic restricting the cartridge from sitting properly inside. American cartridges have two grooves on the back and the Japanese cartridges are flat.

It seems a lot easier to cut the plastic restrictions off inside the console, compared to creating indentations on each of the games.

The website used only a wire cutter to remove the excess plastic that was in the way, inside the SNES. After discovering that the closest pair of wire cutters next to me were too big, I reach for the next closest thing, which just happened to be a saw.

The oscillating/vibrating saw worked perfectly. It was made to cut flush against surfaces, and that's exactly what happened.

One other note. Japanese cartridges are a little less narrow than the US counterparts, so you have to be a little more careful when inserting them. But, it shouldn't be difficult.

Have fun!

~ Danial Goodwin ~



2014-01-12

Level Up - Paint.NET: How To Scale Up Images And Keep Them Pixelated

Typically, when you resize an image in Paint.NET, it will use anti-aliasing in order for images to look less pixelated. But, sometimes, when you have a great small image, you want to keep it pixelated. So, here's how you do it.

1. From the menu bar, click Image->Resize (or just Ctrl+r).
Step 1. Go to the Resize menu

2. Locate the "Resampling" drop-down menu at the top of Resize window. By default, the option selected is "Best Quality".
Step 2. Click the Resampling option

3. Choose the "Nearest Neighbor" option. Set your width and heights. Then click "OK".
Step 3. Select "Nearest Neighbor" resize option

You now have a large image with the pixelation still intact.

How did I find this out? Experimentation (aka guess and check). Good thing there were only four options there to choose from. ;)

UPDATE: A few days later, I have now written a follow up to this with more image comparisons and reasons why you may want to keep pixelation on an image when resizing.

~ Danial Goodwin ~

ps - The image I used in my screenshots used to be 34x32 pixels, then I scaled it up to be 1000 pixels wide. Then, I added the gem's shine (which isn't pixelated).