Paint App using javascript and html5

      This is my basic paint application using Javascript and HTML5. This web application consist of tools to draw rectangle and circle with ten colors. HTML5 canvas is used for making the drawing space.Two canvases are used to draw shapes, the real canvas is used to store the shapes and temporary canvas is used for drawing shapes in temporarily . The color picker is made using the table method in html.The application works basically on three mouse events onmousedown, onmouseup and onmousemove.To see it in action Click on the Paint Application Figure :

      The script start drawing once the mousedown and mousemove event occurs and continue until the mousedown event occurs. The method used to draw rectangle and circle are different. For example, to draw a rectangle we need to know the left top coordinate plus the length and breadth of the rectangle.arc method is used to draw circles on canvas. The application also provide the facility to clear the canvas if anything drowned in it. Tools are selects using current_tool function in script.The function Draw is used to Drawing shapes like rectangle or circle in canvas.When we draw a shape, the values of shapes are pushed to Object(named data).

Paint with saving facility:
       This application also provides the facility to save our drawings.This is done by saving values about each object needed to regenerate the same drawing. for example, for a rectangle it would be the type of the object which is "rectangle", its beginning coordinates and end coordinates are saved to regenerate the rectangle.All the shapes are saved in same manner.Different functions are used to Drawing and regenerating same our drawings When we click the save button the data is transferred to the server as a json string where it is stored along with a name provided by the user . Since we have a save feature it is quite easy to implement the edit feature also.Just regenerate the drawing using the data received from the server,make some changes and save it with the same name or a new name ,as the user wishes. JSON is syntax for storing and exchanging text information.

The complete code is available Here.To see it in action Click Here 

Google App Engine

   Google App Engine is a platform for developing and hosting web applications.App engine applications are easy to build, easy to maintain. You can build your application using Python, Java or Go environments. You just upload your application, and it's ready to serve to your users. With App Engine you write your application code, test it on your local machine and upload it to Google. You can create an account and publish an application that people can use right away at no charge from Google, and with no obligation. 

     This tutorial describes how to develop and deploy a simple Python 2.7 project with Google App Engine.  You can build web applications using the Python programming language,  and take advantage of the many libraries, tools and frameworks for Python.A Python web app interacts with the App Engine web server using the WSGI protocol, so apps can use any WSGI-compatible web application framework. App Engine includes a simple web application framework. Apps can use the App Engine Datastore for reliable, scalable persistent storage of data.Apps use the URL Fetch service to access resources over the web, and to communicate with other hosts using the HTTP and HTTPS protocols.
     For our App Engine implementation use Python 2.7v and use the python Software Development Kit(SDK).Download SDK for linux and extract it on your Home folder.You develop and upload Python applications for Google App Engine using the App Engine Python software development kit (SDK).

Let's begin by a simple 'Hello World!' application that show the message 'Hello World! in our browser.

STEP-1
 Create  a directory helloworld. all files for this application reside in this directory. create a file named helloworld.py

CQ40-Notebook-PC:~$ mkdir helloworld
CQ40-Notebook-PC:~$ cd helloworld/
CQ40-Notebook-PC:~/helloworld$ vi helloworld.py

Give the following content in it.

import webapp2

class MainPage(webapp2.RequestHandler):
  def get(self):
      self.response.headers['Content-Type'] = 'text/plain'
      self.response.write('Hello, webapp2 World!')

app = webapp2.WSGIApplication([('/', MainPage)],
                              debug=True)

This Python script responds to a request with an HTTP header that describes the content and the display Hello, world!. webapp2 is light weighted web frame work. This webapp2  has two parts a request handler and a WSGIApplication instants that route incoming request to handle based on URLs.