Something like the BBC portal website homepage

In Progress Posted Sep 5, 2011 Paid on delivery
In Progress Paid on delivery

I require (for a non-commerical/learning site) a webpage that looks and feels exactly feels like the [url removed, login to view] home page.

Ideally I need it as a Classic ASP webpage and callable Ajax (javascript) to another Classic ASP script to save the drag movements - writing to a cookie for each portlet position is fine so that the initial page can build the portlets correctly for the next time it runs. However, if you want this as a PHP or .NET (C#) then I am open to suggestions.

The initial script must specifically ;

[url removed, login to view] portlet sections that can be dragged and dropped as smoothly and slickly as the [url removed, login to view] website page.

- that sections can be easily moved around and do not need an exact position for the drag facility to work - unlike other jquery examples that can be found around the web.

[url removed, login to view] the same CSS setup is needed; so that the mouse over of the dragable [top] part of each portlet is highlighted with the portlet border.

[url removed, login to view] portlets can be collapsed and expanded with the triangle at the top left of each portlet (next to the portlet title). The collapse and expand must be with the same slick (prototype) animation effect.

[url removed, login to view] two types of portlets are provided in the final delivery – one where there is an EDIT option and one without. The EDIT option (see BBC site for example) will animate a section opening up that will present check box options for that portlet.

[url removed, login to view] each section drag and drop it must save the portlet section position with a Classic ASP cookie (from an Ajax Call) so that on the next reload it will be positioned exactly how it was left.

[url removed, login to view] portlet must have curved corners in the same way as the [url removed, login to view] website - no curved graphics just javascript or CSS to curve them so that portlets can be created easily after the project without any need for anything outside of the project delivery.

Cosmetics

Although the colours shown on the example attached document are green and magenta, the site must have CSS’s in the same way as the BBC site so that they can be tailored using the Customise this Page ptions:

Drag and Drop operation

The drag is easy to use for non-technical users, it highlights the area that it is coming from with a subtle grey area with white dotted border

And the moving of portlets to the new position shows the same subtle highlighted area.

Where a Drag operation is not completed it must return to the original position in the same animated tween effect as the current BBC site.

Documentation needed:

I will need an overview document explaining how the elements of the site has been put together so that I can understand it and change it where needbe - specifically the jquery/prototype functionality and how to adjust it if needbe (e.g. size, speed of drag, speed of drop, CSS details etc). I am a proficient Classic ASP coder so I do not need much about that.

Other Notes

Deliverable files should be uncompressed ASP (or php or .NET files), html, CSS, Javascript etc so that I can work through things clearly and easily.

This is not to be sold on or used in any commercial way so I think that means that if you need to use the actual BBC website CSS, JQuery etc then this will not compromise any license issues that they have. This is for a learning exercise.

The pages must be able to work on [primarily] Microsoft IE (8 and above) but also Firefox.

JavaScript jQuery / Prototype

Project ID: #1196096

About the project

5 proposals Remote project Active Nov 13, 2011