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.

CASE - Revisited!

CASE gets a remake. All the coming soon tags gone and now there is a fully active site capable of handling heavy traffic. A bit heavily loaded cause of the graphics, this version of CASE has got a more beautiful front page because of the textured background and use of CSS3. The menu is neater and more elegant with a semi transparent background. Also the navigation throughout the page has been made easier with sensible placement of navigation  bars in the page. Graphics has been incorporated along with text-shadows and boxes. The point that this site may be viewed on different screen sizes has been aptly been taken care of. All the content being centered in a 1000px wrapper. So 1024x768 is the minimum resolution I'm targeting. Also dividing the page into different panels just like in a grid has made it a lot easier to handle.

Now that the site is up for action, it will be tough to keep it maintained. Giving remake to it will be of secondary concern, providing patches and new modules being the primary one. A lot of exciting plugins and modules are being planned and will provide a lot of functionality and portability to the site. One of the primary modules on the sketchpad being the mobile version of this! So watch out for that.

Check out: consumersolution.0fees.net

CASE - Finally it's up!

After Aarohan2012 and a couple of other research and development projects it was finally time for me to go commercial. 16 hours of continuous work, finally the CASE - Consumer Awareness and Solutions Enterprise website is up and running (consumersolution.0fees.net). Although this is an alpha version and just a preview of what the organisation is all about, in two weeks time the website is going to great a completely new look. Currently it is just a rough collection of PHP pages with plain CSS. Now with much more advanced graphics, animations, HTML5 canvas this one is going to be like a hell of a website. I bet if the team is happy with the start, they will amazed with the beta version. And yes, photoshopping will be something I'll be looking at this time because I believe that great coding always need great graphics.

Not only does making the website for CASE excites me, but also the endeavour that the organisation is taking is awesome. The first of its kind in India and I'm happy to be a small part of it. I would like to thank the entire team for giving me this opportunity.

An attempt for a (X)HTML editor

Google and many other sites provide editors on the web! They are great text editors, except for the fact that many of them lack the HTML editing capabilities! In my next attempt I'll be trying to create an editor using javascript and (X)HTML, that will be providing full scale editing capabilities, mainly HTML editing capabilities. I drafted out a plan, the design is nice but adding HTML capabilities will be new to me. Later if this succeeds, I'll be trying to incorporate this in an application so that we can use this. I believe that it will be off great use, specially in mail editing applications, given that webkit has developed a long way and can provide many capabilities without much hassle.

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.

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

Less of Qt and more of HTML5: Rekonq

The implementation of the background image selector done in Rekonq was coded in Qt. The widgets and all were all coded. But now I've got a different implementation for the same problem. Rekonq uses webkit, so almost all of the HTML5 and CSS3 features are available for use. So instead of creating the popup widget and creating layouts using Qt we can create a lightbox using CSS3 and load the images using HTML5 handlers. Again the file select class of HTML5 will make it real easy to select files from the local disk or from the web. The data file although remains the same. The HTML5 will load data from the XML file using AJAX. This solution will not only make the widget a bit faster, but also coding for it will be a lot simpler. Just like a simple web page. The interface will also be for attractive and making animations will be also very easy.

The 6 images that I intended to load in the lightbox, will be a simple 3 x 2 table and the cells will be image hyperlinks. Instead of controlling the data by the file class of Qt we can use handlers to right the data directly from the HTML file. The entire lightbox will be just a HTML form with submit and cancel buttons. I guess this will soon be implemented. :)