Fogger

How to add support for fogger to a webapp?

Asked by Elco on 2012-07-05

Hey, I really like fogger, and I think it has great potential. I build a webapp for home use a while back, and I wanted to add support for fogger. On reddit I found that adding:

var fogger = new fogger.Fogger();
fogger.notify("Title", "Notification body");
fogger.setProgress(0.7);
fogger.setProgressVisible(true);

should do it, but that doesn't work. I get:

TypeError: 'undefined' is not an object (evaluating 'new fogger.Fogger')

I suppose I have to import some kind of fogger javascript file but I couldn't find some imported javascript on your example website (http://owaislone.org/docs/fogger/).

I'm probably overlooking something rather simple/stupid, but I can't figure it out (perhaps I have been staring at my screen for too long). Could someone point me in the right direction please?

P.S. One thing I hope you could add in future releases is the ability to modify the title of the window, my app shows the name of the file which is open in the title, but Fogger seems to keep the original name of the app as the window title. Also the ability to save username and password would be great. Other than that, this is a great application already!

Question information

Language:
English Edit question
Status:
Answered
For:
Fogger Edit question
Assignee:
No assignee Edit question
Last query:
2012-07-05
Last reply:
2012-07-08
Owais Lone (loneowais) said : #1

Hey, it's great that you like it.

The JS API is still not stable. It might change any time. I'll add proper JS API documentation to readthedocs or to an ubuntu wiki page. For now you can follow this,

Fogger fires an event ('foggerReady') which indicates that the fogger API is ready to be used. Here is an example,

    document.addEventListener('foggerReady', function() {
        var myapp = new fogger.Fogger();
        myapp.setCount(20);
        myapp.newMenu('Hello');
    });

Or using jquery

   $(document).on('foggerReady', function() {
        var myapp = new fogger.Fogger();
        // Your stuff here
   });

Register this event handler as soon as possible and don't wait for document.ready to add this handler.

Owais Lone (loneowais) said : #2

The answer above might not be valid for newer versions. Fogger is shipped with the JS API documentation. You should check that instead.

kernst (kernst) said : #3

Adding "support" to an existing web app might also entail "how do I create a high-resolution icon for Fogger to use with my web app?" That's what I thought of when I clicked on this question, anyway.

As of this moment, the developer supports the link rel="apple-touch-icon" method specified by Apple for iOS apps (http://www.reddit.com/r/ubuntuappshowdown/comments/vggkn/app_submission_fogger_turn_cloud_apps_into_ubuntu/c5d5wff). Other methods do exist, however, and HTML5 even proposes its own "standard."

A reasonable overview of how to implement this on your own web sites can be found on the Wikipedia article for "favicon" --> http://en.wikipedia.org/wiki/Favicon#Device_support

Can you help with this problem?

Provide an answer of your own, or ask Elco for more information if necessary.

To post a message you must log in.