Project is far from bug-free and for example Android app is missing some components like BugSense/Crittercism for bug reporting, Flurry/Localytics for analytics which are required for production version etc. but the "core" is working.
I tried to experiment with MongoDB (because of it's geolocational native features) and Java on the server but the jury decided that for the sake of simplicity only SQL databases are supported and therefore my fallback was the PHP-MySQL version because I knew I could finish on-time (I have some experience in PHP/MySQL).
Project made for Best Code Challenge 3.0 (student competition in programming at Faculty of Electrical Engineering and Computing @ Zagreb, Croatia) according to competitions specifications in ~3-4 days (official deadline was 10 days). The goal was to made the 'ImageWall' - think of it like the TwitterWall but with images.
Every image can have description, tag and location and can be searched on specific tag.
UPDATE: I won 2nd place. The reasons why I didn't won the first place (according to jury) are the bugs on the server side (division by zero), sometimes the refreshed image (via AJAX) was corrupted and (probably code?) documentation was not sufficient.
Notice: I won the 1st place on Best Code Challenge v2.0.
###This project takes leverage of...
PHP, MySQL, Java, Android, Google Maps, JavaScript, jQuery, CodeIgniter, Google GSON, AJAX, REST API, MVC pattern, ORMLite, Little Fluffy Location, Android Asynchronous Http Client, LRU Cache, PullToRefresh...
###Project architecture
application/models
application/views
application/controllers
Mobile application and web-page are connected to REST API. System is based on CodeIgniter framework with the help of CodeIgniter Rest Server library.
####Database
MySQL database consists of 3 tables:
- images
- tags
- locations
####Image resize
To improve the performance of the smartphone app all resizing is made on the server via class.upload.php library into 5 different sizes
- original
- default size on the web (when single image is viewed)
- thumbnail size when the collection of images are viewed (for ex. searching on some tag)
- thumbnail size when looking at collection from
iframe
container - thumbnail size for Android devices
####Duplicates
It's not possible to insert two same images on the service, in any timespan - every image is hashed via SHA-1
hash and that
hash is inserted into the database.
// TODO: Loose the restriction and if the timespan is large enough, still enable the possibility to put 2 identical
images. Requirement: autentification via user accounts (which aren't made in the scope of this project).
application/models
application/views
application/controllers
Here it's also used CodeIgniter framework with the clear MVC design pattern. To make a connection
onto REST API there is small wrapper which uses cURL wrapper library and it just uses simple
GET (or POST to upload) and JSON decoding via PHP's json_decode
.
####Embedded view
If you want to show the images into embededd
view - inside iframe
container you should add type=iframe
parameter onto
/images?tag=myTag
url which is used to retrieve 'classic' web page. So if you request it without parameter you'll get normal web page,
if you add the parameter you'll get embedded view of the same page.
####Live refresh
Live refresh is enabled every 10 seconds via AJAX and if there are some new images from REST API - they'll show on the web-page via jQuery library with the help of some JavaScript interval.
####Google Maps In order to show the image location I used Google Maps JavaScript API v3.
####Screenshots
src/com/svenkapudija/imagewall/*
res/*
Application is connected to REST API to get the new information and uses 2 levels of cache to store Bitmaps
- in memory
caching and disk caching (actually SD-card). For in-memory cache LRU Memory Cache
is used.
For client-side library that connects to REST API I used Asynchronous Http Client as the main UI thread would remain free and responsive.
Mapping between JSON (from REST API) and Java classes is done with the help of Java reflection - GSON library which does it without any kind of annotations.
Storing data into SQLite database (information about images, tags and locations) is done with the help of ORMLite library.
To retrieve user location application uses passive location retrieval (and active if passive wasn't precise enough)
with the help of Little Fluffy Location library.
passive location retrieaval means that if some other application on your phone (for ex. Google Maps) already retrieved
your location via GPS, there is no need to retrieve it again and waste the battery but other applications can just
pick it up - better retrieval speed and better efficiency.
For image retrieaval from camera or gallery I used personal small library - ImageChooser.
####PullToRefresh
There is no button for refresh but application uses UI design pattern 'Pull To Refresh' with the help of Pull To Refresh library.
####Search
Search (by tag) is implemented on the Search
key on the device itself as well as in the button in the action bar which
opens default Android implementation of the Search Bar.
####Google Maps API
All images that have location available (user sent the location bundled with the image on the upload) are viewable on the Google Maps.
####Compatibility
Application supports everything from Android version 2.2, Froyo (API level 8).
####Devices
Application is tested on the HTC Desire Android 2.3.
####Screenshots
####Other
- Git is used as the DVCS system
- design elements (web and mobile) are done with the help of The Bricks Frameowork
- Sven Kapuđija
Copyright 2012 Sven Kapuđija
Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at
http://www.apache.org/licenses/LICENSE-2.0
Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.