Vacation Tracker on Android - LungoJs

After hanging around a lot with PHP and CSS, development of web apps for PC's got somewhat monotonous. Hence, I decided to move on to develops web apps for the tablet and the smart phones. Being the possessor of a Sony Xperia U, Android was the obvious choice of platform. Instead of hard coding the entire application with javaScript I decided to use the framework called LungoJs. The first look at the framework convinced me that it is definitely cool, but lack of documentation and support made it really cumbersome. It took a hell lot of time for me to figure out how to use the Framework. At this point I must tell you that it is not at all that tough as I felt, its just the lack of support.  
 The application itself is very simple. The routine is stored in a MySQL database. All I need to do is to update the routine if I'm absent in a particular class. The absent dates are stored in the database. The application automatically calculates the percentage of classes I have attended in each subject and warns me if I'm low on attendance.

The application is currently in alpha stage of development and major features have already been implemented. The last module that I'm working on is trying out a algorithm that will help me to plan my classes so that I can cope up if I'm low on attendance. A bit of AI ;)

Taskware

Finally my first corporate based application reaches testing phase. Taskware, as it is being called, is an advanced task management application that synchronizes all your tasks, projects, contacts and notes over the network. The thing that really makes it different from other task management softwares is that every part of information can be shared over the network with someone if necessary. Few additional features that makes this application special is its cloud storage - file sharing system, the internal messaging system and the accumulation of contacts sensibly. Security has also been taken ample care off, as corporate solutions always require neck tight security.
I'm looking forward to the results of the first real time test of Taskware over the National Institute of Technology Durgapur servers somewhere in the near future.

The Taskware Dashboard

Client side validation vs Server side validation

It is quite a fun developing a web application this summer for NITD Alumni. Working at such a professional level is tough, but it definitely teaches you plenty of new stuff.

While working on this project I came across a major problem with validation. Since the application is supposed to store profiles of alumni's and present students, we need a lot of validation work. Any wrong data will make the database useless, and also we want to put the best user experience forward. So the idea is to give the user the least number of controls and still collect the most amount of data possible.

Initially, I decided to use client side validation using javascript as that would speed up the process as well provide an enhanced user experience. But how much I tried, javascript was easy to hack and anyone could submit garbage data into the form. So finally it was decided to do server side validation using PHP.

Now to make our plans, we did both client side and server side validation. The obvious question is how will this help! Well the client side validation does most of the work, make the interface fast to use and gives a superior user interface. On the other hand the server side code gives a secure backend. So the before the data is written onto the database, the server side validation makes it foolproof and writes it down.

Hence, for a site to work out proper and secure validation techniques, it needs to have both client side and server side validation.

P.S. For those of you looking for client side validation, look out for the jquery.validate.js and additional-methods.js. They contain almost all the necessary validations. And obviously you can write down a few of your own. :)

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.

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.

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