Skip to content

Instantly share code, notes, and snippets.

@diverted247

diverted247/viewer.html

Created August 29, 2014 17:57
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save diverted247/8933fbc020c93c813996 to your computer and use it in GitHub Desktop.
Save diverted247/8933fbc020c93c813996 to your computer and use it in GitHub Desktop.
Download ZIP
Font Viewer (progress)
Raw
viewer.html
<!DOCTYPE html>
<html>
<head>
<title>txt: Text + Alignment Example</title>
<script type="text/javascript" src="../../src/easeljs-NEXT.min.js"></script>
<script type="text/javascript" src="../../src/txt/Graphics.js"></script>
<script type="text/javascript" src="../../src/txt/CharacterText.js"></script>
<script type="text/javascript" src="../../src/txt/Character.js"></script>
<script type="text/javascript" src="../../src/txt/Glyph.js"></script>
<script type="text/javascript" src="../../src/txt/Align.js"></script>
<script type="text/javascript" src="../../src/txt/Case.js"></script>
<script type="text/javascript" src="../../src/txt/Font.js"></script>
<script type="text/javascript" src="../../src/txt/Word.js"></script>
<script type="text/javascript" src="../../src/txt/Line.js"></script>
<script type="text/javascript" src="../../src/txt/FontLoader.js"></script>
<script type="text/javascript">
var canvas;
var stage;
var PIXEL_RATIO = (function () {
var ctx = document.createElement("canvas").getContext("2d"),
dpr = window.devicePixelRatio || 1,
bsr = ctx.webkitBackingStorePixelRatio ||
ctx.mozBackingStorePixelRatio ||
ctx.msBackingStorePixelRatio ||
ctx.oBackingStorePixelRatio ||
ctx.backingStorePixelRatio || 1;
return dpr / bsr;
})();
createHiDPICanvas = function(w, h, ratio) {
if (!ratio) { ratio = PIXEL_RATIO; }
var can = document.createElement("canvas");
can.width = w * ratio;
can.height = h * ratio;
can.style.width = w + "px";
can.style.height = h + "px";
can.getContext("2d").setTransform(ratio, 0, 0, ratio, 0, 0);
return can;
}
function render(){
var list = JSON.parse( this.responseText ).data;
console.log( list );
var character
var len = list.length-1;
for( var i = 0; i <= 39 ; i++ ){
character = new txt.CharacterText( {
text:'Adjective',
font:list[i],
width:800,
height:150,
align:txt.Align.TOP_CENTER,
size:150,
x:Math.floor(i/10)*810,
y:10 + i%10 * 220,
debug:true
} );
stage.addChild( character );
stage.update();
};
}
function init() {
canvas = createHiDPICanvas( 2000 , 1500 , 2 );
document.body.appendChild( canvas );
stage = new createjs.Stage(canvas);
var request = new XMLHttpRequest();
request.onload = render;
request.open("get", "fonts.json", true);
request.send();
}
</script>
</head>
<body onload="init()">
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment