Upload
others
View
1
Download
0
Embed Size (px)
Citation preview
ECE 750‐T11 Component‐Based Software SystemsProject Presentation ‐IINilam Kaushik (Group 7)
University of Waterloo ‐ Faculty of Engineering
7/27/2009 2
OutlineRecap of PresentationRecap of Presentation‐‐II
Vector vs raster graphics ProblemApproach
Evaluation Results/Further enhancements Goals/Expectations References/Questions
27/27/2009 ECE 750-T11 Project Presentation-II
7/27/2009 3
Vector vs. raster graphics
Scalable Vector Graphics• based on paths • XML language describing two‐dimensional graphics• open standard developed by the W3C consortium
Raster graphics• based on pixels • bitmap graphics: jpg, gif, bmp• used for pictures [1]
37/27/2009 ECE 750-T11 Project Presentation-II
7/27/2009 4
Advantages of SVG
open standard zoom without loss of quality scalable, smaller and more compressible than jpg, gifcreate dynamic content
animations database integration
support for multiple programming/scripting languages – Javascript, Java etc
7/27/2009 ECE 750-T11 Project Presentation-II 4
7/27/2009 5
Proposed project
Motivationday to day problem at work
The problemexploring the challenges involved with creating a specific genre of interactive mapping applications with SVG for resource constrained devices in areas where a GPS cannot be used
Other possible areas of application maps of zoos, parks, museums (web and mobile based)
57/27/2009 ECE 750-T11 Project Presentation-II
7/27/2009 6
3‐tier application
67/27/2009 ECE 750-T11 Project Presentation-II
7/27/2009 7
Tiers in detail
Presentation tier : the UI • component to access the application (as a downloadable jad file) on mobile device
• component to render the map on mobile device Business logic tier• component to handle the user events e.g touch events• zooming, panning, searching for text, annotationsDatabase tier • server from which user can download the application
77/27/2009 ECE 750-T11 Project Presentation-II
7/27/2009 8
Event handling in SVGEvent: a message about a user or system input that notifies state changes or user input within an application[5]UI Events
FocusinFocusoutActivate
Mouse Eventsmouseoverclick
SVGEventsSVGLoadSVGZoom
7/27/2009 ECE 750-T11 Project Presentation-II 8
7/27/2009 9
Event handling mechanism
Application implements org.w3c.dom.events.EventListener interfacePublish‐subscribe communication
7/27/2009 ECE 750-T11 Project Presentation-II 9
_myRect =(SVGElement)_document.getElementById("Room208”); _myRect.addEventListener("DOMActivate", this, false);_myRect.addEventListener("DOMFocusIn", this, false);_myRect.addEventListener("DOMFocusOut", this, false);
public void handleEvent(Event evt){ if(evt.getType().equals("DOMFocusIn")){
_currentFocusInElement = (SVGElement)evt.getCurrentTarget();if(_currentFocusInElement == _myRect){
_animator.invokeLater( new Runnable(){public void run(){
_currentFocusInElement.setFloatTrait("fill-opacity", 0.25f);_currentFocusInElement.setFloatTrait("stroke-opacity", 0.1f);
_display.setTrait("display", "inline"); _displayName.setTrait("#text", "Room#");
}
7/27/2009 10
Design
ECE 750-T11 Project Presentation-II
7/27/2009 11
OutlineRecap of Presentation‐I
Vector vs raster graphics ProblemApproach
EvaluationEvaluationResults/Further enhancements Goals/Expectations References/Questions
117/27/2009 ECE 750-T11 Project Presentation-II
7/27/2009 12
Evaluation
compare with raster based maps use case diagram
extensibility/re‐usabilityporting to a J2ME device as MIDlet
complexity in terms of size of the end deliverable(cod/jad file) user experience
7/27/2009 ECE 750-T11 Project Presentation-II 12
7/27/2009 13
Zoom Image
Pan Image
Search
Rotate Image
Play media
Navigate toanother map
User
Use Case Diagram
ECE 750-T11 Project Presentation-II
7/27/2009 14
Extensibility
Platform dependency Convert BlackBerry app to a MIDlet
possible loss of functionalityCustom event handling
Re‐use the SVG documentsimply change screen dimensions
ECE 750-T11 Project Presentation-II
7/27/2009 15
MIDlet
application that uses Mobile Information Device Profile (MIDP) or Connected Limited Device Configuration (CLDC) APIsruns on devices supporting Java MEused widely for gaming
ECE 750-T11 Project Presentation-II
7/27/2009 16
Use “Form” components to aggregated items
More sophisticated layout and interaction
“Write once, run everywhere”Platform dependent
Only one default CommandListener, need to create listeners for specific events
use native keyboard/touch events
custom MIDlet extends MIDletcustom application extends UiApplication
import javax.microedition.lcduiimport net.rim.device.api.ui
MIDletBlackBerry Application
ECE 750-T11 Project Presentation-II
7/27/2009 17
OutlineRecap of Presentation‐I
Vector vs raster graphics ProblemApproach
EvaluationResults/Further enhancementsResults/Further enhancementsGoals/Expectations References/Questions
177/27/2009 ECE 750-T11 Project Presentation-II
7/27/2009 18
Results (from Presentation‐I)
Chose the development platform touch device (pointer events)
Chose between ECMAscript and Java Evaluated toolkits
Batik, Plazmic, InkscapeAssessed supported attributes/limitations
187/27/2009 ECE 750-T11 Project Presentation-II
7/27/2009 19
Further enhancements
custom tooltips and fields for media linking to another SVG document: possible recommendation?special zoom/pan buttons within image vs menususe of accelerometer
ECE 750-T11 Project Presentation-II
7/27/2009 20
Workflow
Design
Implementation
Deployment
Testing/Debugging
ECE 750-T11 Project Presentation-II
7/27/2009 21
OutlineRecap of Presentation‐I
Vector vs raster graphics ProblemApproach
Evaluation Results/Further enhancementsResults/Further enhancementsGoals/Expectations Goals/Expectations References/Questions
217/27/2009 ECE 750-T11 Project Presentation-II
7/27/2009 22
Goals/Expectations
Goal: explore the level of interactivity that can be achieved with SVG attributes
Expectation from project: illustrate that interactive maps based on SVG can provide richer functionality to user than raster images
227/27/2009 ECE 750-T11 Project Presentation-II
7/27/2009 23
References
[1] Doughty Mike, “Two Kinds of Computer graphics”, 1998. [Online] . Available: http://www.sketchpad.net/basics1.htm [July 11]
[2] Toronto Zoo, “TorontoZoo_Map2008”, 2008. [Online]. Available: http://www.torontozoo.com/pdfs/TorontoZoo_Map2008.jpg
[3] World Wide Web Consortium, “Mobile SVG Profiles: SVG Tiny and SVG Basic”, W3C Recommendation, 2003. Available: http://www.w3.org/TR/SVGMobile12/
[4] Plazmic Inc., “ SVG for BlackBerry SmartPhones”, October , 2008. Available: http://www.plazmic.com/en/pdfs/SVG_for_BlackBerry_Smartphones.pdf.
[5] Carto:net, “Event Handling in SVG Applications”, 2007. Available: http://www.carto.net/papers/svg/eventhandling/index.shtml
[6] E.Gamma, R. Helm, R. Johnson, and J. Vlissides, Design Patterns: Elements of Reusable Object-Oriented Software. Boston, MA: Addison-Wesley, 1995.
[7] Olsen Dan, Developing User Interfaces. San Fransisco, CA: Morgan Kauffman, 1998 [8] Research In Motion Ltd, “BlackBerry MIDlet Developer Guide,” February, 2006. Available:
http://na.blackberry.com/eng/deliverables/612/BlackBerry_MIDlet_Developer_Guide.pdf.
237/27/2009 ECE 750-T11 Project Presentation-II
7/27/2009 247/27/2009 ECE 750-T11 Project Presentation-II 24