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

Explorando as APIs do HTML5

Ed35943d3199ea37b1b60c39615e8163?s=47 Raphael Amorim
May 07, 2014
Programming
0
95

Explorando as APIs do HTML5

Ed35943d3199ea37b1b60c39615e8163?s=128

Raphael Amorim

May 07, 2014
Tweet

More Decks by Raphael Amorim

See All by Raphael Amorim
Writing Your Own React Renderer
Ed35943d3199ea37b1b60c39615e8163?s=48 raphamorim
4
210
the new react
Ed35943d3199ea37b1b60c39615e8163?s=48 raphamorim
1
85
Composition on High-Order Components
Ed35943d3199ea37b1b60c39615e8163?s=48 raphamorim
0
40
Understanding React
Ed35943d3199ea37b1b60c39615e8163?s=48 raphamorim
1
140
Making for Web with WebAssembly
Ed35943d3199ea37b1b60c39615e8163?s=48 raphamorim
4
550
Scratching React Fiber
Ed35943d3199ea37b1b60c39615e8163?s=48 raphamorim
3
430
Understanding Memory Behavior on NodeJS
Ed35943d3199ea37b1b60c39615e8163?s=48 raphamorim
1
220
Using Canvas Components
Ed35943d3199ea37b1b60c39615e8163?s=48 raphamorim
0
180
500 Days of Open Source [PythonBrasil Version]
Ed35943d3199ea37b1b60c39615e8163?s=48 raphamorim
0
110

Other Decks in Programming

See All in Programming
Git操作編
A3efba75cfbb0b7d5248eb74d1d29d79?s=48 smt7174
1
210
SwiftUI+TCAに挑戦！NewsPicks iOSアプリのリアーキテクチャ/re-architecture-newspicks-ios-app-with-swiftui-and-tca
1da8b476058df860d83a12c496b74fff?s=48 takehilo
0
370
테라폼으로 ECR 관리하기 (How to Manage ECR with Terraform)
330c5e37fb238d6b319ae6e18770f44b?s=48 posquit0
0
520
実践的！FPGA開発セミナー vol.11
Bbf28bf908ac83e5b85b52a675641641?s=48 fixstars
0
110
実践 SpiceDB - クライドネイティブ時代をサバイブできるパーミッション管理の実装を目指して / Practical SpiceDB
B1bddcb899ec3060fe9913f3cb70dbb6?s=48 lmt_swallow
0
120
読みやすいコード クラスメソッド 2022 年度新卒研修
E86b46be0f4e61db6b28becc5493bbab?s=48 januswel
0
2.9k
Pluggable Storage in PostgreSQL
62f5ee39e37ba4f8a22acc714781c879?s=48 sira
1
190
20220706_Google Apps Scriptを実演で学ぶ～ GAS × Slack ～
C983c1e22d0d19f21590b83884d9b754?s=48 apachan
2
610
Haskellでオブジェクト指向プログラミング
97a42cc1630ebdfdaaa8d50078a9fd3d?s=48 koheisakata
0
180
Getting Started With Data Structures
Fbe54abf4094d19f1548783d072a7fa7?s=48 adoranwodo
1
250
WindowsコンテナDojo：第6回 Red Hat OpenShift入門
E5eb221d34d4ffbe973f8542b4c3a00e?s=48 oniak3ibm
PRO
0
170
Edge Side Frontend という新領域
3aebd86547bfc5cdb451d5f2f95ed5d8?s=48 mizchi
21
10k

Featured

See All Featured
Creating an realtime collaboration tool: Agile Flush - .NET Oxford
Fd55de4174accaf3b4f030e43a8a70c6?s=48 marcduiker
6
560
Fight the Zombie Pattern Library - RWD Summit 2016
9fa239b3154a0169d99ab7bf1422dd12?s=48 marcelosomers
226
15k
Mobile First: as difficult as doing things right
0fe2973fa8d27d96547e43322341183a?s=48 swwweet
213
7.5k
What's new in Ruby 2.0
7edec06b5435e0dac07a353b2cc26253?s=48 geeforr
336
30k
The Invisible Customer
4262b9cfacfb6b2c77f23e1d0310cd3e?s=48 myddelton
110
11k
Practical Orchestrator
168ccec72eee0530b818d44f3fedaacf?s=48 shlominoach
178
8.7k
Optimizing for Happiness
25c7c18223fb42a4c6ae1c8db6f50f9b?s=48 mojombo
365
63k
Building an army of robots
5f2da528927a2ec9ba4fec2069cbc958?s=48 kneath
299
40k
RailsConf & Balkan Ruby 2019: The Past, Present, and Future of Rails at GitHub
C44e1f7e22c3f23cff7bc130871047ef?s=48 eileencodes
119
28k
5 minutes of I Can Smell Your CMS
465724d73fe3a92c0879fdfb43a3a6f3?s=48 philhawksworth
196
18k
Learning to Love Humans: Emotional Interface Design
5f50f94346fbcb23706f0707169317a4?s=48 aarron
261
37k
A Modern Web Designer's Workflow
8081b26e05bb4354f7d65ffc34cbbd67?s=48 chriscoyier
689
180k

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