Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
JavaScript初心者がFirefox OSの時計アプリを読んでみた
Search
Mikio Fujita
November 15, 2014
Programming
490
2
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
JavaScript初心者がFirefox OSの時計アプリを読んでみた
Mikio Fujita
November 15, 2014
More Decks by Mikio Fujita
See All by Mikio Fujita
社内にアクセシビリティ改善を広める際に意識したこと
benevolent0505
0
1k
GraphQLを使い続けて気づいたこと ~Hatena Engineer Seminar #21~
benevolent0505
3
2.7k
エンジニアから見た出版社との共同開発の暮らし / Hatena Engineer Seminar #13
benevolent0505
0
2.5k
マンガチームとDevOps / Hatena Engineer Seminar #11
benevolent0505
0
1.1k
授業でWebアプリを作っている?話
benevolent0505
0
1k
日曜日といったら
benevolent0505
1
150
朝起きる
benevolent0505
1
110
休講
benevolent0505
0
1.3k
◯◯駆動開発
benevolent0505
0
220
Other Decks in Programming
See All in Programming
Generative UI & AI-Assistants for Your Angular Solutions
manfredsteyer
PRO
0
110
共通化で考えるべきは、実装より公開する型だった
codeegg
0
250
Laravelで学ぶ Webアプリケーションチューニング入門/web_application_tuning_101
hanhan1978
4
950
自作OSでスライド発表する
uyuki234
1
3.9k
エンジニア向け会社紹介/Findy Company Profile
findyinc
6
360k
使用 Meilisearch 建立新聞搜尋工具
johnroyer
0
150
トークンをケチるな、設計しろ:GitHub Copilotを賢く使うコンテキスト戦略
ochtum
0
320
AI がコードを書く時代における新卒エンジニアの仕事風景 (2026) / New Graduate Engineers in the Era of AI Coding (2026)
sushichan044
0
220
AWS CDK を「作」ってみた 〜フルスクラッチで見えた CDK の裏側〜 / aws-cdk-from-scratch
gotok365
3
440
Foundation Models frameworkで画像分析
ryodeveloper
1
120
分散システム、なんですぐ死んでしまうん?耐障害性を高めたいあなたのためのレジリエンスパターン入門
mshibuya
7
6.4k
AI駆動開発を妨げる技術的負債の解消アプローチ / ai-refactoring-approach
minodriven
17
9.1k
Featured
See All Featured
Color Theory Basics | Prateek | Gurzu
gurzu
0
390
Avoiding the “Bad Training, Faster” Trap in the Age of AI
tmiket
0
190
How to Talk to Developers About Accessibility
jct
2
410
GraphQLの誤解/rethinking-graphql
sonatard
75
12k
We Analyzed 250 Million AI Search Results: Here's What I Found
joshbly
1
1.6k
What Being in a Rock Band Can Teach Us About Real World SEO
427marketing
0
1k
Evolving SEO for Evolving Search Engines
ryanjones
0
240
The State of eCommerce SEO: How to Win in Today's Products SERPs - #SEOweek
aleyda
2
11k
Darren the Foodie - Storyboard
khoart
PRO
3
3.4k
Fashionably flexible responsive web design (full day workshop)
malarkey
408
67k
Leveraging Curiosity to Care for An Aging Population
cassininazir
1
400
Impact Scores and Hybrid Strategies: The future of link building
tamaranovitovic
0
340
Transcript
+BWB4DSJQUॳ৺ऀ͕ 'JSFGPY04ͷ ࣌ܭΞϓϦΛಡΜͰΈͨ @staybuzz @benevolent0505 @jade_halcyon 'Y04ίʔυϦʔσΟϯάϛʔτΞοϓ
ࣗݾհdstaybuzzd @staybuzz • ిؾ௨৴େֶ • ࠷ۙόΠτ࢝Ίͨ o Ϋϥυʂ • ͋·Γϓϩάϥϛϯά͠ͳ͍
• චശͷ৭'JSFGPYΦϨϯδ
ࣗݾհdbenevolent0505d !benevolent0505 Έ͖͓ • ిؾ௨৴େֶੜ ! • ϓϩάϥϛϯάॳ৺ऀؾຯʁ !
• ϚοΫϒοΫΦϨ
ࣗݾհdjade_halcyond !jade_halcyon ͋͗͞Μ w ిؾ௨৴େֶ̏ w ϓϩάϥϛϯάॳ৺ऀ w +BWB4DSJQUz)FMMP
XPSMEz͢Βॻ͚ͳ͍͘ Β͍ʹΘ͔Βͳ͔ͬͨ w ʹΐʹΐ
ൃදͷഎܠ ʹߦΘΕͨ04$ʹͯ !NBTBXBEBʮ࠙ձ͋Δ͠ߦ͖·͠ΐ͏ʂʯ ୡʮֶੜԁͳΒߦͬͯΈΑ͏͔ͳʜʯ ͥͻߦ͖·͠ΐ͏ʂ
ൃදͷഎܠ 04$࠙ձʹͯ!BPJ@OBHBUTVLJ͞Μʹ BPJʮ܅ͨͪɺ'Y04ڵຯ͋ΔΑͶʁ͆ʯ ˣ BPJʮίʔυಡΜͰΈͳ͍ʁ͆ʯ ˣ BPJʮۭ͍ͯΔΜ͚ͩͲɺग़ΔΑͶʁ͆ʯ ˣ ୡʮ͋ʙ͆ʯ ʊਓਓਓਓਓਓʊ
ʼɹొஃܾఆɹʻ ʉ:?:?:?:?:ʉ
͕ࣗͨͪͨ͜͠ͱdऔΓΈͷํd ! w·֤͕ͣࣗࣗ༝ʹಡΈਐΊ͍ͯ͘ wணͷચ͍ग़͠ w(PPHMFεϓϨουγʔτʹΘ͔ͬͨ͜ͱΛ࣍ʑ ʹϝϞ͍ͯ͘͠ wใڞ༗
͕ࣗͨͪͨ͜͠ͱdऔΓΈͷํd w ʹҰ΄ͲͷϖʔεͰ4LZQF͠ͳ͕Βಡ ΈਐΊΔ w Ϟνϕʔγϣϯͷҡ࣋ɺूத
͕ࣗͨͪͨ͜͠ͱd࣮ࡍͷྲྀΕd panels alarm stopwatch timer clock_view alarm_list post_message _proxy active_alarm
alarm_edit child_window _manager ֤ϑΝΠϧɾσΟϨΫτϦ໊͔ΒׂΛਪଌ
͕ࣗͨͪͨ͜͠ͱd࣮ࡍͷྲྀΕd • σόοΨΛ͍͡ΊΔ ◦ ͱ͍͑ɺίʔυΛಡΉ͚ͩ ◦ ϒϨʔΫϙΠϯτɾɾɾʁ • ϝιου໊ͰίʔυΛݕࡧ͠ݺͼग़͠ͷྲྀΕΛਪଌ ◦
͋͘·Ͱʮਪଌʯ͔͍ͯ͠͠ͳ͔ͬͨ
͕ࣗͨͪͨ͜͠ͱd࣮ࡍͷྲྀΕd w ΞϥʔϜ͕໐Δॠؒʹண͢Δ͜ͱʹ w ΞϥʔϜͷ࠷ॏཁػೳ ʁ ͳʹ͕ΞϥʔϜΛ ໐Β͍ͯ͠Δͷɾɾɾʁ
͕ࣗͨͪͨ͜͠ͱd࣮ࡍͷྲྀΕd w ϒϨʔΫϙΠϯτͷଘࡏΛΔʂʂʂ w ਪଌ͕֬৴ʹมΘΔॠؒ ϒϨʔΫϙΠϯτɺ ͬͯ·͔͢ʁ
Θ͔ͬͨ͜ͱ
Θ͔ͬͨ͜ͱdΞϥʔϜͷൃՐd Navigator.mozAlarm ! w ࢦఆ࣌ؒʹΠϕϯτΛൃՐ w 'Y04ݻ༗ͷ"1* w ར༻ʹಛݖΞϓϦͰ͋Δ͜ͱ͕ඞཁ
Θ͔ͬͨ͜ͱdΞϥʔϜͷൃՐd manifest.webappͷpermissions෦ https://github.com/mozilla-b2g/gaia/blob/master/apps/clock/manifest.webappΑΓ ͜͜
Θ͔ͬͨ͜ͱdΞϥʔϜͷൃՐd Alarm.scheduleϝιου navigator.mozAlarm.add() ͕ൃՐ࣌ؒΛࢦఆ ΞϥʔϜ࡞࣌
` Θ͔ͬͨ͜ͱdΞϥʔϜͷൃՐd onAlarmFired or onTimerFired Viewͷ දࣔ indexedDB mozSetMessageHandler ͕ઃఆ
onMozAlarm ΞϥʔϜൃՐ࣌ʂʂ อଘ͞ΕͨΞϥʔϜ ͷઃఆΛಡΈࠐΉ ϝΠϯετϦʔϜ
Θ͔ͬͨ͜ͱdεψʔζd ൃՐͨ͠ΞϥʔϜͷ*%ͷใΛ%#ΑΓऔಘ active_alarm.js (v2.0)
Θ͔ͬͨ͜ͱdεψʔζd ݱࡏ࣌ࠁ b4OPP[F`Λλοϓͨ࣌͠ࠁ ʹ༧Ίઃఆͨ͠ε ψʔζλΠϜΛͨ࣌͠ࠁΛ%#ʹॻ͖ࠐΈ alarm.js (v2.0)
Θ͔ͬͨ͜ͱd"1*ͱ͔d ! • Navigator.mozAlarm w ࠓճͷ࣌ܭΞϓϦͷ؊ • Navigator.mozSetMessageHandler w γεςϜʹൃՐ࣌ͷىಈ͢ΔΠϕϯτΛઃఆ͢ΔͨΊ
• Navigator.requestWakeLock w ݤʹͳ͍ͬͯͦ͏ͳΜ͚ͩͲಾɾɾɾ
Θ͔ͬͨ͜ͱd8FC"1*d 8FC"1*ΛͬͯΞϓϦΛ։ൃ͕Ͱ͖Δ ʢྫʣ • indexedDB API ◦ ΞϥʔϜͷઃఆͷอଘʹ༻ • vibration
API ◦ ͷόΠϒϨʔγϣϯ
ίʔυϦʔσΟϯάʹऔΓΜͰΈͨ݁Ռ dऔΓΈํʹ͍ͭͯd • ࢝Ί֤͕ࣗࣗ༝ʹಡΜͰ͍͘ • +4ͷجຊతͳ͔ࣝΒ • ͩΜͩΜ֤ࣗͷಡΉൣғʹऩଋ ! •
(PPHMFεϓϨουγʔτʹ·ͱΊΔ • ଞਓͷϝϞ͕͔ͳΓʹཱͬͨ ! • 4LZQFͰձΛ͠ͳ͕ΒಡΉ • ͘͘ձ෩Ͱ͕͋ͬͨɾɾɾ
ίʔυϦʔσΟϯάʹऔΓΜͰΈͨ݁Ռ dܦݧʹ͍ͭͯd .%/ͷهࣄ ӳޠ ͕ʹཱͬͨ w ॳΊʹ'Y04ͷ߲ʹͭͯಡΊΑ͔ͬͨײ
ίʔυϦʔσΟϯάʹऔΓΜͰΈͨ݁Ռ dܦݧʹ͍ͭͯd γϛϡϨʔλͱ(JUIVCͷNBTUFSϒϥϯνͷ όʔδϣϯͷҧ͍ master v 2.0
ίʔυϦʔσΟϯάʹऔΓΜͰΈͨ݁Ռ dܦݧʹ͍ͭͯd +BWB4DSJQU͍͠ w UIJTͱ͔QSPUPUZQFͱ͔ w ࣗ༝͕ߴ͍ w ॳ৺ऀʹѻ͍ͮΒ͍
ίʔυϦʔσΟϯάʹऔΓΜͰΈͨ݁Ռ dܦݧʹ͍ͭͯd σόοΨͷ༻ w نͷେ͖ͳͷʹ৮Δ͜ͱͰؾ͍ͮͨ༗༻ੑ
ײdstaybuzzd • ॳσόοΨɺॳϒϨʔΫϙΠϯτʹײಈ ! • 'Y04ʹॳΊͯ৮ΕͯΈͯɺຊʹ)5.- +4Ͱ࡞ΒΕ͍ͯΔͷ͔ʁͱٙͬͯ͠·ͬ ͨ ! •
͜ΕΛػʹ+4ͳͲΛษڧͯ͠ΞϓϦΛ࡞ͬ ͯΈ͍ͨ
ײdbenevolent0505d w +BWB4DSJQU͕นͩͬͨ w ଞͷݴޠͱൺΔͱ׳Εͳ͍ײ͡ w 8FCͷٕज़ʹڵຯΛͬͨ w 8FCͷٕज़ͷڧྗ͞ w
ਓͰΔ͜ͱͷྑ͞ w ձ͠ͳ͕Βͬͨ΄͏͕ਐΜͩؾ͕͢Δ
ײdjade_halcyond Կ͔͕ॳΊͯͷܦݧͩͬͨ ɾΞϓϦέʔγϣϯʹ͍ͭͯ৮ΕΔ ! ɾ৮Εͨ͜ͱͷͳ͍ݴޠ ! ɾҰͭͷίʔυΛ̏ਓͰಡΉ
͝੩ௌ͋Γ͕ͱ͏͍͟͝·ͨ͠