We're sorry, but something went wrong (500) - Kickstarter - Firefox

So went to Kickstarter.com as usual and was welcomed with this message "We're sorry, but something went wrong (500)". I figured they had some hicup and figured I'd come back later, a few hours later it was still having issues, but projects I was backing were tweeting about new updates, without a mention of KS being down. Then this morning, still no tweets about it being down and many more messages about KS updates, though the site still gave me a "We're sorry, but something went wrong (500)". So I opened it in Chrome, and it worked. Back to Firefox, I deleted all the kickstarter.com cookies and boom, Kickstarter was back in action.

Photos of Sydney Harbour Bridge from 1930s

Here are some scanned historical photos of the Sydney Harbour Bridge under construction.

August 7th, 1929. Sydney Harbour Bridge under construction. View from North side. They had used 19,200 tons of steelwork to this point.

Middle of April, 1928. Harbour Bridge from South side.

North side, ground level, nearly complete.

1930, Water view of South side of bridge.

1929, Cruiseship arrives with Bridge construction in background.

January 1930. View from Loftus St, Sydney. Harbour Bridge construction in background.

1930, Working 300feet above the water.

Portfolio: Corona Music Mexico

A music driven promotion website, launched down in Mexico recently. People can redeem vouchers from their Corona packages for credits that they can spend streaming or downloading music.

The initial design and HTML/CSS were created by a 3rd party Mexican agency, as I added functionality to the pages and further changes came through, I ended up re-writting much of the CSS and many of the HTML pages to solve cross browser issues, polish the design and facilitate functionality.

Most of the functionality is handled by Javascript, AJAXing to a BE which returns JSON. It features Music listings, creating/editing of playlists, sharing of artists and albums via Facebook, and the ability to stream 30sec and full length tracks via the Flash player.

I had to make heavy customisations to the Flash player to support next track pre-caching, streaming token retrieval, add to playlist, and purchase/download buttons for currently playing song.

I also built the simple HTML/CSS for a feature phone version of this site, and assisted the BE developers in supporting these devices for streaming.

You can see both these at descargas2.coronamusic.com and m.coronamusic.com

IE8 Facebook Login - "Object doesn't support this property or method" in all.js

So doing some more work on Facebook integration, we were posting to facebook.com/dialog/oauth/ and when it redirected back all.js was throwing an error 'Object doesn't support this property or method' at this line response={authResponse:FB._authResponse,status:FB._userStatus};

I couldn't find anywhere in all.js where it defined response, so a quick hack I added

var response={};

This solved the issue for me, hope this helps. If you know anything more leave a comment.

Facebook Javascript API - Post to wall - FB JS SDK

Working with the Facebook JS SDK I was having problems using the FB.ui to log the user is, and post a message to their wall. Main error was 'Permission denied to access property 'Arbiter'.'. I tried many different things such as developing this on a website that could be accessed from external sources, but the problem wouldn't go away.


So I wrote some code that used FB.login and FB.api, though after login/permission acceptance it would leave the XD Proxy window open on a blank page. Below is my code which will handle the XD Proxy window, login, permission acceptance and post to their wall, even on your local environment without external sources being able to access your site.


First we install the FB API

<script>
 window.fbAsyncInit = function() {
   FB.init({
     appId      : facebookAppId,
     channelUrl : 'http://'+ window.location.host +'/channel.html',
     status     : true,
     cookie     : true,
     xfbml      : true,
     oauth      : true
   });
 };

 (function(d){
    var js, id = 'facebook-jssdk'; if (d.getElementById(id)) {return;}
    js = d.createElement('script'); js.id = id; js.async = true;
    js.src = "//connect.facebook.net/en_US/all.js";
    d.getElementsByTagName('head')[0].appendChild(js);
  }(document));
</script>

Next we want to setup the function to handle the login/permissions.

function FBShare(title, link, picture, msg, caption) {
   FB.login(function(data) {
     postFBMsg(title, link, picture, msg, caption);
   }, {scope: 'publish_stream'});
 }

Here I call FB.login, setting scope to publish_stream which once the user is logged in will ask for permission to allow my app to publish to their wall.
Once login is complete and they have accepted my permissions, we call postFBMsg.

function postSocialMsg(title, link, picture, msg, caption) {
   var body={
     message: msg,
     picture: picture,
     link: 'http://'+ window.location.host +'/'+ link,
     name: title,
     caption: caption
   }

   FB.api('/me/feed', 'post', body, function(response) {
     if (!response || response.error) {
       // Error
     } else {
       // Successful
     }
   });
 }

Here I set the body var to contain our Facebook Wall Post details, we have the title(Don't Worry Be Happy) which will be linked to link, we have picture(Guy Sebastian pic), msg(Wall Post Message) which will appear under the Username(John Smith), title and caption(Guy Sebastian) which will appear under our Message to the right of the picture. If no Caption is sent it displays the link URL instead.

The final piece to our puzzle is to handle the closing of the XD Proxy window after login. It posts back to the calling window after actions are performed, I setup an event to capture these messages and close the window once it receives one. If you already are using postMessage between windows, you'll need to setup a conditional statement to only close the window if it's a Facebook message.

 $(window).bind('message', function(e) {
   e.originalEvent.source.window.close();
 });

So once we get a message via postMessage we close the window of the message sender.


This is how I'm doing it in my local development environment, inaccessible to the outside world, if you spot and flaws, or know of a better way of doing things please leave a comment.

Firefox 9.0.1 Error: uncaught exception: TypeError: args.shift() is null

So looking at a site we're developing this morning in FF 9.0.1 and some pages didn't work on some peoples machines, though worked fine on mine. After installing Firebug to see what was going on the pages would work fine.

I uninstalled Firebug and looked at the Firefox Error Console to find the following error.
Error: uncaught exception: TypeError: args.shift() is null


Was a weird one, after much poking around I found it's a poor handling of arguments supplied to console.log, hopefully this is a bug in FF9.0.1 and will be corrected in the next release. For now to quickly get things working I've just extended my console.log handler to set console.log=function() {} to cancel console.log functionality until it's fixed.

If it's not addressed in future versions I'll have to look into it further to detect if Firebug isn't active and do some alternate handling for development.

To work around this I've changed my code to this

if(window.location.search!='?debug=1') {
  top.console.log=function() { }
}

Now I just add ?debug=1 to URL and it uses built in console log so I can manage when it comes on.

Hope this helps, if you have further info please leave a comment.

Dungeon Siege III - GFX Files

GFX files are basically SWFs, to edit them rename them to a *.swf file and with a hex editor change the first 3 bytes from CFX to CWS, then any Flash Decompiler will happily open them.

I've opened them up and inspected the Actionscript which all worked though I'm yet to try editing one, my guess is you should just be able to change the first 3 bytes back to CFX and rename it back to an *.gfx file for it to work, though depending how it modifies the SWF it might break something extra that GFX files have that SWF doesn't.

Let me know if you've had any success, or more info, I'll update this post as I find out more.

Dungeon Siege III - Enable Console

So just bought Dungeon Siege 3 and was horrified with the unchangeable camera angles. So I set about having a dig around the game to try and find a way to change the camera, while digging around I noticed a console file, and the Dungeon Siege III.exe had a number of console commands in it, so I replaced the Help Topics file with the Console, so now when I'm in game I can press Esc, click 'Help Topics' and the console will appear.

After playing around with all the console commands I could find in relation to camera none seemed to have any effect, though most other console commands works, such as adding money, items, XP, levels etc. So cheating is easy in Dungeon Siege III, but changing the camera angles isn't )-: Hopefully I'll have more time to play around with them and work something useful out.

I grabbed the Dungeon Siege 3 OAF Files Extractor and unpacked the files to a temp directory, unpack data_archive.oaf first, then unpack data_archive_2.oaf into the same place, the files in data_archive_2.oaf overwrite some which is how the game works too.

After looking around my first step was to get console working, I copied gui\console.scn and gui\game.gui into %steamapps%\common\dungeon siege iii\data\gui

Rather than having to repack the archives after editing just drop the files you changed here and it will pick it up rather than using the archived copy.

To make things easy I have zipped the files, you can get them from http://www.mediafire.com/?sa7a3gepx3ea4f5 and unzip them in your %steamapps%\common\dungeon siege iii\data folder. My full path is C:\Program Files (x86)\Steam\steamapps\common\dungeon siege iii\data. Once it unzips you'll see a gui folder with the help_topics.scn and game.gui files. The game.gui is for a game with the DLC.

Now rename console.scn to help_topics.scn and edit game.gui. Find the line

help_topics.scn   parsefunction GUI_command_parser_help_topics

Change to

help_topicx.scn   parsefunction GUI_command_parser_help_topics

Then find the line

console.scn   parserfunction GUI_command_parser_console   game_flags  1

Change to

help_topics.scn   parserfunction GUI_command_parser_console   game_flags  1

Orange signals what was changed for ease of reading.

Now run the game, while in game press Esc, in the menu click Help Topics and you'll have access to the console.

To get back to the game type modal_close_all and press enter. You can also type mod and press TAB to auto-complete. As we've hacked the console into an unusual place, things don't appear in it's history straight away, so if you press top_down_mp_ and press TAB, because there are multiple options it won't display anything. After you have pressed TAB, just delete the text and type modal_close_all, then enter the console again and you'll now be able to see the options for your previous commands, so we'll see all available options for top_down_mp_ console commands.

I'll add the console commands and explanation here slowly as I find them, though I can't test them all so some might not work, let me know if you find more, descriptions are wrong or they don't work and I'll update this list.

avoidance_scale
avoidance_range
avoidance_count
avoidance_collection_range
avoidance_collection_interval
avoidance_sideways
avoidance_active
ai_attack
aggro_decay_rate
ai_draw_perception_radius
avoidance_when_stopped
area_notification
area_notification_duration
add_money - Add money to your character
add_xp - Add XP to your character
ai_enabled
add_to_party
ai_revive_debug
ai_loot_pickup_delay
ability_bind
ability_purchase
ability_dump_all
ability_dump
auto_grant_empowered_attacks
ability_autoassign
attract_enable
allow_auto_level_up
allow_skip_level_up
attract_movie_name
attract_movie_delay


batched_lighting
brightness
base_stats_print


combat_knockback_duration
combat_knockback
combat_friendly_fire
combat_damage
combat_print
contrast
con_queue_disable
companion_perception_buff
connection_reset
changelevel
combat_hard_threshhold
companion_alternate_cooldown
camera_remote_interpolate_dist
camera_shared
critical_override
camera_center_on_object
camera_mouse_sensitivity
console_close
console_toggle
console_open
camera_auto_rotate_deadzone
camera_auto_rotate_scale
camera_yaw_max_velocity
camera_yaw_damp
camera_yaw_speed
camera_recenter_delay
camera_multiplayer_control
cost_divider_for_enchant
credits
clear - Clears all previous console output

exec - Run console scripts, located in global\console_scripts\*.txt Eg: exec global\console_scripts\bad_ass
endgame_disconnect


fade_draw
fade_aggressive
find
float_text
float_text_exp_y
float_text_exp_x
find_games_receive_invites
find_games_party


gui_delay_load_sleep
gui_delay_load_name
gui_mem_report_detailed
gui_mem_report
get_global_variable
gui_resource_dump
gui_trace
gui_timescale
gamma
give_unlockable
gui_warning
god - Toggle God mode on player
getpos
game_mode_reset_on_exit
game_mode
gui_quest_filter
gui_split_screen
gui_ingame_character_select
gui_show


human_attack_bias
heal
hide_spinner
hud_fade_duration
hud_show_names


infinite_resource
interpolation_tolerance
if
item_spawn
inv_drop
item_print_by_id
item_print_by_tag
inv_print
inner_warmth_time
inner_warmth_dmg
inner_warmth_hp
ingame_scn_mp
inv_mark_viewed
inv_show_remote_companions
inv_show_remote_players
inv_show_defaults
ingame_screen_fade_duration


journal_load
journal_save
journal_play
journal_stop
journal_record


knockback_prediction_hold
kick
kill


load_art_objects_only
load_game_objects
level_debug
load_spinner_delay
loot_spawn_from_template
loot_random_spawn_from_template
loot_print_template
level_up_delay
level_scaling_dlc
level_scaling_difference_threshhold
level_scaling_target_range
level_scaling_enabled
loading_screen_fadeout_duration
load_full_party
loot_points_per_enchant
load_level_filter
load_level_test


max_combat_channel_dist
mission_open_list
mission_list
mission_set_end_state
mission_set_status
max_auto_target_ui_dist
multiplayer_remote_enabled
multiplayer_local_enabled
modal_close_all
multiplayer_stuck_warp_delay
multiplayer_tether_range
max_players
multiplayer_ai_idle_time
multiplayer_tether_others
multiplayer_remote_warp
multiplayer_tether_screen
minimap_enabled - Show/Hide minimap, top right.
minimap_scale - Change level of zoom used in the minimap.
minimap_rotate
minimap_yaw
minimap_alpha
main_menu_load_level
main_menu_credits
main_menu_dlc
main_menu_find_game
main_menu_continue
message_box_ok


net_interpolate_max_stopped_time
net_extrapolate
net_interpolate
net_position_offset_z
net_position_offset_y
net_position_offset_x
net_activation_delay
net_predict_knockback
net_predict_reaction
net_ip
net_port
net_loopback
new_game_data


objective_set_status
objective_list
overheal


projectile_impact_fx
platform_speed
platform_accel_dist
path_blocker_disable_all
platform_predict_movement
play_anim
player_additive_speed
player_min_health
player_damage
platform_delay
pause
party_add_xp
party_set_level
party_restrict_class
party_single_player_limit
party_default_companions
player_ai
player_name_from_class
player_add
player_level
print_loyalty
player_class
popup
post_charselect_new_game_data

quit -Quit game completely, back to Windows.


render_csa
reset_tutorial
render_hit_flash
rumble
revert
revert_all
respawn
retry
reconnect
rcon
restart_server
respawn_interval

script_list
script_run - Runs AMX files located global\scripts, followed by the function name and arguments. Eg: script_run global\scripts\00_intro\00_intro CamShake will result in the screen shaking once you modal_close_all. I haven't looked into AMX files yet, will do a follow up post once I find more out.
set_light_set
set_global_variable
stats_print
speedy
show_all_damage_numbers
subtitle_notification
seek_fullscreen_movie
stop_fullscreen_movie
start_fullscreen_movie
status_effect_apply_to_player
scale
set_level
set_resource
set_health
status
startcell
startlevel
startlevel_data
stream_proximity_radius
survival_creature_set
say
start_conversation
screen_shake_move_camera
session_type
save_load_enabled
show_spinner
save


timeline_reload
toggle_tutorial
tutorial_enabled
toggle_pause
target_ui_neutral_player_index
target_ui_hostile_player_index
target_ui_neutral
target_ui
top_down_mp_fov
top_down_mp_distance
top_down_mp_pitch
top_down_yaw_offset
top_down_collision_mp_pitch_speed
top_down_collision_mp_decay
top_down_collision_mp_hold
top_down_collision_mp
top_down_collision_sp
top_down_zoom_all


unpause
unlock_all
user_setup_delay


warning_notification
write_file
warp_to_player
warp_to_position


 yaw_offset

Atrix for 7 months Review

So after 7 months using my Motorola Atrix I can say I still love this phone. Stock it has been capable of lasting a full 24hrs with Wifi, bluetooth and GPS active, and spending 14hrs in a quite low signal area.

After a few months stock to make sure the hardware wasn't faulty, I rooted me device and have been able to tweak it to give me minimum two days battery life, though in times of light use it will stretch to just over 3 days.

While I initially thought the Finger print scanner was a gimmick, after using it to unlock my phone for 7 months now I still love it, so quick and smooth while still being secure.

As far as apps I've found that has really made the phone experience great:
GoLauncher, awesome home screen with App menu replacement.
GoSMS, SMS replacement that is amazing.
Folder Organizer, used to create easy to use folders on home screen.

All the other apps I run are specific to my needs such as weather widgets, exchange rate widgets, firewall etc.

So while the new Galaxy has been released, I'd still get this phone, it's smaller size let's it fit in my one hand easily for using, the Galaxy doesn't really offer anything extra in the way of performance that any apps are actually able to use.

So I'd still recommend this phone to anyone looking for a new device.

First time, big trip, traveller - Guide to planning

So I've taken many trips, been to a few countries, but only ever for a few weeks. When I started to look into a few month long trip to Europe, my mind felt like it was about to explode with all the information, places to visit, things to see, transport options to get around etc etc.

This is the method I have used to help me get a plan together, and de-clutter my mind on Europe.

First log in into either Bing Maps or Google Maps. I choose Bing as Google Maps had a bug with their Saved Places list and it took about 2 months to fix. Create a Saved list called 'Places to visit'.

Now you have somewhere to store all these places your interested in, so spend the next few months reading guide books, browsing websites and reading forums. When you come across a place of interest, do a search for it on the map, and save it to your 'Places to visit' saved list. Make sure you save notes with this place of interest, for example, how long you need to visit this place, how much it costs, transportation options to get there, opening hours, special events etc.

For me, I lurked on Lonely Planets Thorn Tree forums for months reading the many threads people would post asking various questions about Europe. When I would find someone mentioning something interesting I'd have a quick search on the item, and if it seemed like something I'd also like I'd add it to my saved list.

I borrowed guide books from my library on Europe, the Shoestring guides were really helpful too, most guidebooks have estimated budgets for cities, major festivals and sample itineraries, which really helped me add things to my list, and had lots of useful information I would add as a note on the item.

I also searched for 'x top 10', x would be whatever country I was interested in, so 'france top 10', or 'paris top 10' to find other peoples suggestions on the top places to visit.

After a few months you should have a map full of pins, and a much better idea about the places you're going too, you should have a good idea of the budget needed for each place, and time of year for different places if they are date/season specific.

Grab a map of the Eurail, I use this one http://www.eurail.com/planning, to help work out a general route I can take, figured where ever the Eurail goes is mostly popular, so there will also be other forms of transport from these places to branch out if you want to take a detour.

For me, I had a look at the Bing map, and could notice some areas that had a few pins in close proximity, so those became locked in places in my rough route, I then looked at the Eurail map and found a route between the locked in places that best included other pins along the way. Because each pin had a suggested time to see it, and an estimate budget, cost for travel between etc I was able to tally a rough budget to know either where to cut some things that didn't rate too high on my list.

Now don’t go off and book the itinerary you come up with, things will change, even while you're on the trip, so leave things open where you can. If you're attending a festival, or a city during peak time, most guide books/forums will have advised you if you need to book ahead, these are unavoidable and should probably be booked ahead to make sure you don't miss out.

Playing with my new Motorola Atrix

So it was time to upgrade my phone again, my Samsung Omnia had been a great phone, manually updated to WM6.5, but like all my phones nearing their 2 year mark are on their last legs. So I began my extensive review process to figure out my next phone from the quite large variety we have to choose from now.

First choice would be the OS, Apple is just too restrictive and lacking, Microsofts new WM7 was the forerunner until I read more and found out they were being a bit restrictive too, not allowing native applications(goodbye firefox), and using a blend of IE8 and IE9 just wasn't what I wanted in a phone. So that left Android, which I don't think is as polished as Apple or Microsoft, but it's fairly open and I like that.

So while digging around looking at what Android phone I'd choose I came across the Motorola Atrix being reviewed at CeBIT and it blew me away. Now I just had to wait for it to come out.

After not too long waiting it was released in the USA and I imported it to Australia, used SwiftUnlocks to free it from AT&Ts grips and I must say I'm impressed with it. Have been using it for 3 days now and it's amazing, I am happily surprised at how good Android it, how many free quality apps are in the market, and how long this battery lasts. After a full day playing with it, GPS on logging as fast as possible for 7hrs, downloading tons of apps on Wifi and the battery ran out. Normal use, few text messages, few phone calls, logging my walk home, bit of foursquare and email and this thing will do one and a half days, even with the amazing matrix live wallpaper!

The phone feels solid, the screen is amazing, the soft keys at the bottom aren't as responsive as normal buttons but you get use to them.

Only issues I have is getting my Google Account to register that I have a mobile device using the same login and that my account includes a Google Checkout account, so for now I can't buy anything from the market place, and things just stay open with no simple way to close them, you end up every day or so running a task manager and killing heaps of stuff, though with the dual core and 1gb RAM it doesn't really slow anything down.

Filter Keys jQuery Plugin

To help users fill in a form, you can filter out keys you don't want them to try and use. If it's a numeric field, supply the data-filterkeys='[0-9]' and they can only enter numbers. If it's a price, use data-filterkeys='[0-9$\.]' and they can enter numbers and $ and .

I have written it to also use a class of .filterkeys on each input, rather than just searching for inputs with a custom attribute, simply because the class search is faster. If you really don't want to have a filterkey class on all inputs requiring the filterkeys functionality, it's an easy change:

$('.filterkeys', this)
to
$('[data-filterkeys]', this)


Download from BitBucket

Javascript: Long loops without blocking UI updates

Browsers like to finish running JavaScript before they update the UI, which makes sense when majority of JavaScript is dealing with DOM manipulation.

The problem this causes is the UI becoming unresponsive when JavaScript takes too long to execute. Many times it's looping through an array of objects and performing the same operations on each object that causes this the UI to hang.

So for a new project I'm working on I decided to write an easy to use looping library that would take care of the pausing of loops to allow the UI tasks to complete, thus stopping the browser from being unresponsive during big loops.

It has 3 functions, sl, loop and asyLoop.

sl is short for Start Loop, you pass it a settings object that contains

• fn which is a function to do what you want to each object, this function can accept one parameter, which will be the object if the loop is passed objects, or the current count if it's passed cnt.
• objs which is a list of objects, though you don't need to pass this if you simply want it to loop through, by passing it a cnt setting. You can also pass a function that will return a list of objects, this function will be run when the loop starts.
• cnt is how many times it will loop through executing the fn
• async is a Boolean, letting you decide if it should be a blocking or non-blocking loop
• debug is a Boolean, which will output to console.log when a task starts, and finishes, run time and when it shifts from the looping queue
• callback is a function that will be called once the loop has completed

sl will decide which loop or asyLoop to call depending on the async option passed.

So what's the difference between loop and asyLoop? loop is a normal blocking loop, asyLoop will pause the loop every 50ms for 35ms to allow the UI to update, after 35ms the loop will continue for another 50ms.

So why have a loop when it doesn't pause looping? It adds the operation to the queue, for the times you need a function to occur after other large loop occurs. This could also be accomplished using the callback option.

How long extra will loops take using asyncLoops? It depends on how long the UI events take each time we pause. If the person isn't doing anything on the page it will be about 35% longer, if the user is scrolling the page up and down it took about 50% longer. For point of reference, to append the 25,000 DIVs it took 2,135ms for loop compared to 3,251ms for asyLoop and I was scrolling up and down while it was occurring.

Is this script optimised? No, I will release a minified, optimised version shortly.


Download the script at BitBucket


Thanks:
I've been reading through some Javascript blogs lately, not sure why I've never looked for them before, and found DailyJS: Let's make a framework. I noticed he checked if the window object existed and either passed it, or this if window doesn't exist, so the library would work outside of browsers, something I hadn't considered before.

Javascript: Finding jQuery bound functions (bind)

When using jQuery to bind events, such as click, mouseup, mousedown etc jQuery stores them in an object, using Firebug plugins that detect bound functions will usually just tell you a function is bound, but using Firebugs console you can find each function and it's actual code.

jQuery('#id-of-object').data('events')

This will show you an object which contains all bound events, such as click, mouseover etc, that are currently bound to #id-of-obj.

Object { click=}

jQuery('#id-of-object').data('events').click

Displays an array of each function bound to the click event of #id-of-obj. There is only one function bound to this object.

[Object { type="click", guid=2}]

If you click on the object in the Firebug console you'll see it has a few properties, 'data', 'guid', 'namespace', 'type' and 'handler'. The one we're interested in is 'handler'.

jQuery('#id-of-object').data('events').click[0].handler.toString()

This will output the code of the function bound to the object. If there are more than one function bound to the click event of the object you can find each one by incrementing the array number.

jQuery('#id-of-object').data('events').click[1].handler.toString()

This will get the second function bound to the #id-of-object object.


So hopefully this will help anyone trying to debug a site using jQuery and bound functions, let me know if you have any further questions.