MDN may have intermittent access issues April 18 13:00 - April 19 01:00 UTC. See whistlepig.mozilla.org for all notifications.

mozilla

Revision 516867 of doorhanger

  • Revision slug: Mozilla/Add-ons/Firefox_for_Android/API/NativeWindow/doorhanger
  • Revision title: doorhanger
  • Revision id: 516867
  • Created:
  • Creator: MKaply
  • Is current revision? Yes
  • Comment Cleanup code sample formatting

Revision Content

The NativeWindow object is only available to privileged code running on Firefox for Android, and is intended for use by Firefox for Android add-ons.

Summary

Returns a reference to the NativeWindow.doorhanger object, which can be used to display doorhanger notifications (also known as popup notifications) on Firefox for Android.

Doorhanger notifications provide a way to present decisions to users which is less intrusive than a modal dialog. You can display a doorhanger using NativeWindow.doorhanger.show(). On Firefox for Android a doorhanger displays a title and an array of buttons for the user choices: selecting a button calls the corresponding callback function. Doorhangers are attached to a specific tab, and you can control the doorhanger's persistence.

You can close a doorhanger explicitly using NativeWindow.doorhanger.hide().

Example

In the example below, an add-on adds a new menu item labeled "Offer cake" which constructs and shows a new doorhanger when selected.

The doorhanger contains two buttons, which just show different toast messages when selected:

var menuID;

function offerCake(window) {
  let buttons = [
    {
      label: "Yes, please!",
      callback: function () {
        window.NativeWindow.toast.show("yum", "short");
      }
    },
    {
      label: "Not today",
      callback: function () {
        window.NativeWindow.toast.show("still hungry", "short");
      }
    }
  ];

  let message = "How about some cake?";
  let options = {
    persistence: 1
  };

  window.NativeWindow.doorhanger.show(message, "cake-request", buttons,
                                      window.BrowserApp.selectedTab.id,
                                      options);
}

function loadIntoWindow(window) {
  if (!window)
    return;
  menuID = window.NativeWindow.menu.add("Offer cake", null, function(){  
    offerCake(window);   
  });
}

function unloadFromWindow(window) {
  if (!window)
    return;
  window.NativeWindow.menu.remove(menuID);  
}

Methods

show
Show a doorhanger notification.
hide
Hide a doorhanger notification.

Revision Source

<div class="note">
 The <a href="/en/Extensions/Mobile/API/NativeWindow" title="https://developer.mozilla.org/en/DOM/window.NativeWindow">NativeWindow</a> object is only available to privileged code running on Firefox for Android, and is intended for use by Firefox for Android add-ons.</div>
<h2 id="Summary">Summary</h2>
<p>Returns a reference to the <code><a href="/en/Extensions/Mobile/API/NativeWindow" title="https://developer.mozilla.org/en/DOM/window.NativeWindow">NativeWindow</a>.doorhanger</code> object, which can be used to display doorhanger notifications (also known as <a href="/en/Using_popup_notifications" title="https://developer.mozilla.org/en/Using_popup_notifications">popup notifications</a>) on <a href="/en/Mozilla/Firefox_for_Android" title="en/Mozilla/Firefox_for_Android">Firefox for Android</a>.</p>
<p>Doorhanger notifications provide a way to present decisions to users which is less intrusive than a modal dialog. You can display a doorhanger using <code>NativeWindow.doorhanger.show()</code>. On Firefox for Android a doorhanger displays a title and an array of buttons for the user choices: selecting a button calls the corresponding callback function. Doorhangers are attached to a specific tab, and you can control the doorhanger's persistence.</p>
<p>You can close a doorhanger explicitly using <code>NativeWindow.doorhanger.hide()</code>.</p>
<h2 id="Example">Example</h2>
<p>In the example below, an add-on adds a new menu item labeled "Offer cake" which constructs and shows a new doorhanger when selected.</p>
<p>The doorhanger contains two buttons, which just show different toast messages when selected:</p>
<p><img alt="" src="/files/3758/NativeWindow-doorhanger.png" style="width: 308px; height: 500px;" /></p>
<pre class="brush: js">
var menuID;

function offerCake(window) {
  let buttons = [
    {
      label: "Yes, please!",
      callback: function () {
        window.NativeWindow.toast.show("yum", "short");
      }
    },
    {
      label: "Not today",
      callback: function () {
        window.NativeWindow.toast.show("still hungry", "short");
      }
    }
  ];

  let message = "How about some cake?";
  let options = {
    persistence: 1
  };

  window.NativeWindow.doorhanger.show(message, "cake-request", buttons,
                                      window.BrowserApp.selectedTab.id,
                                      options);
}

function loadIntoWindow(window) {
  if (!window)
    return;
  menuID = window.NativeWindow.menu.add("Offer cake", null, function(){  
    offerCake(window);   
  });
}

function unloadFromWindow(window) {
  if (!window)
    return;
  window.NativeWindow.menu.remove(menuID);  
}
</pre>
<h2 id="Methods">Methods</h2>
<dl>
 <dt>
  <code><a href="/en/Extensions/Mobile/API/NativeWindow/doorhanger/show" title="en/Extensions/Mobile/API/NativeWindow/doorhanger/show/">show</a></code></dt>
 <dd>
  Show a doorhanger notification.</dd>
 <dt>
  <code><a href="/en/Extensions/Mobile/API/NativeWindow/doorhanger/hide" title="en/Extensions/Mobile/API/NativeWindow/doorhanger/hide/">hide</a></code></dt>
 <dd>
  Hide a doorhanger notification.</dd>
</dl>
Revert to this revision