Sunday 30 October 2011

Assignment 3 – a drawing in SVG

For your third assignment, you should create a drawing in SVG. Your drawing should create as much variety and interest as you can using as little code as you can.

In particular, you should define and re-use symbols and use css to create variety.

If you are an informatics student, your code should also include examples of svg animation.
If you are a mathematics student, your code should include uses of svg transformations.

Others are also welcome to use these features of SVG.

For this assignment you have to produce three files (which you can store in a Folder on your Desktop on the Macs in the 3.01 lab mdash; use -assignment3 as the name of this folder).

These files are:

report: A short (max one page) report.
drawing.html: An HTML file containing the SVG representation of your drawing. This file should not contain any style attributes.
svg.css: This file should use CSS properties to style your svg.

Each file should contain your student ID in a comment near the beginning of the file.

drawing.html should use one of the following templates (your code should go inside the sag tags):

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:xlink="http://www.w3.org/1999/xlink">
  <head>
    <link rel="stylesheet" type="text/css" href="svg.css" />
    <title>SVG and CSS sandpit</title>
  </head>
  <body>

    <svg viewBox="0 0 1000 1000">

    </svg>

 </body>
</html>

This creates a canvas with both x and y coordinates ranging from 0 to 1000. Your css should make the width and height of this element equal to ensure a 1:1 aspect ratio.

Unfortunately our browsers do not render animation when svg is rendered within html. If you use animation, use the following template to demonstrate your drawing, in a file named svg.svg

<?xml version="1.0" encoding="utf-8"?>
<?xml-stylesheet href="svg.css" type="text/css"?>
<svg  xmlns="http://www.w3.org/2000/svg"
      xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 1000 1000">

</svg>

You can open this file as usual in Safari. You may find it helpful to examine this example.

Submit your assignment by email To annette.leonhard@ed.ac.uk Subject: Assignment-IL-3

Wednesday 26 October 2011

SimpleVectorGraphics

SVG is an XML dialect for describing simple pictures.

For example, you can describe two circles and a rectangle. These are two of the basic shapes SVG can draw.

<circle cx="100" cy="100" r="5"></circle>
   <circle cx="200" cy="150" r="10"></circle>
   <rect height="150" rx="10" ry="5" 
         width="200" x="50" y="50"></rect>

We use css to style the shapes. All SVG shapes have two attributes named 'stroke' and 'fill' which are used to paint them.

circle{
fill:pink;
stroke:red;
}
rect{
stroke:green;
fill:none;
}

Try this in the SVG sandpit. Copy the SVG and CSS given above into the right text boxes. Click render SVG then Apply CSS.

We can define a symbol by enclosing some basic objects in <symbol> tags and giving it an ID. Then we can use this symbol. See the examples in the sandpit.

Wednesday 12 October 2011

XSLT Assignment 2 (for Informatics students)

Unless you are also studying another Informatics course, you should do the HTML version of this assignment.

If you are doing this XSLT version of the assignment, first use the lab to do some simple experiments with XSLT.

Go to the w3schools xsl page. This provides an environment where you can experiment with XSL. The example given sets up a simple table. You can edit the XML of the XSLT and then click the Edit and Click Me button to see the result.

Instead of a table, construct a bulleted list of entries, with the title in italics followed by the name of the artist.
Try to present the information in different forms.
Now add the price. Use CSS to precede it by a £ sign.
Try the sorting example from w3schools.
Can you sort the CDs by price instead of by the artist's name?
Try the conditional test example.
Can you just list the CDs from the 1980s?
Now put the xml version of your recipe in the XML box and try to present it by writing appropriate XSLT in the right-hand box.
You should submit your recipe(s) as XML, together with XSL and CSS for presentation.

`Notes`

Include your matriculation number (student ID) in each file you submit.

In xml and html please include your student id between <!-- and --> inside the top-level tag of your code. For css, please include your student ID between /* and */ at the end of your recipe.css file.

Submit your assignment by email To annette.leonhard@ed.ac.uk Subject: Assignment-IL-1

You will have to edit a number of text files. We recommend TextEdit on the Mac, but you can use any editor that allows you to edit HTML as plain text. To edit files as plain text in TextEdit, go to the TextEdit Preferences (in the TextEdit menu). Select the Plain Text format under the New Document tab, then tick the box for Ignore rich text commands in HTML files, under the Open and Save tab.

For this assignment you have to produce four files (which you can store in a Folder on your Desktop on the Macs in the 3.01 lab).

These files are:

report: A short (max one page) report.
recipe.xml: An XML representation of your recipe.
recipe.html: An XSL transformation to produce the HTML layout of your recipe.
recipe.css: This file should use CSS properties to style your layout. You may find it useful to look at some examples.

Your folder should also include your image(s) and any other files used in your presentation.

Tuesday 11 October 2011

HTML Assignment 2

Starting again from the contents of your recipe.txt file, mark up your recipe using HTML tags, using the following template:

<xml version="1.0" encoding="utf-8"?> <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <link rel="stylesheet" type="text/css" href="recipe.css" /> <head>  <title> ... </title> </head> <body> ... </body> </html> The title of your recipe should replace the first ellipsis; the second ellipsis should be replaced by well-formed HTML using the HTML 5 tags. The HTML sandpit is set up to process the body of the recipe. So when using this tool just copy the code from the HTML text box to replace the second ellipsis.


Create a file called recipe.css to display your recipe.html file. You can again use the HTML sandpit to experiment, then cut and paste your css code into your text editor so you can save it.
Finally, write a brief report (no more than one page) comparing your experiences with semantic (xml) and presentational (html) markup. You should also report on any problems you had and how you solved them. Save it as report

You should be able to see the results of your work by double-clicking on the recipe.html file.

`Notes`

Include your matriculation number (student ID) in each file you submit.

In xml and html please include your student id between <!-- and --> inside the top-level tag of your code. For css, please include your student ID between /* and */ at the end of your recipe.css file.

Submit your assignment by email To annette.leonhard@ed.ac.uk Subject: Assignment-IL-1

You will have to edit a number of text files. We recommend TextEdit on the Mac, but you can use any editor that allows you to edit HTML as plain text. To edit files as plain text in TextEdit, go to the TextEdit Preferences (in the TextEdit menu). Select the Plain Text format under the New Document tab, then tick the box for Ignore rich text commands in HTML files, under the Open and Save tab.

For this assignment you have to produce four files (which you can store in a Folder on your Desktop on the Macs in the 3.01 lab).

These files are:

report: A short (max one page) report.
recipe.xml: An XML representation of your recipe.
recipe.html: An HTML representation of the layout of your recipe.
recipe.css: This file should use CSS properties to style your layout. You may find it useful to look at some examples.

Your folder should also include your image(s) and any other files used in your presentation.

Power Peering

Some content providers are national or global operators. They don’t need to connect via Tier 1. They have Tier 2 peering agreements.

But those who control the access networks control access to consumers. “Why,” they ask, “should we pay transit charges to tier 2?” If they want access to our customers, they should pay us.

So they see themselves as higher in the pecking order than the content providers – and, although they are already charging their customers for internet access, they also want to charge the content providers for access to these customers.

A logical outcome of such exploitation of a monopoly over customer ‘eyeballs’ would be to reverse some of the flows of cash through the hierarchy of ISPs.

Dr Peering gives an excellent account of one example (involving Comcast, Level3 and Netflix):
http://drpeering.net/AskDrPeering/blog/articles/Ask_DrPeering/Entries/2011/9/6_Access_Power_Peering.html

PC World see a danger here:

Comcast Toll on Netflix Screams for Net Neutrality

Comcast fired the net neutrality "shot heard round the world" when it throttled BitTorrent peer-to-peer networking traffic.
http://www.pcworld.com/businesscenter/article/211964/comcast_toll_on_netflix_screams_for_net_neutrality.html

Comcast see it slightly differently
http://blog.comcast.com/2010/11/10-facts-about-peering-comcast-and-level-3.html
and other weigh-in to support them
http://www.digitalsociety.org/2010/11/level-3-outbid-akamai-on-netflix-by-reselling-stolen-bandwidth/

The latter piece is by George Ou, whose independence has been called into question elsewhere:
http://www.roughlydrafted.com/2007/08/24/zdnets-george-ou-exposed-as-ignorant-microsoft-shill-zoon/

It comes from "Digital Society" a 'think tank' funded by Jon Henke, and Arts+Labs which is itself funded by Viacom, NBC Universal, AT&T, Broadcast Music, Inc. (BMI), Verizon, Auditude, Microsoft,
Songwriters Guild of America, Jib Jab, Blue Pixel, Cisco, and the American Society of Composers, Authors and Publishers (ASCAP).

Monday 10 October 2011

Trusting Information on the Internet

Man pays $200,000 to save fake girlfriend in online scam

http://m.techspot.com/42583/

How far should you trust the information that you’re getting on the internet?
http://www.thefifthestate.com.au/archives/28546

A Thought Police for the Internet Age
http://www.counterpunch.org/2011/09/28/the-dangerous-cult-of-the-guardian/

Use and abuse of the Internet

Internet is easy prey for governments

Some of us might like to believe that the genie is out of the bottle and that we all have access to an unstoppable decentralized network. In reality, the internet is entirely controlled by large corporations and central authorities.
http://edition.cnn.com/2011/OPINION/02/05/rushkoff.egypt.internet/

Secret Orders Target Email

The U.S. government has obtained a controversial type of secret court order to forceGoogle Inc. and small Internet provider Sonic.net Inc. to turn over information from the email accounts of WikiLeaks volunteer Jacob Appelbaum, according to documents reviewed by The Wall Street Journal.
http://online.wsj.com/article/SB10001424052970203476804576613284007315072.html

Egypt’s Internet shutdown

We are following the current events in Egypt with concern as it appears that all incoming and outgoing Internet traffic has been disrupted. The Internet Society believes that the Internet is a global medium that fundamentally supports opportunity, empowerment, knowledge, growth, and freedom and that these values should never be taken away from individuals.

http://isoc.org/wp/newsletter/?p=3091

Anonymity and the Dark Side of the Internet

'I wrote a book titled “There’s No Such Thing as Free Speech and It’s a Good Thing, Too.” This book could be titled “There is Such a Thing as the Free Unregulated Internet and It’s a Bad Thing, Too.”'
http://opinionator.blogs.nytimes.com/2011/01/03/anonymity-and-the-dark-side-of-the-internet/

The next Digital Decade

The book's 31 essays address questions such as: Has the Internet been good for our culture? Is the Internet at risk from the drive to build more secure, but less “open” systems and devices? Is the Internet really so “exceptional?” Has it fundamentally changed economics? Who—and what ideas—will govern the Net in 2020? Should online intermediaries like access providers, hosting providers, search engines and social networks do more to “police” their networks, increase transparency, or operate “neutrally?” What future is there for privacy online? Can online free speech be regulated? Can it really unseat tyrants? The book is now available as a free downloadable PDF and for purchase in hardcover.

http://nextdigitaldecade.com/contents