On a project we’re working on now, we need to place “pins” on a map. There are some advantages for us not implementing the map with Flash. Namely, the project has a Facebook app component and Facebook requires users to click to activate Flash on profile tabs. I was curious to see how many pins I could instantiate in the DOM before there was noticeable chug. I made a test script that creates a bunch of img elements in the DOM. You can try it out here: DOM Capacity Test.

Through some not very scientific testing, I found that 100-300 DOM elements is my sweet spot (though IE really needs it towards the low end of that range). Any higher and the browser noticeably chugs during rendering. I was surprised that once rendered, the browser didn’t seem to perform any worse during scrolling or resizing. Another thing I noticed was that Firefox visually added each element to the page iteratively (taking much more time), whereas all other browsers immediately showed all of them after the initial CPU churn.

This subject matter is far from new, but quality typography on the web is such an important issue that it deserves attention. There many resources and tutorials out there, but I rarely come across a top-level view of all the typography-related techniques. Therefore, I’ve compiled a roundup of the most popular methods for rendering high-quality typography on the screen.

Images

using images for custom typography doesn’t necessarily have a negative impact on a site’s performance and search engine optimization. If file size is carefully considered, and the proper alt text is used, typographic images can be a good solution. Of course, this technique should only be used for short bits of text, like page headings, pull quotes, and drop caps. I will argue that there are better options available today, but at the end of the day, images are a perfectly valid option.

Flash

The value of embedding fonts in your SWF files cannot be overlooked. Although it would be considered bad practice to utilize flash for only this purpose, if Flash is going to be used anyways, one of it’s major benefits is the cross-browser pixel perfection and ability to embed dynamic type.

Web Safe Fonts & the Font Matrix

The list of “web-safe” fonts is very limited. Normally, most web designers don’t stray too far away from Helvetica, Verdana, and Georgia. This list from 24 Ways helps expand that list to fonts that are common across many computers, operating systems, and installed software. Used correctly in font stacks, developers can target most computers that have software like Office and Creative Suite. Check out the list, you might be surprised by how many fonts are available.

sIFR

It’s worth mentioning sIFR here, although many developers have abandoned this technology in favor of Cufon, which I will talk about later. sIFR (which stands for Scalable Inman Flash Replacement) is a flash replacement technology. The philosophy here is creating the ability to bring rich typography to web pages without compromising accessibility or semantics. Additionally, one of the great advantages of sIFR was it’s fallback to plain text if Flash is not supported. Although it’s been criticized as hard to implement and somewhat buggy, this was the first real jump forward for web typography, and is still very popular to this day. sIFR laid the foundation for many great resources for custom web typography.

Cufon

The best way to describe Cufon is a next generation sIFR which is built with Javascript rather than Flash. This method has it’s benefits like not requiring the Flash plugin – good news for Apple devices. It’s also extremely easy to implement, and has very good performance, even for large amounts of text. You upload font files (with the proper licensing) through the Cufon site, and convert’s the file to SVG format. Then, the SVG file is converted to JSON which can be added to your site through simple Javascript. One downside to using Cufon is that many custom font licenses do not permit usage on web pages, so check the license or use a great free or open source typeface. There are many good ones out there.

If you’re looking for some high quality free fonts, Smashing Magazine is a great place to start your search.

Font-Face

This is by far the easiest method to integrate custom typography on the web. Using the @font-face property allows you to access fonts via CSS, and host the files on your web server. Of course, the same licensing issues remain, so make sure to chose a good typeface with no constraints. From there, you can use @font-face to access that font file for use with any CSS property. Add the font name on the top of your font stacks, and that’s it. There are a few hoops to jump through, mainly to accommodate Internet Explorer. IE requires a .eot file (Embed-able Open Type) to render custom fonts. Luckily, there are a few good online converters that will take common font files (.ttf and .oft) and convert the fonts to .eot. On a side note, I wrote a recent blog post about getting @font-face to work correctly in all major browsers.

TypeKit

TypeKit aims to take all of the hassle out of setting up @font-face, and they do a killer job at it. For as little as $25 per year, you can use fully-licensed fonts which are hosted on TypeKit. All of the licensing issues as well as the compatability woes are taken care of, and in turn you get an incredibly easy-to-use and extremely large font library at your fingertips. It’s definitely work a second look.

Google Font API & Font Directory (beta)

In the same veins as TypeKit, Google recently introduced their font API and font directory. Google hosts fonts that are licensed and ready to go, you just have to target these fonts on your site, and Google will do the rest. Their library is currently very conservative, but hopefully this will grow in the near future.

Here at BKWLD we like to keep things such as our everyday work flow and culture as transparent as possible. I thought it would be a fun idea for everyone whom wanted to take part to list their top 5 or so most used apps.

Some of the apps listed are pretty standard and some not so much. We are always interested in exploring new apps so, please recommend away!

Jeff Toll – Creative Director

Photoshop - “Open and running every day, all day.”
TextEdit – “I get grief for using this but it’s lightweight and simple, simple, simple. I’ll start using a more robust text editor sometime soon. I use it for writing quick storyboards and concept explanation etc. ʻPagesʼ is upon the horizon…”
xScope- “Covers my ass for screen resolution guides at the very least.”
iChat- “Communicating with our Seattle office and random jackasses.”
iCal -“I’ve been getting better and better with my organization.

Robert Reinhard- CTO & Partner

Pages - “I haven’t touched MS Word in over 2 years and haven’t looked back. I love how it handles styles, it’s like easy CSS in a word processor.”
OmniOutliner - “For taking notes on conference calls.”
MAMP Pro - “Powers My LAMP dev environment. Makes it easy to setup additional testing vhosts (test dev rather than local host).”
TextMate – “When is 2.0 gonna come out?! I’ve been flirting with switching to Coda, but I miss some of the hotkeys.”
Socialite -“Aggregates feeds from Facebook, Twitter, Google Reader, and Digg all in one place, plus allows me to post comments/tweets.”

Scott Thiessen – Flash Developer

Safari -“The Activity Window and Web Inspector alone are enough to make me feel like the king of the Internet.”
TextMate - “Lots of power for so little toolbar.”
Sequel Pro – “This is phpMyAdmin’s gorgeous, sophisticated sister. Unbelievable that this app is free!”
Spot Color + Developer Color Picker - “Slick way to grab colors from the screen, tweak them in your favorite gamut, and spit out hexadecimals.”
Quick Look - “Not really a stand-alone app, but I’ve definitely forgotten what it’s like to use a computer without it.”

Matt Aebersold – Flash Developer

Flash + AS3 - “Although thereʼs a steep learning curve, learning object-oriented AS3 has opened up so many doors, and is such an intricate and expansive programming language. Itʼs allowed me to create some kick-ass web designs.”
Coda – “Once a site project is completely set up, the complete integration is incredible, and so intuitive. Once I made the switch I’ve never looked back.”
MAMP - “Helped me do PHP dev on my local machine. Extremely helpful in every way.”
Things - “Awesome to-do app. Easy to set up and manage. So simple, and It’s what’s not included that makes it great. plus syncing over dropbox has make this invaluable. That said…”
DropBox – “Awesome cloud storage. If I point my apps there, than they sync on all my computers (iTunes, Things, etc…). Plus online file recovery is very easy.”

Sean Monahan – Flex Developer

Eclipse w/Flash Builder 4 Plugin - “Paraphrasing a Josh Reddin-ism, ʻItʼs a text editor for fully grown men.ʼ Upgraded from Flex Builder 3 stand alone and my opinion of Eclipse has greatly increased. Eclipse also has plugins for PHP dev, Unfuddle (our ticket tracking software) and Ant (for oneclick builds)- all this allows for a one-step development environment for Elastic.
Calculator -  “Boring, I know, but good for doing quick math. I use this a lot when programming Uls. Bonus: it has a “programmer” view for doing fancy binary math.”
Last.fm – “I like its music picks better than Pandora and the artist bios and photo streams are freaking sweet.”
Photoshop – “What doesnʼt it do?”
Adium - “A slick IM client that supports just about every IM service in existence.”

Aaron Egaas – Web Applications Lead

Chromium - “Browser of choice, nightly version of web inspector is as good as firebug without the performance hit.”
TextMate - “Code keeps me paid, and TextMate keeps me sane.”
iChat - “Remote communication, PM requests.”
MailPlane - “Multiple Gmail accounts? Like to keep ‘em separate? Notifications? Native web app feel with label and everything? Gets me into GCal, too.”
Terminal - “I gotta ssh into servers to push code, so I use some sweet aliases to keep it all organized.”

Dave Brown – Senior Interactive Producer

Adium
OmniOutliner - “Great for taking notes.”
FontLab Studio - “Converting fonts.”
Justinmind Prototyper - “Havenʼt really used this yet, but Iʼve heard great things.”
Adobe Media Player - “Checking/watching native flv.”

George Plendl – Front End Developer

Linkinus - “Best IRC client for a mac. irc.freenode.net, #jquery is a great place to learn and ask questions.”
Alfred - “Quicklaunch application for which aims to save you time in searching your local computer and the web. Replaced ancient Quicksilver app!”
Snippley - “Basic text and organization app.”
Beyond Compare - “Easily compare files, folders, images, anything. Itʼs great!”
TextMate - “The best text editor for Mac and a powerful abbreviation engine for HTML and CSS. Saves hours!”

Shelby White – Design Intern

DropBox - “Best app for managing projects between projects. I also use it for freelance in getting assets.”
Adium/iChat - “Adium manages contacts better but iChat actually sends files.”
Coda - “My favorite app with FTP for html/css.”
Wordpress - “ Where I’ve spent most of my last year and a half.”
TweetDeck - “Nice for managing my tweets…”

Joe Leoni – Producer

TweetDeck - “Best way to stay informed of Chad Ochocincoʼs daily workouts or Snoop Doggʼs ʻbreakfast activitiesʼ.”
iChat - “Instant messaging: extreme convenience and extreme inconvenience all wrapped up into one.”
Garageband - “Now anyone can be a MC, and youʼll probably be better than 99% of radio hip-hop.”
Pages - “Iʼd rather be using Word, but close enough.”
Solitaire - “The best way to play with yourself.”

Veronica Skarshaug – Administrative Assistant

Stickies - “Nice way to save on physical sticky pads, and info that I need on a daily basis is easily accessible.”
TaskMate - “Great for keeping my to-do’s in order.”
Numbers - “I like to make spreadsheets, I’m a total nerd.”
Preview - “Makes things easy, easy, lemon squeezy.”
iChat - “Because, duh.”

The Hit List – “Awesome and free GTD app to keep my days/life organized.”
Transmit – “Gorgeous UI and experience to easily upload my files.”
Adium – “My favorite chat client especially when used with the iPhone message style.”
Cicero – “Dashboard widget that fulfills my Lorem Ipsum needs. Used and abused daily.”
Photoshop – “There is a light on under this icon all day. Content aware fill has come in handy on more than 1 occasion.”

Here’s what I did to get MAMP Pro working so I could test the HTTPS pages of the site I’m working on.

1) Follow these instructions from Rocket Theme to the letter.  I didn’t need to deal with any of the “Possible Issues” section.
2) Go into “/Applications/MAMP/conf/apache/ssl.conf” and add a new vhost within the <IfDefine> blocks at the end of the page.  This vhost will mirror the settings of the vhost you would have already setup in MAMP:

<VirtualHost test.dev:443>
DocumentRoot "/Path/to/document/root"
ServerName test.dev
SSLEngine on
SSLCertificateFile /Applications/MAMP/conf/apache/ssl_crt/server.crt
SSLCertificateKeyFile /Applications/MAMP/conf/apache/ssl_key/server.key
<Directory "/Path/to/document/root">
Options All
AllowOverride All
Order allow,deny
Allow from all
</Directory>
</VirtualHost>

3) That’s really it.  Restart MAMP and you’re good to go.

Flash has a strong reputation for creating visually stunning websites, and rightfully so. Just head over to The FWA to see some of the best flash-based websites ever designed. As good as flash is at delivering rich media to the web, there are some serious downsides to consider.

One of the largest drawbacks to flash content is it’s relative invisibility to search engines and accessibility programs. The criticism is true when talking about Flash as a closed platform. The code written is compiled into a SWF, and then embedded online. This makes searching an indexing flash content extremely difficult for most search engines. Accessing Flash content is also a problem for screen readers and other accessibility programs.

These issues, combined with the popularity of the Apple devices, create a lot of hesitancy for companies to fully embrace Flash content in their projects and sirs. I’m going to talk about a few key principals that will help Flash gain visibility and accessibility across multiple platforms, and at the same time make Flash content easier to update and maintain.

Does it need to be Flash?

The first step, of course, is to figure out what content needs to be in Flash, and what does not. There’s no point to constructing a site using flash if the same design can be achieved using more open, standards-compliant code. Once the decisions have been made as to what content will be built in Flash, than it’s time to start thinking along the same lines as proponents of web standards.

Use the Principals of Web Standards

The primary rule in web development today is the separation of content from presentation. The same principal can be applied to Flash projects. Separating the content from the design means updating and maintaining the Flash site will be much easier if the code doesn’t need to be recompiled and edited every time a change needs to be made. Making things like the navigation, links, and photos flexible and external are all great steps to create clean, smart, and flexible projects.

Smart Degradation

If the Flash content and design are properly separated, than re-purposing the content is extremely easy. If the content is in XML format, it can be applied to an XML site-map which will help search engines index the site’s content much easier. In addition, there are browser and platform detection scripts which could allow you to display the XML content in regular HTML format if the browser or device isn’t compatible with Flash. (iPad anyone?) You can also detect older browsers and Flash players. Content can then be delivered in the most efficient way possible to all users.

For example, head over to the BKWLD site on an iPad or iPhone, and you will see that the features on the homepage are still visible and interactive. This helps serve the most people possible the site’s content, no matter what environment they are using to visit the site.

Hybrids

There is also the option of creating hybrid sites, which are very popular because they combine flash elements with standard HTML markup. This allows the user to have a rich experience, as well as giving search engines easy access to the site’s content. Making use of flashvars and XML/JSON add to the flexibility of the site by allowing Flash to communicate directly with the rest of the site.

SWFObject & Deep Linking

Making use of programs like SWFAddress and SWFObject allow the Flash content to be more transparent and visible to search engines. SWFAddress will create a specific URL for each page in a full-browser Flash experience. Knowing what section the user is on, and showing that section in the browser’s address bar allow search engines to look at specific pages, and create extremely accurate analytical reports.

SWFObject is a way to create valid code though the W3C Validation tools. Also, SWFObject has the ability to replace Flash content with a static image, which maintains the visual design if the user doesn’t have flash enabled.

Conclusion

It’s ultimately about choosing the right tool for the right project. Flash has many advantages, which need to be carefully weighed against the areas in which Flash falls short. The ideas described here can certainly help Flash communicate better with browsers, search engines, analytical tools, and accessibility programs.

I have been playing around with a handful of social integration utilities for Wordpress and so far the Simple Twitter/Facebook Connect plugins from Otto are by far the easiest, most feature useful and stable that I have found.

You will see that this post was simply, and easily posted to our FB Fan Page – http://www.facebook.com/BKWLD and tweeted (http://twitter.com/BKWLD)

The plugins have some really fun features – like automagically grabbing any “@” handles and linking them back to twitter – @BKWLD

Do you guys have any other favorite Wordpress plugins or add ons you find endlessly useful?

There are so many arguments happening now about this technology and that development language. The battle for supremacy has led to some fairly bad blood between some amazing companies. Listening to the recent debates between Adobe and Apple about flash on the iPad and iPhone has got me thinking. It seems like no matter what, there will be a problem and a battle until we as designers and developers get our heads in the right place.

This is because the debate is centered around technologies and programming languages. This strife is very prevalent in all areas of the web design industry. Should you use Flash or Javascript for that slideshow? Should we connect to this MySQL database, or this SQL server over here? .NET or PHP? There are some very opinionated groups, which is too bad because all of these technologies are amazing in their own right.

At the core of every project is an idea, and that is by far the most important thing to consider. Once the creative idea has been set, realizing that idea can happen any number of unique and innovative ways.

When figuring out how to produce the project, it’s all about what technology is best suited for the design. How much interactivity will it have? Of course you’re not going to utilize Flash for a site that is just plain, static text, and you’re not going to link up to a database when your site consists of two pages.

After these things have been sorted out, then pick the technology that you are most comfortable and efficient with. For example, I work really well in Flash and Actionscript. I am very comfortable with the language, and it comes naturally to me. That doesn’t mean that Flash should be used for everything, but in at the end of the day it’s all about the idea being produced, —not what technology was used to make it. If you need a slideshow, it can be written in Javascript, Flash, or hell even Lingo, as long as you end up with a killer slideshow.

It’s also not about the newest technology; it’s it’s about the best technology. My old college instructor is a professional type designer for a 1st-class graphic design agency. She stands by Freehand as the best tool out there for type and letterform design. It’s not a new program by any measure, but it works for her, and she produces some incredible work.

So we need to relax about the technology debates, and focus on making kick- ass designs, and have fun doing it.

I tried out some of the newly announced Facebook features today, specifically the Open Graph markup and the Like social plugin.  They were both technically simple to deploy, as promised.  You have less control over the appearance of the Like button than I’d like.  For instance, they don’t have an option to ONLY display the like button without a list of total likes.  You can work around this by reducing the width of the iframe, but it was an unexpected restriction.  For us, the goal was to provide a handy way to Like us on Facebook; we don’t care to give screen real estate to showing your friends who have also Liked us (for the majority of visitors, I expect there would be none).

I initially went about including the Like button the wrong way.  In the demos they showed at the F8, it appeared that they would expect each deep linked article page in a blog to have a unique Like button, like how CNN is implemented.  So I did this:

However, when you click Like, it adds a link in your profile section on Facebook for that specific deep link.  For example, check out the article link added here from CNN:

You could imagine that very quickly this area would be cluttered with all the articles a person had liked on news sites and blogs.  Then I noticed this suggestion from the Open Graph Best Practices:

Make only real-life things into objects. Users don’t want news articles and other transient content as objects on their profile.

This advice makes sense, though it’s inconsistent that Facebook would tout their partner (CNN) whose implementation contradicts this.  Thus, I moved the Like button into the footer, making it site wide, and added a Digg link in it’s place.

Ideally, users clicking the Like button would be added to the BKWLD Facebook page (we previously had a group, which we’re deprecating).  So far, I’m not seeing this happen; users who Like our Facebook page and users who Like us on the BKWLD site appear to be dropped into separate buckets.  The Social Graph markup doesn’t have a field to specifically relate the object (our site) with a Facebook Page.  I assume that Facebook uses some black magic to join the references to BKWLD in the Social Graph metas with the BKWLD references in our Facebook Page.  Possibly this isn’t working because our Facebook page is so new.  Or possibly something got confused during my initial implementation that was per blog article.  It also doesn’t appear that the “fb:admins” meta tag is having any effect.  I’m curious to see if this generated page will be automatically merged into the official BKWLD Facebook Page in the next few days.  Or if a person Likes a site on the Facebook site and that site has Open Graph markup on the home page, does Facebook read it and pull that info in?

In sum, I think the social plugin and Open Graph standard are pretty great in terms of functionality for users that can be added with minimal effort by developers.  I hope some clarification comes from Facebook about how (or if) merging works between different pages.

Brace yourself – a lot of the people at BKWLD play and love video games. I know, shocker right? From PC to consoles, to MMOs to handhelds, like most interactive shops and people of our age group, we all play and love games. So it’s no surprise that we enjoy making online/web games, whether as full fledged mini-sites, or in banner ads.

Recently we were interviewed by .net Magazine and one of the questions was what sort of things we felt made an online/web game successful. I enjoyed the question, and thought I would expand on it a bit in a blog about what Robert and I shared with them.

We basically boiled it down to four points we felt made for fun and success.

1. Competition & Recognition
If there’s one thing Twitter, Facebook and frankly, this blog proves, it’s that people love attention. Even while I am typing this, I am hoping you are enjoying reading this! So it’s not a surprise that people love to see their name at the top of a scoreboard, or to blast on their ‘wall’ that they just gained a level in Farmville. A game that doesn’t allow someone to ‘tell a friend’ about their score and challenge that friend to beat them is missing out.

2. Variables
I remember about 4 years ago we made a game for the California Tourism Committee that had you skiing against Governor Schwarzenegger down a mountain. Almost immediately, every high score on the board was “14 seconds”, because once you figured out the best path, that was the absolute best score you could get. Not very fun.

So by adding in some crazy score multipliers or jackpots, and things that might only show up in 1 out of every 100 games, you’re easily injecting not only variability, but also giving players a reason to keep trying.

Additionally, throwing in ‘bad’ items like point subtractions also helps make the game not about just trying to gobble up every item on the screen, but gets a little strategy into play.

3. Incentives
This is probably the most obvious of them all, but when someone is playing for an iPod/Corvette/cheeseburger, they are going to play. And play. And play. And tell their grandma to play too.

I think giving stuff away should be two pronged though – give something to the best, but also just give something randomly. In other words, you can give the Corvette to the person with the highest score, but also have 2nd and 3rd place prizes, and even a ‘boobie prize’ where any person who plays, has a chance to win that cheeseburger.

4. Keep it simple stupid
There’s a time and a place for an 80 hour epic gaming adventure. And that place is certainly not in a 300 x 250 banner on yahoo.com. If ever there was a time for a game to be ‘pick up and play’ it’s when it’s a banner or a minisite game. I think a good rule of thumb is if you need more than one page of instructions, it’s going to be too complicated for a ‘casual gamer’ and not complicated enough for a ‘hardcore gamer’.

Overall, there’s plenty of examples however where a game shines in just ONE of these categories, and that’s enough to keep people playing. But if you try to intertwine all of these into your next game (and let’s not forget about the actual ‘design’ of the game) you should have a winner on your hands.

We love making games, and for a while we always had at least one in development.  The demand has waned in the past year as companies focused on more direct kinds of marketing.  Here’s hoping we get more excuses opportunities to make games in the new year!

PS – here’s some of my faves we’ve done over the years.

• http://funnevergrowsold.com/game/
• http://www.whodouwant2b.com/game/
• http://yourcowtown.com/game/index.htm
• http://bkwld.com/work/indiana-jones-the-staff-of-kings
• http://www.firstbank.bkwlddev.com/728×315.php

Those familiar with the Mac OS dock will know that clicking the dock icon of a minimized application will restore that application to it’s pre-minimized state. This is a nice little feature as the minimize/tray area of the dock can quickly become a disorganized mess if you keep a lot of apps open. Those familiar with developing AIR apps will also know that AIR apps don’t do this out of the box. This kinda sucks.

Fortunately there is a fairly easy way to implement this feature for yourself. All you need to do is setup two event listeners and two properties.

The two properties you need are “isMinimized” and “isMaximized”. Both are booleans, the first indicating the application is … drumroll … minimized and the section maximized. While you could get away with just one of these having both offers more flexibility in the future should you need it. For example: it is possible for an app to be neither maximized nor minimized.

The two events you need to listen for are NativeWindowDisplayStateEvent.DISPLAY_STATE_CHANGING and InvokeEvent.INVOKE. The first event is dispatched when the application’s display state changes (i.e., when maximized or minimized). The second is dispatched when the dock icon is clicked.

With those few things all you need to do now is a few start up things:

/**
 * Event handler for the application's creationComplete event
 */
private function init():void
{
         // Check to see if we have a dock available for clicking
         if (NativeApplication.supportsDockIcon)
         {
               // Wire up a listener for the dock icon's invoke event
               NativeApplication.nativeApplication.addEventListener(InvokeEvent.INVOKE, onDockIconClick);
         }

         // Effectively, listen for minimize and maximize event.
         this.addEventListener(NativeWindowDisplayStateEvent.DISPLAY_STATE_CHANGING, onChanging);
}

/**
 * Event handler for display state change events
 */
private function onChanging(event:NativeWindowDisplayStateEvent):void
{
      switch (event.afterDisplayState) // <-- our new state
      {
	case "minimized":
		isMaximized = false;
		isMinimized = true;
		break;

	case "maximized":
		isMaximized = true;
		isMinimized = false;
		break;
	}
}

/**
  * Called when the dock icon is clicked.
  */
private function onDockIconClick(event:InvokeEvent):void
{
	if (isMinimized)
	{
		// If the app is minimized call this
		stage.nativeWindow.restore();
		isMaximized = true;
		isMinimized = false;
	}
}

In the above code it’s assumed that init will be called by the app’s creationComplete event. init then checks to see if the platform on which the app is running supports dock icons (that is, is Mac OS). If it is we add an event listener for the InvokeEvent which is dispatched when the app’s dock icon is clicked. After that init wires up a second event listener, this time listening for the NativeWindowDisplayStateEvent.DISPLAY_STATE_CHANGING event. This event is dispatched when the app is minimized or maximized.

onChanging is our event handler for the display state change event. We use this method to keep track of whether our app is maximized or minimized. onDockIconClick is our event handler for the app’s InvokeEvent that will be dispatched when the dock icon is clicked. This method checks to see if the app is currently minimized, and if it is it calls the window’s restore method.