Jak aktywować kartę Chrome, która utworzyła powiadomienie na pulpicie?

85

Chciałbym zaimplementować taką samą funkcjonalność, jaką ma obecnie Gmail. Gdy nadejdzie nowa wiadomość e-mail lub pojawi się nowy czat, pojawi się wyskakujące okienko z powiadomieniem, a po jego kliknięciu karta z Gmailem zostanie skoncentrowana.

Mam ten kod:

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

Kiedy klikam powiadomienie, po prostu znika. Teraz muszę dodać kod do funkcji onclick, aby wyświetlić i zaznaczyć stronę, która utworzyła to powiadomienie. Wiem, że jest to możliwe, ponieważ Gmail robi to bardzo dobrze. Ale nie udało mi się zajrzeć do źródeł Gmaila (są zminimalizowane i zaciemnione).

Czy ktoś wie, jak to zrobić?

— Frodik
źródło

this.cancel zostało wycofane i usunięte z obecnego kanału Canary.

— Brandito,

109

Możesz po prostu umieścić window.focus () w Google Chrome. Po kliknięciu skupi się na tym oknie.

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

Otworzyłem inspektora w Gmailu, dodałem powyższy kod, przeniosłem się na inną kartę i uruchomiłem. Pojawiło się powiadomienie i po kliknięciu przeniosło mnie z powrotem do Gmaila.

— Mohamed Mansour
źródło

3

Łał ! Tak prosty ?! :-) Świetna odpowiedź, dziękuję. Długo szukałem go w Google, ale nie mogłem go znaleźć. Teraz działa idealnie, jeszcze raz dziękuję.

— Frodik

1

Nie ma problemu! Miłego hakowania :-)

— Mohamed Mansour

Nie działa teraz jsfiddle.net/l2aelba/RhHgR :(, mogę zhakować jak do alert (), aby przywrócić to okno

— l2aelba

2

ktoś wie, jak to teraz działa? Kod nie skupia się już na TAB ... co oznacza, że w najnowszym Chrome kliknięcie powiadomienia nie skupia się na karcie, z której pochodzi. Czy nadal działa w Gmailu?

— hko

6

To jest teraz przestarzałe , zobacz odpowiedź Oswaldo poniżej, aby uzyskać rozwiązanie dla różnych przeglądarek.

— nickf

49

Korzystanie z powiadomień .

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();
  };
});

— Oswaldo Alvarez
źródło

window.focus();Zrób sztuczkę ! Powinna być oznaczona jako prawidłowa odpowiedź.

— Maxime Lafarie

3

window.focus()nie działa na chrome 60, rozwiązanie jazzcat z parent.focus()działa

— pikax

To działa, ale gdy tylko użyję opcji „Utwórz skrót” i przekształcę ją w samodzielną aplikację, przekierowanie nie działa i otwiera nową kartę.

— Waza_Be

26

window.focus()nie zawsze działa w najnowszych wersjach przeglądarek Webkit (Chrome, Safari itp.). Ale parent.focus()tak.

Oto kompletny plik jsfiddle: https://jsfiddle.net/wv0w7uj7/3/

Kod:

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();
    };
  }
}

— jazzcat
źródło

1

To normalne, że „to” odnosi się do innego kontekstu, więc zamiast dzwonić this.close, lepiej wywołać evt.target.closezdarzenie „onclick”: notification.onclick = function (evt) { evt.target.close(); }

— Alejandro Silva,

parent.focus (); pracuje dla mnie! pracuję na chrome 68.0.3440.106

— Johan Morales

2

Używanie tej onclickwłaściwości nie jest dobrą praktyką , używaj addEventListenerjavascript for vanilla lub onmetody dla jQuery.

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

Wanilia:

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

jQuery:

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

— Tim
źródło

0

Powinno być this.close()raczej niż this.cancel()tak:

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

— Nadav B
źródło