here - Sam Krehnbrink's Blog

excitingwonderlakeInternet και Εφαρμογές Web

13 Δεκ 2013 (πριν από 3 χρόνια και 10 μήνες)

109 εμφανίσεις

FlickShotPhoto!

An Image Search Mashup Application

By Sam Krehnbrink

2

Overview

Image Search


Allow users to perform keyword searches for images
found on pages and photo communities in the web.

Mashup


Web Application built upon services of existing
applications






Google
Maps

Craigslist

http://www.housingmaps.com

3

= Image

Overview

FlickShotPhoto!


Flick
r + Web
shot
s +
Photo
bucket + Yahoo
!


Basic Utility


Aggregate image search


results from a variety of


sources


WEB

Flickr

Yahoo!

Photobucket

Webshots

FlickShotPhoto

4

Goals

Learn Mashups


Web Services

Learn new Technologies


PHP


CSS


Javascript/AJAX

Explore New Image Searching Features


Existing Application have few features


5

Image Search Applications


Google

6

Image Search Applications


Yahoo

7

Features


Keyword Search


Results organized by service provider


Results displayed in table format on a per page basis with links
between pages


Save Image


Users can save individual images to local disk


Edit Image


Link images to photo editing service (Snipshot)


Clipboard


Images may be added to a clipboard for later use


Email Image


Allow users to email images

8

Services

Flickr

Service:

API


Request/
Response Formats:

REST, XML
-
RPC, SOAP, JSON, PHP

API kits available that wrap the Flicker API (phpFlickr)


Yahoo

Service:

API


Request/
Response Formats:

XML, JSON, PHP

Zend Framework offers an API wrapper of Yahoo Search services

Webshots

Service:

RSS Feeds

MagpieRSS is a PHP RSS parser that allows for easy parsing of RSS feeds

Photobucket

Service:

None

PHP HTTP API used to request Photobucket pages

PHP DOM API used to parse HTML response


9

Implementation Tools


Aptana


IDE focusing on web application development


Provides Code Assist for HTML/CSS/Javascript


Available standalone or as an Eclipse plugin


PDT Project


Eclipse plugin providing PHP development tools


Firebug


Firefox add
-
on offering live HTML/Javascript debugging of any web page

No Errors

10

Design

Request

imageSearch.php

index.php

phpFlickr

Magpie RSS

Zend

Session

-
Last Result

-
Clipboard

Flickr

Webshots

Yahoo

Photobucket

Response

11

Design

index.php

Javascript

CSS

<html>


<head>





</head>


<body>





</body>

</html>

clipboard.php

Session

AJAX

save.php?url=<Image Path>

save.php

12

Demo

http://www.krehnbrink.com/imagesearch


13

Questions