Presentation is loading. Please wait.

Presentation is loading. Please wait.

COS 125 DAY 21. Agenda Assignment 8 corrected  4 A’s, 2 B’s, 2 C’s and 1 late Assignment 9 not corrected yet Capstone progress report due There will.

Similar presentations


Presentation on theme: "COS 125 DAY 21. Agenda Assignment 8 corrected  4 A’s, 2 B’s, 2 C’s and 1 late Assignment 9 not corrected yet Capstone progress report due There will."— Presentation transcript:

1 COS 125 DAY 21

2 Agenda Assignment 8 corrected  4 A’s, 2 B’s, 2 C’s and 1 late Assignment 9 not corrected yet Capstone progress report due There will be no assignment 10; not enough time left in semester Quiz 3 is on April 23  Chapters 16-20 & 25  20 M/C and 4 Short essays  60 mins, Open Book Open Notes Capstones presentations and projects due April 27 Discussion on Javascript, Podcasting and Real Simple Syndication

3 More Javascript Tricks Adding the current date & time To “write” to the xHTML page  Document. write(“some xHTML stuff” + Javascript + “some more xHTML stuff”);  What ever is not in quotes is considered script Date(); returns the current client date and time http://www.cookwood.com/html6ed/examples/javascript/time.h tml http://www.cookwood.com/html6ed/examples/javascript/time.h tml time.txt

4 Setting a target window size Replace the href value in a standard link with  "javascript:location=‘parent.html'; window.open(‘newpage.html', ‘window_name', 'height=250, width=250,scrollbars=yes')">  Where ‘parent.html’ is the url of the xHTML page where this link is placed ‘newpage.html’ is the url of the page the new window will display “window_name’ will be the name of the newly open window  Can be used as a target for other hyperlinks height is the height in pixels of the new window width is the width in pixels of the new window

5 Setting a new window’s attributes NameTypeDescriptionExample widthnumber Width, not including chrome (in pixels) width=640 heightnumber Height, not including chrome (in pixels) height=480 leftnumber Horizontal position wrt. screen (pixels) left=0 topnumber Vertical position wrt. screen (pixels) top=0 titlebarbooleanWindow has titlebartitlebar=no menubarbooleanWindow has menubarmenubar=yes toolbarboolean Window has toolbar (e.g., back button) toolbar=yes locationbooleanWindow has location barlocation=no scrollbarsbooleanWindow has scrollbarsscrollbars=yes statusbooleanWindow has statusbarstatus=yes resizablebooleanWindow can be resizedresizable=no http://www.infimum.dk/HTML/JSwindows.html http://www.cookwood.com/html6ed/examples/javascript/hawthorne.html

6 Changing images Create a clickable image   Add the following to the opening tag onmouseover=“document.daPicture.src=‘new.gif’” onmouseout=“document.daPicture.src=‘imag e.gif’”  http://www.cookwood.com/html6ed/examples/jav ascript/rollover.html http://www.cookwood.com/html6ed/examples/jav ascript/rollover.html

7 Preloading images into cache Place in an external javascript file  aPicture= new Image(H#, W#)  aPicture.src = “image.gif”  bPicture= new Image(H#, W#)  bPicture.src = “2image.gif”  Save file as somefile.js In head section of xHTML load the somefile.js In xHTML page  onmouseover="document.catpic.src=bPicture.src“ http://www.cookwood.com/html6ed/examples/javas cript/loadimages.html http://www.cookwood.com/html6ed/examples/javas cript/loadimages.html

8 Syndication and Podcasting Syndication  Allows for updates for your site to be “pulled” by an “aggregator” from a “feed” that you create  http://en.wikipedia.org/wiki/RSS_(file_format) http://en.wikipedia.org/wiki/RSS_(file_format) Podcasts  Syndications feeds with multimedia components  http://en.wikipedia.org/wiki/Podcasting http://en.wikipedia.org/wiki/Podcasting

9 Feeds While there was many different feed types the most widely accepted standard is RSS 2.0  http://www.rssboard.org/rss-specification http://www.rssboard.org/rss-specification  All RRS feeds are written in XML  Two parts to every RSS feed Introduction List of items Examples  http://www.cookwood.com/html6ed/examples/#c20 http://www.cookwood.com/html6ed/examples/#c20

10 RSS Introduction Required elements  Title  name of feed channel  Link  url of feed channel web server  Description  phrase or sentence describing feed channel  http://www.cookwood.com/html6ed/exam ples/syndicating/channel.xml http://www.cookwood.com/html6ed/exam ples/syndicating/channel.xml

11 RSS Items Elements  Title  title of item  Link  link to the full item  Description  description of link to be viewed by feed subscribers  http://www.cookwood.com/html6ed/exam ples/syndicating/items.xml http://www.cookwood.com/html6ed/exam ples/syndicating/items.xml

12 http://www.rssboard.org/files/sample-rss-2.xml

13 RSS Aggregators While most RSS feeds are viewable by all Internet Browsers except Chrome, a feed aggregator allows a user to subscribe to a RSS channel (feed) Once a RSS channel is added to an aggregator updates to the feed will be pulled by the aggregator and presented to the user Subscribed Feeds are in bookmarks in FireFox, the favorites toolbar in IE, the Feeds menu drop down in Opera, and in the RSS feeds folder in Microsoft Outlook

14

15

16

17 Making your own feed Used to inform about new content or changed content Starting a feed  Create a basic XML page in Dreamweaver Set RSS version and establish the channel

18 Introduction Add a Title, link and description an other tags as necessary  Between and  http://www.make-rss-feeds.com/rss- tags.htm http://www.make-rss-feeds.com/rss- tags.htm My RSS Feed http://perleybrook.umfk.maine.edu This is a beginning of an RSS for COS 125 students

19 Add Items to your feed Each item should be between and tags  Between and and after introduction section  Minimum of title, link and description COS 125 Class Page http://perleybrook.umfk.maine.edu/classes/cos125/default.htm This web site contains information useful for Web Development students and the work of the students currently in COS 125. http://perleybrook.umfk.maine.edu/rsstest.xml

20 Adding an enclosure For video, audio, images and other file types  Find the size (in bytes) of the file you intend to include  Find the MIME type for the file http://www.mimetype.org/  http://perleybrook.umfk.maine.edu/rsstest.xml http://perleybrook.umfk.maine.edu/rsstest.xml An example enclosure http://perleybrook.umfk.maine.edu/samples/UsingImages.htm This picture is from my 2002 bike trip to Sturgis SD <enclosure url="http://perleybrook.umfk.maine.edu/samples/bikepics/fortkentTN.JPG" length="3265" type="image/jpeg" />

21 Creating Podcasts for iTunes Apple will distribute your RSS feeds on iTunes  http://www.apple.com/itunes/whatson/pod casts/specs.html http://www.apple.com/itunes/whatson/pod casts/specs.html  Pages 386-391 & 393 & 397 in your text book for information on iTunes Podcasting

22 Validating an RSS feed There is a W3 org validator for RSS feeds  http://validator.w3.org/feed/ http://validator.w3.org/feed/

23 Publishing a feed on a webpage Create a link to the feed MY RSS Feed  http://lizcastrohtml.blogspot.com/ http://lizcastrohtml.blogspot.com/ New Feed  Forces use of clients default RSS aggregator


Download ppt "COS 125 DAY 21. Agenda Assignment 8 corrected  4 A’s, 2 B’s, 2 C’s and 1 late Assignment 9 not corrected yet Capstone progress report due There will."

Similar presentations


Ads by Google