Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Explorando as APIs do HTML5

Sponsored · Ship Features Fearlessly Turn features on and off without deploys. Used by thousands of Ruby developers. →
Avatar for Raphael Amorim Raphael Amorim
May 07, 2014
Programming
0
140

Explorando as APIs do HTML5

Avatar for Raphael Amorim

Raphael Amorim

May 07, 2014
Tweet

More Decks by Raphael Amorim

See All by Raphael Amorim
Rust 101 for Web
Avatar for Raphael Amorim raphamorim
0
220
Writing Your Own React Renderer
Avatar for Raphael Amorim raphamorim
4
320
the new react
Avatar for Raphael Amorim raphamorim
1
140
Composition on High-Order Components
Avatar for Raphael Amorim raphamorim
0
150
Understanding React
Avatar for Raphael Amorim raphamorim
1
320
Making for Web with WebAssembly
Avatar for Raphael Amorim raphamorim
4
890
Scratching React Fiber
Avatar for Raphael Amorim raphamorim
3
740
Understanding Memory Behavior on NodeJS
Avatar for Raphael Amorim raphamorim
1
380
Using Canvas Components
Avatar for Raphael Amorim raphamorim
0
300

Other Decks in Programming

See All in Programming
20260127_試行錯誤の結晶を1冊に。著者が解説 先輩データサイエンティストからの指南書 / author's_commentary_ds_instructions_guide
Avatar for nash_efp nash_efp
1
960
今から始めるClaude Code超入門
Avatar for 448jp | OKI Yoshiya 448jp
8
8.6k
【卒業研究】会話ログ分析によるユーザーごとの関心に応じた話題提案手法
Avatar for MomokoShirakawa momok47
0
200
The Past, Present, and Future of Enterprise Java
Avatar for ivargrimstad ivargrimstad
0
550
今こそ知るべき耐量子計算機暗号(PQC)入門 / PQC: What You Need to Know Now
Avatar for mackey0225 mackey0225
3
370
izumin5210のプロポーザルのネタ探し #tskaigi_msup
Avatar for izumin5210 izumin5210
1
110
HTTPプロトコル正しく理解していますか？ 〜かわいい猫と共に学ぼう。ฅ^•ω•^ฅ ﾆｬ〜
Avatar for ♛Heitor Hirose hekuchan
2
680
dchart: charts from deck markup
Avatar for Anthony Starks ajstarks
3
990
IFSによる形状設計／デモシーンの魅力 @ 慶應大学SFC
Avatar for がむ gam0022
1
300
MUSUBIXとは
Avatar for Hisaho nahisaho
0
130
インターン生でもAuth0で 認証基盤刷新が出来るのか
Avatar for takumi taku271
0
190
Oxlint JS plugins
Avatar for kazupon kazupon
1
890

Featured

See All Featured
Why Our Code Smells
Avatar for Brandon Keepers bkeepers
PRO
340
58k
個人開発の失敗を避けるイケてる考え方 / tips for indie hackers
Avatar for panda_program panda_program
122
21k
The agentic SEO stack - context over prompts
Avatar for schlessera schlessera
0
630
Unlocking the hidden potential of vector embeddings in international SEO
Avatar for Frank van Dijk frankvandijk
0
170
From π to Pie charts
Avatar for Rasagy Sharma rasagy
0
120
We Are The Robots
Avatar for Honza Javorek honzajavorek
0
160
The Organizational Zoo: Understanding Human Behavior Agility Through Metaphoric Constructive Conversations (based on the works of Arthur Shelley, Ph.D)
Avatar for Dr. Kim W Petersen kimpetersen
PRO
0
240
Bash Introduction
Avatar for André Augusto Costa Santos 62gerente
615
210k
Jamie Indigo - Trashchat’s Guide to Black Boxes: Technical SEO Tactics for LLMs
Avatar for Tech SEO Connect techseoconnect
PRO
0
57
Distributed Sagas: A Protocol for Coordinating Microservices
Avatar for Caitie McCaffrey caitiem20
333
22k
10 Git Anti Patterns You Should be Aware of
Avatar for Lemi Orhan Ergin lemiorhan
PRO
659
61k
Refactoring Trust on Your Teams (GOTO; Chicago 2020)
Avatar for Rebecca Miller-Webster rmw
35
3.4k

Transcript

  1. Explorando as APIs do HTML5

  2. None

  3. ! Write Code Every ! Single Day

  4. API's do HTML5 ?

  5. None

  6. Web Speech API

  7. Comportamento

  8. Comportamento

  9. Exemplos + raphamorim.com/sound-hunter/ + google.com/intl/pt/chrome/demos/ speech.html

  10. Vibration API

  11. Comportamento navigator.vibrate(time) if (navigator.vibrate) navigator.vibrate(500) ! ! navigator.vibrate([500, 1000, 2000])

  12. ! Fullscreen API

  13. Comportamento ! document.querySelector(‘html’).requestFullscreen() document.exitFullscreen()

  14. Comportamento Mas como saber o status da API? var fullscreenElement

    = document.fullscreenElement var fullscreenEnabled = document.fullscreenEnabled

  15. Comportamento Awesome!! Mas e quanto os eventos da API? fullscreenchange

    fullscreenerror

  16. Comportamento ::fullscreen & ::backdrop

  17. Exemplos + demo.hongkiat.com/html5- fullscreen-api/index.html

  18. None
  19. None
  20. None

  21. Geolocation

  22. Comportamento if (navigator.geolocation) navigator.geolocation.getCurrentPosition(showPosition) function showPosition(position) ! var latitude =

    position.coords.latitude; ! var longitude = position.coords.longitude;

  23. Comportamento position.coords.latitude position.coords.longitude altitude speed altitudeAccuracy timestamp accuracy heading

  24. Suporte

  25. Exemplos + html5demos.com/geo

  26. …E isso é tudo pessoal :) raphamorim