BeginningMac OS X Tiger Dashboard Widget Development 2006 phần 10 potx

Additional Dashboard Programming Infor mation This appendix contains pointers to additional sources of Dashboard programming information.. In addition to Dashboard, Safari, and WebKit-re

gItemsList.push(new Array(title.firstChild.nodeValue,desc.firstChild.nodeValue, link.firstChild.nodeValue, html.firstChild.nodeValue,((pubDate == null) ? “” : pubDate.firstChild.nodeValue)));

}}}

build();

var statusDiv = document.getElementById(“status”);

statusDiv.innerText = “Category: “+gCategoryName;

}

return null;

}

The build()function creates the HTML listing of widgets It creates an unordered list and places each

of the widgets as an item in that list It also incorporates a mouseUpevent to show the details of the get whenever you click a widget in the list

wid-function build() {

var div = document.getElementById(“content”);

var html = new String();

if (gItemsList.length > 0) {html += “<ul>”;

for (var i = 0; i < gItemsList.length; i++) {var type = (i % 2) ? “even” : “odd”;

html += “<li id=’item”+i+”’ class=’”+type+”’

onmouseup=\”showDetails(“+i+”)\” >”;

html += “<div id=’listTitle’>”+gItemsList[i][gFeedItemTitle]+”</div>”;html += “<div

id=’listDate’>”+parseDateItem(gItemsList[i][gFeedItemDate])+”</div>”;

html += “</li>”;

}html += “</ul>”;

} else {html += “No items!”;

}

div.innerHTML = html;

}

Chapter 19

The showDetails(itemNr)function displays the details of the widget whenever you click the widgetname in the scrolling list This function gets the selected item and sets the background color to show that

it has been selected It gets the details of the selected widget, creates the HTML that is used to display thedetails information, and sets the details area to the HTML The details window that covers the widgetwindow is created using the details selectors in the MW.css file The details graphics are stored in theImages directory

function showDetails(itemNr) {var itemDiv = document.getElementById(“item”+itemNr);

if (gSelectedItem != null) {

if (gSelectedItem != itemDiv) {gSelectedItem.style.background = “none”;

gSelectedItem.style.backgroundColor = gSelectedItem.bgColor;

gSelectedItem.url = “”;

}}

gSelectedItem = itemDiv;

gSelectedItem.bgColor = itemDiv.style.backgroundColor;

gSelectedItem.url = gItemsList[itemNr][gFeedItemLink];

itemDiv.style.background = “url(Images/selection.png)”;

var detailsDiv = document.getElementById(“details”);

var html = new String();

html += getWidgetImageURL(gItemsList[itemNr][gFeedItemContent])+”<br />”;

html += “<pclass=\”text\”>”+getWidgetFullDescription(gItemsList[itemNr][gFeedItemContent])+”</p>”;

at Dashboard Downloads without launching a browser

289

More Widgets

3. Old Unix hands write paths that start at the root level of your personal account with a tilde,

as in ~/Library/Widgets/ This is much shorter than typing the full path in terminal:/Users/<yourlogin>/Library/Widgets/ Why is this important? Since widgets can callshell scripts, you need to remember this distinction in your HTML and JavaScript files.More on paths in a latter chapter

Chapter 2

1. As your high school English teacher might have told you, there is no wrong answer to thisquestion Or more accurately, there are any number of right answers GraphicConverter, forexample, has a Caliper Rule tool that lets you take measurements within your graphics

2. The FlightTracker widget has an AllAirports.js file This should have been a pretty easyguess that you could then confirm with Show Package Contents If you tried to useSpotlight to find the file, you may have noticed that you can’t search inside of bundles

3. You can see this kind of folder organization if you look inside of the Weather widget Thefolder hierarchy is:

/Weather/Images/

/Weather/Images/Icons/

/Weather/Images/Icons/moonphases/

The images inside of the directories are referenced with a relative path, that is, the path is given

relative to the current directory

The opposite of a relative path is an absolute path, which starts at the root level of your hard drive The path to the Weather.html file in an absolute form is /Macintosh HD/Library/Widgets/Weather.wdgt/

Weather.html.

Chapter 3

1. You enter a property in the Info.plist file that points to it

2. No, because the widget object isn’t supported in Safari

3. Use BBEdit’s Open Hidden File feature or copy the widget out to a folder where you have writepermissions and do the editing there

1. Dashboard intercepts any alert messages and sends them to console.log

2. PID stands for Process ID Every program on an OS X machine has an entry in the system’s cess list and is assigned a unique process ID A smaller ID number indicates that the processstarted running close to boot time You can see the running processes in Activity Monitor or,using Terminal, in top

pro-3. Step through code, one line at a time, and examine the variable’s values

Chapter 6

1. Use the black info button graphics in the AppleClasses folder Whenever possible, use thegraphics in WidgetResources This ensures compatibility when your widgets are installed onother users’ Macs

Appendix A

2. You may not have clearly delineated what is on the front side of the widget from what is on theback side Always keep the contents of the front or back within their respective <div>s

3. Your widget’s preferences file is an XML file that you can open with any text editor or withApple’s Property List Editor to examine the contents

Chapter 7

1. Leave one preference item in the file.

2. Dashboard isn’t really a process If you get information on any of the widgets, you’ll see thatthey are owned by the Dock (Figure A-1)

Figure A-1

3. Clicking in the widget’s close box or removing it in the Widget Manager

Chapter 8

1. Live resizing is also called relative resizing.

2. Relative resizing is typically used for widgets that display RSS feeds

3. Apple’s scrollbar classes are stored in the WidgetResources directory

Chapter 9

1. You can use the getDatamethod with the ondropand onpasteevents only

2. You pass the information in the eventvariable

3. It doesn’t take any parameters

293

Answers to Exercises

Chapter 10

1. You call the cancelDefault()method

2. The event.stopPropagation()method doesn’t take any parameters

3. Arguably, drag and drop was introduced with the Trashcan in Macintosh OS 1.0

Chapter 11

1. You will want to use the widget.system()method in asynchronous mode The Unix tracerouteutility shows you the Internet path from your Macintosh to the computer or network resourcethat you are accessing As it finds each router on its way to that Internet computer, it writes the

IP address and information about each device to stdout It is common for traceroute to takemore than a minute or two to find the network path to that computer and it may time out Forthis reason, you should allow the widget to continue to run while traceroute is running, andyou should specify that the handler get each line and display it in your widget

2. You would use the AllowInternetPluginsaccess key

3. You may, but it is overkill The more appropriate access key is the

AllowFileAccessOutsideOfWidget This key provides your widget with the maximumamount of access that it needs

Additional Dashboard Programming Infor mation

This appendix contains pointers to additional sources of Dashboard programming information Forthe latest information about changes to Dashboard or WebKit, always check Apple’s Developers’site You will find most of the information that you need on Apple’s website, but you can find othersources in blogs and forums with a quick search on Google

Guides, Tutorials, and SpecificationsApple maintains a site for OS X developers at http://developer.apple.comwhere you canfind the Dashboard, Safari, and WebKit programming documents listed below Most of these docu-ments can be downloaded as PDF files In addition to Dashboard, Safari, and WebKit-related documents and technical notes, you’ll also find information about Human Interface Guidelinesand creating universal binaries for the new Intel Macs as well as other programming guides

Apple Human Interface Guidelines (HIG)

To learn more about the human interface, read Apple’s Human Interface Guidelines

http://developer.apple.com/documentation/UserExperience/Conceptual/OSXHIGuidelines/index.html?http://developer.apple.com/documentation/UserExperience/Conceptual/OSXHIGuidelines/XHIGUsingTechnologies/chapter_8_section_6.html

The HIG describes how to create an application with a consistent user interface Be sure to read the

“High Level Design Guidelines for Widgets” section

Dashboard Reference

The Dashboard reference contains information not included in the tutorial

http://developer.apple.com/documentation/AppleApplications/Reference/Dashboard_Ref/index.html?http://developer.apple.com/documentation/AppleApplications/Reference/Dashboard_Ref/DashboardRef/chapter_1_section_1.html

This reference describes the JavaScript objects available to widgets as well as the interfaces for ing and extending a widget

configur-Dashboard Tutorial

The Dashboard tutorial is the main source of information for widgets

http://developer.apple.com/documentation/AppleApplications/Conceptual/Dashboard_Tutorial/index.html?http://developer.apple.com/documentation/AppleApplications/Conceptual/Dashboard_Tutorial/Introduction/chapter_1_section_1.html

The tutorial walks you through the basics of creating widgets to more advanced topics It describes all ofthe components, events, and access keys for creating widgets

Debugging Dashboard Widgets

If your widget has bugs, you may want to refer to this guide

http://developer.apple.com/technotes/tn2005/tn2139.html

This technical note (TN2139) discusses debugging strategies, tips, and tricks for Dashboard widgets

Developing Dashboard Widgets

For a brief overview of developing widgets, refer to this page at Apple’s website

http://developer.apple.com/macosx/dashboard.html

This information is scattered throughout the tutorial and other technical notes, but this is a goodstarting point

Dynamic HTML and XML: The XMLHttpRequest Object

If you are creating a widget that works with RSS feeds, this document is your best source of information.http://developer.apple.com/internet/webcontent/xmlhttpreq.html

This note describes how to use the XMLHttpRequest Object to connect your widget directly to an XMLsource to update your widget’s information in the background without reloading the page

Appendix B

Safari JavaScript Reference

For information about using JavaScript in Safari, refer to this reference

http://developer.apple.com/documentation/AppleApplications/Reference/SafariJSRef/index.html#//apple_ref/doc/uid/TP40001482

This reference describes Apple’s JavaScript extensions to Safari and the WebKit

Safari Document Object Model Overview

This guide provides a brief introduction to the Document Object Model

http://developer.apple.com/documentation/Cocoa/Conceptual/WebKit_DOM/index.html?http://developer.apple.com/documentation/Cocoa/Conceptual/WebKit_DOM/

01introduction.html

This is a 30,000-foot introduction to Apple’s implementation of the WebKit Document Object Model

It primarily provides links to Apple and W3C DOM specifications and documents

Safari JavaScript Programming Topics

If your widget makes use of the Document Object Model, you may want to refer to this guide

http://developer.apple.com/documentation/AppleApplications/Conceptual/SafariJSProgTopics/index.html?http://developer.apple.com/documentation/AppleApplications/Conceptual/SafariJSProgTopics/Tasks/DOM.html

This collection of programming topics describes how to use the DOM from JavaScript In particular, ittalks about drawing to the canvas, using the Pasteboard from JavaScript, and using Objective-C fromJavaScript

Safari HTML Reference

Because Dashboard and Safari share the WebKit HTML additions, you may want to refer to this guide.http://developer.apple.com/documentation/AppleApplications/Reference/SafariHTMLRef/index.html?http://developer.apple.com/documentation/AppleApplications/Reference/SafariHTMLRef/Introduction.html

This reference describes every HTML tag and property supported by Safari and WebKit

Universal Binaries Programming Guidelines

The Universal Binaries Programming Guidelines document the coding changes that need to be made toapplications so they can run on the new Intel-based Macintosh computers

297

Additional Dashboard Programming Information

Because widgets are mainly composed of HTML, CSS, and JavaScript, they will be able to run on thenew Intel-based Macs If your widget contains a plugin, however, you need to compile your plugin as

a universal binary This guide describes how to build or modify Mac OS X applications so they will run

on either PowerPC or Intel-based Macs

Introduction to WebKit Plugin Programming Topics

For information about WebKit plugins, refer to this document

http://developer.apple.com/documentation/InternetWeb/Conceptual/WebKit_PluginProgTopic/index.html?http://developer.apple.com/documentation/InternetWeb/Conceptual/WebKit_PluginProgTopic/WebKitPluginTopics.html

This collection of programming topics primarily describes the WebKit plugin architecture and explainshow compiled plugins work inside of WebKit applications like Safari

Other Resources

Because widgets are mostly based on open standards technologies, you will be able to find many Mac-specific sources of information for HTML, XHTML, CSS, and JavaScript

non-MacTech Magazine

MacTech magazine may be the last Macintosh programming magazine around It has been publishing

articles for over 20 years and has always been on the cutting edge of Macintosh programming trends.The articles are aimed at the beginning to intermediate programmer and cover everything from

AppleScript, Carbon, and Cocoa development to web scripting languages and Macintosh technologies

Go to their website (www.mactech.com/)for more information

Appendix B

Any listing of websites is sure to be made obsolete by paper publication timelines, so it is better just topoint to the main Dashboard websites that are the most active

Apple Dashboard Downloads

This website (www.apple.com/downloads/dashboard/)is the main source for the latest widgets Ifyou’re wondering whether someone has created the widget that you are thinking about writing, this isthe first place to stop As these pages are being written, there are close to 2,000 widgets

299

Additional Dashboard Programming Information

Widget Distribution

Now that you’ve written a widget — or two — you may be ready to go beyond emailing them to afew of your closest friends You may be ready to share them with the world This appendix talksabout the best places to upload your widgets and some of the issues of distribution

Where to Post Your WidgetShrinkwrap software is almost a thing of the past Small developers no longer have to worry aboutdealing with distributors, paying for media duplication and packaging, and producing the rightnumber of packages for brick-and-mortar stores All of those expensive distribution methods havebeen replaced by Web distribution You can put up a website and let everyone know that yourwidgets are available In some cases, you don’t even have to put up a website

Apple

To get the most exposure, Apple’s Dashboard Downloads page is probably the best place to uploadyour widgets Other widget collections are available in addition to individual developer’s sites, butDashboard Downloads is perhaps the single place that everyone goes to look for new widgets It is

a well-known central repository, it has submission guidelines at www.apple.com/downloads/dashboard/submit/index.html(Figure C-1), and all of the widgets are checked before they areplaced for download

Figure C-1

However, Apple can’t be your only distribution point, because you must provide one working link todownload the software The submission guidelines also point out that the widget must have a support-ing website You must have full rights to distribute the widget and must not have violated the intellec-tual property rights of others Your widget should also have a complete feature set, but you’d neverrelease betaware, would you?

The most obvious place to post your widgets is on your personal website It may not get as much traffic

as Apple’s, but you can provide support and additional information about your widget If you don’thave a personal website, you can get a Mac account where you can share files or you can probably get awebsite through your ISP Just remember, however, that if your widgets are popular, you may exceed themonthly bandwidth limitations

Appendix C