WYSIWYG Editor: Planned!!

Finally 'm working on the WYSIWYG editor that I had planned to do a while ago. All the development stages are almost planned. Research work almost done. And I'm ready to code for it!

The development stages:

• The most basic functionality that a WYSIWYG editor has is the styling, alignment and font options. So for the editor I'm working on, I assume it to be the most important options and hence I put them on stage 1 of my development process. Along with these hyperlinks and inserting images will also be a part of this stage. Font-colors, backgrounds and highlighting will also be taken care of. Indentation was a problem, but with a bit of research this problem was also sorted out.
• The second stage will consist of advanced options like bullets, numbering, emoticons, symbols and date/time options. This stage specifically focuses on options that are less commonly used by editors although they form an integral part of our compositions. More specifically they add feel to it.
• The third and final stage will be to add editing options for most advanced editors. Options like inserting HTML snippets will be available. Tables and grids will also be taken care of. Advanced numbering and bullet systems will be introduced. Layout manager will be introduced. So that the user can make use of common default templates instead of wasting time on making their own.

All these changes are made by applying the changes to the HTML form of the text written in the textarea. This ensures easy portability of the edited content. Hence this can be applied as a web editor in different CMS' like drupal and joomla, or in blog editors or in mail composers were mails can be sent by the alternate mime type.

Menu - A new way!!

Website menus has always been lists modified with a lot of CSS. We have seen vertical menus, horizontal menus, dropdown menus, etc. So this time I planned on something different. I made a circular menu where the sub menus appear as bearings around the main circle. This menu can be extended on all sides to include more sub menus. Check out the code. It will surely be interesting I hope!!

Download files:

http://hotfile.com/dl/146527305/ce07ecf/menu.7z.html

Note: The code has been optimized for Mozilla. Add the -webkit- and -o- commands for running it on Chrome, Safari or Opera.

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!!