Arbitrary HTML? Well IE seems to like it anyway…

One of the most reported problems in feedback from my original HTML mock-up was Internet Explorer's inability to stop expanding the Learn page Inbox (a CSS element with overflow) with a left-right scrollbar. The underlying problem was that the width was being calculated as 100%, and then the scrollbar added on top. Mozilla browsers seemed quite happy to deal with this without bother.

After numerous hours of pondering and layering and stacking of elements, something seemed to work! This does seem to me to be a quite arbitrary stack of HTML and CSS, calculating away widths in their own special little ways.

The solution:

<div class="inboxcolumn">

<div class="containerbox"> <--- a seemingly pointless CSS class, but with width "auto"

<object width="100%"> <--- lets get HTML to do a width calculation too

Last but not least, my content here!

</object>

</div>

</div>

Why I need anything more than the original "inboxcolumn" CSS class I do not know, but mixing HTML, CSS with auto and percentage widths seems to do the trick.

Blimey – I could base my entire presentation just on this! ;)

: 28 Feb 2006 20:13 |  Comments (2) |  Close comments |  Report a problem

Simple but effective

Without wishing to curse my future luck, I think I may be onto a winner with regards to displaying my content. Using the PHP expression var_dump, I am quickly managing to extract parts of the data that I require. Whilst this is not a robust solution, it will allow me to develop my online prototype more quickly.

: 16 Feb 2006 15:53 |  Comments (0) |  Close comments |  Report a problem

Chocs Away!

Successfully managed today to re-use code from the Moodle block "News Items", and add that in place in my template adpated for Moodle. Which does mean, that live news is now available!

Based on this, the same may be undertaken for the Calendar/Diary and latest updates in learning.

: 12 Feb 2006 22:20 |  Comments (0) |  Close comments |  Report a problem

A Coding Development Meeting

Writing about web page http://blogs.warwick.ac.uk/penguin/

Today I have been brought up to speed on the underlying development system Moodle by David, and have agreed on how to proceed with functionality.

Essentially, my starting point is to integrate my static design into the live Moodle content. Then in priority order:

• Fix design issues raised from email feedback
• Wider user testing for final feedback to work into system development
• Develop the "Learn" section of the site
• Copy the "forums" function of Moodle to create a "News" category
• Develop the "News" section of the site, now with added RSS feed from Insite (raised in questionnaire)
• Develop "Diary" section of the site
• Create interface for standard Moodle forums in "Forums" section of the site
• Develop "Help" information

Content of reduced priority

• "E-mail" section
• "Degree" section – may be available with limited content only

Please visit David's Project Blog for more information on the underlying system developments.

: 07 Feb 2006 15:32 |  Comments (0) |  Close comments |  Report a problem

Static Prototype v1 Completed

After a delay of several days due to illness, the first prototype of the portal interface has been completed. It will be distributed later today to "guinea pigs" for feedback, along with a few use cases for them to document their activities for me.

Known Issues

• Trial of an expanding menu using pure CSS without JavaScript. Whilst this works fine in Firefox 1.5 and Opera 8.51, it shows with some parts being unselectable in Firefox 1.0.5 (DCS machines), and does not expand at all in Internet Explorer. This does not affect usability of the site, it just removes an enhanced feature – if the menu proves popular, it is likely to be rebuilt using JavaScript.
• Internet Explorer adds a left-right scrollbar unnecessarily when the Inbox CSS element overflows.
• Issue with border-widths in Internet Explorer – a 1px border is invisible, but a thin border is incredibly thick. Alternatives are being investigated.
• Forced space-characters are displaying as squares in IE. This will be sorted properly, most likely with spacer images.

Limitations

• JavaScript is driving the "Learn" homepage, although this may move to server-side scripting at a later date.
• Drop-down menu functionality on "Learn" and "Module Resources" pages merely show intended functionality.
• "Diary", "Email", "Forums", "Degree" and "Help" have no content
• Search function is disabled
• Homepage links direct the user to the relevant page rather than the message/resource itsself
• Content is not complete – many dummy/duplicate pages.
• Sizing is mostly relative, although on resolutions lower than 1024×768 it seems rather claustrophobic.

: 01 Feb 2006 13:51 |  Comments (2) |  Close comments |  Report a problem

Prototype Develops with CSS

The prototype of the portal's user interface is beginning to develop with the magic of CSS!

• The scrollable elements are completely created by CSS, due to full support across browsers for the "height" property
• Rollover effects on the message "inbox" block an entire table row as a link (edit: IE almost manages this… only the title text appears as a hyperlink… this will be looked into)
• Expandable menus have been created with CSS and no script. Although this is currently unsupported by IE6, IE7 should support it when its released later this year. Mozilla/Opera/Safari are all capable of displaying this menu, however it does not affect the ability of IE to use the top-level links.
• New rollover buttons for the menu have been created by using transparent gifs and a changing background colour… saves bandwidth through only having a single image to load

The full "static" prototype is now very close to being ready, next stage – user testing!

: 22 Jan 2006 22:22 |  Comments (1) |  Close comments |  Report a problem

First meeting of the new term!

David and myself have had our first meeting of the term to review our progress for moving forward. David is experimenting with open source frameworks to avoid "reinvention of the wheel" in the content management system design, which may affect the format for coding developments.

I have been making some progress with template designs, which should hopefully be completed (in their first versions at least) by this weekend.

: 11 Jan 2006 19:20 |  Comments (0) |  Close comments |  Report a problem

Cancellation of Focus Group

Due to regrettably low interest, I have decided not to proceed with tomorrow's planned focus group. In order to "fill in the blanks" of the questionnaire, I shall be either conducting a few face-to-face interviews, or a smaller less-formal focus group later this week.

: 28 Nov 2005 16:27 |  Comments (0) |  Close comments |  Report a problem

Progress report submitted

The project progress report was submitted this morning.

: 28 Nov 2005 16:16 |  Comments (1) |  Close comments |  Report a problem

Exciting new coding developments today!

Writing about web page http://blogs.warwick.ac.uk/penguin/

Had a meeting today with David to discuss –

1. Our timetables and coherently updated timetables for term 2
2. Progress, frameworks and coding developments

Timetables
All things considered, we concluded that we were not far off track with the timetabling, other than my decision to delay determining administrative user needs until January. David and I will be working in parallel from week 1/2 onwards, with the preliminary determination of features to be agreed during the Christmas break.

Coding
Following on from David's research into coding frameworks, we have concluded that I will not be directly coding in JSP, but using a level of abstraction called MVC (Model View Controller) which uses tags to undertake most of the display work. In a nutshell, David sees the database and I don't!

: 24 Nov 2005 16:15 |  Comments (0) |  Close comments |  Report a problem