Desktop Notifications API

[@matei240]

1 - you need a wamp server 2 - create a "root folder" in "c:\wamp\www" (ex.: C:\wamp\www otifications) 3 - create a new folder for icon in "C:\wamp\www otifications" (ex.: C:\wamp\www otifications\icon) 4 - create a new file "index.html" in "C:\wamp\www otifications" 5 - download icon from google , put in "C:\wamp\www otifications\icon" and rename in "notification.png" 6 - copy cod in "index.html" PS: sorry for my english Desktop Reguest permision Trigger var dnperm = document.getElementById('dnperm') var dntrigger = document.getElementById('dntrigger') dnperm.addEventListener('click', function(e) { e.preventDefault(); if(!window.Notification) { alert('Sorry, notification are not supported'); } else { Notification.requestPermission(function(p){ if (p === 'denied') { alert('You have denied notification.'); } else if(p === 'garanted'){ alert('You have garanted notification.'); } }); } }); //Simulate an event dntrigger.addEventListener('click',function(e) { var notify; e.preventDefault(); if (Notification.permission === 'default') { alert('Please allow notification before doing this.'); } else{ notify = new Notification('New mesage from Matei',{ body:'How are you today?', icon:'icon/notification.png', tag:'1234' }); notify.onclick = function(){ window.location = '?message=' + this.tag; }; }; });

[@ankit0120]

hi guys thanks for a great tutorial, i just have one question if you can help me out. what i want know is how facebook show notifications even when that is not open in any tab of the browser, if they use sessions or maybe not please let me know how it works.

[@williamcampospc123]

Hey, great tutorial, congratulations! I've a question... by using this method to display notifications can I use the same method to display notifications by using a cell phone?

[@anmolkumar5923]

Thnx, your videos are really awesome and help me learn new things with better core concepts in lesser time than most of the other videos out there. hope to see more videos!!

[@kna8421]

Thanks you for this tutorial =) Can it be sent automatically and don't pass the click event , just like FB notification was displayed in the Chrome ?

[@mustbetheswoosh4789]

Is there a way for me to have the notifications come in after a triggered event from my program? Pretty much the event is adding a product to cart. Thanks for the help in advance! ✌

[@Potetskrelleren]

Great tutorial. Works great with my current project.

[@harshitgangwar4500]

We may have accidentally turned off the "allow notifications" feature of the browser Turn it on otherwise console will always show "denied" . If you are using chrome steps are -> Settings => Advanced => site settings => Notifications

[@--INDIAN--TRADER]

As usual a 💎 gem

[@arbharadwaj8318]

Sir how did you gained that much stuff about java script ,sir you suggest me some books or any courses to do this type of stuff.so that I could get a better clarity of the javascript

[@frozeneternity93]

Thank you! I found this VERY helpful and concise

[@nileshratanguptanrg]

Great video sir.. I like it

[@happinin]

is there a way to make a custom look of the notification box with html / css as well as having it appear whether or not you have switched tabs like facebook?

[@Shortly8908]

What is the difference if you call the e.preventDefault() before the var and after the var?

[@msq7041]

how do you trigger a Desktop Notification if the Browser is closed?

[@0xs]

You can't.

[@Emilsteixner]

i think you can with simply changing the trigger to "online"

[@bannouna]

yes like youtube sends me notifications of my subscriptions and i dont know how it does

[@MunchMunch40]

Is this automatic to display the notification or do you have to press trigger for the notification to show up?

[@ebenezertamiru3541]

awesome..Is their a way to run this html as batch file on client machines using PHP exec() method...tnx...

[@niranjan8687]

can we send notifications to different systems at a time

[@_yonas]

Is it possible to remove the permission with a (e.g.) "Disable Notification" Button?

[@H0b0Gamers]

Amazing! Love these videos.

[@StyleOnPC]

How did you get your notifications in the top right corner? Mine don't even pop up, I have to click on the Google notification icon in my notification area..

[@codecourse]

That's odd, not seen that happen before.

[@patrickthotho1583]

Notification (on mac) appears on upper right while (on windows) they appear on lower right

[@StyleOnPC]

***** I guess it bugged out. I re-tried again yesterday and it worked, thanks for the tutorial! : -)

[@rijor6651]

How to trigger rather than click the button. Suppose based on the time I want to notify the person.

Be carefull with script place, this important! The script place under the two link, otherwise dosen't work!

[@PowerAndP-g3v]

how can i send to specific user?

[@otaldepeewee3596]

did you find out a way to do it this way?

[@RanjeetSingh-oq1id]

its working on firefox mozila and not working on google chrome. how can i fix it.

[@DarKcS2]

Why do you work in files in your dropbox folder? Are you using any junctions?

[@maxverb]

It makes it easier, you'll always have your localhost directory available whereever you go.

[@codecourse]

As Max TheBoss says, it just means my files travel with me wherever I go since I have three machines I work on.

[@DontBeMadBro]

once i have set up localhost dir in onedrive but ended up with "error save file due too long file path"

[@Excelsoft]

What's that IDE/code editor you're using?

[@Tobirobih]

Sublime Text. www.sublimetext.com

[@robertmosquedar]

No funciona en google chrome vr74. Ya resetee configuración, establecí permisos y nada. Alguna solución? En firefox funciona de maravillas

[@webapplicationguide3798]

Awesome !! Thanks a lot

[@appukumaravel6476]

very useful thanks

[@chg_m]

how can i send notification from php instead of javascript

[@rekhashrama1143]

i love it sir

[@sofruity3]

what does it look like in windows?

[@codecourse]

It's browser dependant, so it would look the same.

[@AvnishKumar-zf9km]

Thanks a lot.

[@chg_m]

u saved me again

[@thebabyhmv]

The notification doest work in mobile

[@muh_guts]

yes you can do it

[@jeevajeeva2481]

I need notify = new Notification("") this object very very thanks

[@gulrahmanitprofessional9260]

how to do this in apex

[@ashishsharma-tj6dg]

this is not working on chrome but working on Mozilla

[@pednekargandhar]

same issue here

[@markcuello5]

PLEASE HELP ME

[@JeanRichardLima]

How use with Angularjs? Thanks.