Help - Search - Members - Calendar
Full Version: Creating a widget
Invision Power Services > Community Forums > Community Web Design and Coding
däve
Yes, well Ive had plans for it since tiger came out. I was first to actually receive the version 2 days prior to the sales--horrid. Anyways, if anyone has any idea on how to make a widget(I sure do) and wants to help me with this, PM me. Im looking for apple fans--sorta, hehe.
http://www.apple.com/downloads/macosx/dashboard/
däve
Also its meant to act like an RSS/XML feeder/aggregator of the most recent posts. The new posts feature from IPB V2.1 has inspired some ideas, but Im looking at making something better. original.gif
http://www.apple.com/downloads/macosx/dash...strictnews.html
Rikki
I started work on a 2.1 new post reader.
däve
QUOTE(Rikki @ May 3 2005, 06:30 AM) *
I started work on a 2.1 new post reader.

Whats your email or aim/msn? original.gif
Payton
I've started making one.
Chris Griego
Actually, I've been working on getting a dashboard widget working in Win/Firefox. wink.gif

Starnox
I hope to be making something soon, not quite sure what yet original.gif
däve
There is already a widget* for windows lol, sorta, its called konfabulator.
Starnox
Well my widget is coming along well original.gif, got the Icon and Default graphics done. Tested it in Dashboard and it looks great, wubs ripple effect wub.gif

Just gotta work on the content now tongue.gif

No doubt I will come back later for some Javascript tips wink.gif
Chris Griego
QUOTE(gtr @ May 4 2005, 03:19 PM) *
There is already a widget* for windows lol, sorta, its called konfabulator.

and? Konfabulator is built on xml & javascript alone, originall Mac-only and ported to Windows, a project that was dying until Apple announced Dashboard. But, show me the Yahoo-created Yahoo Local Traffic widget for Konfabulator... Dashboard, being built into the OS, is already showing signs of bigger company involvement even though it's brand new. That makes Dashboard widgets more appealing.

Anyway

My first attempt was localized to just the one widget but I expanded it to where making more widgets compatible would be much easier with less recoding. In fact, the only true recoding I have to do is clean up after lazy developers who use non-standard shortcuts like datatable.innerHTML instead of document.getElementById("datatable").innerHTML. Including just today getting storing and retreiving preferences to work (via cookies). One cavet is that most clickable areas are visually defined with -apple-dashboard-region in the css, which Gecko won't expose, even to javascript, because it ignores it completely because it's unfamiliar. I did my best with a css rule for *[onclick] { cursor: pointer; } but that's obviously far from perfect.

The biggest challenge comes from the xmlhttprequest security model, which makes loading data off the web possible. Traditionally it won't allow data loaded from other domains possible, which means it always fails for local files. Dashboard obviously allows this, but to get Firefox to allow it, you have to enable igned.applets.codebase_principal_support in the about:config and then litter the javascript with requests to allow the script extra access within each callstack, meaning within every function that uses the xmlhttprequest.get function or uses the node data.

Outside of that, including my javascript and css file makes the Yahoo widget work out of the box. Now to try some other widgets. biggrin.gif



Update:
I tried it with the Bloglines widget.
- Added my javascript and css file
- Added 1 extra security permissions request
It now works except for a little onkeypress code for hitting enter on the back of the widget.
Rikki
I'm finding widgets a pain in the ass to be honest. Trying to animate with PNG's and javascript is a nightmare.
Chris Griego
Differences in event accessing is making the Package Tracker widget difficult. getlost.gif


Update:
Success is fading.
The Package Tracker had enough problems with different event accessing availability, but it also calls document.implementation.createHTMLDocument which Firefox lacks and I don't even understand document.implementation.createDocument enough to try to emulate it if even possible.
dashLicious is full of simply bad html (img scr? src! no html tag? <script/>?), references system files and uses unix commands (still don't know why a del.icio.us widget would need access to the unix system).
John
What is a widget?

I thought it was something to do with beer. noexpression.gif

"Widget! It's got a widget! A lovely widget! A widget it has got! Widget!"
Steve
QUOTE(John @ May 5 2005, 06:54 PM) *
What is a widget?

I thought it was something to do with beer. noexpression.gif

"Widget! It's got a widget! A lovely widget! A widget it has got! Widget!"

laughing.gif


John's on the bottle again. tongue.gif
Starnox
Ok I got a javascript problem. I am trying to get my widget to load an external .txt file. I noticed that the weather widget does this, but when reading: http://developer.apple.com/internet/webcon...xmlhttpreq.html - it says you cannot open external files. So who do the widgets that fetch info off the web (like the weather, stock etc.) work?

Am I using the wrong function. I tested it with a local file and the function worked fine - external won't work for me :S

Any other functions for this?
Rikki
QUOTE(Starnox @ May 6 2005, 11:20 AM) *
Ok I got a javascript problem. I am trying to get my widget to load an external .txt file. I noticed that the weather widget does this, but when reading: http://developer.apple.com/internet/webcon...xmlhttpreq.html - it says you cannot open external files. So who do the widgets that fetch info off the web (like the weather, stock etc.) work?

Am I using the wrong function. I tested it with a local file and the function worked fine - external won't work for me :S

Any other functions for this?


You have to set AllowNetworkAccess to true in your plist file.
Starnox
QUOTE(Rikki @ May 6 2005, 12:34 PM) *
You have to set AllowNetworkAccess to true in your plist file.


Yeah I have done that, ah well I will fiddle with it a bit more original.gif At least I know it could work and I am not barking up the wrong tree original.gif

Ah when I edited the Info.plist I deleted the baseHTML value by mistake - which is why I didn't think it was working tongue.gif

Is the only way to get it to refresh by a button, or can u get it to refresh each time someone opens dashboard?
Chris Griego
You can manually refresh a widget by clicking it and pressing Ctrl+R and you can have a javascript function executed when Dashboard is shown by attaching it to the widget.onshow event handler.

CODE
widget.onshow = function () {
// do stuff when Dashboard is redisplayed

}
Starnox
QUOTE(cgriego @ May 6 2005, 09:50 PM) *
You can manually refresh a widget by clicking it and pressing Ctrl+R and you can have a javascript function executed when Dashboard is shown by attaching it to the widget.onshow event handler.

CODE
widget.onshow = function () {
// do stuff when Dashboard is redisplayed

}


perfect, just what I was looking for original.gif

one last question:

I get it to display some text in a div with: document.getElementById('T1').innerText=xmlhttp.responseText;

Is there any way to get this text passed as html?

basically I want to add linebreaks and links to the text, dunno if thats possible - never worked with javascript before pinch.gif

Cheers,
~Jordan
Rikki
Try innerHTML instead of innerText.
Starnox
QUOTE(Rikki @ May 6 2005, 11:09 PM) *
Try innerHTML instead of innerText.


You're a genius! (and yes I wont go on the SARS list innocent.gif)

Edit: There we go its done!

http://www.geniusbar.net/?page=news2&id=77 (Nice and simple tongue.gif)
This is a "lo-fi" version of our main content. To view the full version with more information, formatting and images, please click here.
Invision Power Board © 2001-2009 Invision Power Services, Inc.