Skip to content

Instantly share code, notes, and snippets.

@mattfinch
Created March 30, 2015 23:22
Show Gist options
  • Save mattfinch/6bba350a380b86deb381 to your computer and use it in GitHub Desktop.
Save mattfinch/6bba350a380b86deb381 to your computer and use it in GitHub Desktop.
Baudot

Baudot

Baudot Code - randomly changing over time + scrolling. Could be used as a loader I suppose... Options for these are in updateBaudot() function. Enjoy.

Set data-length and data-interval for the number of characters and interval in ms. Defaults to 16 and 100 if not.

A Pen by mattfinch on CodePen.

License.

<div class="baudot" data-length="32" data-interval="80"><div>
$(document).ready(function(){
initBaudot();
});
function initBaudot() {
l = $(".baudot").data('length') ? $(".baudot").data('length') : 16
i = $(".baudot").data('interval') ? $(".baudot").data('interval') : 100
$(".baudot").html(getRandomString(l))
setInterval('updateBaudot()', i);
}
function updateBaudot() {
//Scroll forward, it's good!
$(".baudot").html(getRandomString(1) + $(".baudot").html().substring(0,$(".baudot").html().length-1));
//Scroll in reverse, it's doog!
//$(".baudot").html($(".baudot").html().substring(1) + getRandomString(1));
//Full Retard. Random characters for all positions. I think it's pretty ugly.
//$(".baudot").html(getRandomString($(".baudot").html().length));
}
function getRandomString(n) {
var s = "";
var possible = "ABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789";
for( var i=0; i < n; i++ )
s += possible.charAt(Math.floor(Math.random() * possible.length));
return s;
}
body {
background: #212121;
margin-top: 5%;
text-align: center;
}
.baudot {
background: #FFF3E0;
font-size: 6em;
color: #424242;
display: inline-block;
padding: 6px;
font-family: baudot;
-webkit-box-shadow: 2px 3px 10px 0px rgba(0,0,0,1);
-moz-box-shadow: 2px 3px 10px 0px rgba(0,0,0,1);
box-shadow: 2px 3px 10px 0px rgba(0,0,0,1);
}
@font-face {
font-family: 'baudot';
src: url(data:application/x-font-woff;charset=utf-8;base64,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) format('woff');
font-weight: normal;
font-style: normal;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment