Till now all of you used Online image editors.Do you think of an Offline Image Editor that runs in a browser and can do everything like cropping,resizing,rotating and black and white operations before uploading into any of image hosting server? Mozilla created a web application with the help of the latest technology HTML 5 that work with Mozilla Firefox 3.6 and twitpic a free twitter image hosting service.You can check the live demo of HTML 5 Offline Image Editor.
Offline image editor with HTML 5
Offline image editor with HTML 5
Why is Offline Image Editor?
Daily when we are uploading images to image hosting servers , we face the following problems
- If you want to edit an image that you want to put on your blog post, you can do it only after the image uploaded into the image hosting server.
- If you are using a less bandwidth internet connection ,like me (Mostly Indians face this problem) , it takes more time to load an image editing program from the server.
- What happens if your internet disconnected when you are uploading an image? It won’t resumes from that point.It has to start from the beginning.
- You cannot upload more than one image at a time if you have multiple images.Or some restriction may be there like 5 images max.
What is Offline Image Editor?
It is an HTML 5 based Firefox 3.6 application that can solve all the above problems.
Here’s a full list of the things that this application can do
- You can drag images from your desktop or the web into the application.
- You can see a preview of each image you want to upload.
- You can drag previews to the trash to delete an image.
- Images are automatically made smaller if they are bigger than 600px wide.
- You can edit any of the images before uploading. This includes being able to rotate, flip, crop or turn an image black and white.
- If you edit an image it’s saved locally so you can still edit when you’re offline. If you close the tab, restart Firefox or your computer they will be there when you load the page again so you can upload when you’re re-connected.
- It will upload several files at once and give feedback as the upload progresses.
- The HTML 5 Offline Application Cache makes the application load very quickly since it’s all stored offline.
The demo includes the following features of HTML 5 included in Firefox 3.6
-
HTML 5 Drag and Drop
You can drag and drop items inside of the web page and drag images from your desktop directly into the browser.
-
HTML 5 localStorage
With this feature we can save the data of the image even browser restarts.
-
HTML 5 Application Cache
This allows you to create applications that can be used when the browser isn’t connected to the Internet. It stores the entire app in the browser and also gives you access to online and offline events so you know when you need to re-sync data with a server.
-
HTML 5 Canvas
The HTML 5 Canvas element is used through this demo to edit and render images.
-
Cross-origin resource sharing
to host an application at one site and publish data to another.
Here are the screenshots
Offline image editor 1 with HTML 5
Offline Image Editor 2 with HTML 5
Offline Image Editor 3 with HTML 5
Rotation with Offline Image Editor
Black and White with Offline Image Editor
Naming a image with Offline Image Editor
Sign in into your twitpic account
Uploading your image into server
Uploaded pics in TwitPic
You can also check the official blog post at Mozilla Hacks here.
So what do you think? Did it really makes your work simpler? Share your feeling in form of Comments.
