Web: Plan for thuesday 24. feb (week 09) - and preparation


Teachers plan for the day

We will briefly work with few basic HTML elements

I might use this examples from the last cource as inspiration

Webservice I might be using to get objects

Slides and examples from the lecture is accessible here:

http://bjoerks.net/klasser/Mobile_2015_Foraar/materials/

From the lecture special:

201502240956_Example_01.htm  -  javacript changing DOM instead of writing extended from  20060303_02.htm
Week09_SolutionJavaScriptPart00_ObjectAndDomAccess_20150224.zip – same as previous but in a webproject for enabling debugging from Visual Studion using IE
Week09_SolutionJavaScriptPart01_WithSoapService_20150224.zip – example with simple callback page method for getting data from soap webservice
Week09_SolutionJavaScriptPart02_WithWebClientData_20150224.zip – example with simple callback page method for getting text data with http WebClient
Week09_SolutionJavaScriptPart03_WithWebClientDataConverted_20150224.zip – same as previous but with parsing JSON example and XML RSS feed for display in UI 
The last example could be used with the RSS feed from your Fronter room (se fronter)

 

Prepare yourself by before lecture

- viewing toturial 31-40 on this playlist: http://www.youtube.com/playlist?list=PL46F0A159EC02DF82

- reading briefly about (i have pointet out with links the elements)

JS Browser BOM -

· JS WindowJS

JS HTML DOM (Document Object Model) - http://www.w3schools.com/js/js_htmldom.asp 

· DOM Intro

· DOM Methods

· DOM Document

· DOM Elements

· DOM HTML

· DOM CSS

· DOM Events

· DOM EventListener

· DOM Navigation

· DOM Nodes

· DOM Nodelist
 

JavaScript and HTML DOM Reference - http://www.w3schools.com/jsref/default.asp

 Ideas for small exercises:

Using this example as basic Week09_SolutionJavaScriptPart03_WithWebClientDataConverted_20150224.zip
You can find some webservice (Soap, JSON and XML) here: http://webservicedemo.datamatiker-skolen.dk/
You can also find service (JSON and XML) here: Odense Kommune - Geografiske services - fx Kælkebakker
You now could receive data from the webservice and make small javascript solution showing data on the page.


Make a list of object an when holding the mouse over an element show details in a new window or an element on same page.

It could be persons or maybe you could receive the RSS from your fronter room and present a list of titles and when clicking on the title show the details. In the example you find how to get the author and title (fill in the rss link from fronter room) – use debugging for exploring the data together with the raw data received to find the element in the xml document.

More links about javascript

General tutorial about Javascipt/Js - where you also can try on the fly...
-http://www.w3schools.com/js/default.asp

Topic: basic elements in javascript

Materials:

-tutorial (and examples) - http://www.w3schools.com/js/default.asp

-tutorial (and examples) -Variables, Functions, Operators, Conditionals

 

Topic: basic elements in javascript

Materials:

-tutorial (and examples) - http://www.w3schools.com/js/default.asp

-tutorial (and examples) -Variables, Functions, Operators, Conditionals

 

Topic: Objects in javascript

Materials:

-tutorial (and examples) - http://www.w3schools.com/js/default.asp

-tutorial (and examples) - JavaScript and Object Oriented Programming (OOP)

 

Topic:   Builtin Objects in javascript

Materials:

Reading:

-JavaScript Objects

-JavaScript Object Examples

-JavaScript DOM Examples

-DOM (Document Object Model) Reference