Upload
elmer-houston
View
222
Download
2
Embed Size (px)
Citation preview
COM531 Multimedia Technologies
Lecture 1 - Module Overview
An introduction to Rich Internet Applications
Contact Details
Martin Doherty
MS016A
Email: [email protected]
Tel: 028 7167 5552
Ms Anne Hinds
Email: [email protected]
Times and Locations
Lecture
Tuesday, 09.15 – 11.05, Room MG122 Tutorial
Tuesday, 11.15 - 12.05, Room MG122 Practical
Monday, 12.15 – 17.05, Room MG122
Online Resources
Details of Module specification, learning outcomes, marking schemes and other
resources can be found online here
Module websitehttp://scisweb.ulster.ac.uk/~martin/
Module specificationhttp://cis.ulster.ac.uk/images/Courses/UG/MultimediaComputer_Games/com531.pdf
Module Aims
To provide students with the multimedia authoring/scripting skills necessary for designing and implementing rich internet applications
To provide students with the skills to integrate complex dynamic databases with intuitive front end user interfaces using multimedia technologies
To encourage a dynamic approach to authoring responsive interactive applications
Module Schedule
*Proposed sequence of topic presentation, circumstances permitting
Week Lecture Topic1 Introduction
Module Content2 Project Management and Web Design
Issues3 Web 2.0 Authoring Tools
Accessibility4 Expression Blend and Microsoft Silverlight
5 Introduction to PHP6 PHP and MySQL7 Adobe Flash and ActionScript
Flash CatalystAjax
8 (17/03/15) NO CLASS9 Employability31/03/13 + 07/04/13 EASTER HOLIDAYS
10(14/04/15) Human Computer InteractionEvaluation
11 Legal Issues12 Revision
Assignment WeighingAssignment 1
Due Tuesday 17th February
(week 4)
Research Paper
“Handling Multimedia on the Web”
30%
Assignment 2
Due Tuesday 15th April
(week 10)
Initial Planning 20%
Assignment 3
Due Tuesday 29th April
(week 12)
Working prototype 50%
Assignment Overview
http://scisweb.ulster.ac.uk/~martin/COM531/CW_2015.docx
Recommended Reading Ambrose Little, J. (2009), Silverlight 3 Programmer's Reference, Wiley &
Sons, ISBN 9786612274015 (electronic bk)
Gaudioso, V. (2009), Foundation Expression Blend 3 with Silverlight, Friends of Ed, 1st edition, ISBN 978-1430219507
McDonald, M. (2010), Pro Silverlight 4 in C#, ISBN 9781430229797
Albert, C. and LaVigne, F. (2010), Microsoft Silverlight 4 Business Application Development: Beginners Guide, Packt Publishing, ISBN 9781847199768
Welling, L. and Thomson, L. (2009), PHP and MySQL Web Development, Fourth Edition, Pearson Education Inc., ISBN 0-672-32916-6
Recommended Reading - Journals
IEEE Multimedia IEEE Transactions on multimedia ACM Multimedia systems
Recommended sites Macromedia Resources
http://www.adobe.com
http://www.adobe.com/products/flash/flashpro
http://www.flashkit.com Accessibility
http://www.webaim.org/howto/flash TechDis
www.techdis.ac.uk Microsoft Silverlight
http://www.silverlight.net
http://www.lynda.com/search?q=Silverlight&x=0&y=0
www.microsoft.com/expression
A Brief Introduction to the Internet
Origins ARPAnet - late 1960s and early 1970s - Network reliability - For ARPA-funded research organizations
BITnet, CSnet - late 1970s & early 1980s - email and file transfer for other institutions NSFnet - 1986 - Originally for non-DOD funded places - Initially connected five supercomputer centers - By 1990, it had replaced ARPAnet for non-military uses - Soon became the network for all (by the early 1990s)NSFnet eventually became known as the Internet
What the Internet is:A world-wide network of computer networks based on TCP/IP protocols (TCP/IP hides the differences among devices connected to the Internet )
A Brief Introduction to the Internet (2)
Internet Protocol (IP) Addresses - Every node has a unique numeric address - Form: 32-bit binary number - New standard, IPv6, has 128 bits (1998)
Organizations are assigned groups of IPs for their computers
Domain names - Form: host-name.domain-names
- DNS servers - convert fully qualified domain names to IPs
Problem: By the mid-1980s, several different protocols had been invented and were being used on the Internet, all with different user interfaces (Telnet, FTP, Usenet, mailto)
The World-Wide WebA possible solution to the proliferation of different protocols being used on the Internet
Origins- Tim Berners-Lee at CERN proposed the Web in 1989- Purpose: to allow scientists to have access to many databases of scientific work through their own computers
Document form: hypertext
- Pages? Documents? Resources? - We’ll call them documents
- Hypermedia – more than just text – images, sound, etc.
Web or Internet?The Web uses one of the protocols, http, that runs on the Internet--there are several others (telnet, mailto, etc.)
Web Browsers Mosaic - NCSA (Univ. of Illinois), in early 1993 - First to use a GUI, led to explosion of Web use - Initially for X-Windows, under UNIX, but was ported to other platforms by late 1993
Browsers are clients - always initiate, servers react (although sometimes servers require responses)
Most requests are for existing documents, using HyperText Transfer Protocol (HTTP)
But some requests are for program execution, with the output being returned as a document
Web Servers
All communications between browsers and servers use Hypertext Transfer Protocol (HTTP)
Provide responses to browser requests, either existing documents or dynamically built documents
Browser-server connection is now maintained through more than one request-response cycle
Web servers run as background processes in the operating system
Monitor a communications port on the host, accepting HTTP messages when they appear
Web servers have two main directories:
1. Document root (servable documents) 2. Server root (server system software)
URLsGeneral form:
scheme:object-address
The scheme is often a communications protocol, such as telnet or ftp
For the http protocol, the object-address is: fully qualified domain name/doc path
For the file protocol, only the doc path is needed
Host name may include a port number, as in zeppo:80 (80 is the default, so this is silly)
URLs cannot include spaces or any of a collection of other special characters (semicolons, colons, ...)
The doc path may be abbreviated as a partial path
The rest is furnished by the server configuration, if the doc path ends with a slash, it means it is a directory
Multipurpose Internet Mail Extensions (MIME)
Originally developed for email Used to specify to the browser the form of a file returned by the server (attached by the server to the beginning of the document)
Type specifications - Form: type/subtype - Examples: text/plain, text/html, image/gif, image/jpeg
Server gets type from the requested file name’s suffix (.html implies text/html)
Browser gets the type explicitly from the server
Experimental types
- Subtype begins with x- e.g., video/x-msvideo
Experimental types require the server to send a helper application or plug-in so the browser can deal with the file
The HyperText Transfer ProtocolThe protocol used by ALL Web communications
Request Phase
Form: HTTP method domain part of URL HTTP ver. Header fields blank line Message body
An example of the first line of a request: GET /cs.uccp.edu/degrees.html HTTP/1.1
Most commonly used methods: GET - Fetch a document POST - Execute the document, using the data in body HEAD - Fetch just the header of the document PUT - Store a new document on the server DELETE - Remove a document from the server
The HyperText Transfer Protocol (2)
Four categories of header fields:
General, request, response, & entity
An example of a complete response header:
HTTP/1.1 200 OKDate: Sat, 25 July 2009 20:15:11 GMTServer: Apache /2.2.3 (CentOS)Last-modified: Tues, 18 May 2004 16:38:38 GMTEtag: "1b48098-16a-3dab592dc9f80"Accept-ranges: bytesContent-length: 364Connection: closeContent-type: text/html, charset=UTF-8
Both request headers and response headers must be followed by a blank line
SecurityThere are many kinds of security problems with the Internet and the Web
One fundamental problem is getting data between a browser and a server without it being intercepted or corrupted in the process
Security issues for a communication between a browser and a server: (e.g. credit card)
1. Privacy – it must not be possible for the credit card number to be stolen on its way to the company’s server
2. Integrity – it must not be possible for the credit card number to be modified on its way to the company’s server
3. Authentication – it must be possible for both the purchaser and the seller to be certain of each other’s identity
4. Nonrepudiation – it must be possible to prove legally that the message was actually sent and received
SecurityThe basic tool to support privacy and integrity is encryption
If the sender and the receiver both use the same encryption key, the key must be transmitted from the sender to the receiver
Solution: (1976, Diffie and Hellman) - Public-key encryption
Use a public/private key pair•Everyone uses your public key to encrypt messages sent to you•You decrypt them with your matching private key•It works because it is virtually impossible to compute the private key from a given public key
RSA (Ron Rivest, Adi Shamir, Leonard Adleman, 1977) is the most widely used public-key algorithm
Security
Another security problem: destruction of data on computers connected to the Internet
Another - Viruses and worms
Yet another common security problem: Denial-of-Service (DoS) - created by flooding a Web server with requests – often using networks of virally infected ‘zombie’ computers
Rich Internet Applications
Technologies that go beyond the aging HTML standard
- Idea of a “rich client”, a user interface that is more robust, responsive, and visually interesting than what can be achieved with HTML
- Rich Internet Application (RIA) technologies allow the deployment of rich clients over the internet with Web-like simplicity
- RIAs use client-side rendering engines that can present very dense, responsive, and graphically rich user interfaces
- Offering a wider variety of controls (sliders, date pickers, windows, tabs, etc.)
- Data can be cached in the client, allowing a vastly more responsive user interface and fewer round trips to the server than with HTML
Traditional approach
1. Initial Selection 2. Available Flights 3. Confirm Flights
4.Details 5. Credit card entry 6. Confirmation
Rich Internet Applications
Typical architecture
Typical architecture for an RIA where XML is generally used as the data transfer format
Client usually stays connected to the data source, so server updates client in real time
Access to database is accomplished with Web service calls
Rich Client Technologies
For further examples, see:www.silverlight.net/showcase/category/rich-media
Web Developer Toolkit - HTML
HTML-based applications became popular because the cost of deployment was low and the architecture was simple
HTML was trivially easy to learn and use Trade-off between user interface functionality against
immediate access to new data and applications Some applications not suited to HTML implementation and
may require several page redraws to complete a transaction Leads to unacceptably slow interaction In addition in HTML even simple interactivity can require a lot
of scripting to get the job done Browsers still limited by name/value pairs
XHTMLTo describe the general form and layout of documents
An XHTML document is a mix of content and controls
Controls are tags and their attributes - Tags often delimit content and specify something about how the content should be arranged in the document - Attributes provide additional information about the content of a tag
Tools for creating XHTML documents
XHTML editors - make document creation easier - Shortcuts to typing tag names, spell-checker
WYSIWYG XHTML editors (Frontpage, Dreamweaver) - Need not know XHTML to create XHTML documents
Plug ins - Integrated into tools like word processors effectively converting them to WYSIWYG XHTML editors
Filters - Convert documents in other formats to XHTML
Advantages of both filters and plug-ins:
Existing documents produced with other tools can be converted to XHTML documents
Use a tool you already know to produce XHTML Disadvantages of both filters and plug-ins:
XHTML output of both is not perfect – must be fine tuned
XHTML may be non-standard
You have two versions of the document, which are difficult to synchronize
XMLA meta-markup language, used to create a new markup languagefor a particular purpose or area
As the tags are designed for a specific area, they can be meaningful
No presentation details
A simple and universal way of representing and transmitting data of any textual kind
JavaScriptA client-side XHTML-embedded scripting language, only related to Java through syntax
Dynamically typed and not object-oriented
Provides a way to access elements of XHTML documents and dynamically change them
Macromedia Flash
Macromedia Flash is a mature commercial product for bringing interactive graphics to Web pages
A system for building and displaying text, graphics, sound, interactivityand animation (movies) - includes features for building forms-style applications
Supports both motion and shape animation
Interactivity is supported with ActionScript
-Widely deployed front-end technology on the Web, claiming up to 98% penetration across all desktops
Two parts: 1. Authoring environment 2. Player
PHPA server-side scripting language
Similar to JavaScript
Great for form processing and database access through the Web
AjaxAsynchronous JavaScript + XMLNo new technologies or languages
Much faster for Web applications that have extensive user/server interactions
Uses asynchronous requests to the server
Requests and receives small parts of documents, resulting in much faster responses
Java Web Software
Java allows creation of complex client applications
Main drawback of using Java for rich clients is its complexity (even simple forms and graphics require dozens of lines of complex code)
- Servlets – server-side Java classes
- JavaServer Pages (JSP) – a Java-based approach to server-side scripting - An alternative to servlets
- JavaServer Faces – adds an event-driven interface model on JSP
ASP.NETDoes what JSP and JSF do, but in the .NET environment
Allows any .NET language to be used as a server-side scripting language
ASP.NET documents are compiled into classes
RubyA pure object-oriented interpreted scripting language
Every data value is an object, and all operations are via method calls
Most operators can be redefined by the user Both classes and objects are dynamic
Variables are all type-less references to objects
RailsA development framework for Web-based applications
Particularly useful for Web applications that access databases
Written in Ruby and uses Ruby as its primary user language
Based on the Model-View-Controller (MVC) architecture
Silverlight
Offers a new set of features for building light-weight, sandboxed companion experiences for the Web that run on the desktop
Enables the application to be placed in a restricted store on the user’s machine; and then provide a link directly to it from the user’s desktop or start menu. An application can now be easily found on the user’s desktop or start menu, and launched with a single click
It can test if the network is connected, it can update itself, and can also have access to Isolated Storage
Tools applied in COM531
Microsoft Expression Blend Microsoft Silverlight PHP and MySQL
Others of interest but not included directly are Adobe (Macromedia) Flash, Actionscript, Flash Catalyst