Teaching an "old" dog, new tricks

OK, I'm not a fantastic Web Dev and tbh there are gaps in my learning, i know enough to get me by and produce some reasonable stuff.

This project has made me have to take a step back and at the same time, take a step up. Today i have learned that to make a web page you do not need to put ANY html in it at all.... this was some what of a daunting concept, since my learning is centre around traditional HTML/CSS etc. So now we throw in OOP PHP... well as Darren Stephens will attest to, i was some what perplex/confused/down right Stupefied!

OOP (for people that do not know) stands for Object Orientated Programming. In first year of my BSc we touched on this and if I'm honest i fell over at the first attempt.. i simply was not very good at it. i have struggled to grasp the concept of OOP ever since. to my surprise i manged to explain to a non Programmer how OOP works (in an abstract context)

I told martin (one of the Players on my pool team) that OOP works something like this:

A house is a OBJECT
A house has windows which is a CLASS with in the object
A window has ATTRIBUTES like size colour
A window has METHODS like Open close
A window can have an INSTANCE of the class, so Stained glass is different type of Window but still falls in the class of window.

he got the jist of it, but tbh i wasn't 100% sure if i was right about it, but i digress.

the following is a snippet of Code from the wild project html Client page:

Coorrrrreecctiiioonnnn i was going to, but basically Blogger wont let me and i could not find any thing in the help pages to change this...

I'll be back later with Screenshots...

a disgruntled ~Keith

EDIT

Told you i would be back! Ok our HTML code samples:

in here you can see the standard HTML is present and the php function for connecting to a database and calling a query.

Ok now this is the same code in OOP PHP:

In the words of a favorate Character of mine "It not even sound same!"

Mobiles for Project

We are now entering into the testing phase of our project and for the past few weeks i've been trying to source some iPhones through the institution in line with our project budget. Ultimatley it seems to no avail with O2 corporate we're looking at 24 month contracts and £250 per phone (not an option). There are two reasons I would like iPhones for this project, 1) They come with 12 months of web access and 2) Interface wise they work extremely well. Going to have to see, tomorrow, whether or not I can put 10 iPhones on my credit card otherwise its time to look at sourcing other options. First choice at the moment would be 10 Android phones network free then free sims and the purchase of top up cards from 3, who offer quite a nice included web package.

We'll see what happens over the next week, just from expecting things to be straightforward we move into the realms of the not possible.

Better late than never!

Ok i haven’t been to good with the blog so time for an update.

First of all, JISCRI in Manchester, was for me, new Experience. for me. I have never had the opportunity to visit a developer conference before, and i enjoyed it. I don’t mind admitting that i was a little shy and left allot of the talking to Darren and Darren (from here on i should call them DnD but i feel the law suits from Wizards of the coast :) )

It was good to see the different things that where going on in the JISC world (though there was a LOT of stuff that seemed to do the same things (just my opinion!)). The project that caught my eye was the shuffl one. The use of JQuery to create index cards to store notes (with out database Backend) was very kool. only one thing JISC guy.... PLEASE don’t make me go to the city of Manchester’s stadium again..... unless the Red half of Manchester are playing there!

Ahem that aside....

Ok Bring the Project back up to date we have completed the first functional prototype consisting of:

• Plug-in for MS PowerPoint that can embed an web browser for Wild use or normal web use
• A PHP driven web Interface for a tutor to add, edit activities and create the URLs for the tutor to embed Into the PowerPoint Add-in.
• A PHP client Interface that works on most mobile devices and allows the client to repl to the correct activity
For the Tutor interface we are currently using a standard PHP/xHTML web site, i would like to use some JQuery to make it a little more dynamic, but we'll see.
The Display and the client pages are my little triumph, They are Both Static template that have the information needed for an activity inserted on the fly, simples! (heh) basically you put the Id of the activity into the client and the back end will search for that related activity details, like title, description and put then into the correct parts of the page..... we only need one page then ;)
The display works on the same base.
This morning we had a flying visit from David Flanders, He chatted with genuine interest and seem happy with the progress made, so if he’s happy.... I’m Ecstatic!

~Keith

JISCRI

The three of us made the (shortish) journey down to Manchester on Thursday morning to take in the wonders of the JISCRI workshop. The venue of the Man City ground at Eastlands was a nice one, though Keith, a Man U fan, was slightly less happy about it :-) As it turned out, the MCFC wi-fi network was a touch ropey; not a problem thanks to the open mesh some guys from Southampton had provided. Thanks guys!

We hadn't had a visit from our programme manager yet so it was nice to put faces to names and see that David Flanders was nothing like we had envisaged (in a good way). The main thing we noticed after some of the show and tell and 45 second pitches on the first day was that we were somewhat out on a limb: our project wasn't that similar to anything else there. The closest thing that we saw really was Song Ye's interesting Super Slides project. Darren M had been down this route with SMIL a couple of years before and had tales to swap on morning two with Song Ye.

While Darren M was doing that I was enjoying chatting with Ben Charlton from Kent, while Keith was talking to Alex Bilbie from Lincoln. I was interested in Kent's Reading List stuff as I'd been mulling over how to develop some tools to structure module and course information like module handbooks and specs. Ben was interested in this too and I wondered how data from their system would be exported, especially if they were serious about cross-institutional support. We mused on the idea of what kinds of ontology would be useful, and how they might be underpinned by appropriate RDF. After this, I came back into Keith's conversation with Alex (who'd also gotten involved in a discussion about how useful 3D printing would be for printing bacon). Alex's mobile campus project rang some bells with us, as a developer on our campus is looking at this very area.

I'd never stayed in the Madonald Hotel in Piccadilly before, so was very pleasantly surprised by what greeted us when we got there. So, after a quick shower and a blast on the iPod, we went down to dinner - a real school dinners affair: pizza and chips! Unfortunately, I don't do chees, but the staff were great and I managed to get some bruschetta instead. A few drinks were had and, after listening to what I remember being quite a lot of Stone Roses tracks (spot average age of audience, folks!) , some pleasant time spent with a number of people and a discussion about getting Leopard onto netbooks with the AV guys, I toddled off to my room and the free internet before bed.

The pitches on Thrsday and Friday were all interesting, though of course some were a little more polished than others, particularly on Thursday. Friday's were, without exception so much slicker. And a few of them were really memorable. The ones that stayed in my mind were for Clipper, Xpert and WATT. It's also a pity that we were in our blog interview on Friday as both the bits OSSWatch and agile for small teams sessions that I miessed looked really interesting. Still, can't have everything.

I'm not the most confident of people, so before making the journey down was a touch worried that the very rough prototype of our initial system was going to look a bit weak comapred to other people's work. It didn't. We got encouraging feedback that the project was a worthwhile one and enthusiastic noises from several people. We came back re-energised by WILD and also with a couple of other ideas to float around if things go well. All in all a pretty good two days.

Thanks should go to Mahendra and the troops from UKOLN who kept everything pretty smooth over the two days and looked after us really well. It was a blast, guys.

Some project docs and a working SVN repo are now sitting at : https://sourceforge.net/projects/thewildproject/

Jscrip, Jquery PHP and God damit!

I am currently working on a feature for the wild project which I envisioned when I was drafted in to help. When a tutor wants to add, edit or embed an activity, they will need to get the correct one from an activity set. Let me put this context:

Dr. Livingstone (no not that famous guy) teaches the University of Hamburg(er). The good Doctor is building a presentation for a lecture on the African jungles, and has decided to use an existing activity from another lecture he made with the wild project. Doc L picks the Activity set in the tutor interface via a drop down list and selects the "jungle bells: stories from the green forests" activity set. The next selection drop down list is then populated with the activities from that set, in which Doc L picks "the hills of stranglethorn vale" activity.

On to my problem:

That "cannot" be done with PHP (I "" because I haven’t found an example of it been done) you can set up the query, but that’s about it. Now it can be done with Jscript and something called JQuery which is a Library for java script. I have been looking at Different examples of JQuery and I find it could be useful in a lot of different things for wild, but it something we will be looking at later versions.

I have done some searching around and found a good example of what I am trying to achieve:

http://remysharp.com/2007/01/20/auto-populating-select-boxes-using-jquery-ajax/

(Thanks Remy)

at the moment I am trying to follow the Example he has given but am struggling to get it working locally (not sure I have the correct code in the correct files Etc) but I am confident I can convert this to use a database Ids rather than the values of the select or use the Values of the select to reference the table ids.

~Keith

Amusing Interface Quirks!

I have spent a few days building templates for the interface for wild. I have found a few things that amuse me with Mozilla FireFox and IE (7/8). I will show you what I mean shortly but first i want to talk interface!

Client:

Originally I envisaged the client being to different interfaces (one for high end devices, one for mobile devices)

But after some tweaking I feel that we might be able to work the larger interface for the mobile devices, simply because of the way the browsers (IE and Firefox) scale the web page:

moving on...

Tutor:

In the previous post I stated that I wish to move away from the traditional web page. its hard for me to explain what I mean but I am going to give it ago.

My idea is to make the web interface feel and work like something you would have in a kiosk or information booth, for instance the interface will not have a navigation bar, in the traditional sense. Also all navigation will happen within an area of the page (a bit like frames but not as evil) and will be in sequence or will be fluent (so one option will lead on to the next until completion).

So I went about creation the tutor interface to mirror the client. The thing I found this was the Scale effect for the tutor client became annoying and I mean REALLY annoying. If I where a lecturer or a teacher, I think I would of being seriously narked with the thing and ditched it.

After this, I decided to set the whole thing as absolute positioning with in the CSS (some people say this is a no no, well to you I :P ) the interface looks and feels a lot neater with this and I have give it some scalability for different browser sizes, I might have also fallen in the trap of creating for 1024X768 but then we cant change this at a later stage.



Display:

the display page was really a no brainer, its just a simple page that displays the data. i had little problems with setting this up.

Right the browser quirks:

as daft as it sounds there is one little quirk that i have noticed;

Firefox:

IE:

I'm using a reset CSS file.... but still it happens... love IE!

~Keith

Interface Design

First and foremost I am no designer, never have been, never will be. I have the artistic talent of donkey, so if this designs don’t look “pretty” go figure. :D

To start with I tried to make a “nice” design; I thought about themes and wanted something “wild” looking, as in wild life or jungle. So I came up with this:

After been told off by my partner (she is a web developer) I was force to re-think, So I decided to go with something more simple and use more neutral colours. I also decided that I would like to move away from a traditional web site, and Try and make the site look more like a system interface, to make it feel more like a program and make the user forget it is really just a web client.

So I created this:



It’s not pink….its blue…I swear!

This interface was "built" in Photoshop and am hoping that i can use the layers to construct the full working interface from it.

~Keith