<commit_before>---
layout:     post
title:      Pendel 
summary:    A pendulum controlled by a smartphone.
categories: javascript
---

<div id="feld" style="position:relative; width:100%; height:600px;
    background:#39CCCC" class="absolute-center">
    <div id="pendel" style="position:absolute; width:20px; height:20px;
      background:#F012BE; border-radius:100%"></div>
</div>

<script type="text/javascript">
    var feld = document.getElementById('feld');
    var pendel = document.getElementById('pendel');

    var maxW = feld.clientWidth - pendel.clientWidth;
    var maxH = feld.clientHeight - pendel.clientHeight;

    function handleOrientation(event) {
      var x = event.beta%90;
      var y = event.gamma;

      x += 90;
      y += 90;

      pendel.style.left = (maxW*y/180 - pendel.clientWidth/2) + "px";
      pendel.style.top  = (maxH*x/180 - pendel.clientHeight/2) + "px";
    }
<commit_msg>Update 2015-03-16-pendel.md<commit_after>---
layout:     post
title:      Pendel 
summary:    A pendulum controlled by a smartphone.
categories: javascript
---


{% highlight javascript %}
script type="text/javascript">
    var feld = document.getElementById('feld');
    var pendel = .getElementById('pendel');

    var maxW = feld.clientWidth - pendel.clientWidth;
    var maxH = feld.clientHeight - pendel.clientHeight;

    function handleOrientation(event) {
      var x = event
{% endhighlight %}


<div id="feld" style="position:relative; width:100%; height:600px;
    background:#39CCCC" class="absolute-center">
    <div id="pendel" style="position:absolute; width:20px; height:20px;
      background:#F012BE; border-radius:100%"></div>
</div>

<script type="text/javascript">
    var feld = document.getElementById('feld');
    var pendel = .getElementById('pendel');

    var maxW = feld.clientWidth - pendel.clientWidth;
    var maxH = feld.clientHeight - pendel.clientHeight;

    function handleOrientation(event) {
      var x = event.beta%90;
      var y = event.gamma;

      x += 90;
      y += 90;

      pendel.style.left = (maxW*y/180 - pendel.clientWidth/2) + "px";
      pendel.style.top  = (maxH*x/180 - pendel.clientHeight/2) + "px";
    }

{'fraction_non_alphanumeric': 0.14541284403669724, 'fraction_numerical': 0.03302752293577982, 'mean_word_length': 3.3102766798418974, 'pattern_counts': {'":': 0, '<': 13, '<?xml version=': 0, '>': 14, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '744802', 'n_tokens_mistral': 797, 'n_tokens_neox': 697, 'n_words': 155}