Monday, November 23, 2009

Car-Economy.com: The Free Vehicle Mileage Log

Car-Economy.com is a free vehicle log that I use to track my car mileage. I was using a standard notepad to log my fuel economy and fill ups. At some point I wanted to data capture all my manual logs into Excel or something like that and see if my fuel economy got worse or better depending on what I did. I eventually came up with an idea to make a web app, so Car-Economy was born.

It has the following features:
I'll be adding some more features as time goes on, but until then please sign up for free and tell me what you think.

Friday, May 29, 2009

Resetting DotNetNuke After Uploading a Broken Skin

Today, after uploading a Skin file to DotNetNuke, it threw this exception when rendering the Home page:

DotNetNuke Error: - Version 04.09.02



An error has occurred.
DotNetNuke.Services.Exceptions.PageLoadException: Object reference not set to an instance of an object. ---> System.NullReferenceException: Object reference not set to an instance of an object. at DotNetNuke.Common.Globals.CreateValidID(String strID) at DotNetNuke.UI.Skins.Controls.Styles.AddStyleSheet() at DotNetNuke.UI.Skins.Controls.Styles.Page_Load(Object sender, EventArgs e) at System.Web.UI.Control.OnLoad(EventArgs e) at System.Web.UI.Control.LoadRecursive() at System.Web.UI.Control.LoadRecursive() at System.Web.UI.Control.LoadRecursive() at System.Web.UI.Control.LoadRecursive() at System.Web.UI.Control.LoadRecursive() at System.Web.UI.Control.LoadRecursive() at System.Web.UI.Page.ProcessRequestMain(Boolean includeStagesBeforeAsyncPoint, Boolean includeStagesAfterAsyncPoint) --- End of inner exception stack trace ---

I couldn't get back to Admin>Skins to reset the skin, so I had to find a way to reset the skin without the Admin interface.
I reset DotNetNuke to the default skin by deleting the folder under /Portals/0/Skins/. From there I could explode the 'nuke again.

Monday, December 03, 2007

Brian's bedroom up

If you get some time, go and check out Brian's bedroom. He's going be posting a whole bunch of articles on getting running with Ubuntu Studio.

Thursday, September 06, 2007

Web 2.0 gradients for GIMP

Thanks to BitBox for this one. Some sweet preset gradients for making sleek looking logos.

Get them from here:
http://gimp-tutorials.net/30-Ultimate-Web-20+Layer-Styles-for+-Gimp

Cool Web 2.0 gradients for gimp

Wednesday, August 08, 2007

Creating a Web 2.0 logo in GIMP

Instead of working today, I decided to revamp the iChurch logo using the GIMP. It came out alright so I decided to create a short tutorial on how I did it. That didn't work so I made a really long one.

Here's what it looked like originally:



and here's the final product:



Setting up the text path


First start with a same size as the original image. I use the FreeType filter (found under Filters>Text>FreeType...) rather than the standard Text tool. The FreeType filter gives you much more control over the spacing and size of your text.

Firstly, we'll create the word "Church". I used Verdana for its clean look, and moved the letter spacing to -160 in order to bring the letters closer together. Spacing can make a world of difference. Play around to get what you need.



Make sure that you tick the "Create Bezier Outline" checkbox so that we can use the selection over and over.

Click OK and you'll see the newly created path (if you can't see it, go to the Paths tab on the Layer, Channels & Paths dock and make it visible.)



Filling the church


Create a new layer (Layer > New Layer ... ).



Create a selection from the path.



Select the gradient tool and choose a dark colour and a light colour. I chose dark blue to light blue. Create a linear gradient from top to bottom, with the lighter colour at the bottom.



Next, we'll create an inner shadow. First create a new layer. Select the PaintBrush tool and choose the Circle Fuzzy (03) brush. Choose black as the foreground colour.

Making sure that you still have the selection, go to the paths tab on the Layers, Channels and Paths dock and right-click on the Church path. Select Stroke Path from the menu.

Choose "Stoke path with a paint tool" and make sure that the PaintBrush is selected.



The result should look like this:



Now, add a new layer and get the selection from the path again. Create a white-to-transparent linear gradient from the bottom of the text that just covers the lighter blue shade.



Set the Mode on the new layer to Overlay and move it below the Inner shadow layer.



Bringing in the bling



Now we'll add the token glass finish that everyone loves so much. First select the Paths tool from the toolbox:



Create yourself a wavey path over the text by clicking and dragging the Path tool. Make sure that you leave space above the text. When you're done, hold CTRL and click on the first point to close the path.



Now comes the super sneaky bit. In the Path tab of the Layers, Channels and Paths dialog, select the first text path and create a selection from it (right-click and select Path to Selection. Then right-click the new wavey path and select Intersect with Selection.



It should look like this:



Create a new layer and select a White-to-transparent linear gradient. Apply the gradient to the selection with the white at the top. Make sure that you end the gradient a fair distance below the selection so that the edge of the selection is sharp. Set the Opacity of the layer to 75%.



Create another layer and create another White-to-transparent gradient inside the selection. This time end the gradient a third of the way down the selection.



Deselect everything (Select > None) and create yet another layer. Select the dark blue colour again and go to the Paths dialog. Right-click the 'Church' path and choose Stroke Path....

In the Stroke Path dialog, choose Stroke Line, 1.0 px and Solid.





Using the same technique I created the 'i' in red. I used orange for the lighter part of the red gradient because a lighter reddish pink looks far less vibrant.



Finishing touches



Soft shadow



Hide the white background layer by clicking the eye in the Layer dialog. Select Copy Visible from the Edit menu, and then Paste (also in the Edit).



In the Layers dialog, there'll be a new layer called 'Floating Selection'. Right-click on it and select new Layer. (This creates the pasted layer as a new layer. If you select Anchor Layer, it pastes the copied layer into the current layer. This frustrated me to no end when I started using GIMP).


Go to Script-Fu > Shadow > Drop-shadow. Set the Blur radius to 9 and the Opacity to 37. Click OK and wait for your shadow to be cast.



If you want, you can select the Move tool and move the shadow layer around until you are happy with how it looks. You can also adjust the Opacity of the shadow by adjusting the layer's Opacity.

Reflection


Select the Layer that you pasted to create the soft shadow from. Flip it vertically by going to Layer > Transform > Flip Vertically.



Select the Move tool and move the layer to a couple of pixels below the original text.



Right-click on the layer and select "Add Layer Mask...".



Choose the default "White (full opacity)" option when asked what you want to initialize the mask to. Right-click on the Layer and select "Show Layer Mask". Make sure that "Edit Layer Mask" is still selected.

Select the gradient tool and make a White-to-Black linear gradient over the layer mask with the white at the top.



Right-click the layer and unselect "Show Layer Mask" and "Edit Layer Mask"

And that's it.