JSFiddle

  • SPACE SHOOTER

    A little space shooter, made a boring sunday

    var canvas = document.querySelector('canvas');
    var ctx = canvas.getContext('2d');
    var scoreboard = document.querySelector('.scoreboard');
    var height = 400;
    var width ...
  • Discrete sampling of Pi

    Use a discrete model to sample the value of Pi, instead of random samping.

    function computePi() {
        var diameter = parseInt($('#input').val());
        var inCircle = 0;
        var inSquare = diameter * diameter;
        
        
        for(var y = 0; y < diameter; y++)
            for(var x = 0; x < diameter; x++)
                if(inside(x,y))
                   inCircle++;
        
        
        document.getElementById('report').innerHTML =
            "<table>" +
                "<tr><td>Diameter ...</td></tr>
  • Discrete sampling of Pi #3 is the latest revision

    Use a discrete model to sample the value of Pi, instead of random samping.

    function computePi() {
        var diameter = parseInt($('#input').val());
        var inCircle = 0;
        var inSquare = diameter * diameter;
        
        
        for(var y = 0; y < diameter; y++)
            for(var x = 0; x < diameter; x++)
                if(inside(x,y))
                   inCircle++;
        
        
        document.getElementById('report').innerHTML =
            "<table>" +
                "<tr><td>Diameter ...</td></tr>
  • Discrete sampling of Pi

    Use a discrete model to sample the value of Pi, instead of random samping.

    function computePi() {
        var diameter = parseInt($('#input').val());
        var inCircle = 0;
        var inSquare = diameter * diameter;
        
        
        for(var y = 0; y < diameter; y++)
            for(var x = 0; x < diameter; x++)
                if(inside(x,y))
                   inCircle++;
        
        
        document.getElementById('report').innerHTML =
            "<table>" +
                "<tr><td>Diameter ...</td></tr>
  • Discrete sampling of Pi

    Use a discrete model to sample the value of Pi, instead of random samping.

    function computePi() {
        var diameter = parseInt($('#input').val());
        var inCircle = 0;
        var inSquare = diameter * diameter;
        
        
        for(var y = 0; y < diameter; y++)
            for(var x = 0; x < diameter; x++)
                if(inside(x,y))
                   inCircle++;
        
        
        document.getElementById('report').innerHTML =
            "<table>" +
                "<tr><td>Diameter ...</td></tr>
  • Animated CSS Youtube button

    No-Library (pure JS), HTML, CSS, JavaScript

    var state = false;
    var button = document.querySelector('.youtube')
    
    button.onclick = function() {
      button.classList[state ? 'remove' : 'add']('playing')
      state = !state
    }
  • Animated CSS Youtube button

    No-Library (pure JS), HTML, CSS, JavaScript

    var state = false;
    var button = document.querySelector('.youtube')
    
    button.onclick = function() {
      button.classList[state ? 'remove' : 'add']('playing')
      state = !state
    }
  • Add remove shadow on scroll start/stop instead of every scroll event

    No-Library (pure JS), HTML, CSS, JavaScript

    
    function createStartStopScrollEvent(scrollContainer) {
      var scrollStart = new Event("scrollStart", {"bubbles":false})
      var scrollStop = new Event("scrollStop", {"bubbles":false})
    
      var timer = null ...
  • Scroll start and stop events

    No-Library (pure JS), HTML, CSS, JavaScript

    
    function createStartStopScrollEvent(scrollContainer) {
      var scrollStart = new Event("scrollStart", {"bubbles":false})
      var scrollStop = new Event("scrollStop", {"bubbles":false})
    
      var timer = null ...
  • Debounce and throttle combined

    No-Library (pure JS), HTML, CSS, JavaScript

    var all = document.querySelector('.all'),
        reg = document.querySelector('.regular'),
        deb = document.querySelector('.debounce'),
        thr = document.querySelector('.throttle'),
        com = document.querySelector ...