Give user the power: Editing ProjectPier

ProjectPier is an opensource  cross-platform application that is written using PHP, Javascript and requires a MySQL database backend. It is a simple, powerful and intuitive software for web-based project management and group collaboration.

Now the present ProjectPier version is shipped with just a single default theme named marine. I implemented quite a few for themes for the project that I made. They did work out nice, but later I realised that open source is not about giving the user plenty of options, instead its about giving him all the options. So I decided to add another table to the MySQL database which will store the theme and ui data and another php form which allows the user to add or modify the looks. They can choose any color or gradient or background image they want to. Javascript handlers manage the textboxes, color choosers and spin boxes. They make Ajax calls to change the required data in the database. And finally the CSS of the file gets dynamically changed using Javascript. Wasn't that tough!! :)

Newspaper Layout - Getting modern

Frontpage Screenshot 1

Frontpage Screenshot 2

Newspapers have been with us for a long time. It was the main source of information for commoners for the later half of the twentieth century, until and unless the human race was invaded by the Internet. Information started flooding the Internet and people remained informed just by a few clicks. But somehow the newspaper never lost its importance.
Newspaper companies started uploading high resolution images of their newspapers so that people could read them on the web itself. No doubt they take a good amount of space but the quality is superb. Afterall everything has a price.

Frontpage Screenshot3

After noticing the new layout and grid features of CSS3, I was encouraged to make a web layout to display the newspaper exactly at it is on paper. I very tough challenge indeed. The newspaper layout itself is so varying and complex that it was almost impossible to write it out through a single style sheet. Again the content is so huge that it has to be arranged efficiently too and any two newspapers seldom have the exact same arrangement. Images sometimes get difficult to handle.
After working on it for a few days I have creating a model on how it should look like once it is done. I created it using CSS3 and HTML5. But the limitations of this model outnumber the amount of data in it! Many things needs to be looks upon, the greatest challenge being to make the structure fluid. May be this is the start of another framework, but whatever it may be it will surely stretch web layout capability to its limits.

Source under development. Available on request.
Send a mail at amitdatta1806082599@gmail.com

Ticker

Many news channel and websites use a vertical scrolling bar. This widget solves the same purpose but it has been modified and can be customized easily by editing it with a text editor.

This widget has different backgrounds for headers and the description part. It can be changed by editing the CSS of the widget. Another customization is the scroll speed of the widget. It can be changed by changing the javascript file of the widget. The different parts of the width is a single column table made in HTML, the tags being styled by the CSS. You can go on adding more and more data by adding more rows to this table.

I have added the feature of the earlier photo viewer in this also. Hence the ticker stops as soon as we hover the mouse of the ticker. This is done by editing the javascript of the ticker.

If anyone of you wants to get the source, you can mail at amitdatta1806082599@gmail.com. Live free!! 

PhotoViewer

This project was in particular inspired by our college's Tech Fest website. And while developing stuffs for the Math's N Tech Club site of our college, I really found interest in pursuing this project. In the end it turns out to be a nice one. At least I'm satisfied fully!! :)

This is a photo gallery created totally with the help of CSS, JS and HTML. The right side of the gallery contains a scrolling ticker which contains the photos of the gallery, while the left side of the gallery is the space for viewing the photos. There is space for putting up captions in the bottom, with a semi transparent black background! Another trick, that I have added in the gallery is, the scroll stops as soon as you hover the mouse with it. Hence if you want to see a particular group of photos you can just hover the mouse. The width, scroll speed, thumbnail size etc can easily be customized by editing the CSS.

If anyone of you wants to get the source, you can mail me at amitdatta1806082599@gmail.com. Live free!!