Cyberslingers

Finally scored!!

Admin — Tue, 14 Jul 2009 18:00:00 -1000

Transcribed a tune I had written for guitar a couple of years ago using Noteflight.com – I had forgotten how much fun it was to score music. The rhythms aren’t perfect but I am surprised at how well this site works. Looking forward to writing more music in the near future!

Gunslinger illustration

Admin — Tue, 14 Jul 2009 17:47:00 -1000

This is a quick illustration I did while brainstorming some new blog themes. I recently changed jobs and had to return the laptop that I had been using for work, so I didn’t have access to Photoshop anymore. I decided to give SumoPaint.com a shot and I think the results came out pretty well!

Flash now on Android: HTC Hero

Admin — Sat, 27 Jun 2009 05:38:00 -1000

This is huge. Looks like the new HTC Hero is still using AS2 and not a full Flash Player 10 yet, but the evolution of Flash enabled phones will allow for web developers to easily deliver rich multimedia content and applications for the mobile web in the near future, as well as optimize existing Flash content that is out there already. Think YouTube, Hulu, AddictingGames, Rhapsody... in other words, what amounts to a netbook in the palm of your hand. Currently, this release is integrated into the HTC Hero’s ROM – so you’ll have to wait for a version of the Flash player that can be installed on other Android devices. Also, I would think that sites that rely on the latest features of Flash Player 10 will probably not work well or at all on the Hero. All the same, I get a little light-headed thinking about what could be possible in the near future as the software and hardware evolves. Imagine having the ability to use Adobe ConnectNow, Buzzword, or even Photoshop from your phone :-D

Convert a scanned PDF to Word using Acrobat

Admin — Sun, 21 Jun 2009 05:55:00 -1000

In case you weren’t already aware, it is possible to convert a document that has been scanned and saved as a PDF into a Microsoft Word document, as long as the scanned text is relatively clear. You can do this using the built-in optical character recognition (OCR) features of Adobe Acrobat. The end result is only a simple text file that will need to be reformatted by applying new styles, but it will save you a lot of typing!

To convert your PDF:

Open the file
Select Document>OCR Text Recognition>Recognize Text Using OCR
Select File>Export>Rich Text Format
Make sure to click the “Settings” button in the Save Dialogue and deselect “Include Images”. It is easier to do the images separately, either by opening the PDF using Photoshop or by cropping the PDF page and exporting the image as a JPG directly from Acrobat. You will probably notice that really poor quality text (maybe it was highlighted or underlined) will want to become an “image”. Deselecting the image option saves time in my opinion, plus the images will disappear when you save as text format later in Word anyways – just make sure to compare page by page to re-enter any missing text. This is still MUCH faster than typing for most people.
Open the new RTF file in Word. To remove all of the useless frames you now see before you, save the document as a text file. Close the document. Rename the text file so that it has a “.doc” extension and then open the text file in Word again. Do a “Select All” (CTRL+A) to change the font from Courier to Arial or whatever you prefer, or simply select the Body Text style and continue formatting as needed.

It is worth noting that full featured OCR programs like OmniPage Professional will do a better job at capturing a document’s formatting and images than Acrobat, but in my experience, by the time you get it set up to perform consistently (usually by drawing boxes around content one page at a time and designating it as text or graphics) you might as well have typed it yourself! Unless you feel you will be spending a large amount of time performing OCR, using Acrobat to capture scanned documents should be more than adequate.

Happy formatting!!

Add an Event Calendar to WordPress using Google Calendar

Admin — Fri, 12 Jun 2009 19:06:00 -1000

Live Demo

I was recently tasked with adding a dynamic event calendar to a WordPress site. I considered several possible ideas including custom WordPress calendar plugins and even a great Flex event calendar. Then it occurred to me that I could simply embed a custom Google calendar. The initial configuration to set up the calendar size and permissions only needs to be done once, then client only needs to worry about logging in to Google and adding events!

How do we accomplish this miracle of web application goodness? First, you will need a Google account. If the site is for a client, you will probably want to create a new account specifically for them. Once this is done, navigate to Google Calendar and clicke “create” under “My Calendars” in the sidebar:

Then go ahead and give your calendar a name, description and location. Don’t forget to make sure that your calendar is set to be “public”; otherwise, other users will get a permissions error when trying to view the embedded calendar:

Click “Create Calendar” and select yes when Google warns you that this calendar will be visible to everyone in search results:

Now you will want to add a few events for testing purposes. Simply click any date and type something in the “What” field:

Now you are ready to configure how the calendar will appear when it is embedded on your site. Navigate to your calendar settings using the “My Calendars” module in the sidebar:

Scroll down to “Embed this Calendar” and select the “Customize the color, size and other options” link:

It is very likely that the default embed size of 800x600 is much larger than the WordPress template your site is using. This is where you will set the desired size, available navigation features, and the default calendar mode. My preference is to disable the calendar title since the WordPress post will have its own title, and to disable the Calendar list feature since I am only going to be sharing one calendar for now. If you will have a lot of events, you may want to consider choosing “Agenda” for the default mode since it will display your events in list format and will probably be easier for users to navigate in a blog format. I went with 600x400 for the new size of the calendar as well:

Copy the generated HTML and login to your WordPress site, create a new post (or page), give it a title, select HTML mode, paste in the new code, and save the post:

Your calendar should now be live. I suggest logging off of Google and checking the calendar again to make sure that it is indeed set to public. Remember, if you are viewing your calendar in one tab and you are adding new events in another tab, you will have to reload the page before your new events appear in the calendar.

So far this solution has worked really well for me. As always, I love to hear the good and the bad from anyone else tinkering with Google Calendar!

Upgrading BlogEngine.NET hosted on 1and1 using the Blog Importer

Admin — Fri, 22 May 2009 01:08:00 -1000

Well I have been putting it off for too long now, but I have finally gotten around to upgrading my blog. I decided to install a completely fresh version of BlogEngine side by side with the existing version in a new folder. I then used the Blog Importer application found on the BlogEngine Settings page (make sure you are using Internet Explorer for this step) to export and reimport my posts using BlogML format into the new blog. You will want to export your posts from the Settings page on your old blog to somewhere you can easily find, like your desktop. It generates a single XML file and works fairly quickly. You will then need to download the images and files that are linked to your posts using FTP - you'll need the AppData/Files folder (again, I just put this entire folder on my desktop).

Once this was done and I was sure I manually duplicated the few remaining fields in the Settings panel, I simply archived my old blog to a zip file and deleted the entire folder. I then renamed the new folder to match the name of the old one. I noticed that the new install added the dates to the URL by default, but this is easily turned off in Settings if you were not doing this on your old blog. Remember, you want to try and maintain as many of the links as possible to avoid broken links from referring sites. Another gotcha is that it seems that the Blog Importer didn't catch small changes in the slugs - so it doesn't hurt to do a rough side by side comparison if you create your slugs manually or if you typically modify them.

I will keep an eye out over the next couple of days and try and fix any stray links I might have missed on the first pass, but so far I am excited at how smoothly everything went. I will be slapping a fresh theme on this puppy soon, so keep an eye out and let me know what you think!

Post to Twitter from Safari on iPhone using Twitlet

Admin — Tue, 28 Apr 2009 11:46:00 -1000

This is a really quick and easy way to post sites from Safari on the iPhone to your Twitter account using Twitlet.

Go to Twitlet and follow the instructions on the main page to generate your custom 'Twitlet link'.
Drag the link to your bookmark bar in your browser, then right click it to edit it
Now you simply want to make it something you can bookmark on your iPhone. I found the easiest way for me to do this was to add "http://www.twitlet.com?q=" (without the quotes) before the word "javascript", and then simply take this new url and email it to yourself or use a service like Delicious or TinyUrl.com to create a bookmark or link that you can send to your iPhone. I used Delicious since, well, there's an app for that :-)
Once you can see the link on your iPhone, open it in Safari and bookmark it. Now you can edit the link on your iPhone and remove everything up to the word "javascript".
Now when you are viewing a page in Safari, click the bookmark icon and select the Twitlet bookmark you just edited. It should fire up a Twitlet popup window right in your browser. Simply add #link or #this to send the current page address along with your Tweet!
This works great with other popular bookmarklets (or favelets) such as "Share on Facebook" too.

Enjoy!

Working with Tables in Quark

Admin — Tue, 28 Apr 2009 11:22:00 -1000

I have been practicing my Quark tables and found some really neat features. I have avoided using this tool in the past because it seemed cumbersome, and I felt that I could create tables more quickly simply by drawing them using picture and text boxes. After experimenting a little bit; however, I am much more excited about creating tables with the Table tool. Here are a few tips to help you get the most out of this tool:

Layout

You can highlight a column of cells and link them so that they will act like traditional linked text boxes. This way you can paste a whole column of text from an old table and it will flow from cell to cell – great for converting long textbox columns to a Quark table column (if you try to link cells more than once this option will be grayed out, so make sure do this methodically. As far as I can tell, there is no visual indicator for linked cells):

To change the vertical alignment of a cell, highlight it and press CTRL-M. You can also set the internal padding/margins for the cell here under Text Inset (especially handy for the title and any left justified text):

To make a row taller, press F7 to view guides if you don’t have them on, and select the row edge you want to move using the Text tool:

Shading Rows

To select all of the alternate rows at once so that you can make them gray, make sure the Text tool is selected in the toolbar, and then use the Table pull-down menu and select “Odd” rows, change them to 30% Black, and change the first row back to red for the title:

Borders

You can also use this same menu to select Horizontal Grids, Vertical Grids and Border. Select the Horizontal Grids, press CTRL+M and set the border width to zero under the Grids tab. Then do it again for the Vertical Grids, and then do it one more time to set the Border as well.

To select multiple cells at once, don’t try to use the Shift key like Excel. You just have to click and drag using the Text tool.

Summary

When doing massive spreadsheet style tables like this one, using the Table tool makes it much easier to tweak the column and row widths, the text leading, and to change the horizontal scaling on those long header words and make the headers vertically justified. There will be some adjustment as you become familiar with the process, but the time saved makes all the difference.

Online Digital Painting Software – Sumo Paint

Admin — Mon, 09 Feb 2009 21:12:00 -1000

I recently discovered Sumo Paint, a full featured online digital painting program. Built using Adobe Flex, I am simply amazed by the amount of features Finnish company Snap Group, Ltd. has been able to pack into this free web application. Sumo Paint loads quickly and has many of the same features, if not all, of the traditional desktop applications in the same category.

Some features that really grabbed my attention include layers, blending, a large library of shape, brush and ink tools, text and gradient tools and even filter support. Undoubtedly, this app pushes the RIA envelope –and the result is very cool.

Flex ComboBox: Assigning Items as the Default selectedIndex

Kevin Brammer — Thu, 18 Dec 2008 22:49:00 -1000

I recently discovered a post by FlashBulb on Actionscript.org that helped me solve a problem I was having with assigning a value provided from a database as the default selectedItem with the Flex ComboBox. The easiest way to assign a particular item so that it will appear as the default selection in Flex is to provide the selectedIndex for that item. The trick, of course, is how do we search the ComboBox datasource in order to determine the necessary index to assign to the selectedIndex property?

Here is FlashBulb's solution, modified somewhat for Flex. If you are using an Array instead of an ArrayCollection as the datasource for your ComboBox, you can simply relace the ArrayCollection type with the Array type in the findIndex function below.

myComboBox.selectedIndex = findIndex(myArrayCollection, myItem);

//...

private function findIndex(whichArray:ArrayCollection, whichItem:String):Number

            var ret_value:Number = 0;

            for(var i:uint = 0; i < whichArray.length; i++)

                if(whichArray[i].label == whichItem)

                    ret_value = i;

            return ret_value;

};

It is important to realize that this function is searching for a specific property, "label", within the ArrayCollection. You will need to modify this to suit your needs. For instance, if your Array does not have properties you will probably need to loop by specifying the desired index (i.e. if(whichArray[1][i] ==whichItem)). This is an example of the ArrayCollection that I used:

public var myArrayCollection:ArrayCollection = new ArrayCollection([

            {label:"Production", data:"0"},

            {label:"Support", data:"1"},

            {label:"Graphic Design", data:"2"}

]);