oguz.karadeniz@random

Codeslot uitzetten voor iPhone

2012-02-06T19:49:00.000+01:00

Soms lijken zaken ingewikkelder dan ze zijn... zoals het uitzetten van de codeslot op de iPhone. Gewoon naar Instellingen-Algemeen-Codeslot, je voert dan je code in en is de Zet code uit is dan beschikbaar. Je moet nog een keer je code invullen waarna de codeslot wordt uitgezet. (iOS 5).

Het is mogelijk dat in sommige gevallen dit niet mogelijk is omdat de iPhone gekoppeld is aan een corporate email (Exchange) met een policy waarbij code niet uitgezet kan worden.

In response for the Font Hipsters

2011-10-21T16:50:00.001+02:00

Today I read the article “Font Hipsters” by Daring Fireball and have to comment on the last 3 sentences:

We criticize Android for being poorly designed because it’s poorly designed. We favor iOS because it’s better designed. That’s it.

My reaction is:

We criticize iOS for being totally controlled by Apple because you will need to jailbreak your device to run your own apps. We favor Android because it’s open. It’s you who controls your device.

Anyway, the article was actually about the new Android system font Roboto. Personally I really like the font.

Click here to download it.

Batch converting with ffmpeg in Windows

2011-09-13T17:18:00.001+02:00

As mentioned in my earlier post, ffmpeg is the best tool to convert media files. However sometimes you need to convert a collection files in one go. Of course you can use various gui tools for ffmpeg, but I like to keep things simple (or complicated, depending on the context).

Basically ffmpeg can only process 1 file at a time from the command line. Linux/Mac users have powerful bash script at their disposal, but do not underestimate Windows

You probably already have a batch file to convert a single file (which contains all the required parameters for ffmpeg). What we need to do is add an additional batch file which will call “converting” batch file.

So, say you want to convert all .mov files in a folder to .mp3. Let’s start by our converting batch file.

convert-to-mp3.bat

IF EXIST "%1.mp3" GOTO exit

@echo Conversion for %1 started on %DATE% %TIME%
ffmpeg -b 128k -i %1 %1.mp3

:exit
@echo %1.mp3 already exists

What does it do: Checks if output exists, if not then converts the input file to .mp3 using ffmpeg.

Next step is to create the batch file which will call the above batch file.

Startconvert.bat

for %%i IN (*.mov) DO (convert-to-mp3.bat "%%i")
pause

As you can see this is a simple for loop calling your converting batch file.

To just convert all the .mov files to mp3, start startconvert.bat and you will be fine.

Lessons which can be learned by playing Angry Birds

2011-08-16T14:32:00.001+02:00

Playing angry birds is actually a lot of fun and besides being fun, without even realizing, we train ourselves in the daily business practices as:

Planning
Before you start playing the game, you look how the pigs are located and protected to determine the best strategy would be to beat the level as you should so do in real life: doing an inventory on the obstacles and the possibilities.

Efficiency
As you have limited birds with different abilities having their strengths and weaknesses, you have to be efficient with your resources to beat the level or as in business: get the job done with the resources you have.

Minimum effort, maximum output
The game gives you bonuses for the birds you have not used. By doing a good planning and by being efficient you can achieve the goal with the minimum effort.The game actually somehow forces you to be smart. Same applies in business.

Patience and Perseverance
As you progress in the game the levels get harder and mostly you will not succeed the first time you try. However by trying again and re-evaluating your tactic, you will succeed. By having patience and retrying each time you will be successful.

Experience
As you get more and more experienced the game becomes easier. You will start to see the patterns and develop tactics which you can use to achieve the goal. Your tactics will become more complex as you know how your resources act and even at some point be able to use your resources in a way you initially would not have thought of.

Luck factor
Sometimes you are just plain lucky. Your tactic did not work as you had thought but still you were able to achieve the goal. This is the same in business, sometimes you get lucky and sometimes not. Combined with experience you can even predict if you are going to be lucky and it can be even be integrated in your tactics with a backup plan if you were not lucky as expected.

I believe the success of Angry Birds is due to the fact that the game involves what we do daily (even some of us do without knowing) in a fun way.

Installous download folder

2010-12-27T22:21:00.001+01:00

Been experimenting with old 2G iPhone (iOS update, jailbreak, etc). Just a quick note: If you ever wanted to know where the downloaded IPA’s are on your phone/pad, check the /private/var/mobile/Installous/Downloads folder. You can use a tool like DiskAid to connect to your device and store them locally.

I am currently doing the other way around.I am in principle against iTunes and avoid as much as I can, so I will try to see if I can install downloaded IPA from Installous. I think it should work.

PS. Coming back from Android to iOS, I realize how good Android is and how restricted iOS is.

Connecting KIES to the Samsung Galaxy S

2010-12-01T15:57:00.001+01:00

I have waited until today to update my SGS to Froyo and installed KIES finally. After reading the horror stories about KIES, you can imagine my expectations. It was actually not that horrifying. However I did keep having an issue connecting the phone to the KIES. The Galaxy MTP application says it is connected, but in KIES it states it is trying to connect.

To keep a long story short, while your phone is connected, right click on My Computer, select Device Manager and you will probably see an entry called GT-I900 with a warning sign.

Right click, select uninstall and then disconnect.

Connect the phone again, and Windows will install the drivers again, and you should be able to connect with KIES.

Multiple rundll32.exe instances

2010-11-23T11:30:00.001+01:00

Recently I have been encountering multiple run32dll.exe instances in my taskmanager (windows 7). Of course I was alarmed and googling indicated a probable virus. I was almost sure that this was not the case on my machine, but better safe then sorry. Scans resulted nothing, which was as I expected.

It was time now to actually investigate what triggered the rundll32.exe. With process explorer I found out it was Chrome…. Aahaa… now I had more context for googling. It turns out that the current Chrome Canary version 9.0.583.0 (Official Build 66097) had this issue.

It seems it has already been fixed in the latest development build, see http://code.google.com/p/chromium/issues/detail?id=64006

So if you are using Chrome Canary build and see a lot of rundll32.exe, then you know

Windows 7 Printer not printing

2010-11-18T12:54:00.001+01:00

Sometimes Windows is not really helping when you never reboot. I like my Windows 7 Sony Vaio laptop, especially the hibernation function. Quick start everytime, but sometimes Windows need to be rebooted, especially when things are becoming slow or stop functioning. This week I had a problem during printing: I was unable to print, each time it failed. My guess was that the printer spooler got lost somewhere.

So a quick tip:

Open command prompt (with Administrative priviledges: right click on shortcut, select Run as Administrator):

Issue the following command:

net stop spooler

and then

net start spooler

Your printing issues will be gone (unless something is really messed up)

(for more info see this link)

Android development continued

2010-11-02T10:46:00.001+01:00

Sometimes this Eclipse is killing me After I added a menu.xml, it kept giving strange errors like, XML cannot be parsed, size 0, bla bla. I double checked the xml and couldn’t find any problems. So maybe it could have been an Eclipse issue, so I restarted it.

After restarting Eclipse, this time I got the message:

Unparsed aapt error(s)! Check the console for output. <ProjectName> Unknown Android Packaging Problem.

Checking the console, revealed no errors What to do now. Again Google Fu learned me how to resolve this issue as follows:

Right-click on the error message in the Problems view, and deleting the error. Modify the xml for forcing a build and magically it worked.

Android development

2010-11-01T21:00:00.001+01:00

After a long time not using Eclipse, I recently started it again to experiment further with Android development. 3 things came up, which I would like to share with you and what the fix is.

After creating a test Android project, the following error showed up:

ERROR: Unable to open class file <path>\gen\com\example\test\R.java: No such file or directory.

It seems that the java compiler cannot create this R.java. In order to fix this, do the following:

Open Eclipse
Open Window/Preferences
Expand JAVA option
Select Build Path
Check the option "Project" and uncheck "folder" options
Click on OK
Restart eclipse IDE

These steps fixed my problems regarding this issue.

When trying to run the application, the following error came up:

An internal error occurred during: "Launching test".com/android/ddmlib/ShellCommandUnresponsiveException

The fix for this was to update the Android DDMS by going to Help -> Software Updates select the Android DDMS and press Update button.

I had updated the Android Development tools, but had forgotten to update the Android DDMS.

Unable to view manifest files from within Eclipse, when you open the main.xml

When you try to open an application's manifest file from within Eclipse, you might get an error such as this one:

An error has occurred. See error log for more details.
org.eclipse.wst.sse.ui.StructuredTextEditor.isBlockSelectionModeEnabled()Z

Try reverting to the 3.0 version of the Eclipse XML Editors and Tools. If this does not work, remove the 3.1 version of the tool. To do this in Eclipse 3.4:

Select Help > Software Updates...
Select the Installed Software tab.
Select Eclipse XML Editors and Tools.
Click Uninstall.
Click Finish.
When you restart Eclipse, you should be able to view the manifest files.

In my case, I just uninstalled them and it magically worked

Hope these were useful for you if you encounter the same issue.

Samsung Galaxy S Tips

2010-10-31T13:45:00.001+01:00

I was just surfing and encountered some tips on the usage of the Samsung Galaxy S which will help me/you to get the most of this excellent phone.

Contact screen: Swipe to left to create a text/SMS message to the contact
Contact screen: Swipe to right to call the contact immediately
Contact screen: Move your finger in the alphabet to quickly navigate to a contact starting with the letter, then while pressing move to left to move within that letter, eg. after D you can navigate in everything starting with D by moving to the left
Press and hold HOME key to get a list of recently used apps, which can be used to switch between applications (not specific to SGS)
Press menu and Edit in the home screen to delete and/or reorder the home pages. In order to reorder: touch and hold the screen which will allow to drag them
If your brightness is not set to auto, you can swipe from left to right in the notification bar to set brightness to maximum and the right to left to set brightness to minimum.
You can have the SGS announce the title/artist of a song from the Music player by pressing and holding the Up Volume button while a song is playing
You can "lock screen" while watching video by pressing Power Button while a video is playing. This is great at preventing unintended clicks while holding the phone watching a video
In the browser: Access to the bookmark button and address bar by tapping the Menu button (no need to scroll all the way up)
Open soft D-Pad by tap-and-hold the "?123" key on the standard Samsung Keyboard or swipe from the Swype button to the SYM button in the Swype Keyboard
Pressing and holding the Power button (keep pressing it after you get the shutdown/airplane dialog) will perform a reset.
Holding the Menu key for a second, will bring up the search dialog (emulating the search button available in other Android phones)
You lock the camera screen to only take a shot, by pressing the Power button for a very short time. This will show a paddock on screen.
When receiving a call press the volume down button to mute the ringer
Use the volume +/- in camera mode to zoom in and out

For more technical tips see the also the XDA forum and see also a list of cool apps to use with the SGS.

Samsung Galaxy MTP keeps repeating “Initializing” when connected to USB

2010-09-30T14:17:00.001+02:00

I have been using a Samsung Galaxy for a few weeks now and it has been the best phone ever. I think Samsung has really got a phone which can blow away the iPhone (4) without any problems. After installing the voodoo fix for the lag issue, it has been extremely fast. Just now waiting for the Froyo (Android 2.2) release and my life will be complete :)

Anyway, today I connected my Galaxy to my PC, and for the first time something strange happened. The MTP application for KIES on the phone kept initializing. It tries to initialize but for some reason it dies and then the whole process starts all over again, actually funny to see. However this meant I was unable to access my phone from my PC. I needed some Google-fu. After a while I found the solution, it seems that if you have any files with an extension longer then 16 characters, the MTP application just looses it.

For me the solution was to start up my favorite file manager (ES File Explorer) and remove the TunnyBrowser folder. This folder is used by the Dolphin browser I have been using for a while now. If the issue still exists and you are using Soundhound try also removing the SoundHound cache folder. If this does not help, get your SD card out and search for files with long extensions.

Hope this helps if you have the similar issue

FFMpeg and WMV conversion

2010-09-02T11:45:00.001+02:00

Just a quick blog entry. When converting video files (avi, mpg, etc) to WMV to play on Windows or XBOX, you will need to make sure that the correct audio encoding (wmav2) is used. If not the video file will not play and you will probably get an error.

You can use the –acodec wmav2 switch in ffmpeg command parameter to enforce to correct audio encoding for WMV files.

Creating animated gifs from movies

2010-08-24T12:59:00.001+02:00

There are a lot of guides on explaining how to creating animated gifs by either creating them using various tools or by directly converting them from a movie. If you want to create an animated gif from scratch you can use Adobe Fireworks or Beneton Movie Gif. If you want to convert movie files (like WMV or FLV) to an animated gif, the best tool to use is ffmpeg.

The quick way

The easiest way to convert a movie (in this example I will use a wmv, but it can also be any movie type) is using the internal function of ffmpeg. You can convert it by issuing the following command (which will create output.gif):

ffmpeg –i movie.wmv –r 5 –pix_fmt rgb24 –loop_output 0 –s 320x240 output.gif

Explanation of the switches (see also ffmpeg documentation):

-i	determines the input file name (movie.wmv) (put your filename between “ s if it contains spaces)
-r 5	tells ffmpeg to use a framerate of 5, which is a good setting when creating animated gif files (can be omitted if you want to use the original framereate)
-pix_fmt rgb24	required when converting to gif (due to the max colors in a gif file)
-loop_output 0	Makes sure the gif animated forever, omit if this is not required
-s 320x240	Set the gif size to 320 by 240 to make the size of the animated gif smaller. Omit this if you don’t want this

This works perfect, however personally I am not so fond of how ffmpeg chooses the GIF color palette. I have not found anyway to improve this.

The better results way

As mentioned above, depending on your movie, the converted gif does not have an optimal color palette and you will see a lot dithering. The method I use most which gives the best results is exporting the frames using ffmpeg and importing them to your favorite animate gif tool (in my case Fireworks)

To export the frames of a movie using ffmpeg use:

ffmpeg –i movie.wmv –an –r 5 –y capture%d.png

Quick explanation: -an stands for no audio, –r specifies the framerate (change accordingly) and –y just tells ffmpeg to overwrite if files are existing. You export to any image format. I use PNG because this gives the best results.

The next step is to import your files in your favorite animator app. In Fireworks, select File – Open and select multiple the files you have generated with ffmpeg. Before pressing the Open button, make sure that the you check the “Open as animation” checkbox

Now Fireworks will create all the frames for you based on the image you have selected. Do your usual stuff and export it to animated gif.

Hope that this was useful and happy animating!

Souces: ahfr.org, noeckel,

New Flickr Interface

2010-08-23T12:10:00.001+02:00

Just encountered the new interface of Flickr. I really love how they are introducing it, especially the last step: have fun.

Besides this cool presentation, a few new features have been implemented:

Lightbox zoom
A fresher user interface with Improved tooltips and navigation
Enhanced map (like show pictures nearby)

Wielmaten voor kinderfietsen

2010-08-19T19:52:00.001+02:00

Voor de keuze van de juiste wielmaat kunt u onderstaand schema aanhouden:

Jaar	Wielmaat (inch)	Kleding maat
2 tot 4	12,5	92 - 104
4 tot 6	16	104 - 116
4 tot 8	20	116 - 122
5 tot 9	22	122 – 128
8 tot 10	24	> 128

Zoekt u een fiets voor uw kind van 11 jaar of ouder, dan kunt u dit opzoeken bij de gewone fietsen en zoeken naar een model met een klein frame en 26 inch wielen.

Samsung Galaxy versus Apple iPhone 4

2010-08-19T17:26:00.001+02:00

I believe currently the Samsung Galaxy is the only real competitor of the new iPhone.As I am interested in both of them I want to visualize both machines and see which one is better.

As you can see, on the size level the iPhone looks like a winner, however we also need to keep in mind the that the size of the Galaxy is 4 inch where as the iPhone as 3.5 inch. Personally I find the screen size in combination with the weight more important and here the galaxy excels. As you can see below the ratio of the screen versus the weight is much much better on the Galaxy. Which means actually, you carry less weight and get a bigger screen.

If you want the see the ratio of the screen regarding to the dimension (in this case the volume) we get the following chart.

The volume of the iPhone is less, but again if we put this in respect with the screen size, Galaxy wins.

Let’s have a look at the battery now.

If you focus on the talk time, the iPhone wins but the Galaxy is not far behind. I am not much a talker, so the standby is more interesting for me and here the Galaxy wins without a doubt (which makes sense because of the higher mAh value).

The last comparison which is interesting for me is the support for media files. I think the chart below says enough.

The Galaxy plays almost anything (mp3, xvid, etc) while the iPhone is restricted to it’s own format (except the mp3). Another big disadvantage is iTunes on the iPhone. I just want to drag and drop my media files.

Finally lets have a look at some comparison screenshots:

Video Player

Camera

Browser

As you might have guessed, I will go for the Samsung myself, but at the end it is a personal preference. My final suggestion is to go to a shop and physically hold both machines, look at their screens and play with them. All the specs and charts have no real meaning, as a wise colleague of mine always says: Figures lie and Liars figure.

Source for the chart data: gsmarena.

Google contact image not synching in Picasa

2010-08-17T12:29:00.001+02:00

I have been using google mail for a long time now and have always been impressed on how well it does what it needs to do. The recent update has also been a great improvement, especially the (new) functionality in the contacts (especially the merging of contact after importing from other sources). I have started to put my contacts in gmail and have been updating the images too.

Another google application I use often is Picasa. The people functionality in Picasa (with the face recognition) a great tool and is one of the reasons why I am so fond of Picasa.

After I had updated and reorganized my contacts (in gmail), I assumed that they will also available in Picasa. My assumption was correct, with one disappointment: the contact image did not show up. I also realized that I had now duplicate contacts: the ones in Picasa I created during face recognition and the contacts from gmail. Unluckily I could not find any way to merge them.

So my feature request for Picasa is right now:

Extend the “central” contact list (used by gmail) with all the properties (including contact image, etc), with the ability still to check whether a contact in Picasa should be synchronized, which also seems to be the second most requested feature in Picasa :)
Ability to merge an existing Picasa portrait/contact with the “central” contact list, meaning that when the Picasa contact has an image and the “central” contact doesn’t, it would copy it and (also the nickname), without loosing all the photos where the contact has been spotted.

Hope this will get implemented soon.

Fireworks tips

2010-08-13T17:02:00.001+02:00

There is denying it, Adobe Fireworks is my favorite Adobe App. I have been using it for ages it seems and am still satisfied with it. (I haven’t used CS5 version yet… but I am sure I will not be disappointed with it). For images and projects for the web, it is perfect. Photoshop is mostly overkill. What I especially like about Fireworks is that is a hybrid image program; you can work on pixel level and still use vector tools.

Here are some tricks and tips I use often in Fireworks.

Convert images to Grayscale

Converting images to grayscale can be done by using the Creative menu.

Pasting new image

One useful feature of Fireworks is that is monitors your clipboard. If you have copied and image to the clipboard, you can start editing it by pressing Control-N (New) which will open up the new image dialog with the size of the image in the clipboard. After just pressing OK, you can paste it directly.

Fading images

Fading images can be done by using the Commands – Creative – Fade Image menu

You can further customize the fade by clicking on the layer mask, which shows you the gradient controller.

Setting layer preview size

I usually do not make any changes in the preview size, however there are some situation where you would to see smaller or bigger previews. This can be easily changed by clicking on the Layer option dropdown – Thumbnail Options item.

Useful keyboard shortcuts

Below is a list of keyboard shortcuts which I use most of the time

TAB	Hide/Show panels
Control – Alt – D	Duplicate current selection/layer
Control – Shift – D	Clone selection/layer (similar to duplicate, however duplicate moves the copy)
Control – K	Full display
Control – Numpad +	Zoom in
Control – Numpad -	Zoom out
Control – Mouse scroll	Zoom in and out
Control – G	Group selected
Control – Shift – G	Ungroup (grouped) object
Control – Alt – V	Paste as mask
Control – A	Select All
Control – D	Deselect
Control – Up	Bring Forward
Control – Down	Send Backward
Control – T	Transform
Control – Shift – T	Numeric transform

You can also customize your keyboard shortcuts via the Edit – Keyboard shortcuts menu item.

Unnecessary short variable names irritation

2010-08-03T15:26:00.001+02:00

There is always a discussion between programmers (and code reviewers, etc) on how variable names should be assigned. Except the formatting (camel case, etc), there is also the issue of the length of variable names. Some people really dislike and even get irritated in short, non-descriptive variable names. Today I have encountered a blog post even given 5 reason why not to use short variable names. I find this discussion very unnecessary and people are really missing the point here.

The most important best practice in (readable) programming should be consistency. Having long or short variable names does not achieve this. Long variable names can be as confusing as short variable names.

An example: Let’s take the variable called total_order. What does this say… probably the total order amount, but is this including VAT or is including discount or including discount and VAT. Is the amount in US dollars or euro’s? Maybe it is not even the amount but the total items in the amount. Coming back to consistency, if the variable total_order is used in function x() as the total amount in USD and in function y() it is used as total amount in euro’s including discount, it really gets confusing. Having it called tot would force you to think (and investigate) what it would contain, which in some case would catch some nasty bugs then relying on a name of a variable.

As you can find reasons why not to use short variable names, I can find good reasons on not using long variable names. For me in variable names the following is more important:

Consistent use of variable names, e.g.. using single character (or 2 character) variable names for temporary/looping purposes (like i or ix). This also means that shortening variables in the same manner. For example a variable containing a total should be throughout the program shortened to total and not to sometime tot and another time to totals.
Use of comments explaining what a variable is required for and what it stores (and purpose). This means instead of using

total_amount_vat_incl_discount

I would prefer to see something like

// contains total amount including VAT (with discount applied to it)
totamount

This clears any misconceptions about what the variable is used for. In the case of total_amount_vat_incl_discount: is the total amount including VAT or is it the total amount of VAT?
Readability. When having long variable names, the lines become unnecessary long and formulas look more complex. You actually loose the overview what is happening. For example, have a look at the following formula:

((total_order_amount_ex_vat – total_discount_customer – total_discount_sales_month) * ((1+ (vat_percentage/100)))/total_share_percentage) + total_amount_zero_vat

(In this case too much total_ in the formula and it’s just too long)
Programming speed. When using long variable names, it also means that you will need to type more (over and over again), There is counter argument that you should you a good editor, which allows auto-completion. However from my experience auto-completion does not really help here. If you have variables like: total_amount_incl_vat, total_amount_incl_discount, total_amount_ex_vat, total_amount_usd, you will get all of them and you will still need to scroll and find the correct variable. Most of the time, I even don’t use this functionality and just type it, because I am quicker then the editor.
Minimize copy-paste errors during programming. Copy-Paste is a very common situation during programming, you mostly use an existing piece of code for a new module/function. If you have very specific variable names, you also start renaming/re-edit these variable names. During this process you always make typing errors or forget to rename one item, resulting in strange program behavior.

Let me give a very basic simple example: You have a piece of code which does something in US Dollars. You copy paste it to a new function which does similar calculations in euro’s and have variables like amount_usd, amount_incl_usd, amount_usd_discount, etc. You will need to change them to amount_eur, amount_incl_eur, etc. You will also during this process make errors like instead of using amount_incl_eur, you use amount_inc_eur (missing l). It is just statistics, the more characters you need to type, the bigger the chances of typing errors.

At the end, as mentioned earlier, the focus should be on consistency and readability then the actual naming variables and you will need the right balance between what is long and what is short.

Happy programming

jQuery plugins July 2010

2010-07-29T17:28:00.003+02:00

InputNotes

A jQuery plugin to add notes below textareas and input fields based on regex patterns. Great for validating forms and showing additional info.

Equal Column Heights

This jQuery plugin sets the height of selected elements equal to the height of the highest element with the ability to animate the change.

Full Calendar

FullCalendar is a jQuery plugin that provides a full-sized, drag & drop calendar like the one below. It uses AJAX to fetch events on-the-fly for each month and is easily configured to use your own feed format.

Button Tutorials

A nice compilation of some of the helpful tutorials that can teach you on how to use jQuery in improve and creating special effects for the buttons of your website.

Poshy Tip

A new promising tool tip with a lot of options for configuration and easy to use. It also works very well with forms.

Thumbnails Navigation Gallery

Extraordinary navigation using images, a great tutorial by codrops, definetely worth checking out.

jQuery.Spritely

A plugin for creating dynamic character and background animation in pure HTML and JavaScript. It's a simple, light-weight plugin with a few simple methods for creating animated sprites and dynamic scrolling backgrounds.

and for the iPhone and iPad experts: jQuery Swipe

Renaming Networking Printers in Windows

2010-06-25T11:20:00.001+02:00

I had never realized that you are not able to rename network printers, but it is sad and true. There is however a work-around which allows to rename network printers indirectly.

Instead of adding your printer as a network printer, add it as a local printer with a new port. In the new port specify your network printer share, eg. \\printer-server\printer-share-name. After selecting the model/etc, you have a network printer which feels like a local printer, which you can rename.

Thanks cobolhacker for sharing this info.

Firefox 3.6.4

2010-06-24T09:36:00.000+02:00

Yesterday I have updated to the latest version of Firefox, version 3.6.4 and actually I am amazed. I have been using Chrome for a while because of it's speed compared to Firefox. I must say that the latest version of Firefox now starts up almost as quickly as Chrome and the respond time is also superb, especially if you compare how many add-ons I have installed.

I looked at the memory usage and this has also become better, actually even with the large amount of add-ons Firefox uses around the same amoung of memory (on a fresh start) as Chrome.

I did have a same issue with our network/proxy. I know our company proxy needs authentication and I have always been struggling to get non microsoft applications to work. It loaded some pages and some it just would not load... crazy... after investigation of http traffic I got denied errors. The fix was easy:

Navigate to
about:config ->
network.automatic-ntlm-auth.allow-proxies -> true
network.negotiate-auth.allow-proxies -> false

Details at mozillazine.org

Great job for the Mozilla team!

Getting rid of Content Preparation Progress dialog in Reader 9

2010-06-18T10:36:00.000+02:00

Since I have installed the latest version of Reader (9), each time I open Adobe Reader, it start scanning the document with a message: Please wait while document is being prepared for ....

This is really annoying, Reader is not the fastest and things like this makes it even slower.

Fix: Goto to the c:\Program Files\Adobe\Reader 9.0\Reader\plug_ins\ folder (or the folder where you have installed Reader) and remove the Accessibility.api file.

Is IE gonna die....?

2010-03-05T19:22:00.000+01:00

I was reading an article about the upcoming promised IE 9: http://www.webmonkey.com/2010/03/microsoft-to-double-down-on-html5-with-internet-explorer-9/

As it is clear, Microsoft is running behind the facts and not setting the standards anymore (regarding browser technology). If Microsoft will not keep up with the technology, IE will die, because people will drop it in favor of faster and better browsers.

Currently I think more and more people are using a non IE browser at their personal hardware, due to different reasons. The one and only place where IE still rules is the corporate/business hardware. Personally this is one the reasons why IE has still a big market share. As mentioned in my previous posts, business software eventually follows what people use at home (matter of being used to....). Loosing market share on personal/home computers will hurt IE very hard...eventually, as it will take some time, but it will happen.
Maybe it will happen even faster, as more and more web developers in corporate operations, are actually using Chrome and Firefox during development. Users/testers will be aware of this and they would like to have the same speed and functionality as the developers. As more business solutions are converted/created as web applications this can have a big impact and would be able to speed up the process of killing IE in the business environment.

To conclude, if Microsoft does not take real action and just tries to keep up with the developments, their browser will die. (It even feels like this time Microsoft is the WordPerfect/Lotus123 they have killed years ago)

EU funding

2010-02-21T18:29:00.001+01:00

See article at fsteurope.com. Nothing surprising actually: Germany and France are the biggest payers int the EU for the EU. Actually there is something surprising, the Netherlands. As suspected and now confirmed, the dutch people are the biggest contributors for the EU (followed by Denmark I think).

Maybe I should move to Luxembourg..

Sharepoint Filter List from url

2010-01-26T15:00:00.001+01:00

Sometime you need to a have a link to filtered list in Sharepoint. Luckily Sharepoint has the ability to do this. You need to use the following parameters after the list url:

......allitems.aspx?Filtername=<name of field>&FilterMultiValue=<filter text>

<name of the field> is the field name in your list, you wish to filter on (eg. Name etc)
<filter text> is the filter criteria. You can use * as an wildcard. You can add multiple filter text values by separating them with semi colons.

For example:

......allitems.aspx?Filtername=Name&FilterMultiValue=A*;B*

will show all items starting where the Name starts with A or B.

I like this method because it allows you to have multiple values and wildcards. You could also use the FilterField1 and FilterValue1 parameters. (see for more info: Using URL to sort or filter a list).

Firebug 1.5 not expanding elements on inspect

2010-01-21T16:31:00.000+01:00

Just installed Firebug 1.5 (after using 1.4.5 for a long time) and first thing I noticed was that the inspect element did not work correctly. After hovering on an element, the html tab did not show (or expand to) the element. Then I noticed that even manually expanding an element (by clicking on the + symbol) also did not work after 3 or 4 level deep.

After some googling, I finally out it was due to FireQuery. I was using version 0.3 and after updating to 0.5, all issues fixed.

I would also like to use the opportunity to thank the Firebug team and ofcourse FireQuery for their great tools!

Windows 7 - Change theme font properties

2009-12-17T13:28:00.000+01:00

Just a quick tip: If you want to change your desktop/theme font, you are looking for the old windows properties tab. You can easily get this on the screen by opening a Run dialog box (Windows + R keys) and then type Control Color and hit enter to directly open Window Color and Appearance box.

Terminating XMBC remotely on Ubuntu

2009-12-15T16:18:00.000+01:00

Last few weeks I have been testing XMBC 9.11 Alpha/Beta on my Ubuntu Media system. Personally I think it is the best Media manager/player ever :).. But due to the fact it is still a beta release, the application sometimes does not respond or hangs and completely blocks the system.

The easies way to kill it and free your system without a reboot, is just open putty.exe and login remotely to your ubuntu system and issue the following command:

killall -9 xbmc.bin

This will terminate XBMC and will free your system. In my case I just restart XBMC :)

Merging items with same title in gantt view in Sharepoint

2009-12-15T16:07:00.002+01:00

Today, got a challenge with Sharepoint where a user wanted to see multiple entries in a gannt view in Sharepoint. Below is the jquery magic you can use in a CEWP.

function docready() {

var row = [];
var ix=0;



$('tr.ms-ganttTaskRow th').each(
  function() {
    row[ix] = $(this).parent();
    ix++;
  }
);


ix=0;
for(ix=1; ix< row.length; ix++){
   var $prevrow = row[ix].prev();
   var prevtxt = $prevrow.find('th').text();
   var curtxt  = row[ix].find('th').text();
   if (prevtxt == curtxt) {
     var colix =0;
     row[ix].find('td').each(
       function() {
         var ht = $(this).html();
         if (ht.length > 0){
           $prevrow.find('td:eq('+colix+')').html(ht);
         }
         colix++;
       }
     );
     row[ix].remove();
   }
}

}

_spBodyOnLoadFunctionNames.push("docready");

Explanation of the code:

Trigger the docready on load
Store all the rows in an jquery array for easy processing
Walk through the rows array starting from second item and match the row header with previous row, if so, copy the contents of the columns to the row above and remove after processed.

There is only one catch, the gantt view needs to be sorted on the row header column.

Killing tasks/processes from the command line in Windows 7

2009-11-17T12:26:00.000+01:00

Sometimes you quickly need to kill a task in Windows (mostly from the command line). With Windows 7 this can be done by using the taskkill command. First thing you need to do is start a command line with administrative priviledges:

Type in command in the start menu, when the Command Prompt shows up, right click and select Run as Administrator.

After a warning message (if UAC is turned on), the command line is shown. Before we kill something, we need to know what we would like to kill :). This can be done by issuing a tasklist command.

The tasklist command will show all the running tasks (similar to task manager). This list can be quite long depending on your system. You can quickly filter by issuing the /M switch, eg.

taskkill /M vm*

will show all tasks (and modules) starting with vm in the name

Now killing the task is the easy part. Just issue a taskkill /IM with the name of the task:

The /IM specifies that we are using the image name and the /F at the end is used to specify we would like to kill the process forcefully. You can also kill a task by PID (process id) by using the /PID instead of /IM. It also allows you to kill multiple tasks eg:

taskkill /PID 230 349 230 /F

will kill processes 230, 349 and 230 simultaneously. The taskkill has much more functionality, eg killing multiple task based on filters, for example:

taskkill /IM note* /FI "windowtitle eq untitle*"

will kill every task name starting with note (eg notepad) and where the title starts with untitle, with other word kill all instances of empty notepad.

Enjoy!

Cisco VPN 5.0.00.340 after Windows 7 Update

2009-11-09T20:41:00.000+01:00

2 weeks ago I have updated my laptop to Windows 7 and today I wanted to use my VPN account. When trying to connect, I got an error 440 Driver Failure. Fixing this issue was quite easy, however you do need to have the Cisco VPN installation files.

Goto start, type "add remove" and select Add or Remove programs

From the list of installed applications, scroll to the Cisco VPN item and press repair.

If your original installation files are still in the same folder, all will go well, otherwise you will get a popup screen asking for the installation files. Luckily I have my backup and it was easy to find them :)
It works like a charm now!

Domination of the web

2009-10-23T17:32:00.000+02:00

Just read an article on techcrunch that Sean Parker thinks that the web will be dominated by Facebook/Twitter and not google:

To be clear, he thinks Google will stay huge and relevant, but it’s dominance will go down because collecting data is less valuable than connecting people, he said.

I have to disagree with this.

I still believe that Facebook and Twitter (and any other major social service) is currently over-hyped. In the future the hype will disappear and the dying process will start.
As long as google delivers the best search experience, it will never die. Finding information on the net is an essential part of surfing the web.
It is also a matter of time until the success of social website will hurt itself. People are still not aware of the privacy issues involved with it; every day I see more and more FAIL pictures of facebook updates. When the users realize that everything they say/post/publish is stored forever with the possibility that it can be used against you, the frequency of use will become less.
If you want to spot the next big thing for the future, you need to look at the teenagers, as they are the future. I remember that these social sites are not very strongly presented in this age category. This is also correct when I look around me. I believe the current social sites are focused on the 25+ to 45 age range. This means either when the teenager become older they will start using the current social sites or they will laugh at it and invent/continue with their own technology. (see also point 6)
As this guy mentions, Connecting people is the future relevance of being dominant, I don't think so. Connecting people has always existed during the existence of the internet. In my youth it was something called IRC. Great tool to chat and meet people. In my time and area I think it was even more popular then the current social sites. It still exists and is used widely I guess, but as mentioned in point 1 the hypes goes over and it gets into coma.Other old examples are ICQ, MSN, Skype, etc.... All still exist and all do their work but they were never able to dominate the web. This brings us to point 5.
I think this guy doesnt understand the web. The web is much much more than a way of communication between people. Just of because of this social sites can not dominate. They are trends of the internet, like trends of color. Suppose the most trendy color currently is red (eg. 80% of cars/dresses/etc are red), I believe you cannot say that all important things in the future will be of the color red. It will be for a time, but then the next color will come...etc. But google is the freaking color spectrum itself... no matter what the trend is, it will always be on top of that.
The future is the mobile web and google/apple understand this. Teenagers mostly use mobile devices to communicate directly (mostly with SMS messages in europe). It is just a matter of time until the internet connectivity speeds and costs will be low enough for people to massively use it. Once this happens, the usage of internet will shift to the mobile world. Collecting data and presenting it (as this guy mentions what google does) will become even more bigger then now. People will want to have information anywhere at any time. I think Augmented reality is a good example of a future technology which will be very big. No matter how social a human is, at the end the world evolves around its self. Finding the information to help him/her a step further will always overrule the social aspect.

As a conclusion I would expect that the current social sites will still be big and can only stay big if they become part of the cloud, allowing future users to integrate their services with other services. This is also where google expels and will unless it doesnt become evil, will dominate the future :)

FileList Version 1.0 Release

2009-10-22T12:32:00.001+02:00

I mentioned in my previous post, I was planning to develop a tool to easily generate a list of files in a folder for further processing. Well, last night I put something together and I am now releasing it to the public.

I am calling is FileList and it is a portable application. Unzip to a folder where you have read/write access. All settings are saved in the application folder.

Some features:

Unicode support for multilingual use
Drag and drop support, you can drop folders/files to the application and it will list the files of the folder
Command line argument supported (for right click event in explorer)
Settings to change font and customize output

Screenshots:

Original Location

Mirror

Some disclaimers (just to make things clear)
You are free to use this application for personal, business or any other use. The application is provided as is and use it at your own risk. The application is not evil and has no ET functionality (call home). I cannot be put responsible for any damages what so ever.By downloading and using this application you confirm this. I have tried to make the application as bug free as possible, however if you encounter any issues, do let me know. If you would like to distribute this application, please let me know. In no case can you ask any money for this application.

Files list

2009-10-21T11:17:00.000+02:00

Today I have been in need of a tool which could easily generate a list of files in a folder which I can easily copy and paste for further editing. Normally I do this by issuing a dir command in the command prompt and redirecting output to a file, etc. This works fine if it is occasional, but if you need to do it on a regular basis (like me in this case), a tool might help.

Searching on the net I have found the "5 Ways to Print Folder and Directory Contents in Windows", which listed some apps, which I tried. None of the application met my criteria (easy to use, small, multilingual, drag and drop), so I have decided to create my own app which I will share soon.

If you have any suggestions on a file lister tool, please let me know.

Maintenance of Sharepoint Web Parts

2009-10-16T10:49:00.000+02:00

For some reason, all the web parts ever added to a page in Sharepoint are actually never really removed when you delete them from the page. You can see this for example when you edit the page in Sharepoint Designer. Actually it is a good feature which allows you to retrieve webparts which could have been accidently removed by a user.

You can also remove or clean up the not used web parts in a page by using the Web Part Maintenance page.

It also allows you to remove buggy web parts which prevent your page to load.

You can access this maintenance page by going to the following page:

http(s)://[site-collection-root]/_layouts/spcontnt.aspx?url=[relative path to the page]

Vista, svchost.exe and my CPU

2009-10-13T11:15:00.000+02:00

Last week I started to have issues with my Vista Laptop. Until now Vista has been great with me, I never understood why people complained about it anyway. After each boot and login my cpu maxed out. Initially with taskmanager I was not able to see which process was eating my processor, so got the tool Process Explorer (Sysinternals ... now Microsoft) and watched what happened.

It seemed that the svchost.exe was eating all my cpu cycles. Hovering with the mouse on it showed the services which it involved.

There was definitely a service which was doing something terribly wrong. Right click - Properties and then the Threads tab showed me that the dnsrslvr.dll!Reg_DoRegisterAdapter+0x501 was the cause. After googling for this I found only 1 entry, which luckily was the entry which helped me.

Summary on how to resolve this is as follows:

There seems to be a network adapter definition in the registry which is incorrectly referenced. In order to find this you need to use the Process Monitor tool and filter on the registery changes only and you will see a lot of entries like:

RegOpenKey HKLM\System\CurrentControlSet\Services\Tcpip\Parameters\DNSRegisteredAdapters\{0751F0D9-4F38-4FCB-8EA8-2E05F05FC711} SUCCESS Desired Access: Read

What you now need to do is to get the GUID of the adapter, in the example above it is:
0751F0D9-4F38-4FCB-8EA8-2E05F05FC711

and use the registry editor and navigate to the following path:

HKLM\System\CurrentControlSet\Services\Tcpip\Parameters\DNSRegisteredAdapters\{0751F0D9-4F38-4FCB-8EA8-2E05F05FC711}

and remove this entry. The moment I removed it from the registry, my issue was solved.

Note: If you are more careful it would be better to create a backup of your registry and/or create a restore point.

It seems that the adapter was an vmware adapter (I do have vmware installed), and for some reason it got corrupted. I didnt test vmware yet, so I dont know what the impact of this would be on vmware.

Probably another solution would be to uninstall vmware.

Enlarge input width size in edit/new pages

2009-09-04T14:16:00.008+02:00

When editing list items in SharePoint, one of the most irritating issues I find is the width of the input fields, in particular the rich-text editor. So I have decided to fix this.

First of all we need to go to the page and set it in edit mode, which can be done by using the ToolPaneView=2 querystring. (See SharePoint Kings for more info), eg:

.....your-sharepoint-list-url..../EditForm.aspx?ToolPaneView=2

Then add a Content Editor WebPart. Make sure it is hidden in the appearance.
Finally add the following code:

<script type="text/javascript" src="{url-to-jquery}/jquery.js" language="javascript"></script> 


<script type="text/javascript">
function docready() {
  $('.ms-formbody').css('width', '100%');
  $('.ms-long').css('width', '100%');
  $('.ms-rtelong').css('width', '100%'); 
  $('.ms-rtelonger').css('width', '100%'); 
  $('#onetIDListForm').css('width', '100%');
}

_spBodyOnLoadFunctionNames.push("docready");

</script>

Your forms will now use the complete width of your window.

Update: 25 september - Added the rte-longer class for also resizing the rich-text boxes

Future of navigation: Augmented Navigation

2009-09-04T13:20:00.001+02:00

For more information about augmented reality, see this presentation

Function reference calculated fields in Sharepoint

2009-08-04T17:36:00.002+02:00

Some times you need a list of functions you can use in Sharepoint calculated fields. It seems that this is available in your local machine...just go to: C:\Program Files\Microsoft Office\Office12\1033\STSLIST.CHM (if you got Office/Access 2007 installed)

From: Michael Blumenthal's BlumenthalIT.NET

or if you need an online version: wssdemo

or on your local sharepoint server:

http://server-name/_layouts/help.aspx?lcid=1033&cid0=MS.OSS.manifest&tid=MS.OSS.CH10176029&sq=calculated%20column

Show the year/week in Sharepoint

2009-08-04T13:50:00.004+02:00

In order to group per week in a Sharepoint list, I have used the following function:

=IF([Completed date];YEAR([Completed date])&"/"&IF((INT(([Completed date]-DATE(YEAR([Completed date]);1;1)+(TEXT(WEEKDAY(DATE(YEAR([Completed date]);1;1));"d")))/7)+1)>10;INT(([Completed date]-DATE(YEAR([Completed date]);1;1)+(TEXT(WEEKDAY(DATE(YEAR([Completed date]);1;1));"d")))/7)+1;"0"&INT(([Completed date]-DATE(YEAR([Completed date]);1;1)+(TEXT(WEEKDAY(DATE(YEAR([Completed date]);1;1));"d")))/7)+1);"Uncompleted")

Actually the code to determine the weeknumber is:

=INT(([Completed date]-DATE(YEAR([Completed date]);1;1)+(TEXT(WEEKDAY(DATE(YEAR([Completed date]);1;1));"d")))/7)+1

So actually what I did was to first detect if the [Completed date] is valid (not empty), if it is it will show the text uncompleted. The next step was to check whether the week number is 2 digits if not then we will add an additional 0 to it, in order to make sure we can sort it correctly.

Modifying pages without the Edit page option in Sharepoint

2009-08-04T13:44:00.002+02:00

Sometimes you want to customize a Sharepoint page, however the Edit Page item in the Site Actions Menu is not available. A good example for this is the Display and Edit page of a list item.

You can still do this by adding the ?ToolPaneView=2 parameter after the page url, eg. DispForm.aspx?ToolPaneView=2

My next smartphone

2009-01-30T11:21:00.002+01:00

jQuery 1.3 issue - part 2

2009-01-18T15:30:00.002+01:00

I have to apologize to the jQuery team, as it seems that jQuery does work. It seems there was a very strange issue with the Finjan software we are using at the office. When I downloaded jQuery at home, all seemed to be working.. after doing a file compare between what I got at the office and what I had downloaded at home, there was 1 line (the line I mentioned in previous post), different.

Anyway, this has been a lesson for me to double check the firewall and proxies..

jQuery 1.3 issue/bug

2009-01-15T11:29:00.008+01:00

First of all congrats to the jQuery team with the new 1.3 release, however maybe it is me only.. but it doesn't work. I have downloaded it used it on my test sites and none of them work: there is an issue in the jQuery code.

So I checked http://api.jquery.com and the same issue..(in IE7 and FF3)

Now I was interested what went wrong, downloaded dev version, checked the error message:

Line 2097 seemed the issue:

div.appendChild( document.createElement('Comment').data = "" );

I guess appendChild assumes an Element object, however:

document.createElement('Comment').data = ""

returns an empty string. Removing the .data="" fixes the issue for now, but I have no idea how it will effect the rest of the code.
I can't imagine that jQuery team released a non working version! Am i doing something wrong or do more people have this issue?

I still have some other pages which gives errors on events, but first a smoke :)

Year++

2009-01-01T14:45:00.004+01:00

or as seen on reddit </2008><2009>

Future of Windows

2008-12-23T22:47:00.004+01:00

As Microsoft is working on its hype of Windows 7, after the unsuccessful release of Vista, the question comes up what the future of Windows will be. You probably have seen some screen shots of how Windows 7 will look like. There are some pretty cool UI elements but will this help Microsoft on making Windows 7 a success? Time will tell, however what Microsoft should be focusing on (and probably is), is the future of the OS.

In order to understand what the future of the OS and Windows will be, we will need to look at the history of the (Microsoft) OS and look back how it has evolved. It's not up to me give you a history lesson, however my intention is to explain how I have seen it evolve.

When I first starting with computers (the commodore and apple ][ era), the OS was actually a tool to make use of the hardware and start applications. The most famous OS was actually DOS and as the name mentions it was a DISK Operation System. It was really low level and user unfriendly (that is why tools like Norton Commander, etc existed).
As the computers became more powerfull, Windows 3.x was launched, which actually kicked off the PC market. The power of the graphic user interface in combination with the support for old DOS applications and the ability to "multi"-task made it popular. The multitasking (which was actually the ability to switch between running applications) also introduced many people to the clipboard and the famous control-c and control-v key combination. From a developers perspective, there was now uniformity on controls, application interface, hardware independency which was now all taken care of by the Windows OS. Remember the time in DOS when each program had its own graphic driver (EGA/VGA) and printer driver (HP codes, etc). Now these days were gone and applications became uniform and easy to develop (and to use). A big boom on software came to the market and Windows became the standard.
Windows 3.11 added the network support which allowed the users to connect to each other (and connect to internet).

Windows 3.x still felt like a shell on DOS and DOS was still very important for fine tuning your system (autoexec.bat and config.sys files). The come of Windows 95 and 32 bits processors killed the DOS era. With Windows 95, Microsoft delivered a true graphic OS which was not an addon to an existing lower level (D)OS. In combination with developments like Internet and Windows NT Server, it ruled the OS market until Windows XP.

Windows 98 and ME felt like minor upgrades without real improvements and these even felt less stable. Personally, my home desktop has been on 95 until XP was released (in the meantime my business computer was Windows NT/2000 workstation).

Windows XP, is still the ruling OS because it does what the users want: Boot quickly, best hardware and application support, connect and surf the internet.

So if we need to summarize what happened with the OS:

Start computer, start applications and locally store data (DOS)
Easier user interface and switching applications (Windows 3.0)
Network connectivity, allowing easily sharing of data (Windows 3.11)
Multitasking and a true new interface with working with computers. End of DOS. (Windows 95)
Improvement of user experience (multimedia/video/gaming) in combination with new hardware and server systems (Windows XP)

As we can conclude from the above list, with each step there was an essential improvement and need for an OS update. If we look at the Vista situation, there was no trigger for the Windows community to start using Vista. Besides that it had issues with existing hardware, had high hardware requirements, was incompatible with business critical software and probably because of the reasons mentioned earlier, it was slower (compared to XP). The improvement Vista brought (like better security, fancy user interface effects like aero) was not enough to convince the majority of XP users to switch to Vista. Actually there is nothing XP can't do what Vista can't do (even all the cool gimmicks).

Having looked backed at the past, we also now have to look to the current situation and the future to try to vision what will happen to Windows. What is happening is that more and more people are switching to Windows alternatives, like Mac OSX and Ubuntu. There are a couple of reasons for this, but I think the most important reason is the independancy on the OS and OS specific applications. If we look at the average user and try to summarize what the main activities are, we will probably get the following list, from most to less time spent:

Surfing internet
Communication: email, instant messaging and voip
Gaming
Store and organize digital media like photo and video (and share them)
Write documents (personal use or blogging)
Easy calculations (based on spreatsheets)
Watch media (movies, tv series, etc)

Personally, I have to say that, if I have no internet available on the computer, the machine feels dead and there is no trigger to use it. Having a browser and internet almost allows all the above to be accomplished (except Gaming, while the internet connectivity is very important though). So as long as we have a good browser and a machine which allows us to do the above, most people really don't care about the OS anymore. I have been using Ubuntu and Mac OSX recently and to be honest, i didn't miss anything (especially on Ubuntu). In the future when the connection speeds and the html techniques will become better and extended, almost all we need or will use will be running in the are going to be will be on the browser.

Coming back to the actually subject: the future of Windows. I truly believe that Microsoft should focus on 4 items (besides the obvious like networking, etc):

Hardware support, allow the hardware developers to easily create drivers for the OS
Speed, extreme fast booting without any bloat and a very reactive system
Low level speedy graphics (directx on the OS level)

Besides this they should provide the OS with the fastest HTML/javascript rendering engine.
If Microsoft can achieve this, they will regain and keep their dominance in the OS market, otherwise I think they will loose the OS battle in the long term.

Tables: The Next Evolution in CSS Layout is Now

2008-12-21T13:50:00.009+01:00

After reading an excellent article at Vitamin about using CSS tables and how it will be next evolution for design once IE 8 is released. But I think we already should start using it, because with the help of jQuery, we can easily modify the DOM to emulate the CSS tables in IE 7 and below.

The trick is to replace the CSS table elements to real table elements for IE, which can be very easily done and the results are amazing. See my example.

Actually the code convert the elements to tables is the following:


$(document).ready(
function() {
// check for ie (it would be better to check for IE version too in the future)
if( jQuery.browser.msie){
// update the cells....
$('#container > div > div').each(
 function(){
   $(this).replaceWith('<td class="'+$(this).attr('class')+'">'+$(this).html()+'</td>')
 }
);
// update the rows
$('#container > div').each(
 function(){
   $(this).replaceWith('<tr>'+$(this).html()+'</tr>')
 }
);
$('#container').replaceWith('<table id="container_table">'+$('#container').html()+'</table>');
}
}
);

What the code actually does is converting the div elements containing the display: table-cell to td elements and the same for row (to tr elements) and finally the container div to a table.

To be honest, I am amazed with the results myself and for now on I will start using this technique for all my projects.

See below for the screenshots (as you notice, they all look the same)

Firefox:

Safari:

IE 7:

Of course what I have done here is a quick test whether it was possible. The code I have presented is just an idea and it can be optimized and generalized for common use.

Good luck on using the CSS tables!

Using mapstraction and Yahoo maps to determine lat/lon of a location

2008-07-25T15:38:00.004+02:00

(View demo).

During this week, I started experimenting with maps in my web applications. As a good developer, you should always google and see what is out there. Why invent the wheel again. One the first things I encountered was a javascript framework called mapstraction. It really does a nice job on working with maps (independent of the maps provider).

Having a look at the demos provided by mapstraction it was quite easy and fast to create mapping functionality. My biggest problem was the choice of the mapping provider. Having a look at the various api's and providers, there are actually 2 mapping api's which look good: Yahoo and Google. Being stubborn and not being a sheep in a flock, I have chosen for yahoo. I think yahoo is doing a very good job with their services.

Creating the map

The first thing we need to do is to get an app key from Yahoo. After we have this we can start coding. We start off by including the javascript files to our page. Then we create a div element which will hold our map. (Keep in mind that thesize of the div element needs to be specified, either directly or in the css).

Basically we are now set for coding.


<script type="text/javascript" src="http://api.maps.yahoo.com/ajaxymap?v=3.0&appid={yourappkey}"></script>
<script type="text/javascript" src="js/mapstraction.js"></script>
<!-- the size must be specified here, or in the CSS -->
<div id="mapcontainer" style="width:300px;height:200px;"></div>

As always for javascript coding, I use jQuery. When the dom is ready, we will start
creating the mapstraction object and then initialize it.


$(document).ready(
 function() {
   var bw = $('body').width();
   // we want the map to be as width as the browser window
   $('#mapcontainer').css( 'width', bw);
   // initialise the map with yahoo API
   mapstraction = new Mapstraction('mapstraction','yahoo');
   // add some controls for it (for zooming and panning)
   mapstraction.addControls({
     pan: true,
     zoom: 'large',
     map_type: true
   });
  // this function we will use to put some markers on the map,
  // eg coming from a database
  fillmap(true);
  }
 );

Almost done... Just need to fill the map with markers. In my example I will have 1 marker which is predefined, but you can easily get this from your database (eg, by using an ajax call)

Markers on the map

In order to be able to add markers on the map, we need to define a point based on latitude and longitude. Once we have this point, we can add the marker to the given position.


function fillmap() {
 // check if we have a mapstraction defined
 if (mapstraction) {
   // set the lat/lon value of the location we would like to mark
   // in this example, it is Rotterdam (centrum of the world :))
   var lat=51.92434043666618;
   var lon=4.47817325592041;
   // get rid of existing markers (if they are)
   mapstraction.removeAllMarkers();
   // create a point with lat/lon coordinates defined
   var myPoint = new LatLonPoint(lat,lon);
   // create a marker positioned at a lat/lon
   var my_marker = new Marker(myPoint);
   // add the marker to the map
   mapstraction.addMarker(my_marker);
   // center map on the location and zoom (level 9)
   mapstraction.setCenterAndZoom(myPoint, 9);
 }
}

It is possible to add text to a marker, however this is not my goal. If you want to do that, you can use the my_marker.setInfoBubble() method.

The goal is to get the latitude and longitude values of a location the user selects on the map. In order to do this we need to add and onclick event to the map. This can easily be done by using the addEventListener of the mapstraction object.


// capture the mouse click event
mapstraction.addEventListener( 'click', onClickMap);

// on each mouse click this function will be called with the point
// object of mapstraction
function onClickMap( point) {
 // the yahoo map returns 0 for lat and 180 for lon when user
 // clicks on a control on the map (for example on the pan-left arrow)
 if (point.lat != 0) {
   // we will remove existing markers on the map (resetting the map)
   mapstraction.removeAllMarkers();
   // we add a marker at the clicked location
   mapstraction.addMarker( new Marker( new LatLonPoint(point.lat,point.lon)));
 }
}

Now we are finished. To conclude: it is very quick and easy to geo-enable your application by using mapstraction.

Demo

For a demonstration of the code, have a look at my lat/lon finder. Please look at the source to see the full implementation.

In order to accomplish the search functionality and removing of markers in the demo, I have modified/extended the mapstration.js with 2 functions (for Yahoo):

Mapstraction.findCenterAndZoom(findtxt, zoom)

Marker.setClick(onMarkerClick)

The first function allows to search on a text and then centers the found location with a zoom. The second function allows a callback function when the marker is clicked. This was a function I really missed in mapstraction.

While I was busy working on the demo, I also found it interesting to be able to retrieve the location name of clicked/entered location. This is done by using the geonames.org JSON webservices.

Finally, I also implemented the parsin of the URL with lat and lon parameters, allowing a permalink. All in all, I think it is a usefull demo ;)

Feedback/Comments

If you have any questions or remarks about this code, as always you can always contact me.

Using CSS to clip image with the help of jQuery

2007-05-19T13:18:00.000+02:00

Last week I was reading a nice article by Seifi explaining how to clip an image in a web page by using available CSS techniques. I did like the idea of clipping images. Sometime there is no need to show the whole image on a page, especially if you want to save space.

Although the idea of clipping images interested me, the wholeprocess of getting an image chopped scared me, especially if you need to have different clippings on different sizes. Why calculate offsets and sizes manually if there is a computer which can do this for you. To accomplish this, I took the method in the article as a base and with the help of my favorite javascript framework jQuery, I got it all automated.

How?

In order to get the process of clipping images automated, some parameters are necessary to get the job done. These parameters are: size of original image, clipping offset and clipped size. I have chosen to use attributes on the img tag, allowing setting these values during design of the page.

Example

<img src="castle.jpg" id="clipit" alt="Clipped castle image" width="300" height="225" clipwidth="136" clipheight="105" clipleft="82" cliptop="50" />

As you can see, I have used some custom properties to the img tag, which will be used by javascript during the clipping process. In order to get the image clipped I have written a javascript function which can be called.

clipImage( 'id-of-image', 1);

This function will take care of it all and it will render the clipped image with the given parameters. I didnt spend much time on the code and it is quick and dirty. Maybe it would be an idea create a jQuery plugin for it.

Demo

The demo page showing the image clipping can be found here.
Please look at the source to see the implementation.

Feedback/Comments

If you have any questions or remarks about this code, you can always contact me.

How to make sexy buttons with CSS - jQuery version

2007-05-15T12:51:00.001+02:00

A quick update on the previous post on improving sexy buttons. I have a jQuery version which fixes some small issues. See the demo page for detailed information.

How to make sexy buttons with CSS - Improved

2007-05-08T20:35:00.005+02:00

Yesterday I visitted an blog entry by Alex Griffioen about making sexy buttons with CSS. It was a good tutorial for on how to use CSS. When I looked at his implementation, I was missing a hover effect on the button, so I decided the modify his implementation to make the hover effect possible.

As explained by Alex, the sexy button is created by using the Sliding doors technique and uses background image shifting to create the pressed state. By expanding the background image we can have a hover state on the button. The only thing need to be done is to add the :hover state with the correct vertical alignment for the background. The most difficult during this whole process was the correct modification of the background images

You can see the demo here.

Download all files: zip

Enjoy.

Update
11 may 2007 - Oran Sands notified me that the active state did not work. This has been fixed. Thanks Oran.