The BlueClock Blog

Icon

Articles To Help You Manage Your Web Site : Web Design and Consultancy in Brussels

The iPhone will now be available on July 11

Make up your mind Mobistar.

But the good news is that it looks like the 3G iPhone will definitely be available in Belgium on Friday. It’s unbundled and at €525 it looks pretty costly, but there’s a good price comparison at this site.

Let’s see what price packages and incentives BASE and Proximus can come up with.

You can get the full details from Mobistar at:

EN phone3g.mobistar.be

NL iphone3g.mobistar.be

FR iphone3g.mobistar.be

Filed under: Apple, Benelux, Web Browsers , , ,

So Belgium Is To Get The iPhone – Eventually

Finally. On July 11, the iPhone becomes available in Belgium via Orange’s partner here, Mobistar.

Apple combatted their reputation for being a provider of expensive hardware by halving the (dollar) price as part of the iPhone’s official expansion into most of Europe and beyond.

Apple really is set to keep growing because of one very important factor. Generally, their products don’t. Apple are a miniturisation company and they are very good at it.

No other company pays so much attention to the form factor of their products and keep changing and refining that form factor. When people come round to my place, they look at my iMac, say “Nice screen.” and ask where the computer is. I can hold the music that previously took up the space of a wall in a room in the palm of my hand. I reckon I’ll succumb to the iPhone as well, so soon I’ll have an entire OS in my hand as well.

If you take miniaturisation to it’s logical conclusion you have nothing and that is exactly what they have built in iTunes. Movies, TV shows, music, books, it’s all their in a virtual format, part of our dematerialised economy.

They didn’t invent any of this stuff, but they are good at implementing it and bringing it together.

Roll on July 11 and vive la pomme!

[Update, looks like Mobistar are rolling back on the July 11 date and saying some time in the summer instead] [Further update, it is not back to July 11. see here]

Filed under: Apple, Benelux , , ,

Update to Safari 3.1.1. Now

Apple have released an update to Safari 3.1 which patches a security hole.

If you’re using Safari on Windows you can get the latest update by going to Start > All Programs > Apple Software Update.

You’ll be required to reboot your machine.

Filed under: Apple, Free Software, Safari, Support Articles, Web Browsers ,

Snippley – A Demonstration AIR Application

The second AIR application we’ll be looking at this week is Snippley created by .

I’ve chosen this as it’s aimed at developers in two senses. First of all, Snippley is used for storing and organising code snippets and secondly the source code is available which makes it an excellent candidate for deconstructing and learning more about Adobe AIR.

If you’re not a developer but want to understand more about what an AIR application is you can check out yesterday’s review of Shifd.

What’s Snippley Got Going For It?

If you look at Snippley as an AIR learning tool, there are several features of interest in Snippley:

  1. It’s pure HTML / Javascript / CSS and it’s an example of implementing a JavaScript library (MooTools) in an AIR application.
  2. It replicates the look and feel of Apple applications such as iTunes and the new Finder.
  3. It uses local data storage via SQLite

At first glance Snippley doesn’t appear very feature rich (I mean that in a nice way) and the developers have said it’s their first attempt to create something robust using AIR. But it’s apparent lack of features means that you can easily get to grips with analyzing the source code.

What Does Snippley Do?

I’m not writing this post to recommend that you store all your code using Snippley. The focus here is on giving you pointers to a good project that you can give you insights into how easy it is to create an AIR application of you’re already creating web sites using HTML/Javascript/CSS.

A quick overview though. Snippley let’s you add groups (essentially folders or categories) in a sidebar on the left hand side of the screen (a bit like folders and playlists in iTunes).

Snippley

These groups are containers for any code snippets that you add.

It’s very AJAX-like in it’s feel, with in-place editing being the give away.

adding a group stage 2

In-place editing isn’t just used for naming groups, it’s prevalent throughout the entire application.

You can also specify which (programming) language your snippet is written in and it’ll provide syntax highlighting.

In the screenshot above, we see that the application has a mix of Windows XP and Apple OS X about it. We see the standard Windows Minimize/Maximize buttons on the top right. This is because the developers have opted to set the chrome of the application to “standard”. This is the default option for all AIR applications and sets the applications chrome to the standard system chrome. So if I’d taken a screenshot of Snippley running on my Mac, the Minimize/Maximize buttons would be on the left and use the OS X colour scheme. On Linux, it would use the Linux system chrome and so on. You can set the application so that no chrome appears, in which case you’d have to create your own buttons for controlling the application. All of the application settings are to be found in application.xml and this is the case for any AIR app.

Dig Into Some AIR Code

If you unzip the source files, you’ll see only 2 files in the root directory, application.html and application.xml

unzipping snippley source code on ubuntu

All of the applications settings are contained in the application.xml file. Application.xml is provided with the AIR SDK and is the basis for any AIR application you build. Examine it, it’s well commented and it’ll give you an idea of what you can configure and just how easy it is to create an AIR app. The entire interface is contained in application.html This file can be given any name. When you open it you’ll see it’s just a regular html file. Just like a web site, all of the JavaScript that provides the functionality is provided by file includes in the header.

Apple Look and Feel

All of the glitz is provided by a small CSS stylesheet and 20 PNGs (most to recreate Mac style scrollbars), and all of the application logic is in the javascript files. The JavaScript folders have been organised to separate out the standard files that you have to include with any air application; aliases.js and introspector.js They’ve also included MooTools to provide some of the polish to the application.

Then using all of these assets, they’ve written the custom code that is the app. You’ll find all of this in the scripts/snippley folder. There are 6 files in there totalling about 23Kb. Each file is named according to the group of functions it carries out. For example there’s snippely.groups.js which handles creating and renaming of groups etc. Then there’s snippely.database.js which is a good primer in how to start working with AIR’s embedded SQLite database. This is the same database that is used in Google Gears and on most Nokia phones so it’s useful to understand how it works and it’s limitations (no stored procedures, no foreign keys).

Snippley comes out of the MooTools stable and therefore it looks great. The guys at MooTools produce very polished work and the Apple look used on Snippley is no exception.

It’s a great base application for you to play around with, change and then repackage to test your new AIR skills. The source is hosted on Google’s code repository for open source projects and you can join and add to the development of this project.

How to get Snippley and the Source Code

You can download Snippley and the source files from the Google Code and read more about it’s development at the MooTools blog

Filed under: Adobe Air, Apple, Free Software, How It Works , , , , , , , , , ,

Safari 3.1 on Windows Problems Displaying A Background Image On a Body Tag

[UPDATE: panic over. Let's just call it user error/stupidity and assume that they won't be naming a bug after me.]

I’m currently developing a site that uses a very common technique of tiling a background image on the body tag in css.

I tested the site in Safari 3.1 for Windows and the image would not display. It works fine in all other browsers.

I then moved the css for the background image into a div tag that wraps the entire site and hey presto it works as expected. I didn’t give it much more though until just now.

I’ve just been to look at Adobe’s new Photoshop Express website in Safari 3.1 for windows and they have exactly the same problem. Nice to know I’m in good company!

They are using the same technique e.g.

body {
background-image:url(assets/landing/background.jpg);
background-repeat:repeat;
}

Is anyone else experiencing this?

I can’t show you my site as it’s still in development, but the Photoshop Express site is here www.photoshop.com/express/landing.html

Filed under: Apple, Web Browsers, Web Standards, Accessibility and Best Practice , , , , , ,

Safari 3 And WYSIWYG Rich Text Editors

Safari 3 has recently become a first class citizen in the world of WYSIWYG Rich Text Editors. Until recently, the majority of Rich Text Editors didn’t support Safari so if you were using a content management system or blogging software to edit your content online then Safari would usually default to a plain old text area.

But in the past few months a couple of most popular Rich Text Editors have begun to support Safari.

As of version 2.5, FCKEditor now supports Safari 3. Their free editor can be integrated into most development environments and has plug-ins for dealing with file browsing and photo management.

TinyMCE (the editor used on WordPress) also supports Safari, but with the caveat that it’s still experimental.

CuteEditor is a paid for product and has supported Safari for some time now.

Now all that we need is for site owners and CMS developers to replace the older versions of these editors to the newer versions which support Safari.

Filed under: Apple, Free Software, How To Manage A Website, Safari, Web Browsers, Web Standards, Accessibility and Best Practice , , , , ,