EEC4113Data Communication &

Multimedia SystemChapter 10: Presentation Layer – Data

Formatting

by Muhazam Mustapha, November 2013and contributions by class members, October 2010

Learning Outcome

• By the end of this chapter, students are expected to be able to understand formatting of data especially with XML standard and standardization of Unicode

Chapter Content

• ASN.1 Data Formatting

• XML– XML Based Language– XML Based Data

• Unicode

ASN.1 Data Formatting

CO1

Data Formatting

• Presentation layer lies between application and session layer

• Application layer deals with human readable data

• Presentation layer is responsible to convert the data into more machine readable for lower layers

CO1

Data Formatting

• Not only handling the conversion between application and the lower layers, presentation layer also needs to handle the different platforms exist at application layer– e.g. MS Windows, Linux, Solaris, VAX

• Conversion of data among, and, from these platforms should comply to the standards in the lower layers

CO1

Abstract Syntax Notation One

• Abstract Syntax Notation One (ASN.1) was the earliest work done on standardization of data format

• Only define the abstract syntax but does not restrict the way of doing encoding

• ASN.1 defines a general rule of formatting and a few specific rules

CO1

ASN.1 General Rules

• Looks like C syntax

• Example:FooProtocol DEFINITIONS ::= BEGIN

FooQuestion ::= SEQUENCE {

trackingNumber INTEGER,

question IA5String

}

FooAnswer ::= SEQUENCE {

trackingNumber INTEGER,

answer BOOLEAN

}

END

Example of use:

myQuestion FooQuestion ::= {

trackingNumber 5,

question "Anybody there?"

}

myAnswer FooAnswer ::= {

trackingNumber 6,

answer False

}

CO1

ASN.1 Specific Rules

• Basic Encoding Rules (BER)– Canonical Encoding Rules (CER)– Distinguished Encoding Rules (DER)

• XML Encoding Rules (XER)

• Packed Encoding Rules (PER)

• Generic String Encoding Rules (GSER)

CO1

Basic Encoding Rules (BER)

• Has 2 subsets: CER, DER– DER states data size,– CER puts end of data marker

• DER Example (from previous slide):30 -- tag indicating SEQUENCE

13 -- length in octets

02 -- tag indicating INTEGER

01 -- length in octets

05 -- value

16 -- tag indicating IA5String

0e -- length in octets

41 6e 79 62 6f 64 79 20 74 68 65 72 65 3f -- value ("Anybody there?" in ASCII)

CO1

XML Encoding Rules (XER)

• Makes use of XML standard

• Example (from previous slide):<FooProtocol>

<FooQuestion>

<trackingNumber>5</trackingNumber>

<question>Anybody there?</question>

</FooQuestion>

<FooAnswer>

<trackingNumber>6</trackingNumber>

<answer>False</answer>

</FooAnswer>

</FooProtocol>

CO1

Packed Encoding Rules (PER)

• More packed (compressed) version of BER

• It is used if limiting values of data is known

• No. bits for data can be limited to cover just the range of value

CO1

Generic String Encoding Rules

• Version of ASN.1 that uses human readable text format

• Used only in LDAP (Lightweight Directory Access Protocol) for publishing distributed computing services

CO1

Extensible Markup Language (XML)

CO1

Impact of WWW

• ASN.1 remains as machine to machine data transfer standard

• Even though ASN.1 can be sent as XML (XER) but the two have no direct common predecessor – they more like hybrid

• ASN.1 is still not human readable enough

• But XML is, hence XML is more popular for the web

CO1

Impact of WWW

• The plain text format of XML has both flavors – human and machine readability

• Human can easily read XML from its tags, attributes and values

• Machines have been equipped with an enormous no. APIs to handle XML– the nature of XML makes it easy to write APIs

for it

CO1

SGML vs XML vs HTMLSGML

Standard Generalized Markup Language

Simplified,loosen rules,applied to web layout definition

HTMLHypertext Markup

Language

XMLExtensible Markup

Language

Simplified,keep most useful

features,applied to data

transfer

XHTMLExtensible Hypertext Markup Language

Re-tighten rules,not forgiving,not popular

XML-defined Language

XML-formatted Data

Mozilla’s XUL

Microsoft’s XAML

. . .

GIS’s GML

Google’s KML

. . .

MathMLSVG

CO1

Common Misconceptions

• XML and HTML are the same– Not true – XML and HTML may just look the

same– XML tags are user defined– HTML tags are fixed standard

• XML is just another kind of web page– Not true – HTML is for web, XML is for data

transfer

CO1

XML Structure

• XML consists of tags bounded data

• There will be pairs of tags:– Opening tags: <tagname>– Closing tags: </tagname>

• Values (content) of XML elements are denoted by a pair of opening and closing tags:<distance>50</distance>

CO1

XML Structure

• Some tags are defined not to have value:<empty />

• Tags can have attributes to tell some properties of the content:<distance unit="km" >50</distance>

– attribute unit tells that the value of distance is in “km”

CO1

XML Structure

• Data in XML file are arranged hierarchically – nested<car>

<brand>Proton</brand>

<model>Waja</model>

<spec>

<capacity unit="cc">1200</capacity>

<door>4</door>

</spec>

</car>

CO1

Support Document

• XML file needs a separate file to define the tags’ values and attribute

• The link to the support file is given some where at the top of the XML file

• Two most popular ways to define XML tags:– DTD (Document Type Definition)– XSD (XML Schema Document)

CO1

Support Document

• DTD example:<?xml version="1.0" encoding="UTF-8"

standalone="no"?>

<!DOCTYPE people_list SYSTEM "example.dtd">

<people_list>

<person>

<name>Fred Bloggs</name>

<birthdate>2008-11-27</birthdate>

<gender>Male</gender>

</person>

</people_list>

example.dtd:

<!ELEMENT people_list (person)*>

<!ELEMENT person (name, birthdate?, gender?, socialsecuritynumber?)>

<!ELEMENT name (#PCDATA)>

<!ELEMENT birthdate (#PCDATA)>

<!ELEMENT gender (#PCDATA)>

<!ELEMENT socialsecuritynumber (#PCDATA)>

CO1

Support Document

• XSD example:<?xml version="1.0"?>

<p xsi:noNamespaceSchemaLocation="example.xsd" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance">

Hello world!

</p>

example.xsd:

<?xml version="1.0"?>

<xsd:schema xmlns:xsd="http://www.w3.org/2001/XMLSchema">

<xsd:element name="p" type="xsd:string"/>

</xsd:schema>

CO1

XML Defined Language

CO1

XML Defined Language

• There are hundreds of languages defined using XML along side with its own XSD

• The language defines its own set of tags

• Normally the languages can work with JavaScript

• Examples:– Scalable Vector Graphics (SVG)– XUL (XML User Interface Language)– XAML (Extensible Application Markup

Language)CO1

SVG• Vector graphic image for web pages• Defines resolution free drawing objects• Created by Adobe• Besides vector graphics, it also provides

support for:– Embedded raster image– Text Printing– Gradients– Filter

• More details in PBLCO1

XUL

• XUL or XML user interface markup language is an upgrade version of XML

• It was develop by the Mozilla project – intended to develop a way to design a desktop application with web programming technology

XUL Slides contributed by: MUHAMMAD AZIZOL BIN AMINUDDIN,MOHAMAD JAMAL BIN KAMARUDIN

CO1

XUL

• History:

1998 Mozilla switches development to NG Layout rendering engine, decides to completely overhaul the browser

New browser will use XML-based language for quick cross-platform UI development: XUL is born

1999 Milestone 4 released, community’s first good look at XUL + themes

2000 Netscape 6 released, based on Mozilla 0.6, first major product using XUL for UI

CO1

XUL

• XUL is not a programming language but a markup language– Any programming feature required, can be

included as JavaScript

• Can be viewed on Mozilla Gecko layout engine such as FireFox and Flock

• Can be standalone application

• XUL is part of (Cross Platform Front End) XPFE family

CO1

XUL

• Example:

<?xml version="1.0"?>

<?xml-stylesheet href="chrome://global/skin/" type="text/css"?>

<window id="hello_world" title="Hello World Example by Jamal and Azizol" xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">

<box>

<button id="Hello World!" label="Hello World!"/>

</box>

</window>

CO1

XAML• XAML stands for eXtensible Application

Markup Language• It function as HTML for Windows

applications, but it is really quite a bit more expressive and powerful

• XAML is used extensively in .NET Framework 3.0 & .NET Framework 4.0 technologies, particularly Windows Presentation Foundation(WPF), Silverlight, and Windows Workflow Foundation(WF).

XAML Slides contributed by: MUHAMAD SAFWAN BIN ZAMRI,KRITHARAN A/L SUPRNIOMCO1

XAML• A XAML file can be compiled into a .baml

(Binary XAML) file, which may be inserted as a resource into a .NET Framework assembly.

• When used in Windows Presentation Foundation, XAML is used to describe visual user interface

CO1

XAML• WPF allows for the definition of both 2D

and 3D objects, rotations, animations, and a variety of other effects and features.

• XAML can’t be embedded in HTML.

CO1

XAML• Silverlight Example: Silverlight

project

CO1

XAML• The given default Page.xaml code (added

1 line of code):

<Canvas x:Name="parentCanvas"xmlns="http://schemas.microsoft.com/client/2007" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" Loaded="Page_Loaded" x:Class="SilverlightProject1.Page;assembly=

ClientBin/SilverlightProject1.dll"Width="640"Height="480"Background="White">

<TextBlock Text="Hello World" FontSize="50"/>

</Canvas>

Added line

CO1

XAML• Output:

CO1

XML Formatted Data

CO1

XML Formatted Data

• The data is defined by a set of XML tags and XSD

• The limit and type of data depends on application and vendor

• Example:– MathML– GML (Geography Markup Language)– KML (Google Map’s Keyhole Markup

Language)CO1

MathML

• Option for writing complex mathematical expression on web pages

• Defines mathematical expression as structures

• Proposed by W3C

• More details in PBL

CO1

GML Geography Markup Language• A modeling language and an encoding for

geographic information

• Designed for the web and web-based services

• An XML encoding for the transport

• Storage of geographic information, including the geometry and the properties of geographic features between distributed systems.

GML Slides contributed by: NORZHAFRE HAZWAN BIN ZAINUDIN,EMMA EMELIA BINTI BARHATH ALI CO1

GML• Based on XML technologies (W3C)

• Implements concepts of the ISO 19100 series

• Supports spatial and non-spatial properties of objects

• Open and vendor-neutral and extensible

• Supports the definition of profiles (proper subsets) of the full GML capabilities

CO1

GML

Road

name

class

maintainer

I95

Interstate

DOT xyz

centerLine gml:Curve

• Modeling feature types

Building an information community reaching consensus about the vocabulary (feature types and their properties)CO1

GML• Geospatial Web

– Information Communities publish their Application Schemas (preferably in some sort of registry) so that it can be found, accessed and understood by others

– This enables that also the features can have properties whose values are maintained by other authorities

• a web of geospatial features is created

Roads

Parcels

TrafficMessages

AdministrativeBoundariesBuildings

CO1

GML• Examples:

Solid Model in VRML

GML Data

x-plane z-plane

y-plane

SVG Views

Slide from Galdos Inc.

CO1

GML• Example (test.gml):<?xml version="1.0" encoding="UTF-8"?>

<gml:FeatureCollection xmlns:gml="http://www.opengis.net/gml">

<gml:featureMember>

<LAYER>

<attrib1>attrib1_value</attrib1>

<attrib2container>

<attrib2>attrib2_value</attrib2>

</attrib2container>

<location1container>

<location1>

<gml:Point>

<gml:coordinates>3,50</gml:coordinates>

</gml:Point>

</location1>

</location1container>

<location2>

<gml:Point>

<gml:coordinates>2,49</gml:coordinates>

</gml:Point>

</location2>

</LAYER>

</gml:featureMember>

</gml:FeatureCollection> CO1

GML• Associated .gfs:<GMLFeatureClassList>

<GMLFeatureClass>

<Name>LAYER</Name>

<ElementPath>LAYER</ElementPath>

<GeometryElementPath>location1container|location1</GeometryElementPath>

<PropertyDefn>

<Name>attrib1</Name>

<ElementPath>attrib1</ElementPath>

<Type>String</Type>

<Width>13</Width>

</PropertyDefn>

<PropertyDefn>

<Name>attrib2</Name>

<ElementPath>attrib2container|attrib2</ElementPath>

<Type>String</Type>

<Width>13</Width>

</PropertyDefn>

</GMLFeatureClass>

</GMLFeatureClassList>

CO1

GML• The output of ogrinfo test.gml -ro -al is

Layer name: LAYER

Geometry: Unknown (any)

Feature Count: 1

Extent: (3.000000, 50.000000) - (3.000000, 50.000000)

Layer SRS WKT: (unknown)

Geometry Column = location1container|location1

attrib1: String (13.0)

attrib2: String (13.0)

OGRFeature(LAYER):0

attrib1 (String) = attrib1_value

attrib2 (String) = attrib2_value

POINT (3 50)

CO1

KML Keyhole Markup Language• Keyhole Markup Language (KML) is an

XML-based language schema for expressing geographic annotation and visualization on Internet-based, two-dimensional maps and three-dimensional Earth browsers

• KML was developed for use with Google Earth, which was originally named Keyhole Earth Viewer

KML Slides contributed by: TUAN MOHD KHAIRI BIN TUAN MAT,NIK MOHAMAD RUKMAL HAKIM BIN ROKMAN CO1

KML• It was created by Keyhole, Inc, which was

acquired by Google in 2004

• The name "Keyhole" is an homage to the KH reconnaissance satellites, the original eye-in-the-sky military reconnaissance system first launched in 1976

• KML is an international standard of the Open Geospatial Consortium

• Google Earth was the first program able to view and graphically edit KML files

CO1

KML

<?xml version="1.0" encoding="UTF-8"?><kml xmlns="http://earth.google.com/kml/2.1"><Document><name>Flat Region</name><Region><LatLonAltBox><north>37.430419921875</north><south>37.41943359375</south><east>-122.080078125</east><west>-122.091064453125</west></LatLonAltBox><Lod><minLodPixels>128</minLodPixels></Lod></Region><GroundOverlay><name>Mountain View DOQQ</name><Icon><href>files/image.JPEG</href></Icon><LatLonBox><north>37.430419921875</north><south>37.41943359375</south><east>-122.080078125</east><west>-122.091064453125</west></LatLonBox></GroundOverlay> <Document> </kml>

• Code Example:

CO1

KML• View Example (SVG):

CO1

Unicode

CO1

Unicode

• Coding system to standardize the encoding of all characters that ever existed and ever used by mankind– Including ancient Egyptian hieroglyphic if

possible

• Problem with older coding system (like ASCII): normally only 8 or 7 bits which normally limited to encoding English characters (Basic Latin)

CO1

Unicode

• Unicode uses 16 bit: > 65k characters - syntax: U+nnnn – called code point

• Supposed to be able to encode almost all characters ever existed except Chinese-Japanese-Korean (CJK) ideograph

• For character set that are too large (like CJK), Unicode applies a scheme called surrogate pairs that combine the code to become a 20 bit code – 1 million chars

CO1

Unicode Consortium

• Unicode is maintained by Unicode Consortium: http://www.unicode.org/

• Current version is Unicode 6.1 (as of January 2012)– UPNM library has a copy of Unicode 5.0

• Users of Unicode can download chapters of the Unicode from the website for free

CO1

Coding Approach

• The first 128 character points are the same as ASCII (referred to as Basic Latin)

• The rest of the code space is divided into characters of various languages as well as different usage– Language: Greek, Balinese, Thai, Arabic, etc– Usage: Mathematical symbols, drawing lines,

other symbols

CO1

Coding Approach

• Unicode is to encode different characters differently even if the glyph (drawing / rendering of the character) of the characters are the same

• Example: Basic Latin (English) capital A and Greek capital Alpha are normally rendered the same in many systems, Unicode gives them different code since they are DIFFERENT characters

CO1

Coding Approach

• Unicode is to encode the same characters equally even if the glyph of the characters are different

• Example: Arabic خ is drawn differently if it appears at the beginning, middle or end of word. Unicode gives them the same code since they are THE SAME characters

CO1

Unicode Constant• Unicode is added into HTML as HTML entity• Should one need to put special characters in

HTML, predefined entity can be used– List and syntax:

[http://en.wikipedia.org/wiki/List_of_XML_and_HTML_character_entity_references]

• Or, custom Unicode characters can be used• Example: To put Greek character lambda (λ)

and division sign (÷) – &#x03BB; and &#x00F7; respectively

• Other programming language syntax: C# and C/C++ - \unnnn, VB - &Hnnnn

CO1

UTF8• UCS Transformation Format 8 Bit• Sending all 16 bits of Unicode in a text file is

wasteful• There are few schemes created to make more

efficient transfer over internet• Among others: UTF8, UTF16 and UTF32 (we

will cover UTF8 only)• UTF8 is a variable no. bytes transfer of

multibyte Unicode – up to 6 bytes

CO2

UTF8

CO2

• Conversion scheme:– X-s are the bits from the Unicode