Skip to content

Commit

Permalink
fix: tweaks for iframe https linking (#212)
Browse files Browse the repository at this point in the history
  • Loading branch information
ajfisher authored Jun 29, 2024
1 parent 354e6cf commit 155279c
Show file tree
Hide file tree
Showing 2 changed files with 34 additions and 17 deletions.
48 changes: 32 additions & 16 deletions site/src/content/posts/2014-05-04-device-api-safari.md
Original file line number Diff line number Diff line change
Expand Up @@ -35,13 +35,15 @@ and explored numerous facets of the Device API, including:

The presentation is embedded below:

<p class="mediacontainer"><iframe title="A device API safari" src="//www.slideshare.net/slideshow/embed_code/key/BGkZl6CDNLabUl" allowfullscreen frameborder="0"></iframe></p>
<p class="mediacontainer"><iframe title="A device API safari"
src="//www.slideshare.net/slideshow/embed_code/key/BGkZl6CDNLabUl"
allowfullscreen frameborder="0"></iframe></p>

[A Device API Safari - WDC 2014](//www.slideshare.net/andrewjfisher/a-device-api-safari-web-directions-code-2014)

The main aim of this talk was to have a large number of demos in the 20 minute
presentation in order to show case what was possible. All the code for these
demos is [available in the repo.](http://github.com/ajfisher/wdc)
demos is [available in the repo.](https://github.com/ajfisher/wdc)

The demos are embedded below if you'd like to play with them in more detail noting
that support can be a bit hit and miss. Firefox is pretty much guaranteed.
Expand All @@ -50,51 +52,65 @@ that support can be a bit hit and miss. Firefox is pretty much guaranteed.

Support: all mobile devices with a proximity sensor

<p class="mediacontainer"><iframe title="Proximity sensor test" src="http://wdc14.ajf.io/examples/proximity/" frameborder="0"></iframe></p>
<p class="mediacontainer"><iframe title="Proximity sensor test"
src="https://wdc14.ajf.io/examples/proximity/" frameborder="0"></iframe></p>

[Proximity detection](http://wdc14.ajf.io/examples/proximity/)
[Proximity detection](https://wdc14.ajf.io/examples/proximity/)

<p class="mediacontainer"><iframe title="Video of proximity test" src="https://www.youtube.com/embed/7cgug03jmVw" frameborder="0" allowfullscreen></iframe></p>
<p class="mediacontainer"><iframe title="Video of proximity test"
src="https://www.youtube.com/embed/7cgug03jmVw" frameborder="0"
allowfullscreen></iframe></p>

## Battery

Support: All modern browsers except IE (any)

<p class="mediacontainer"><iframe title="Battery API example" src="http://wdc14.ajf.io/examples/battery/demo.html" frameborder="0"></iframe></p>
<p class="mediacontainer"><iframe title="Battery API example"
src="https://wdc14.ajf.io/examples/battery/demo.html"
frameborder="0"></iframe></p>

[Battery level](http://wdc14.ajf.io/examples/battery/demo.html)
[Battery level](https://wdc14.ajf.io/examples/battery/demo.html)

## Vibration

Support: Most devices that have vibration motor in them

Application in HTML games:

<p class="mediacontainer"><iframe title="Vibration motor example" src="https://www.youtube.com/embed/0AC_InC0QMA" frameborder="0" allowfullscreen></iframe></p>
<p class="mediacontainer"><iframe title="Vibration motor example"
src="https://www.youtube.com/embed/0AC_InC0QMA" frameborder="0"
allowfullscreen></iframe></p>

[Racer](http://wdc14.ajf.io/examples/racing_car/)
[Racer](https://wdc14.ajf.io/examples/racing_car/)

Application in form error reporting:

<p class="mediacontainer"><iframe title="Vibrating form example" src="http://wdc14.ajf.io/examples/vibrate/form.html" frameborder="0"></iframe></p>
<p class="mediacontainer"><iframe title="Vibrating form example"
src="https://wdc14.ajf.io/examples/vibrate/form.html"
frameborder="0"></iframe></p>

[Vibration form](http://wdc14.ajf.io/examples/vibrate/form.html)
[Vibration form](https://wdc14.ajf.io/examples/vibrate/form.html)

## Ambient light

Support: Firefox on desktop and most mobile devices

Application in contrast modification:

<p class="mediacontainer"><iframe title="Ambient light contrast changer" src="http://wdc14.ajf.io/examples/ambient/contrast.html" frameborder="0"></iframe></p>
<p class="mediacontainer"><iframe title="Ambient light contrast changer"
src="https://wdc14.ajf.io/examples/ambient/contrast.html"
frameborder="0"></iframe></p>

[Ambient light for contrast modification](http://wdc14.ajf.io/examples/ambient/contrast.html)
[Ambient light for contrast modification](https://wdc14.ajf.io/examples/ambient/contrast.html)

Application in silliness:

<p class="mediacontainer"><iframe title="Video showing ambient light changes" src="https://www.youtube.com/embed/E2Eu5gRvkME" frameborder="0" allowfullscreen></iframe></p>
<p class="mediacontainer"><iframe title="Video showing ambient light changes"
src="https://www.youtube.com/embed/E2Eu5gRvkME" frameborder="0"
allowfullscreen></iframe></p>

<p class="mediacontainer"><iframe title="Ambient light demo" src="http://wdc14.ajf.io/examples/ambient/ghosts.html" frameborder="0"></iframe></p>
<p class="mediacontainer"><iframe title="Ambient light demo"
src="https://wdc14.ajf.io/examples/ambient/ghosts.html" frameborder="0"></iframe></p>

[Ghosts appearing over video stream](http://wdc14.ajf.io/examples/ambient/ghosts.html)
[Ghosts appearing over video stream](https://wdc14.ajf.io/examples/ambient/ghosts.html)

3 changes: 2 additions & 1 deletion site/src/content/posts/2015-08-08-ddd-jsiot-workshop.md
Original file line number Diff line number Diff line change
Expand Up @@ -31,4 +31,5 @@ devices that were built were:
* Ambient light visualisation
* Temperature data logger

<p class="mediacontainer"><iframe title="JS IOT slides" frameborder="0" src="http://jsiot.ajf.io/"></iframe></p>
<p class="mediacontainer"><iframe title="JS IOT slides" frameborder="0"
src="https://jsiot.ajf.io/"></iframe></p>

0 comments on commit 155279c

Please sign in to comment.