Як зосередитись на вкладці Chrome, яка створила сповіщення на робочому столі?

Я хотів би застосувати таку ж функціональність, як сьогодні в Gmail. Коли надходить новий електронний лист або приходить новий чат, з’являється спливаюче сповіщення, і якщо ви натискаєте його, вкладка Gmail фокусується.

У мене є такий код:

var n = window.webkitNotifications.createNotification('ico.gif', 'Title', 'Text');
n.onclick = function(x) { this.cancel(); };
n.show();

Коли я натискаю сповіщення, воно просто зникає. Тепер мені потрібно додати код до функції onclick, щоб відкрити та зосередити сторінку, яка створила це сповіщення. Я знаю, що це можливо, тому що GMail робить це дуже добре. Але мені не вдалося заглянути в джерела Gmail (вони мінімізовані та затуманені).

Хтось знає, як це зробити?

Ви можете просто розмістити window.focus () у Google Chrome. При натисканні воно фокусується на цьому вікні.

var n = window.webkitNotifications.createNotification('ico.gif', 'Title', 'Text');
n.onclick = function(x) { window.focus(); this.close(); };
n.show();

Я відкрив інспектор у Gmail, додав наведений вище код, перемістився на іншу вкладку та запустив його. Повідомлення з’явилося і, клацнувши, воно повернуло мене до Gmail.

Використання сповіщень .

if (typeof Notification !== 'undefined') {
  alert('Please us a modern version of Chrome, Firefox, Opera or Safari.');
  return;
}

Notification.requestPermission(function (permission) {
  if (permission !== 'granted') return;

  var notification = new Notification('Here is the title', {
    icon: 'http://path.to/my/icon.png',
    body: 'Some body text',
  });

  notification.onclick = function () {
    window.focus();
  };
});

window.focus()не завжди працює в останніх версіях браузера Webkit (Chrome, Safari тощо). Але parent.focus()робить.

Ось повний jsfiddle: https://jsfiddle.net/wv0w7uj7/3/

Код:

function notifyMe() {
  if (Notification.permission !== "granted")
    Notification.requestPermission();
  else {
    var notification = new Notification('Notification title', {
      icon: 'http://cdn.sstatic.net/stackexchange/img/logos/so/so-icon.png',
      body: "You've been notified!",
    });

    notification.onclick = function () {
      parent.focus();
      window.focus(); //just in case, older browsers
      this.close();
    };
  }
}

Використовувати onclickвластивість, використовувати addEventListenerjavascript onfor або vanilla або метод для jQuery не дуже добре .

var notify = new Notification('Test notification');

Ваніль:

notify.addEventListener('click', function(e) {
    window.focus();
    e.target.close();
}, false);

jQuery:

$(notify).on('click', function(e) {
    window.focus();
    e.target.close();
});

Це має бути this.close()швидше, ніж this.cancel()так:

var n = window.webkitNotifications.createNotification('ico.gif','Title', 'Text');
n.onclick = function(x) { window.focus(); this.cancel(); };
n.show();