Blog @SoftPoetry

Shift It+ for OSX

2012-01-25T03:13:00.001Z

Windows 7 has a great windows shifting mechanic for quickly splitting windows around the screen, to be able to use applications side by side.

For OSX I found an Open Source solution here.
http://code.google.com/p/shiftit/

It wasn't perfect for my needs, so I forked the source code primarily to add multiple monitor support, and more customized controls which didn't conflict with the applications I used.

Here is the presentation of the current features.

Here is a walkthrough of the source code so you can quickly jump in and add your own customizations.

&lt;p&gt;&amp;amp;amp;amp;lt;p&amp;amp;amp;amp;gt;&amp;amp;amp;amp;amp;amp;amp;lt;br&amp;amp;amp;amp;amp;amp;amp;gt;&amp;amp;amp;amp;amp;amp;amp;lt;br&amp;amp;amp;amp;amp;amp;amp;gt;&amp;amp;amp;amp;amp;amp;amp;lt;br&amp;amp;amp;amp;amp;amp;amp;gt;&amp;amp;amp;amp;amp;amp;amp;lt;br&amp;amp;amp;amp;amp;amp;amp;gt;You &amp;amp;amp;amp;amp;amp;amp;lt;br&amp;amp;amp;amp;amp;amp;amp;gt;&amp;amp;amp;amp;lt;/p&amp;amp;amp;amp;gt;&lt;/p&gt;

Feel free to grab the forked source code here.
https://github.com/ashcairo/ShiftItPlus

How to fail at promoting your Android App

2011-12-29T16:41:00.002Z

I'm not a markerteer, I'm a developer. I like creating things then showing them off for better or worse reactions (usually worse). For my 9-5, we've been given the opportunity to work on and release side projects to the Android market. After releasing an app on there, I wanted to try to figure out how to go about getting it downloaded by people.

The market I was going for was going to be a challenge, the app enables people to create lip sync videos, this obviously narrows down your userbase from predominantly content consumers to content creators. Nevertheless, I googled how to promote your app and really, it seemed there wasn't much resources out there, other than a stackoverflow post from 2008 (perhaps I'm suffering from a search bubble?). So here are the aproaches I tried and their results.

DISCLAIMER: I am not a markerteer, I just did this as a fun learning exercise.

Attempt 1: Social Networks
So step one for me was to talk to my friends and tell them how awesome my app was and how they needed to download it right now. I posted it on my Facebook wall and Tweeted about it. (I didn't go hyperbolic about it, just one single quirky post.)

Results: This generated around 50 downloads and a bunch (~10) of good reviews.
Cost: £0.
Conclusion: Good for good reviews, perhaps I could of spammed my friends more.

Attempt 2: Blogs
There are a lot of Android blogs out there, so googled Android blogs, and e-mailed the reviewers asking them to review the app. I recieved some generic replies asking me for money for their premium review service, which I ignored. But, perhaps I'll try this out in future.

Results: 0 downloads.
Cost: £0.
Conclusions: I should investigate a premium review.

Attempt 3: Ad Networks
Facebook
Facebook is great for targeting the users you want to see your advert, you can select your age demographic, gender and interests. You can't select multiple interests, it either someone who loves music OR someone who loves Android, not both. Felt like a bad idea. I initially targetted Android users, but no one wanted to click my advert. I expanded to music, but still hardly anyone wanted to click my advert.

The advert took around a day to verify, and there was no minimum pre-payment, you're charged after.

Results: 47 clicks. ~0 downloads
Cost: £4.71.
Conclusions: Perhaps people are just too educated to the advert placements that they just filter them out, that's what I do. Or most likely my advert creating skills are poor.

Adwords
Let's you specify lots of keywords for your campaign, which, is ok. Can't target users like Facebook, but the main problem here was that keywords simply cost too much. A targeted keyword ranged between £1.50 to £2.50. This was too much for my beliefs, so I set it to £0.50. Of course, no one clicked on the targeted keywords. But the budgeted money magically disappeared at the end of the week from their 'Display Network' which charged £0.07 per click.

The advert took around a few days to verify, and the minimum pre-payment is £10.00.

Results: 142 clicks. ~0 downloads.
Cost: £10.00
Conclusions: Not convinced this is the right way to go.

Admob
Google's other advertising platform is more interesting. You can target the phone and OS, not so much the interests or user age like Facebook, but you can really pick out a phone that you know works with your app. Since you can get a few disheartening 1/5 stars from one of the hundreds of customized Android devices that you never managed to test your application on and discover that it doesn't function correctly on that device.

Also note when specifying the region, it's probably best to decouple your adverts into individual regions to keep the minimum cost per click low. As if you select UK on it's own, its $0.05 per click, if you select USA on it's own, it's $0.15 per click, if you select them both it jumps to $0.25, if you add in Japan it'll jump to $0.76.

The advert took a week to verify and the minimum pre-payment is $50.00.

Results: So far after a day of heavily targetted advertising (region+device) we've had 310 impressions and 0 clicks.
Cost:$0.00 ($50.00 pre-payment)
Conclusions: I like how you can pick which OS and phone you want to target. Probably can get more with different regions targetted.

AppBrain
This service allows you to pay per install, which is great to boost your download figures at the least. There's no OS/phone filtering or demographic selection. The recommended cost per install is $0.60, and the minimum is $0.20, I went with $0.20.

Initially the app wasn't on their directory, but I e-mailed them and they added it within a day. The minimum pre-payment is $100

Results: It's only been a day, we've had 1,289 impressed, 22 clicks and only 3 installs. We did get an extra rating during that period; a bad rating.
Cost: $0.60 ($100 pre-payment).
Conclusions: At least it's a gauranteed install your paying for. Although if you're releasing an app which hasn't been tested on every single Android device out there and has a risk of not running on one of them (i.e. uses Camera API/NDK/OpenGL), you may get some negative reviews.

Others?
Open Source
I like open sourcing things, I hear it can also promote your app virally via the developer community. In future I plan on open sourcing the source code to provide an explaination on how the code works. However, as it's a work project, I'll need to go through a couple of check points before getting this done.

Everbadge
Another pay per install service, however it seems to require an SDK for app download verification. The app was already released, and I couldn't add the SDK at this stage.

Conclusion
Of course, real life advertising would require a much bigger budget than I was prepared to sacrifice for my experiment. But, I thought this post may be interesting to small time developers like me. In the end, I am not a markerteer. But, if you have any suggestions, please leave a comment.

Quran Project - Loading 3D Obj Models

2011-12-26T07:12:00.000Z

Reading e-books is like eating marmite. You either love it or hate it. Myself personally, I read lots of articles, but never have the attention span to get through a book. Currently we're working together with the Quran Project charity (http://quranproject.org) in trying to re-create your typical reading experience into something more as an interactive 3d novel. The basic idea being that you get to browse the different chapters of the book, by swiping through different scenery and animations that hopefully entice you to read on more than perhaps you normally would.

Working along with a 3d artist has it's challenges, ranging from getting your naming conventions right to importing the assets created.

The models I'm working with have been exported from Maya as obj files. In the past I'd write my own exporter into my own personal favoured file format. However, I took this opportunity, to go with the flow for compatibility reasons and work on getting obj files imported into the application engine I'm working with.

I found a great ObjLoader tutorial series online here (http://nccastaff.bournemouth.ac.uk/jmacey/RobTheBloke/www), I tested out the provided tutorials with the model exported and found that tutorial3 was everything I needed to get to the obj description.

Integrating the objloader header and cpp file into an iOS project can be done with minimal changes to get it compiling. Those being to comment out win32 specific includes and switch from the OpenGL method of drawing polygons using glBegin and glEnd, into an OpenGL ES compatible vertex array using GL_TRIANGLES.

So the first step would be to take the loaded in vertices and draw them using OpenGL ES's GL_TRIANGLE construct, but of course this would lead to an incomplete scene.

What we need to do is switch from OpenGL's GL_POLYGONS to OpenGL ES' GL_TRIANGLES. To do so we can create a triangles from the first vertex and remaining vertices of the polygon.

As in if we have a 5 sided polygon.
We'll make a triangle from the first three vertices (v1, v2, v3).
Then, the first vertex and the next two (v1, v3, v4).
Then finally, the first vertex and the last two (v1, v4, v5).

You can grab the source code from the Open Source cross platform application framework (https://github.com/OrangeLabsUK/2c) with the file to watch out for being CCModelObj.cpp.

Social Poetry - Open Sourced

2011-10-19T22:30:00.000+01:00

FaceStalker the working title for the SocialPoetry project has gone gold across three platforms. To mark the approval for the iPhone, Android and Windows versions, the source code has been open sourced on GitHub.

All links to download the app and source code for the relevant platforms can be found here: http://softpoetry.com/projects/facestalker/

Social Poetry release candidate

2011-10-02T10:27:00.000+01:00

The social poetry project that was conceptualised a couple of months ago, has finally hit its release candidate milestone. Over the next coming weeks, it will be submitted to the relevant app stores. This app has been written as a showcase for a soon to be released open source cross platform 3d application development framework, so the actual source code for it will also be released very soon.

http://softpoetry.com/projects/facestalker

Rapid Software Architecture Design Tools

2011-07-20T23:57:00.003+01:00

In an ideal world you'd want design the system architecture first, then program in conformance to the architecture design. Back in University I used tools such as Rational Rose for modelling UML class interaction diagrams. This was great to be able to detail in what classes you've decided to use post-design and to get a good mark from my tutor. But, for the actual design process it was slow, unintuitive, boring and a pain to deal with. Pen and paper for rapid prototyping was my best friend in discovering the best architecture to go with.

Now say hello to the world of cutting edge software, where new system constraints are being discovered as these systems are built and interact with each other. You end up constantly re-designing your architecture to fit in with these constrains, which means the actual step of modelling your architecture on a tool such as Rational Rose becomes a fad.

When modelling your architecture becomes a second thought, you lose the ability to effectively communicate to other developers and project managers how a system works and what the cost would be of developing new features to the software. This is bad. There has to be a better way.. What we need is rapid software architecture design tools.

So in this effort to discover such a tool, I've shortlisted the following tools for trialing.

Microsoft Visio (Windows, commercial)
yEd (Windows/OSX/Linux, free)
GraphViz (Windows/OSX/Linux, free)
Dia (Windows/OSX/Linux, free)
Visual Paradigm (Windows/OSX/Linux, commercial)
Enterprise Architect (Windows, commercial)
OmniGraffle (Mac, commercial)

Now remember, the use case of this tool is to re-architect systems more intuitively than using a pen and paper. I will be very harsh in my scoring, as I will to stress, I will be comparing these tools to using a pen and paper.

Microsoft Visio 2003

I'd heard great things on this tool. Firstly it's the recommended tool of choice as my company has a license for it, mind you it's only a licence for the 2003 edition. Now, I really really hope they've improved on it since then because using this tool is like having your eyelids pierced while watching a Justin Bieber music video. It is so UGLY. UGLY to use, UGLY to look at. The lines are rigid, the connection sections stand out too much, a dialog box pops up just to rename a class. Even if I managed to model the most intricate architecture in the world ever with this tool after years of practice, if I showed the results to someone, they'd probably stab their eyeballs out as relief from looking at this monstrosity.

Score: 0/5
Please don't use or recommend this software.

yEd

I'm using the mac version and it looks and feels pretty dated. I don't understand why the class boxes don't resize if you give them a name that doesn't fit the box. Panning is unintuitive. Creating arrows is a mystery, and it seems to like creating classes every time you left click the mouse. Well, at least it's nicer to look at than Visio.

Score: 2/5
Has potential, may come back to using this later.

GraphViz

I've kind of used this tool before when generating a DOXYGEN, well not really. The doxygen tools generated the chart automatically and I did nothing. My gut tells me that this tool will be useless unless you're a command line VIM junkie.. My gut was right. I have no idea how to use this tool to create charts. When you launch it, the an open file dialog box appears. If you have any clue as to how to create charts using this tool. Please let me know.

Score: -1/5
Waste your time with Microsoft Visio.

Dia

It's almost as ugly as Visio. The OSX version feels like a hack, with the shortcut keys being all wrong. When you move a class, the arrows don't follow. The lines can be diagnal, but the classes don't lock inline with other classes so it gets pretty messy, pretty quick.

Score: 1/5
It's free, but other than that I have no iDia why I'd use this tool.

Visual Paradigm & Agilian

Agilian popped up when installing Visual Paradigm, it claimed to be the solution for agile software development, so with the buzz on Scrum going on I picked to install that. Looks like Eclipse, feels like Eclipse, when I tried to draw a class diagram, the UML class toolbox was empty, reappeared later though, but you get the idea that it's buggy. Suffers from the same issue of not resizing a class box when you input a long name. Doesn't provide indicator lines when placing a class down for the first time, so you always have to place a class down, rename it, then replace it again. Gets a bit too excited when placing down associations, as in, you place one down, it places it wrongly, you try to drag it to the right place, but instead it decides to turn into a game of Snake. I give up with this, there has to be something better.

Score: 0/5
I can't believe people actually pay to be tortured.

Enterprise Architect

While the website looks like the kind of thing mothers of the future will be teaching their children to stay away from. With their malware inspired use of stock photos of corporation towers and business executives shaking hands. My workmate said that he loved it, and it did the job really well. On launch it asks you which version you want to use, Professional, Enterprise, Business, blah blah, listing no feature differences.. Whatever, I went with Business and Software Engineering. The interface looks a lot like Microsoft Visual Studio 2010, which is a good thing. The class boxes are shaded, which means that it'll impress project managers who are used to looking at shaded PowerPoint boxes. Well, that's enough of the good. The text is too small, creating links between classes is a pain, you drag one between classes then you have to select the connection type from a drop down, very cumbersome. I quizzed my workmate on this and he admitted that he had only used it once.. a long time ago.. to impress his boss.

Score: 1/5
Packed with so much features that you will never use.

OmniGraffle
Macintosh fan boys love this tool. I'm on a MacBook Pro, so why not me? Oh my god, there's a cloud chart. Seriously! Look..

Not really useful for the class connections, but it is pretty fun to use. Ok, what about for a proper class diagram? Well, there's no class diagram option in the menu, but surprisingly enough you can import a xCode project. The parser only works on Objective C classes which is pretty limited and modifying the class contents is challenging. Overall, it's really more of a drawing tool than for classes which is a real shame.

Score: 2/5
Shame it's not built for software architecture diagrams.

Conclusion
I give up. Pen and paper is the way to go for rapid design. For software architecture modelling (after you've got a good sense of the design), I think I'll go back to yEd and give that another spin.

If you have any suggestions for good software design tools, please let me know. I'm desperate..

From lib_json to Jansson

2011-07-11T03:08:00.005+01:00

I love homogeneity when it comes to developing software. Sure, heterogeneity is required when dealing with undefined cutting edge high performance systems. But for application development, where software elegance and maintainability are key. You really don't want to tie yourself down to platform specific libraries especially in the current "App" world where you want to hit as many platforms as possible. This is why I recently switched to Jansson for my JSON parsing needs.

Jansson is a C JSON library which doesn't depend on other libraries, so if like me you need something to run on Android's NDK which doesn't support STL, you want to be using this.
http://www.digip.org/jansson/

Since I find sample code to be the easiest way of picking up a new library..

Here is example code showing you how to parse your friends list from Facebook's graph api using lib_json.

 #include "json.h"  
   
 ...  
   
 std::string jsonResponse( reply->data.buffer );  
 Json::Value root;  
 Json::Reader reader;  
 const BOOL parsingSuccessful = reader.parse( jsonResponse, root );  
 ASSERT( parsingSuccessful );  
 if( parsingSuccessful )  
 {  
   const Json::Value jsonData = root["data"];  
   const uint length = jsonData.size();  
     
   for( uint i=0; i<length; ++i )  
   {  
     Json::Value text = jsonData[i];  
       
     std::string jsonStringName = text["name"].asString();  
     std::string jsonStringID = text["id"].asString();  
       
     // We can now do something with our Name and ID  
   }  
 }

Here is example code showing you how to parse your friends list from Facebook's graph api Jansson.

 #include "jansson.h"  
   
 ...  
   
 json_error_t error;  
 json_t *root = json_loads( reply->data.buffer, 0, &error );  
 if( root )  
 {  
   json_t *jsonData = json_object_get( root, "data" );  
   if( json_is_array( jsonData ) )  
   {  
     const uint length = json_array_size( jsonData );  
     for( uint i=0; i<length; ++i ) // Iterates over the sequence elements.  
     {  
       json_t *jsonObject = json_array_get( jsonData, i );  
         
       json_t *jsonID = json_object_get( jsonObject, "id" );  
       const char *jsonStringID = json_string_value( jsonID );  
         
       json_t *jsonName = json_object_get( jsonObject, "name" );  
       const char *jsonStringName = json_string_value( jsonName );  
         
       // We can now do something with our Name and ID  
     }  
   }  
   json_decref( root ); 
 }

Piece of cake :)

Social Poetry - First Prototype

2011-07-02T03:38:00.006+01:00

I spend a lot of my life on Facebook, it's great what they've done with social networking. But, I've always found quirks in the user experience. I've been lately imagining a world where I could easily run through my friends lists, see the status updates and photo galleries in a minority report inspired way. It really irks me that such beautiful beautiful user generated data is only really being exploited by stupid social games like Farmville.. Grr.
I hate Farmville.

So last weekend I set myself the challenge of seeing what I could do with the Facebook APIs, and the following video presents the outcome.

I'm pretty busy this weekend, but I plan on getting at the very least a photo gallery viewer for all my friends.

Currently I'm targeting Qt for the prototype as I'm initially tailoring it as a Desktop Windows/Mac prototype. However as the codebase is based off OpenGL, I have got it running on iPhone and Android.

If you're interested in this project, let me know and I'll be happy to give you an early release.

Freedom Square

2011-07-01T01:14:00.004+01:00

This 4th of July the Americans won't be the only ones out in the streets with something to celebrate about..

Download Here

The game that should not have been made will be available for one day and one day only.

AppStore Rejections Are Sometimes A Good Thing

2011-05-28T13:17:00.007+01:00

Tahrir Square II: He's Back!

2011-05-24T07:04:00.001+01:00

Well it's finally done! After spending the last three weekends stoned out on the concept. I can finally play as a cybernetic Egyptian dictator.

Watch the trailer and give me your feedback on whether I should release this or not.

Best Hijabs Online

2011-05-22T02:11:00.004+01:00

http://mh-couture.com
Well my friend runs a Hijab fashion website called MH Couture. For some reason Facebook decided to ban all links to her site.

So being an awesome software engineer, I figured I'd try to circumvent their ban.

First, I first tried using a URL shortner (goo.gl, tinyurl), but that didn't work.

I then tried to upload a webpage redirect using PHP by changing the header, but that didn't work.

 <?php
   header( "Location: http://mh-couture.com" );
?>

Finally, I used a javascript redirect, and that worked.

<script type="text/javascript">
<!--
window.location = "http://mh-couture.com"
//-->
</script>

kthanksbye

Music Gym

2011-05-17T23:46:00.009+01:00

When I work out at the gym, I need my music to motivate me.

The first issue I have with the iPhone for gym music, is that whenever I want to change tracks, due to the touch screen, I'm forced to always pull the phone out of my pocket and touch the screen.

The second issue is that, whenever I switch tracks, they always start from the beginning so to keep my psyche up, I need to manually fast forward into the chorus.

To solve these issues, I put together..

MUSIC GYM!

(prepare to notice the awesome 3D interface)

When you go to the next track, it jumps straight into the chorus.
When you tap the power button to put the phone to sleep, it allows you to skip tracks by double tapping the volume buttons.

I use it at the gym now, and everyone thinks I'm on steroids because I've put on so much mass!

and that I'm on steroids. (not really).

Enjoy.
http://itunes.apple.com/us/app/music-gym/id435903595

Bonus Rage Comic

Mosque Finder for Females

2011-04-22T00:24:00.004+01:00

Generally over here in the UK, mosques tend to cater for male practioners of the Islam faith. Last year Faith Matters took a look at the top 100 mosques in England that meet 5 core criteria that Muslim women wanted to see within mosques in the country.

With the help of Faith Matters, I am happy to announce that the first iOS Mosque Finder app for Females is now available on the Apple App Store, completely free for a limited period.

Get it here
http://itunes.apple.com/app/women-in-islam-mosque-finder/id431515052

Egyptian Stock Market - Before and After Mubarak

2011-03-27T06:59:00.010+01:00

There's been a lot of panic lately about the Egyptian stock market. When it last opened it's value dropped by 10% as we can see in the chart below.

However, if we look back a few years, you'll notice that latest drop in value is insignificant in comparison to it's overall devaluation under Mubarak's rule.

SoftPoetry - Mission Statement

2011-03-26T04:38:00.005Z

SoftPoetry.com is open.

Our mission statement is simple.
We write software. We write games. We write poetry.

lipo Makes You Fat

2010-09-28T11:26:00.003+01:00

Ever had to link in an external library for your iPhone project?
Did you receive a big headache having to switch between the simulator version and the iphone version of the library?

Yes?

Well, this is for you, run the lipo command, and it'll magically embed both versions into one FAT library.

And fear not, the linker will only link in the required version.

Example usage of lipo with "libSkinny"..

 lipo -output build/libFatty.a -create build/Release-iphoneos/libSkinny.a build/Release-iphonesimulator/libSkinny.a

So it's official.. Lipo makes you fat. Well in the geek world anyway.
http://en.wikipedia.org/wiki/Lipo

HTML5 Canvas iPhone Level Editor

2010-09-01T11:36:00.004+01:00

So I've been working on and off on a Syndicate style birds eye view shooter, just as an excuse to mess around with AI again.

When going on to creating the actual game map, usually I'd hard-coding everything (I see things easier in code). However, this time since I had an actual artist (non-programmer artist) create the base ground texture. Placing buildings to conform to an artists texture would be a pain, especially because maths and uniformity doesn't mesh with art. So yesterday I decided to quickly mock up a level editor using everyone's favourite new buzz word 'HTML5'.

All it does is simply draw the ground texture on a webpage using the canvas tag, then allows you to draw rectangles over the image. These rectangles are then exported out as an xml file. The xml file is then read by the game, and buildings are placed in position and to proportion of the rectangles created.

It's simple, it works, and since the level editor is web based, it should be relatively easy to release it alongside the game (if it ever gets done) for gamers to produce and play maps of their own.. I'll keep you updated.

1:  <xml> 
2:   <building x="0.5006934812760055" y="0.49791955617198336" w="0.13592233009708737" h="0.130374479889043"> 
3:   </building> 
4:   <building x="0.2725381414701803" y="0.326629680998613" w="0.07350901525658807" h="0.0651872399445215"> 
5:   </building> 
6:   <building x="0.32177531206657417" y="0.573509015256588" w="0.07489597780859916" h="0.07628294036061026"> 
7:   </building> 
8:   <building x="0.6276005547850207" y="0.651872399445215" w="0.17614424410540916" h="0.022191400832177532"> 
9:   </building> 
10:   <building x="0.651872399445215" y="0.4098474341192788" w="0.027739251040221916" h="0.14008321775312066"> 
11:   </building> 
12:   <building x="0.7371705963938974" y="0.30374479889042993" w="0.04022191400832178" h="0.05547850208044383"> 
13:   </building> 
14:   <building x="0.6900138696255201" y="0.04299583911234397" w="0.3536754507628294" h="0.030513176144244106"> 
15:   </building> 
16:   <building x="0.3765603328710125" y="0.9251040221914009" w="0.05409153952843273" h="0.05547850208044383"> 
17:   </building> 
18:   <building x="0.46393897364771153" y="0.9299583911234397" w="0.04299583911234397" h="0.03467406380027739"> 
19:   </building> 
20:   <building x="0.17614424410540913" y="0.9112343966712898" w="0.04160887656033287" h="0.08599167822468794"> 
21:   </building> 
22:   <building x="0.06726768377253814" y="0.782246879334258" w="0.04854368932038835" h="0.033287101248266296"> 
23:   </building> 
24:   <building x="0.07420249653259361" y="0.8550624133148405" w="0.05409153952843273" h="0.0319001386962552"> 
25:   </building> 
26:   <building x="0.06796116504854369" y="0.934119278779473" w="0.052704576976421634" h="0.04854368932038835"> 
27:   </building> 
28:   <building x="0.07004160887656033" y="0.6761442441054092" w="0.04854368932038835" h="0.05409153952843273"> 
29:   </building> 
30:   <building x="0.07420249653259361" y="0.5235783633841886" w="0.04854368932038835" h="0.04854368932038835"> 
31:   </building> 
32:   <building x="0.12135922330097088" y="0.42718446601941745" w="0.04576976421636616" h="0.033287101248266296"> 
33:   </building> 
34:   <building x="0.13106796116504854" y="0.07420249653259361" w="0.13730929264909847" h="0.05409153952843273"> 
35:   </building> 
36:   <building x="0.9361997226074896" y="0.7281553398058253" w="0.05547850208044383" h="0.1636615811373093"> 
37:   </building> 
38:  </xml>

1:  void Scene03Game::loadBuildings(const char *filename) 
2:  { 
3:       const float height = 10.0f; 
4:        
5:       // Parse xml config file 
6:       XMLDocument *xml = new XMLDocument(); 
7:       if( xml->load( filename ) ) 
8:       { 
9:            // Get root node 
10:            XMLNode *xmlRoot = xml->getRoot(); 
11:            if( xmlRoot != NULL ) 
12:            {      
13:                 // Parse xml data 
14:                 xmlRoot = xmlRoot->getRoot(); 
15:                 while( xmlRoot != NULL ) 
16:                 { 
17:                      if( xmlRoot->tagIs( "building" ) ) 
18:                      { 
19:                           XMLNode *xmlBuilding = xmlRoot; 
20:                           { 
21:                                float x = xmlBuilding->attributeFloat( "x", 0.0f ); 
22:                                float z = xmlBuilding->attributeFloat( "y", 0.0f ); 
23:                                float width = xmlBuilding->attributeFloat( "w", 0.0f ); 
24:                                float depth = xmlBuilding->attributeFloat( "h", 0.0f ); 
25:                                 
26:                                x *= ground->collisionBounds.x * 2.0f; 
27:                                x -= ground->collisionBounds.x; 
28:                                 
29:                                z *= ground->collisionBounds.z * 2.0f; 
30:                                z -= ground->collisionBounds.z; 
31:                                 
32:                                const float hWidth = width * ground->collisionBounds.x; 
33:                                const float hDepth = depth * ground->collisionBounds.z; 
34:                                 
35:                                const float additionalHeight = (float)( rand() % 10 ); 
36:                                const int texture = rand() % 7; 
37:                                 
38:                                ObjectBuilding *building = new ObjectBuilding( hWidth, hDepth, ( height + additionalHeight ) * 0.5f, texture_building1+texture ); 
39:                                building->setPositionXZ( x, z ); 
40:                                building->setScene( this ); 
41:                                gEngine->collideables->nodeNetwork->addCollideable( building ); 
42:                           } 
43:                      } 
44:                      xmlRoot = xmlRoot->next(); 
45:                 } 
46:            } 
47:       } 
48:       delete xml; 
49:  }

Note, if anyone else out there thinks they might have use for a web based editor, let me know and I can try extending it to suit more than my needs.

iGrapher 3D released

2010-06-16T04:55:00.007+01:00

Our first native iPad port of iGrapher has now been released on the App Store.

http://itunes.apple.com/app/igrapher-3d/id374218741

Expect lots of more features coming in the next versions.

iGrapher 3D submitted

2010-05-24T02:51:00.003+01:00

After a week of dev, the first release of iGrapher 3D has just been submitted.

It's been developed to work on the iPad and iPhone 3GS. It does run on the older iPhones, but not smooth enough for my liking.

The first release will feature panning, rotating, zooming, raining (yes there's rain), and price scanning through the ftse 100 and dow jones indices in glorious 3D.

iGrapher 3D

2010-05-18T00:47:00.004+01:00

Here's a small peak at iGrapher ported for the iPad.

How to play YouTube videos in your iPhone app

2010-03-15T01:25:00.002Z

So I was trying to launch a YouTube video from my game, without the game switching to the YouTube app. To do this, I ran into a few issues.

Here I'll describe how to set up the playing of a YouTube video and how to tackle the issues you will encounter.

So first you must create a UIWebView and add it to your main view.
In the following I create a webview pointing to http://technolojia.com/NahBruv/trailer.htm where I have embedding the YouTube clip I want to play, I set it hidden because I'll later want to launch the video full screen.

      htmlView = [[UIWebView alloc] initWithFrame:CGRectMake( 55.0f, 105.0f, 369.0f, 178.0f) ];  
[htmlView setBackgroundColor:[UIColor blackColor]];  
htmlView.hidden = YES;  
htmlView.delegate = self;  
[self addSubview:htmlView];  
[htmlView loadRequest:[NSURLRequest requestWithURL:[NSURL URLWithString:@"http://technolojia.com/NahBruv/trailer.htm"]]];

So now in the background the webview starts seeking the website http://technolojia.com/NahBruv/trailer.htm

 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">  
<html>  
<head>  
<title>Trailer Page</title>  
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />  
</head>  
<object width="369" height="178">  
<param name="movie" value="http://www.youtube.com/v/Aq4wI89cUa4&autoplay=1&fmt=18">  
</param><param name="allowFullScreen" value="true">  
</param><param name="allowscriptaccess" value="always"><param name="wmode" value="transparent" />  
</param>  
<embed src="http://www.youtube.com/v/Aq4wI89cUa4&autoplay=1&fmt=18" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="369" height="178">  
</embed>  
</object>  
</html>

Once it's loaded it'll call the delegate function which you music implement in your class. Notice I set htmlView.delgate = self. I do this because I want to launch the video once the page is loaded, because by default YouTube video's need to have the play button clicked before they launch in the MPMoviePlayerController object.

So here I scan through all the buttons in the webview and select the first button found using the sendActionsForControlEvents function.

 UIButton* findButtonInView(UIView* view)  
{  
UIButton *button = nil;  
if( [view isMemberOfClass:[UIButton class]] )  
{  
return (UIButton*)view;  
}  

if( view.subviews && [view.subviews count] > 0 )  
{  
for( UIView *subview in view.subviews )  
{  
button = findButtonInView( subview );  
if( button )   
{  
return button;  
}  
}  
}  

return button;  
}  

-(void)webViewDidFinishLoad:(UIWebView*)webView  
{  
UIButton *button = findButtonInView( webView );  
if( button != nil )  
{  
[button sendActionsForControlEvents:UIControlEventTouchUpInside];  
}  
}

Great so far huh? But on return if you're using OpenAL, the sound no longer works. Eek. So what you have to do is, before launching the video you must make sure you call AudioSessionSetActive( NO ) and then AudioSessionSetActive( YES ) once the video has finished. I also found I had to destroy and recreate my OpenAL context and samples loaded, but I haven't looked too much into it, so if you find a way to reuse your OpenAL context and device, let me know.

 if( stoppingAudio )  
{  
[audioManager destroy];  
AudioSessionSetActive( NO );  
}  
else if( restartingAudio )  
{  
AudioSessionSetActive( YES );  
[audioManager load:YES];  
}

That's it, you now can launch a YouTube video fullscreen in your app, without losing audio or having the YouTube application take over. Enjoy.

Stock Market Hero submitted

2010-02-16T05:57:00.002Z

Just managed to submit make my first submission to the app store. Getting a distribution profile was a pain.. I'll post more details after I've got some sleep..

Graph Normalization

2010-02-09T19:51:00.005Z

Just implemented a new feature called Graph Normalization as suggested by Jeff from Forex Fundamental Analysis. The problem previously was when you chart stocks with extreme differences in price levels, it's impossible to visualize the graph shapes together.

But now with the Graph Normalization feature, you can normalize the graphs to see the pattern by clicking on the graph you wish to normalize the rest by..

Then selecting Normalize Graph..

Now all the graphs will be normalized to the chosen scale..

You can denormalize the charts using the same option.

If anyone has any requests/suggestions, feel free to drop me a line.

Font pages

2010-02-09T08:21:00.002Z

I recently switched from rendering texture strings to font pages. The difference between the two is for texture strings you'd render the string into a bitmap and assign the image to an openGL handle. For a font page, you'd create all the characters of the font required and then when rendering a string, you'd fetch the characters required individually from the created page to render one by one.

The reason for switching was to display a more dynamic text such as an OSD counter. With the old system I'd have to have to constantly create and release different images representing the numbers required, which would be impractical.

So here's how rendering text using a font page works.

First we initialize our class, where we create a bitmap with all the characters from the font required, and paste them one by one onto the page, incrementing the width and height as we paste along..

 -(id)init  
{  
if( self = [super init] )  
{  
// Initialise our texture page  
UIFont *font = [UIFont fontWithName:@"Trebuchet MS" size:32];  
width = 512;  
height = 256;  
widthAspect = ( width * gView->actualScreenSizeMultiple.width );  
heightAspect = ( height * gView->actualScreenSizeMultiple.height );  
const CGSize textureSizeMultiple = CGSizeMake( 1.0f / width, 1.0f / height );

CGColorSpaceRef colorSpace = CGColorSpaceCreateDeviceGray();  
void *data = calloc( height, width );  
CGContextRef context = CGBitmapContextCreate( data, width, height, 8, width, colorSpace, kCGImageAlphaNone );  
CGColorSpaceRelease( colorSpace );  
CGContextSetGrayFillColor( context, 1.0f, 1.0f );  
UIGraphicsPushContext( context );  

// Create our characters  
float x = 0.0f, y = 0.0f;  
float maxY = 0.0f;  
for( uint i=0; i<128; ++i )  
{  
NSString *string = [[NSString alloc] initWithString:@"£"];  
letters[i].stringSize = [string sizeWithFont:font];  
float endX = x + letters[i].stringSize.width + 1.0f;  
if( endX > 512.0f )  
{  
x = 0.0f;  
y += maxY + 1.0f;  
maxY = letters[i].stringSize.height;  
endX = letters[i].stringSize.width + 1.0f;  
}  

// Check if we've reached the end of the page
if( letters[i].stringSize.height > maxY )  
{  
maxY = letters[i].stringSize.height;  
}  

letters[i].start.x = x;  
letters[i].start.y = y;  
[string drawInRect:CGRectMake( x, y, letters[i].stringSize.width, letters[i].stringSize.height) withFont:font lineBreakMode:UILineBreakModeWordWrap alignment:UITextAlignmentLeft ];  
x = endX;  
// Normalize  
letters[i].stringSize.width *= textureSizeMultiple.width;  
letters[i].stringSize.height *= textureSizeMultiple.height;  
letters[i].start.x *= textureSizeMultiple.width;  
letters[i].start.y = 1.0f - ( letters[i].start.y * textureSizeMultiple.height );  
letters[i].end.x = letters[i].start.x + letters[i].stringSize.width;  
letters[i].end.y = letters[i].start.y - letters[i].stringSize.height;  
[string release];  
}  
assert( maxY + y < height ); 

// Finish our texture page  
UIGraphicsPopContext();  
glGenTextures( 1, &name );  
BindTexture( name );  
glTexParameteri( GL_TEXTURE_2D, GL_TEXTURE_MIN_FILTER, GL_LINEAR );  
glTexImage2D( GL_TEXTURE_2D, 0, GL_ALPHA, width, height, 0, GL_ALPHA, GL_UNSIGNED_BYTE, data );  
CGContextRelease( context );  
free( data );  
BindTexture( 0 );  
}  
return self;  
}

Now to render any given string, we just look up the letters one by one and render each one with their stored sizes..

 -(void)renderText:(const char*)string length:(const uint)length x:(const float)x y:(const float)y centered:(const BOOL)centered size:(const float)size  
{    
BindTexture( name );  

// Find out our width so we can center the text  
float totalWidth = 0.0f, maxHeight = 0.0f;  
float widths[length], heights[length];  
for( uint i=0; i<length; ++i )  
{  
const Letters *letter = [self getLetter:string[i]];  
if( letter != nil )  
{  
widths[i] = widthAspect * letter->stringSize.width * size;  
totalWidth += widths[i];  
heights[i] = heightAspect * letter->stringSize.height * size;  
maxHeight = MAX( maxHeight, heights[i] );  
}  
}  

CGPoint start = CGPointMake( x, y );  
if( centered )  
{  
start.x -= totalWidth * 0.5f;  
start.y -= maxHeight * 0.5f;  
}  

CGPoint currentStart = start;  
for( uint i=0; i<length; ++i )  
{  
const Letters *letter = [self getLetter:string[i]];  
if( letter != nil )  
{  
// Calculate end point  
CGPoint orientatedStart = currentStart;  
CGPoint end;  
end.x = orientatedStart.x + widths[i];  
end.y = orientatedStart.y + heights[i];  

const GLfloat texCoords[] =   
{  
letter->start.x, letter->start.y,  
letter->end.x, letter->start.y,  
letter->start.x, letter->end.y,  
letter->end.x, letter->end.y  
};  
glTexCoordPointer( 2, GL_FLOAT, 0, texCoords );  
RenderSquare( orientatedStart, end );  
currentStart.x += widths[i];  
}  
}  

BindTexture( 0 );  
DefaultTexCoords();  
}

Any issues, let me know.

3D Level Generation

2010-02-05T22:08:00.002Z

So, I've been experimenting with generating levels based off actual stock market history data.

Here's a little preview of the result..

iGrapher 3D Level Generation

2010-02-05T22:06:00.006Z

So I've been working on a 3D engine for the iPhone and decided to quickly throw together a level generated from non-other than stock market history.

Check it out..

I didn't get dumped..

2010-01-20T03:46:00.001Z

Just managed to re-use my male character model to create a female. It's still work in progress, but it was enough to inspired me to put together this quick concept cover art.

Octrees - Code and walkthrough

2010-01-18T09:22:00.001Z

Octrees are a data structure to represent spartially dividing up a scene. The way they work is to divide up a scene into eight leafs, with each leaf further dividing up if they contained more objects than the set threashold.

You could then use this divided up scene for optimisations. Such as to only process rendering for the objects in the visible octrees, or to only process collisions for the objects in the same octree as the current object.

Here's a video of the octrees in action, notice how when a leaf becomes dense, it breaks down into a further eight leafs.

So let's start.

First we create our octree structure. With each octree will containing a pointer to it's parent tree, it's eight leafs, a set of objects and it's world position.

 enum OctreeLeafs  
{  
leaf_bottom_front_left,  
leaf_bottom_front_right,  
leaf_bottom_back_left,  
leaf_bottom_back_right,  

leaf_top_front_left,  
leaf_top_front_right,  
leaf_top_back_left,  
leaf_top_back_right,  
};  

struct Octree  
{  
Octree *parent;  
Octree **leafs;  
ObjectCollideable *objects[MAX_TREE_OBJECTS];  
uint numberOfObjects;  

float hSize;  
Vector3 min, max;  
};

We can then create the octree with.

 void OctreeNew(Octree **tree, Octree *parent, const Vector3 position, const float size)  
{  
*tree = malloc( sizeof( Octree ) );  
(*tree)->parent = parent;  
(*tree)->leafs = nil;  
(*tree)->numberOfObjects = 0;  

(*tree)->hSize = size * 0.5f;  
(*tree)->min = position;  
(*tree)->max = position;  
Vector3AddFloat( &(*tree)->min, -(*tree)->hSize );  
Vector3AddFloat( &(*tree)->max, (*tree)->hSize );  
}

Now we'd need to handle adding an object to the tree, this is done by use of recursive function calls, that drill down into the leaf nodes to add the object to all the leafs it resides in. Once it's found a leaf if we have space for the object we add it into it's object list, if we don't have space we'll need to split the tree down to a further eight leafs and re-attempt adding the object.

 void OctreeAddObject(Octree *tree, ObjectCollideable *collideable)  
{   
// Ensure the object is within the octree's limits  
if( tree->parent == nil )  
{  
UpdateCollisions( collideable );  
Vector3 *objectMin = &collideable->min;  
Vector3 *objectMax = &collideable->max;  
if( objectMax->x < tree->min.x ||   
objectMax->y < tree->min.y ||   
objectMax->z < tree->min.z ||   
objectMin->x > tree->max.x ||   
objectMin->y > tree->max.y ||   
objectMin->z > tree->max.z )  
{  
return;  
}  
}  

// Insert in an approperate leaf node  
if( tree->leafs != nil )  
{  
UpdateCollisions( collideable );  

for( uint i=0; i<8; ++i )  
{  
Octree *leaf = tree->leafs[i];  
if( OctreeIsInLeaf( leaf, &collideable->min, &collideable->max ) )  
{  
OctreeAddObject( leaf, collideable );  
}  
}  
}  

// Unless we don't have any  
else if( tree->numberOfObjects < MAX_TREE_OBJECTS )  
{  
tree->objects[tree->numberOfObjects++] = collideable;  
assert( collideable->numberOfOctrees < MAX_OBJECT_TREES );  
collideable->octrees[collideable->numberOfOctrees++] = tree;  
}  

// If we have too many objects split the octree  
else  
{  
OctreeSplit( tree );  

// Try again  
OctreeAddObject( tree, collideable );  
}  
}

To check if the object resides in a leaf's space we simply use our min max vectors which we're set in OctreeNew.

 BOOL OctreeIsInLeaf(Octree *leaf, Vector3 *targetMin, Vector3 *targetMax)  
{  
Vector3 *sourceMin = &leaf->min;  
Vector3 *sourceMax = &leaf->max;  

if( sourceMax->y > targetMin->y && sourceMin->y < targetMax->y )  
{  
if( sourceMax->x > targetMin->x && sourceMin->x < targetMax->x )  
{  
if( sourceMax->z > targetMin->z && sourceMin->z < targetMax->z )  
{  
return YES;  
}  
}  
}  

return NO;  
}

Now comes the fun part, splitting our octree into a further eight octrees.
To do so, we first create the eight leaf nodes from our parent's min max vectors and hSize variables.

 void OctreeSplitTopLeafs(Octree *tree, const uint index, Vector3 position)  
{  
position.y += tree->hSize;  
Octree **leaf = &( tree->leafs[index+4] );  
OctreeNew( leaf, tree, position, tree->hSize );  
}  


void OctreeSplit(Octree *tree)  
{  
assert( tree->leafs == nil );  
tree->leafs = malloc( sizeof( Octree ) * 8 );  

// Create our leaf nodes  
uint index = leaf_bottom_front_left;  
Vector3 position = tree->min;  
Vector3AddFloat( &position, tree->hSize * 0.5f );  
Octree **leaf = &( tree->leafs[index] );  
OctreeNew( leaf, tree, position, tree->hSize );  
OctreeSplitTopLeafs( tree, index, position );  

index = leaf_bottom_front_right;  
position.x += tree->hSize;  
leaf = &( tree->leafs[index] );  
OctreeNew( leaf, tree, position, tree->hSize );  
OctreeSplitTopLeafs( tree, index, position );  

index = leaf_bottom_back_right;  
position.z += tree->hSize;  
leaf = &( tree->leafs[index] );  
OctreeNew( leaf, tree, position, tree->hSize );  
OctreeSplitTopLeafs( tree, index, position );  

index = leaf_bottom_back_left;  
position.x -= tree->hSize;  
leaf = &( tree->leafs[index] );  
OctreeNew( leaf, tree, position, tree->hSize );  
OctreeSplitTopLeafs( tree, index, position );  
...

We then parse through the current leaf's objects, remove them from the object list and re-add them into the appropriate new leafs we've just created.

     // Now we need to sort our objects into our new leafs  
while( tree->numberOfObjects > 0 )  
{  
ObjectCollideable *collideable = tree->objects[0];  
removeFromList( collideable, (void**)tree->objects, &tree->numberOfObjects );  
removeFromList( tree, (void**)collideable->octrees, &collideable->numberOfOctrees );  

UpdateCollisions( collideable );  

for( uint i=0; i<8; ++i )  
{  
Octree *leaf = tree->leafs[i];  
if( OctreeIsInLeaf( leaf, &collideable->min, &collideable->max ) )  
{  
// Place this object in this leaf  
leaf->objects[leaf->numberOfObjects++] = collideable;  
assert( leaf->numberOfObjects <= MAX_TREE_OBJECTS );  
collideable->octrees[collideable->numberOfOctrees++] = leaf;  
assert( collideable->numberOfOctrees < MAX_OBJECT_TREES );  
}  
}  
}  
}

Now for removing an object from the tree, we simply check through all the leafs the object resides in and one by one remove the object from the trees list. We then set a call to prune the tree, so that if the leafs are no longer needed they'll be deleted.

 void OctreeRemoveObject(ObjectCollideable *collideable)  
{  
while( collideable->numberOfOctrees > 0 )  
{      
Octree *tree = collideable->octrees[0];  
removeFromList( collideable, (void**)tree->objects, &tree->numberOfObjects );  
removeFromList( tree, (void**)collideable->octrees, &collideable->numberOfOctrees );  

if( tree->numberOfObjects == 0 )  
{  
if( gEngine->collideables->pruneTrees <= 0.0f )  
{  
gEngine->collideables->pruneTrees = 1.0f;  
}  
}  
}  
}

Above I set a timer to 1.0f which would count down elsewhere to call the prune tree function. With the prune tree function recursively calling itself on all it's leafs, and if the set of leafs have no objects in them they get deleted.

 void OctreePruneTree(Octree *tree)  
{  
if( tree->leafs != nil )  
{  
BOOL hasObjects = OctreeHasObjects( tree );  
if( hasObjects == NO )  
{  
OctreeDeleteLeafs( tree );  
}  
else  
{  
for( uint i=0; i<8; ++i )  
{  
OctreePruneTree( tree->leafs[i] );  
}  
}  
}  
}  


BOOL OctreeHasObjects(Octree *tree)  
{  
BOOL hasObjects = tree->numberOfObjects > 0;  

if( tree->leafs != nil )  
{  
for( uint i=0; i<8 && hasObjects == NO; ++i )  
{  
hasObjects |= OctreeHasObjects( tree->leafs[i] );  
}  
}  

return hasObjects;  
}

Again delete leafs works by recursively calling itself to free all the leafs inside.

 void OctreeDeleteLeafs(Octree *tree)  
{  
// Ensure all our leafs are deleted  
if( tree->leafs != nil )  
{  
for( uint i=0; i<8; ++i )  
{  
if( tree->leafs[i] != nil )  
{  
Octree *leaf = tree->leafs[i];  
OctreeDeleteLeafs( leaf );  
}  
}  

free( tree->leafs );  
tree->leafs = nil;  
}  
}

That's it! Simply add in all your static objects, then whenever you move an object, just re-add it to the root tree, so it can put itself into the appropriate leafs.

Widgets and function pointers

2010-01-08T06:40:00.000Z

I'm currently working through the setting screens, so I needed to make a few widget classes. Basically I have a bunch of widgets which contain their position, size and some functions to determine how input is handled. Now comes the fun bit, re-using the class for different options. I wanted one widget to handle starting a new game, one for toggling collision boxes, etc.

To get this done, I used function pointers. I'd let the scene handle the interactions with the widgets and when one was invoked, it's set callback was fired.

So in the header file, I have two members, the first being the function to call, and second being the parameter to pass into the function.

 @interface WidgetButton : WidgetBase   
 {  
   @public  
    void (*callback_routine)(void *data);  
    void *callback_data;  
 }

When the widget is invoked, it then went ahead and fired it's function pointer.

 -(BOOL)handleControls:(ScreenTouches*)screenTouch  
 {  
   if( [super handleControls:screenTouch] )  
   {  
     if( callback_routine )  
     {  
       callback_routine( callback_data );  
     }  
     return YES;  
   }  
   return NO;  
 }

So in the case of toggling a bool on or off, in the main scene I'd create a widget and pass in the function pointer for toggling bools with the variable active.

 activateWidget = [[WidgetButton alloc] init];  
 ((WidgetButton*)activateWidget)->callback_routine = &toggleBool;  
 ((WidgetButton*)activateWidget)->callback_data = &active;

Finally, the function of toggleBool would simply toggle the bool.

 void toggleBool(void *data)  
 {  
   BOOL *toggle = (BOOL*)data;  
   *toggle = !(*toggle);  
 }

So now we have a classes which encapsulate the drawing and user interaction, but provide differing responses.

iPhone - Unproject a 2D point

2010-01-01T06:14:00.000Z

Alright, just added in support for selecting 3d objects using 2d coordinates. So you can select an object in a 3d scene using your finger. The idea to do this is to unproject the 2d coordinates passed in at 0 and 1 range to get the direction of the ray, then simply use that ray to find which objects collide.

Step one was to find the source for glu unProject function. There's loads of sources online for OpenGL, so all you need to do is port it over to OpenGL ES (just replace GLdouble with GLfloat).

Here's some source code ported from http://code.google.com/p/iphone-glu

 static void __gluMultMatrixVecd(const GLfloat matrix[16], const GLfloat in[4], 
                                GLfloat out[4]) 
{ 
    int i; 
    for( i=0; i<4; ++i ) 
    { 
        out[i] =  
        in[0] * matrix[0*4+i] + 
        in[1] * matrix[1*4+i] + 
        in[2] * matrix[2*4+i] + 
        in[3] * matrix[3*4+i]; 
    } 
} 
/* 
 ** Invert 4x4 matrix. 
 ** Contributed by David Moore (See Mesa bug #6748) 
 */ 
static int __gluInvertMatrixd(const GLfloat m[16], GLfloat invOut[16]) 
{ 
    GLfloat inv[16]; 
    inv[0]    =  m[5]*m[10]*m[15]    - m[5]*m[11]*m[14]    - m[9]*m[6]*m[15] 
             + m[9]*m[7]*m[14]        + m[13]*m[6]*m[11]    - m[13]*m[7]*m[10]; 
    inv[4]    = - m[4]*m[10]*m[15]    + m[4]*m[11]*m[14]    + m[8]*m[6]*m[15] 
             - m[8]*m[7]*m[14]        - m[12]*m[6]*m[11]    + m[12]*m[7]*m[10]; 
    inv[8]    =  m[4]*m[9]*m[15]        - m[4]*m[11]*m[13]    - m[8]*m[5]*m[15] 
             + m[8]*m[7]*m[13]        + m[12]*m[5]*m[11]    - m[12]*m[7]*m[9]; 
    inv[12] = - m[4]*m[9]*m[14]        + m[4]*m[10]*m[13]    + m[8]*m[5]*m[14] 
             - m[8]*m[6]*m[13]        - m[12]*m[5]*m[10]    + m[12]*m[6]*m[9]; 
    inv[1]    = - m[1]*m[10]*m[15]    + m[1]*m[11]*m[14]    + m[9]*m[2]*m[15] 
             - m[9]*m[3]*m[14]        - m[13]*m[2]*m[11]    + m[13]*m[3]*m[10]; 
    inv[5]    =  m[0]*m[10]*m[15]    - m[0]*m[11]*m[14]    - m[8]*m[2]*m[15] 
             + m[8]*m[3]*m[14]        + m[12]*m[2]*m[11]    - m[12]*m[3]*m[10]; 
    inv[9]    = - m[0]*m[9]*m[15]        + m[0]*m[11]*m[13]    + m[8]*m[1]*m[15] 
             - m[8]*m[3]*m[13]        - m[12]*m[1]*m[11]    + m[12]*m[3]*m[9]; 
    inv[13] =  m[0]*m[9]*m[14]        - m[0]*m[10]*m[13]    - m[8]*m[1]*m[14] 
             + m[8]*m[2]*m[13]        + m[12]*m[1]*m[10]    - m[12]*m[2]*m[9]; 
    inv[2]    =  m[1]*m[6]*m[15]        - m[1]*m[7]*m[14]    - m[5]*m[2]*m[15] 
             + m[5]*m[3]*m[14]        + m[13]*m[2]*m[7]    - m[13]*m[3]*m[6]; 
    inv[6]    = - m[0]*m[6]*m[15]        + m[0]*m[7]*m[14]    + m[4]*m[2]*m[15] 
             - m[4]*m[3]*m[14]        - m[12]*m[2]*m[7]    + m[12]*m[3]*m[6]; 
    inv[10] =  m[0]*m[5]*m[15]        - m[0]*m[7]*m[13]    - m[4]*m[1]*m[15] 
             + m[4]*m[3]*m[13]        + m[12]*m[1]*m[7]    - m[12]*m[3]*m[5]; 
    inv[14] = - m[0]*m[5]*m[14]        + m[0]*m[6]*m[13]    + m[4]*m[1]*m[14] 
             - m[4]*m[2]*m[13]        - m[12]*m[1]*m[6]    + m[12]*m[2]*m[5]; 
    inv[3]    = - m[1]*m[6]*m[11]        + m[1]*m[7]*m[10]    + m[5]*m[2]*m[11] 
             - m[5]*m[3]*m[10]        - m[9]*m[2]*m[7]    + m[9]*m[3]*m[6]; 
    inv[7]    =  m[0]*m[6]*m[11]        - m[0]*m[7]*m[10]    - m[4]*m[2]*m[11] 
             + m[4]*m[3]*m[10]        + m[8]*m[2]*m[7]    - m[8]*m[3]*m[6]; 
    inv[11] = - m[0]*m[5]*m[11]        + m[0]*m[7]*m[9]    + m[4]*m[1]*m[11] 
             - m[4]*m[3]*m[9]        - m[8]*m[1]*m[7]    + m[8]*m[3]*m[5]; 
    inv[15] =  m[0]*m[5]*m[10]        - m[0]*m[6]*m[9]    - m[4]*m[1]*m[10] 
             + m[4]*m[2]*m[9]        + m[8]*m[1]*m[6]    - m[8]*m[2]*m[5]; 
    GLfloat det = m[0]*inv[0] + m[1]*inv[4] + m[2]*inv[8] + m[3]*inv[12]; 
    if( det == 0 ) 
    { 
        return GL_FALSE; 
    } 
    det = 1.0 / det; 
    for( int i=0; i<16; ++i ) 
    { 
        invOut[i] = inv[i] * det; 
    } 
    return GL_TRUE; 
} 
static void __gluMultMatricesd(const GLfloat a[16], const GLfloat b[16], 
                              GLfloat r[16]) 
{ 
    int i, j; 
    for( i=0; i<4; ++i )  
    { 
        for( j=0; j<4; ++j )  
        { 
            r[i*4+j] =  
            a[i*4+0]*b[0*4+j] + 
            a[i*4+1]*b[1*4+j] + 
            a[i*4+2]*b[2*4+j] + 
            a[i*4+3]*b[3*4+j]; 
        } 
    } 
} 
BOOL gluUnProject(GLfloat winx, GLfloat winy, GLfloat winz, 
                 const GLfloat modelMatrix[16],  
                 const GLfloat projMatrix[16], 
                 const GLint viewport[4], 
                 GLfloat *objx, GLfloat *objy, GLfloat *objz) 
{ 
    GLfloat finalMatrix[16]; 
    GLfloat in[4]; 
    GLfloat out[4]; 
    __gluMultMatricesd( modelMatrix, projMatrix, finalMatrix ); 
    if( !__gluInvertMatrixd( finalMatrix, finalMatrix ) )  
    { 
        return NO; 
    } 
    in[0] = winx; 
    in[1] = winy; 
    in[2] = winz; 
    in[3] = 1.0; 
    /* Map x and y from window coordinates */ 
    in[0] = ( in[0] - viewport[0] ) / viewport[2]; 
    in[1] = ( in[1] - viewport[1] ) / viewport[3]; 
    /* Map to range -1 to 1 */ 
    in[0] = in[0] * 2 - 1; 
    in[1] = in[1] * 2 - 1; 
    in[2] = in[2] * 2 - 1; 
    __gluMultMatrixVecd(finalMatrix, in, out); 
    if( out[3] == 0.0 ) 
    { 
        return NO; 
    } 
    out[0] /= out[3]; 
    out[1] /= out[3]; 
    out[2] /= out[3]; 
    *objx = out[0]; 
    *objy = out[1]; 
    *objz = out[2]; 
    return YES; 
}

Step two take in a 2d coordinate and feed it into the collision detection system. My collision system scans through all base objects of ObjectCollideable and returns the one which is closest to the start of the ray. The viewport and projection matrices are calculated on OpenGL initialisation with the following calls.

 ObjectCollideable* Projection2DScan(CGPoint point)  
 {  
    GLfloat modelViewMatrix[16];  
    glGetFloatv( GL_MODELVIEW_MATRIX, modelViewMatrix );  
   
    point.y = 1.0f - point.x;  
    point.x *= gView->viewport[2];  
    point.y *= gView->viewport[3];  
   
    Vector3 nearPlane, farPlane;  
    gluUnProject( point.x, point.y, 0.0f, modelViewMatrix, gView->projectionMatrix, gView->viewport, &nearPlane.x, &nearPlane.y, &nearPlane.z );  
    gluUnProject( point.x, point.y, 1.0f, modelViewMatrix, gView->projectionMatrix, gView->viewport, &farPlane.x, &farPlane.y, &farPlane.z );  
   
    // Figure out our ray's direction  
    Vector3 direction = farPlane;  
    Vector3Sub( &direction, &nearPlane );  
    Vector3Normalize( &direction );  
   
    // Cast the ray from our near plane  
    Vector3 farPoint = Vector3MulResult( &direction, 500.0f );  
    Vector3Add( &farPoint, &nearPlane );  
   
    Vector3 hitLocation;  
    ObjectCollideable *hitObject = BasicLineCollisionCheck( &nearPlane, &farPoint, &hitLocation, gEngine->collideables );  
    return hitObject;  
 }

That's it, your collision system can now use that ray to return the closest hit object.

iPhone - Serialize this

2009-12-31T08:59:00.000Z

Just implemented saving and loading. It's really really really simple to do.

The basic concept is the following.

// Grab the default archive

NSUserDefaults *archive = [NSUserDefaults standardUserDefaults];

// Create a magic key for the value you're about to load or save

NSString *key = [[NSString alloc] initWithFormat:@"myData"];

// To save

[archive setFloat:vector->x forKey:vectorKeyX];

// To load

vector->x = [archive floatForKey:vectorKeyX];

// Don't forget to release the key

[key release];

Armed with these tools I went with the approach to save out as much of the game state required to re-launch the game back into same state. To do this I set up the engine to process a number of scenes. Each scene is responsible for a number of objects. When I save out the game data, I go through all the objects and save out what scene they're in, so on launch, I reload all the scenes that were currently loaded, which will then create all the required objects. I then pass through all the objects and load in the required data to get them working the way they were.

I organised my objects to create unique keys depending on their object index and the internal data index I was processing. Enough talk, here's the code.

// Creates the unique key for our object

+(NSString*)getSerializeKey:(uint)index key:(NSString*)key

{

if( key == nil )

{

return [[NSString alloc] initWithFormat:@"Obj%i", index];

}

else

{

return [[NSString alloc] initWithFormat:@"%@Obj%i", key, index];

}

// Creates our key and passes it into the serializeInternals function for saving the internal data

-(void)serialize:(NSUserDefaults*)archive saving:(BOOL)saving key:(NSString*)key index:(uint)index

{

NSString *objectKey = [ObjectBase getSerializeKey:index key:(NSString*)key];

// The internal index will aid the creation of unique keys for our internal data

uint internalIndex = 0;

[self serializeInternals:archive saving:saving key:key index:&internalIndex];

[objectKey release];

}

// Overridden by child classes to save more data

-(void)serializeInternals:(NSUserDefaults*)archive saving:(BOOL)saving key:(NSString*)key index:(uint*)index

{

// Save our object position by default

[self serializeVector:&position archive:archive saving:saving key:key index:index];

}

// Save/load our scenes with a unique scene key

+(void)serializeScene:(SceneBase*)scene archive:(NSUserDefaults*)archive saving:(BOOL)saving key:(NSString*)key

{

NSString *sceneKey = [[NSString alloc] initWithFormat:@"%@Scene", key];

if( saving )

{

[archive setInteger:scene ? scene->index : -1 forKey:sceneKey];

}

else

{

NSInteger sceneIndex = [archive integerForKey:sceneKey];

[gEngine addScene:sceneIndex];

}

[sceneKey release];

}

// The keys for the objects internal vectors are concatenated by the object key and the internal index key

-(void)serializeVector:(Vector3*)vector archive:(NSUserDefaults*)archive saving:(BOOL)saving key:(NSString*)key index:(uint*)index

{

NSString *vectorKeyX = [[NSString alloc] initWithFormat:@"%@Vector%iX", key, *index];

NSString *vectorKeyY = [[NSString alloc] initWithFormat:@"%@Vector%iY", key, *index];

NSString *vectorKeyZ = [[NSString alloc] initWithFormat:@"%@Vector%iZ", key, *index];

if( saving )

{

[archive setFloat:vector->x forKey:vectorKeyX];

[archive setFloat:vector->y forKey:vectorKeyY];

[archive setFloat:vector->z forKey:vectorKeyZ];

}

else

{

vector->x = [archive floatForKey:vectorKeyX];

vector->y = [archive floatForKey:vectorKeyY];

vector->z = [archive floatForKey:vectorKeyZ];

}

[vectorKeyX release];

[vectorKeyY release];

[vectorKeyZ release];

(*index)++;

}

That's the basic jist of it, create unique keys for saving and loading the data.

iPhone - Posix Threads for the win

2009-12-28T01:27:00.000Z

So I've been looking into multithreading my iphone engine. Switching from using a timer to threads bumped up my frame rate by about 10% instantly. I found that using Posix threads were slightly (1-2%) faster than NSThreads. Currently, I've set my engine up to have 2 additional threads. One to handle the game updating and rendering, and a second to handling job loading, with jobs being streaming in audio and textures. To handle synchronisation I'm using spin locks, which are basically while loops.

Things to note

When setting up your thread you must always, start and release an NSAutoRelease pool.
The pool should be restarted every now and then to release the objects released during the runtime of the thread.
When using Posix threads it's recommended you run an empty NSThread just to let the OS know that the app will be multithreaded.
Setting up an OpenAL context stalls the engine by around half a second on start up, so I tend to launch it in the jobs thread to avoid stalls.
Bumping up the priority of the render thread does improve performance slightly.

Sample code

When called the start function will launch a dummy thread which does nothing, so the thread will terminate immediately. It then launches two threads, a game thread and a jobs thread. The game thread is given a higher priority than the jobs thread.

-(void)start

{

// iPhone SDK recommends launching an empty NSThread when using POSIX threads with Cocoa applications

[NSThread detachNewThreadSelector:@selector( emptyThread ) toTarget:self withObject:nil];

// Create the game thread using POSIX routines.

createThread( &PosixGameThread, self, 0, +2 );

// Create the jobs thread

createThread( &PosixJobsThread, self, 0, -2 );

}

Empty thread does nothing, so the thread will terminate naturally upon launching.

-(void)emptyThread

{

}

Create Thread wraps the PSIOX routines required to launch a thread with a set priority.

void createThread(void *(*start_routine)(void*), void *restrict arg, int prioritySet, int priorityAdj)

{

// Create the game thread using POSIX routines.

pthread_attr_t attr;

pthread_t posixThreadID;

int returnVal;

returnVal = pthread_attr_init( &attr );

assert( !returnVal );

returnVal = pthread_attr_setdetachstate( &attr, PTHREAD_CREATE_DETACHED );

assert( !returnVal );

returnVal = pthread_create( &posixThreadID, &attr, start_routine, arg );

assert( !returnVal );

struct sched_param param;

int policy;

pthread_getschedparam( posixThreadID, &policy, &param );

assert( !returnVal );

if( prioritySet != 0 )

{

param.sched_priority = prioritySet;

}

else if( priorityAdj != 0 )

{

param.sched_priority += priorityAdj;

}

assert( param.sched_priority > 0 && param.sched_priority < 100 );

returnVal = pthread_setschedparam( posixThreadID, policy, &param );

assert( !returnVal );

returnVal = pthread_attr_destroy( &attr );

assert( !returnVal );

}

The game thread owns the OpenGL context and spins around the while loop updating the frames while the game is running, while making a call lazily to refreshReleasePool to restart the pool.

void* PosixGameThread(void* data)

{

// Note: autorelease pools should be created and released more frequentley if using this feature

NSAutoreleasePool *pool = [[NSAutoreleasePool alloc] init];

uint poolRefreshCounter = 0;

EAGLView *view = (EAGLView*)data;

[view setupGameThread];

[pool release];

pool = [[NSAutoreleasePool alloc] init];

view->runningGame = YES;

while( view->runningGame )

{

if( view->paused == NO )

{

[view update];

#if DEBUGON && TARGET_IPHONE_SIMULATOR

// 20 frames a second in debug

usleep( 50000 );

#endif

}

refreshReleasePool( &pool, &poolRefreshCounter, 100 );

}

[view shutdown];

[pool release];

return NULL;

}

The jobs thread works the same way as the game thread, but owns the OpenAL context instead and starts the file I/O operations requested by the game thread.

void* PosixJobsThread(void* data)

{

NSAutoreleasePool *pool = [[NSAutoreleasePool alloc] init];

uint poolRefreshCounter = 0;

EAGLView *view = (EAGLView*)data;

while( view->runningGame == NO )

{

usleep( 1000000 );

}

[view->audioManager load];

usleep( 200000 );

while( view->runningGame )

{

if( [view startJobs] )

{

// 5 jobs a second

usleep( 200000 );

}

else

{

usleep( 1000000 );

}

refreshReleasePool( &pool, &poolRefreshCounter, 10 );

}

[pool release];

return NULL;

}

Refresh Release Pool handles, reseting the NSAutoreleasePool lazily for both threads.

void refreshReleasePool(NSAutoreleasePool **pool, uint *count, const uint target)

{

if( (*count)++ > target )

{

[*pool release];

*pool = [[NSAutoreleasePool alloc] init];

*count = 0;

}

Any questions? Feel free to ask.

Stock market listings bug

2009-12-23T00:35:00.002Z

Just patched a lingering stock market listing bug. The API we get the latest stock market lists and news feeds from have been modified.

I've patched the market lists today, so you should now have the correct stock market listing (in case any new companies have been added/removed from the markets) and I'll get the news feed fixed soon.

iGrapher

Stock news date search

2009-11-15T21:14:00.003Z

Finally got some spare time to devote back on this project. Noticed that the stock news date search wasn't working any more, so quickly patched it up.

iGrapher

iPhone - It's been one week

2009-09-09T16:14:00.000+01:00

So I spent the last week working on modelling, lighting, cartoon rendering and animations...

Modelling has been the most interesting part, rather than using a 3D modelling tool, I decided to generate it all in code using helper primitive classes, which handle drawing cubes and pyramids of differenet skews.

Lighting comes free with OpenGL, so that was easy to set up, still need to provide better normals for the models, but will work on that later.

I decided to go for a cartoon styled look by drawing lines around the edges of the primitives, had some issues with z fighting depending on the thickness of the lines, but instead of battling with it, I went with a line thickness that just worked.

Animations was fun, I hooked in a model/primitive heichreichy and created a simple controller class to handle interpolating between frames. So when the character starts running, I just pass in the rotations that I want to occur and interpolate between them using the running speed, and the controller class handles the interpolation of all the rotations for all the frames. Next challenge will be prioiritising animations, so say when doing a shooting animation while running, the shooting animation will override the arm parts of the general running animation.

But for now, I have a basic character on the screen that can run around, so the next step is tying in basic collisions so he has a world he can interact with.

iPhone - Week One

2009-09-09T16:10:00.000+01:00

Spent the last week working on modelling, lighting, cartoon rendering and animations.

I now have a basic character on the screen that can run around. Next step is tying in more objects and colliding them.

iPhone - Project Malaks

2009-08-30T23:41:00.000+01:00

Last week I finally got round to purchasing a macbook air, so now I have the chance to jump in and do some iphone programming.

After spending about a week orienting myself to the new environment, OS X and xcode, I started working on creating a 3d game engine. So far it's early stages, implementing simple engine code to handle 3D third person camera and object movement. ( I'll try to post a video soon )

The plan is to have something presentable by the end of the year, I'll try to keep you posted with how the engine delopment goes regulary inbetween code thrashing sessions.

Mortgage Calculator

2009-08-01T15:08:00.006+01:00

Just came back from holiday and remembered that the "Super Sexy" Mortgage Calculator Contest was coming to a close. So I quickly knocked up an entry.

Check it out at http://igrapher.com/iMortgage.

There's lot's of features I'd still like to implement, but for 15 hours work over 3 days, I'm content with the outcome. Positive things about this calculator is that it doesn't use flash (so the charts work on mobiles), and does all the calculations asynchronously client side, so there's no wasted server interactions.

iGrapher

v1.93 News platform demo

2009-07-14T20:41:00.001+01:00

Hey, just finished implementing the stock headlines feature. Just double click on the graph and the headlines for the stock graphed on the date hovered will be displayed.

Here's a quick video demonstrating how to use it. Enjoy.

iGrapher

News Aggregation Update

2009-07-02T14:12:00.005+01:00

Just a quick update on the progress of the news platform development. Currently we're working on aggregating more news sources together into the new news headlines table.

We're also looking to display the news graphed from the scan news activity feature. Meaning that soon you'll beable to graph a stock, then double click on a date, and the news for the stock released on that date will be displayed in the headlines table.

We've also started work on porting this engine to scan and chart sports news and data. This will make our engine more portable to meet our long term goal of providing an API, for our users to scan and chart their own news/data feeds.

iGrapher

v1.9 News Feed

2009-06-16T02:53:00.002+01:00

The main new feature in this release is the first first step towards the new news aggregation plaform. For the moment you should notice a simple bar at the bottom of the charts displaying the latest news headlines. Coming soon will be the rest of the framework, which'll allow you to expand the news bar to see the relevant stories. As well as be able to see the news headlines of the charts as you're scrolling through the dates.

Also in this version, we've put in a lot of under the hood work in the form refactoring and optimising the engine, with a lot of niggly bugs being fixed along the way. So now it should be more dynamic and extensible from a development point of view.

iGrapher

Chart Stock News Activity

2009-05-30T14:17:00.008+01:00

Ever wanted to chart the news activity for a stock? Well, now you can.

To try this feature out, simply select a stock from the right menu, then click the legend button on the top left after the stock's graph displays, then select the Scan News Activity button.

We honestly don't know how useful this feature will become, but I imagine it'll has a lot of potential.

Next, we're going to be actually displaying the news that's charted on the graph, so you can easily jump to a particular date and see the news headlines with links to the actual articles. Further ahead, we'll be including more news sources and parsing the news data to judge the bias of the author of an article and how relevant it was to the stock's movement. Watch this space.

iGrapher

Swiss SMI Market

2009-05-16T21:25:00.003+01:00

Just finished updating the new market selection menus. Split the markets up into continental regions so we can fit in more markets per region. Added the Swiss SMI market into the European category.

Since we have more space, we're going to start charting a lot more markets very soon.

iGrapher

Forex Trend Shift Analysis and Predictions

2009-05-13T05:34:00.001+01:00

Going on a big drive at the moment to get more and more features in. The latest addition to the engine giving the ability to run the trend shift analysis and predictions on currency market data. We're going to be adding in some more algorithms in the near future, so watch this space. In the mean time, here's an example of it running for the Yen.

Remember, to run analysis and predictions of your own, simple click the graph legend button on the top left, then select Analyse Trend Shifts from the menu that appears.

iGrapher

National Stock Exchange of India Graphed

2009-05-10T04:53:00.000+01:00

Just implemented the national stock exchange of India and the US S&P 500 markets, so you can have a play with those markets too now. Also patched a few bugs here and there mainly to do with conversion rates. Next will be to split up the different markets into regions as well as get the lastest price data pumping for the Egyptian and Indian stock markets.

Have a play.

iGrapher

Egyptian Stock Markets

2009-05-09T13:43:00.004+01:00

Just finished implementing the egyptian stock markets into iGrapher. Still have to feed in the latest stock movements as they occur during the day, but all the history data is now live. Going to fix up a few bugs next before implementing the latest movement and more markets.

Have a play.

iGrapher

Reddit love

2009-05-04T13:30:00.000+01:00

iGrapher was recently featured on one of the posts in the programming section of Reddit and recieved a lot of community support. In fact, at the peak we recieved over 65,000 hits. One of the most highly suggested improvements was support for more markets. So that's what's currently in development. Feel free to suggest any particular markets you'd like to see added.

iGrapher

3D Visualisations in the works

2009-04-02T04:33:00.000+01:00

Just a little update on what's going on, after releasing the trend shifts analysis platform for iGrapher, our focus shifted towards bug fixing and solidifying the platform we've built up.

In the mean time we started development on a side project engine to render 3D polygons fast inside a web browser. The plan is to get it running as fast as possible so we can have 3D graphics in a web browser on the iPhone.

After having success on the initial proof of concept work, we're aiming to have a robust plug-able engine demonstrable very soon.

Here's a video of the initial proof of concept work.

Music provided by AndyT - Wagons Roll.

So hopefully soon, you'll be seeing 3D visualisations popping up in the near future.

iGrapher

v1.71 iPhone Creature Feature

2009-03-22T00:14:00.000Z

Just finished porting the trend shifts platform over to the iPhone. I've also compiled a quick features usage video to help demonstrate how to use the software.

Music provided by AndyT - Creature Feature.

iGrapher

v1.7 Trend Shifts Implemented

2009-03-20T04:53:00.001Z

We just released the intial implementation of the trend shifts analysis and prediction tools, it works pretty well. I've quickly mocked up a video demonstration on how to use the new tools, just in case it's not so obvious.

Next up, we have to port it over for use on the iPhone, enable it to work off forex data (only minor tweaks required), and then go ahead and put in some more complicated trend analysis, for example as discussed before, differentiating between major/minor trends.

iGrapher

Prediciton platform coming soon in v1.7

2009-03-08T18:07:00.000Z

We have finally reached a stage where we can now work towards a providing various analysis and prediction algorithms. The first batch of tasks have been designed and are now in development.

So, in the next release you'll have the ability to:

Draw graphs based on the shifts in price momentum.
Get statistics on how often the price momentum shifts weekly, monthly, yearly breakdowns.
Distinguish between the types of shifts occurring (major/minor).
Estimate the type of the current shift currently occurring and how long it's expected to last.

It's basic analysis, however it'll be a great first step towards a more dynamic analysis tool.

iGrapher

Hacking the Heart

2009-03-02T03:17:00.000Z

"If open bracket love equal equals true, my heart's pointer is forever assigned to you".

The only way to be forever assigned to someone, is by using a const pointer. So say we had a heart inside of us..


class Heart
{
};

class Us
{
public:
Us()
{
 myHeart = new Heart();
}

~Us()
{
 delete myHeart;
}

const Heart* GetConstHeartPtr()
{
 return myHeart;
}

private:
Heart* myHeart;
};

In our main function in order to hack the heart, since our hearts are constant, there would be no legal way to change it. Unless we malloced over our heart with their heart.


int _tmain(int argc, _TCHAR* argv[])
{
Us *me = new Us();
Us *you = new Us();

if( me != NULL && you != NULL )
{
 memcpy( me, you, sizeof( Heart ) );

 if( me->GetConstHeartPtr() == you->GetConstHeartPtr() )
 {
  printf( "Love" );
 }
}
}

Hacky but, it still doesn't work. Why? Because our hearts are empty. However, if we go back to the start and fill our hearts with something.


class Heart
{
public:
     Heart(const char *name)
           : name( name )
     {}

private:
     const char *name;
};

class Us
{
public:
Us(const char *name)
{
 myHeart = new Heart( name );
}

~Us()
{
 delete myHeart;
}

const Heart* GetConstHeartPtr()
{
 return myHeart;
}

private:
Heart* myHeart;
};

We'd now have something to allocate, because our heart would point to a memory location which contains a name, which can be copied using malloc and filled.


int _tmain(int argc, _TCHAR* argv[])
{
Us *me = new Us( "ash" );
Us *you = new Us( "you" );

if( me != NULL && you != NULL )
{
 memcpy( me, you, sizeof( Heart ) );

 if( me->GetConstHeartPtr() == you->GetConstHeartPtr() )
 {
  printf( "Love" );
 }
}
}

So what's the lesson to be learned?
Don't try to love a girl that's heartless.

Price Scanning With HTML Tables

2009-02-26T14:19:00.000Z

In the next release of iGrapher the main new feature will be a much needed hovering price scanner. So as you scroll over the chart, it'll give you an indication of the price of the stock on that date, as seen in the image above.

To implement this we would need to create a table the size of a point, colour it, then moved it along the position of the mouse while over the graph.

So we first create a class to encapsulate the scanners function so we can easily iterate it's functionality over as many stocks currently drawn on the graph.

function PriceScanner(index)
{
this.table = document.createElement( 'table' );
this.td = document.createElement( 'td' );
this.border = "4px solid " + graphColours[index];

this.table.cellPadding = 0;
this.table.cellSpacing = 0;
this.table.style.position = 'absolute';
this.table.style.left = 1;
this.table.style.top = 1;
        
var priceScannerTBody = document.createElement( 'tbody' );
var priceScannerTR = document.createElement( 'tr' );

this.table.appendChild( priceScannerTBody );
priceScannerTBody.appendChild( priceScannerTR );
priceScannerTR.appendChild( this.td );

canvasParent.appendChild( this.table );
}
var priceScanners;

Next in our mousemove event we run the scanner update function if it's over the graph canvas, after recording our mouse x and y coordinates.

Then in our scanner update function for all the stocks drawn on the graph, we pick out the price index that's closest to the mouse coordinate, work out the draw point and set the table's left and top attributes to point to the same point. Then set the border of the table to be it's "this.border" property. When the mouse goes off the chart we stop calling the update function and the border back to "" so it disappears from our view.

Also in the next release we've freshed up the design a little throwing in some outset tables and buttons, fixed a few niggly bugs todo with scrolling and resizing at unusual occasions and included the minute to minute data to the graph slider at the bottom, so when you slide it to the right it'll go to today's movements.

iGrapher

From x to i

2009-02-06T15:10:00.000Z

A few days ago, when we tried logging into the ftp account to roll out a new update, we'd got a password incorrect error. We emailed the host, but there was no reply. Then we noticed that the site was gradually being re-branded... We'd been hijacked!

The thing is, since we started this project as a self-development exercise to extend our knowledge on the financial sector. We never actually considered it branching out and becoming popular (at least so soon). But, ever since we gained recognition on the internets (mostly thanks to apple), we immediately began being targeted for a takeover.

We still saw this project as in it's infancy, and refused to consider any offers. However, our web hosting company saw otherwise. Since it had let us use it's web space and domain for free (thanks), it also meant that they owned the legal rights to it. Well, on that day, they decided to hold us for ransom.

So...

Out with the old and in with the new? Development on this financial visualisation project will now continue on iGrapher.com, hope you like the name, it's very apple-centric, but, I guess it works.

In our next update we'll be implementing history downloading optimisations and extending currency exchange history data.

iGrapher

RBS ♥ You

2009-01-29T20:26:00.002Z

While looking through various charts, my friend noticed a cute little pattern in the graph for Royal Bank of Scotland's stock history.

What does this mean? Well, it's conclusive proof that the Royal Bank of Scotland loves you... or that it's bragging about a new boob job? or quiet possibly that it's flashing you it's butt right before it's stock crashes?

More mysteries coming as soon as I implement the cute shape stock matching algorithm.

iGrapher

Streaming Javascript

2009-01-28T00:06:00.000Z

One of my favourite features of Javascript is the ability to write more source code on the fly. Usually in most languages I've used before in the past, you'd have to write the code, compile it, link it, then run. In Javascript you can write source code which writes source code and runs it ON-THE-FLY.

So for example I could do this in my code.

// Create a new script element
var bamScript = document.createElement( 'script' );

// Fill in the script element with more source code
bamScript.text = 'function bam() { alert("aahh"); }';

// Add our script to the document
document.body.appendChild( bamScript );

// Run our newly added script.
bam();

This piece of code, would add in a new script element with a function called bam, which we can run right after it's added to our document. AMAZING!

(Note: A few gotchas I came accross. Make sure you use the text parameter and not the innerHTML one. InnerHTML will work fine in Firefox, however in Internet Explorer it'll go boom, and on the iPhone's safari, it'll go boom depending on the complexity of the source code you're writing.)

Since the beginning of iGrapher I've been meaning to use this feature of Javascript, however with the use of gzip, my javascript has been small enough to avoid needed to split the program into separate downloadable components. However, since porting to the iPhone, I've found that it takes a good few seconds to load, so I finally pushed ahead the usage of self-writing source code.

So now in v1.56 iGrapher will load in a small script which dynamically streams in more source code using the XMLHttpRequest object. At the moment the source code is split in two, however I plan on breaking it up into further components so at first the necessary components download first, then the non-essentials (top menu, data spanner, etc.)

iGrapher

My iPhone Gesture Dilemma

2009-01-20T03:55:00.001Z

Currently in Safari, if you touch the screen with more than one finger, then rotate the phone. Safari will crash in a very perverse way.

The program will still be on the screen however all javascript will not function, the status bar buttons will not function, and you will no longer be able to navigate the Internet, it'll just hang.

The only way around this state is to turn off the phone, then turn it back on.

Now the problem is, I wanted to add the zooming feature to the graphs and I wanted it to make use of the famous pinch technique. Should I disallow multi-touch gestures and use a different technique or just allow pinching in hope no one would rotate their phone?

I decided to allow pinching, but display a warning message, informing the user that if they rotated their phone, it will go boom!

Sigh..

iGrapher

iPhone v1.5 Preview

2009-01-19T19:27:00.000Z

Work on the iPhone version of iGrapher has been on-going all week and we have hit a few milestones this past weekend. The shares menu is much more usable, XML has been ditched for a custom .xg format which is half the size of XML meaning faster data downloads and work on scrolling the graph canvas has started.

Here's a little preview of the iPhone version in action.

iGrapher

My iPhone Web App Experience

2009-01-16T05:55:00.000Z

So I submitted my grapher program to the apple web app directory the other day. Not expecting much of it, I decided to give it a little test run to make sure it all still worked. I had been making sure it functioned on the iPhone, feature by feature as I implemented them on the desktop, however I had never actually tried using it from an end-users point to view.

Needless to say, it was too buggy, with several crashes and annoyances. I wasn't happy! I frantically spent the night fixing bug after bug. The clock hit 4:30am and I had patched it up enough for it to be barely functional.

You couldn't scroll the charts, but at least you could just about click on some buttons without it reacting erratically and be able to rotate the phone, without it crashing.

I uploaded the new version, then checked my e-mail to find a welcome note from apple. So I figured I'd check their web directory...
Woah... Featured with a staff pick. I have no idea how!?

I was pretty sure, I'd get rejected with perhaps some useful advice on how to improve the app, but wow!

The worst problems faced when porting to the iPhone?
Viewport - Don't experiment with different width's and height's, when you do so, it randomly jumps from dimension to dimension when rotating.
I found it best for me to set the scale to be 1.0 for all the scale options..

content="minimum-scale=1.0, maximum-scale=1.0, initial-scale=1.0"

So I could always have the same dimension when rotating.

Multi-touch - It's strange this one, if you use a multi-touch gesture (very very fun to do so) and rotate the iPhone at the same time, it goes boom! I tried every permutation possible to get round this issue, but I found it crashes regular websites, and it doesn't just crash in a close down safari friendly way. It keeps Safari running, however the internet becomes unusable, it just hangs forever trying to connect to a website. The only way I found around it was to turn off the phone then turn it back on again. My coding solution was to override the gesturestart event, then fire off an alert if the user tried using multi-touch. I'm defiantly not happy with this, but it's the only way I could get round this issue. Maybe it's just my phone, I'll have to look more into this. Would be nice to hear if anyone else has experienced this?

OnResize - On a desktop PC, by default I had used the onresize event to inform me when I needed to resize my grapher to fit the screen. On the iPhone... BIG MISTAKE! It kept firing the onresize event randomly and relentlessly (probably because my viewport size wasn't set as advised above). However, once I found out that this was the cause of my app crashing, I simply switched over to orientationchange for the iPhone. That event would fire (as long as you never had two fingers on the screen) and you could get the viewport rotation from the window.orientation variable.

Adsense - A quick final tip for adsense users. I'm not a fan of irritating in your face adverts, so I specifically had only used a 468x15 text ad for the non-iPhone version. However, because of the viewport size limitation, I had to switch over to the next smallest thing for the iPhone.

To get a different advert on a different device for the same page, I had originally tried asking google for what to do. However, no one ever got back to me, so I came to the realisation that php was my friend.

[?php
$ua = $_SERVER['HTTP_USER_AGENT'];
if( strpos( $ua, 'iPhone' ) == false )
{
echo '
DESKTOP CODE
';
}
else
{
echo '
iPHONE CODE
';
}
php?]

Simple huh?

We'll anyway, I'll try coming back here to post some more tips later, but it's 6am here and my alarm clocks going off.

Thanks for reading.

iGrapher

Turnaround for the pound?

2009-01-02T07:20:00.000Z

Analysts have been prediciting the EURO to ascend to the heights of £1.50 per EURO within 6 months. However looking at the latest trades, has the rally for the EURO come to an end?

iGrapher