parent
637fb40ac9
commit
3a2869a929
14 changed files with 10777 additions and 115 deletions
@ -1 +0,0 @@ |
||||
The HTML files generated are in this directory |
@ -0,0 +1,63 @@ |
||||
<!DOCTYPE html> |
||||
<html id="body"> |
||||
<head> |
||||
<title>Detailed Comparison</title> |
||||
<script type="text/javascript" src ="scripts/jquery-3.2.1.js"></script> |
||||
<script type="text/javascript" src ="scripts/jquery.animateSprite.js"></script> |
||||
<script type="text/javascript" src ="scripts/top.js" ></script> |
||||
<link rel="stylesheet" type="text/css" href="styles/top.css"> |
||||
</head> |
||||
<p id="demo"></p> |
||||
<div id="animation" class="animation"></div><br> |
||||
|
||||
<button id="set_dim"onclick="set_dim()">SetDim</button> |
||||
<button id="start">Start</button> |
||||
<button id="play">Play</button> |
||||
<button id="stop">Stop</button> |
||||
<button id="changeFPS">Change FPS</button><br> |
||||
|
||||
<script> |
||||
/* global $ */ |
||||
var currentFps = 1; |
||||
var animationSettings = { |
||||
fps: currentFps, |
||||
loop: true, |
||||
autoplay: false, |
||||
animations: { |
||||
walkRight: [0, 3] |
||||
} |
||||
}; |
||||
|
||||
$(document).ready(function(){ |
||||
$("#start").click(function(){ |
||||
|
||||
$('.animation').animateSprite(animationSettings); |
||||
|
||||
var play = function(){ |
||||
$('.animation').animateSprite('play'); |
||||
} |
||||
|
||||
$('#play').on('click', play); |
||||
|
||||
$('#stop').on('click', function(){ |
||||
$('.animation').animateSprite('stop'); |
||||
}); |
||||
|
||||
$('#changeFPS').on('click', function(){ |
||||
currentFps = (currentFps === 2) ? 1 : 2; |
||||
$('.animation').animateSprite('fps', currentFps); |
||||
}); |
||||
|
||||
$('body').on('keydown', function(ev){ |
||||
if (ev.keyCode === 39){ |
||||
goRight(); |
||||
} else if (ev.keyCode === 37) { |
||||
goLeft(); |
||||
} |
||||
console.log('ev', ev.keyCode); |
||||
}); |
||||
}); |
||||
}); |
||||
</script> |
||||
</body> |
||||
</html> |
@ -1,2 +0,0 @@ |
||||
This folder includes all the images generated |
||||
|
@ -1,22 +0,0 @@ |
||||
var people, asc1 = 1,asc2 = 1,asc3 = 1; |
||||
|
||||
function sort_t(tbody, col, asc){ |
||||
var rows = tbody.rows, rlen = rows.length, arr = new Array(), i, j, cells, clen; |
||||
// fill the array with values from the table
|
||||
for(i = 0; i < rlen; i++){ |
||||
cells = rows[i].cells; |
||||
clen = cells.length; |
||||
arr[i] = new Array(); |
||||
for(j = 0; j < clen; j++){ |
||||
arr[i][j] = cells[j].innerHTML; |
||||
} |
||||
} |
||||
// sort the array by the specified column number (col) and order (asc)
|
||||
arr.sort(function(a, b){ |
||||
return (a[col] == b[col]) ? 0 : ((a[col] > b[col]) ? asc : -1*asc); |
||||
}); |
||||
for(i = 0; i < rlen; i++){ |
||||
arr[i] = "<td>"+arr[i].join("</td><td>")+"</td>"; |
||||
} |
||||
tbody.innerHTML = "<tr>"+arr.join("</tr><tr>")+"</tr>"; |
||||
} |
File diff suppressed because it is too large
Load Diff
@ -0,0 +1,227 @@ |
||||
/*! jqueryanimatesprite - v1.3.5 - 2014-10-17 |
||||
* http://blaiprat.github.io/jquery.animateSprite/
|
||||
* Copyright (c) 2014 blai Pratdesaba; Licensed MIT */ |
||||
(function ($, window, undefined) { |
||||
|
||||
'use strict'; |
||||
var init = function (options) { |
||||
|
||||
return this.each(function () { |
||||
var $this = $(this), |
||||
data = $this.data('animateSprite'); |
||||
|
||||
// ASYNC
|
||||
// If we don't specify the columns, we
|
||||
// can discover using the background size
|
||||
var discoverColumns = function (cb) { |
||||
var imageSrc = $this.css('background-image').replace(/url\((['"])?(.*?)\1\)/gi, '$2'); |
||||
var image = new Image(); |
||||
|
||||
image.onload = function () { |
||||
var width = image.width, |
||||
height = image.height; |
||||
cb(width, height); |
||||
}; |
||||
image.src = imageSrc; |
||||
}; |
||||
|
||||
if (!data) { |
||||
$this.data('animateSprite', { |
||||
settings: $.extend({ |
||||
width: $this.width(), |
||||
height: $this.height(), |
||||
totalFrames: false, |
||||
columns: false, |
||||
fps: 12, |
||||
complete: function () {}, |
||||
loop: false, |
||||
autoplay: true |
||||
}, options), |
||||
currentFrame: 0, |
||||
controlAnimation: function () { |
||||
|
||||
var checkLoop = function (currentFrame, finalFrame) { |
||||
currentFrame++; |
||||
if (currentFrame >= finalFrame) { |
||||
if (this.settings.loop === true) { |
||||
currentFrame = 0; |
||||
data.controlTimer(); |
||||
} else { |
||||
this.settings.complete(); |
||||
} |
||||
} else { |
||||
data.controlTimer(); |
||||
} |
||||
return currentFrame; |
||||
}; |
||||
|
||||
if (this.settings.animations === undefined) { |
||||
$this.animateSprite('frame', this.currentFrame); |
||||
this.currentFrame = checkLoop.call(this, this.currentFrame, this.settings.totalFrames); |
||||
|
||||
} else { |
||||
if (this.currentAnimation === undefined) { |
||||
for (var k in this.settings.animations) { |
||||
this.currentAnimation = this.settings.animations[k]; |
||||
break; |
||||
} |
||||
} |
||||
var newFrame = this.currentAnimation[this.currentFrame]; |
||||
|
||||
$this.animateSprite('frame', newFrame); |
||||
this.currentFrame = checkLoop.call(this, this.currentFrame, this.currentAnimation.length); |
||||
|
||||
} |
||||
|
||||
}, |
||||
controlTimer: function () { |
||||
// duration overrides fps
|
||||
var speed = 1000 / data.settings.fps; |
||||
|
||||
if (data.settings.duration !== undefined) { |
||||
speed = data.settings.duration / data.settings.totalFrames; |
||||
} |
||||
|
||||
data.interval = setTimeout(function () { |
||||
data.controlAnimation(); |
||||
}, speed); |
||||
|
||||
} |
||||
}); |
||||
|
||||
|
||||
data = $this.data('animateSprite'); |
||||
|
||||
// Setting up columns and total frames
|
||||
if (!data.settings.columns) { |
||||
// this is an async function
|
||||
discoverColumns(function (width, height) { |
||||
// getting amount of columns
|
||||
data.settings.columns = Math.round(width / data.settings.width); |
||||
// if totalframes are not specified
|
||||
if (!data.settings.totalFrames) { |
||||
// total frames is columns times rows
|
||||
var rows = Math.round(height / data.settings.height); |
||||
data.settings.totalFrames = data.settings.columns * rows; |
||||
} |
||||
if (data.settings.autoplay) { |
||||
data.controlTimer(); |
||||
} |
||||
}); |
||||
} else { |
||||
|
||||
// if everything is already set up
|
||||
// we start the interval
|
||||
if (data.settings.autoplay) { |
||||
data.controlTimer(); |
||||
} |
||||
} |
||||
|
||||
|
||||
} |
||||
|
||||
}); |
||||
|
||||
}; |
||||
|
||||
var frame = function (frameNumber) { |
||||
// frame: number of the frame to be displayed
|
||||
return this.each(function () { |
||||
if ($(this).data('animateSprite') !== undefined) { |
||||
var $this = $(this), |
||||
data = $this.data('animateSprite'), |
||||
row = Math.floor(frameNumber / data.settings.columns), |
||||
column = frameNumber % data.settings.columns; |
||||
|
||||
$this.css('background-position', (-data.settings.width * column) + 'px ' + (-data.settings.height * row) + 'px'); |
||||
} |
||||
}); |
||||
}; |
||||
|
||||
var stop = function () { |
||||
return this.each(function () { |
||||
var $this = $(this), |
||||
data = $this.data('animateSprite'); |
||||
clearTimeout(data.interval); |
||||
}); |
||||
}; |
||||
|
||||
var resume = function () { |
||||
return this.each(function () { |
||||
var $this = $(this), |
||||
data = $this.data('animateSprite'); |
||||
|
||||
// always st'op animation to prevent overlapping intervals
|
||||
$this.animateSprite('stopAnimation'); |
||||
data.controlTimer(); |
||||
}); |
||||
}; |
||||
|
||||
var restart = function () { |
||||
return this.each(function () { |
||||
var $this = $(this), |
||||
data = $this.data('animateSprite'); |
||||
|
||||
$this.animateSprite('stopAnimation'); |
||||
|
||||
data.currentFrame = 0; |
||||
data.controlTimer(); |
||||
}); |
||||
}; |
||||
|
||||
var play = function (animationName) { |
||||
return this.each(function () { |
||||
var $this = $(this), |
||||
data = $this.data('animateSprite'); |
||||
|
||||
if (typeof animationName === 'string') { |
||||
|
||||
$this.animateSprite('stopAnimation'); |
||||
if (data.settings.animations[animationName] !== data.currentAnimation) { |
||||
data.currentFrame = 0; |
||||
data.currentAnimation = data.settings.animations[animationName]; |
||||
} |
||||
data.controlTimer(); |
||||
} else { |
||||
$this.animateSprite('stopAnimation'); |
||||
data.controlTimer(); |
||||
} |
||||
|
||||
}); |
||||
}; |
||||
|
||||
var fps = function (val) { |
||||
return this.each(function () { |
||||
var $this = $(this), |
||||
data = $this.data('animateSprite'); |
||||
// data.fps
|
||||
data.settings.fps = val; |
||||
}); |
||||
}; |
||||
|
||||
var methods = { |
||||
init: init, |
||||
frame: frame, |
||||
stop: stop, |
||||
resume: resume, |
||||
restart: restart, |
||||
play: play, |
||||
stopAnimation: stop, |
||||
resumeAnimation: resume, |
||||
restartAnimation: restart, |
||||
fps: fps |
||||
}; |
||||
|
||||
$.fn.animateSprite = function (method) { |
||||
|
||||
if (methods[method]) { |
||||
return methods[method].apply(this, Array.prototype.slice.call(arguments, 1)); |
||||
} else if (typeof method === 'object' || ! method) { |
||||
return methods.init.apply(this, arguments); |
||||
} else { |
||||
$.error('Method ' + method + ' does not exist on jQuery.animateSprite'); |
||||
} |
||||
|
||||
}; |
||||
|
||||
})(jQuery, window); |
@ -0,0 +1,82 @@ |
||||
function change() { |
||||
var dpi = document.getElementById('dpi').value; |
||||
var font = document.getElementById('font').value; |
||||
var mode = document.getElementById('mode').value; |
||||
var size = document.getElementById('size').value; |
||||
var frame = document.getElementById('frame_1'); |
||||
var string = "pages/"+dpi+"/"+font+"/"+mode+"/"+size+"/index.html"; |
||||
frame.src = string; |
||||
} |
||||
|
||||
var people, asc1 = 1,asc2 = 1,asc3 = 1; |
||||
|
||||
function sort_t(tbody, col, asc){ |
||||
var rows = tbody.rows, rlen = rows.length, arr = new Array(), i, j, cells, clen; |
||||
// fill the array with values from the table
|
||||
for(i = 0; i < rlen; i++){ |
||||
cells = rows[i].cells; |
||||
clen = cells.length; |
||||
arr[i] = new Array(); |
||||
for(j = 0; j < clen; j++){ |
||||
arr[i][j] = cells[j].innerHTML; |
||||
} |
||||
} |
||||
// sort the array by the specified column number (col) and order (asc)
|
||||
arr.sort(function(a, b){ |
||||
return (a[col] == b[col]) ? 0 : ((a[col] > b[col]) ? asc : -1*asc); |
||||
}); |
||||
for(i = 0; i < rlen; i++){ |
||||
arr[i] = "<td>"+arr[i].join("</td><td>")+"</timaged>"; |
||||
} |
||||
tbody.innerHTML = "<tr>"+arr.join("</tr><tr>")+"</tr>"; |
||||
} |
||||
|
||||
function frame_2_source(image){ |
||||
var path = "url("+image.src+")"; |
||||
|
||||
var fr_2 = parent.frame_2.document; |
||||
|
||||
var div = fr_2.getElementById('animation'); |
||||
div.style.backgroundImage=path; |
||||
} |
||||
|
||||
function set_dim() { |
||||
|
||||
var imageSrc = document |
||||
.getElementById('animation') |
||||
.style |
||||
.backgroundImage |
||||
.replace(/url\((['"])?(.*?)\1\)/gi, '$2') |
||||
.split(',')[0]; |
||||
|
||||
var image = new Image(); |
||||
image.src = imageSrc; |
||||
|
||||
var src_w = image.width; |
||||
var src_h = image.height; |
||||
|
||||
var win_w = window.innerWidth; |
||||
var win_h = window.innerHeight-60; |
||||
|
||||
var r_w = (win_w/(src_w/4)).toString(); |
||||
r_w = parseInt(r_w); |
||||
|
||||
var r_h = (win_h/src_h).toString(); |
||||
r_h = parseInt(r_h); |
||||
|
||||
var div_w = 0; |
||||
var div_h = 0; |
||||
|
||||
if (r_w > r_h) |
||||
{
|
||||
div_w = src_w * r_h; |
||||
div_h = src_h * r_h; |
||||
} else { |
||||
div_w = src_w * r_w; |
||||
div_h = src_h * r_w; |
||||
} |
||||
|
||||
document.getElementById('animation').style.width= div_w/4 + "px"; |
||||
|
||||
document.getElementById('animation').style.height= div_h + "px"; |
||||
} |
@ -1,26 +1,80 @@ |
||||
rm -f ./html/images/* |
||||
rm -rf ./html/pages |
||||
rm -f ./html/top.html |
||||
##################################################################### |
||||
FT_TEST_TEST_DIR=../.. |
||||
FT_TEST_BASE_LIB=$FT_TEST_BASE_DIR/objs/.libs/libfreetype.so |
||||
FT_TEST_TEST_LIB=$FT_TEST_TEST_DIR/objs/.libs/libfreetype.so |
||||
##################################################################### |
||||
mkdir ./html/pages |
||||
touch ./html/top.html; |
||||
##################################################################### |
||||
echo ' |
||||
<!DOCTYPE html> |
||||
<head> |
||||
<script type="text/javascript" src ="scripts/jquery-3.2.1.js"></script> |
||||
<script type="text/javascript" src ="scripts/jquery.animateSprite.js"></script> |
||||
<script type="text/javascript" src ="scripts/top.js" ></script> |
||||
<link rel="stylesheet" type="text/css" href="styles/top.css"> |
||||
</head> |
||||
<html> |
||||
<body> |
||||
<iframe id="frame_1" name="frame_1" src="" ></iframe> |
||||
<iframe id="frame_2" name="frame_2" src="diff.html" ></iframe> |
||||
<div class="select"> |
||||
'>./html/top.html; |
||||
##################################################################### |
||||
for i in $FT_TEST_DPI; do |
||||
mkdir ./html/pages/$i |
||||
for j in $FT_TEST_FONT_FILE; do |
||||
mkdir ./html/pages/$i/$j |
||||
for k in $FT_TEST_RENDER_MODE; do |
||||
mkdir ./html/pages/$i/$j/$k |
||||
for l in $FT_TEST_PT_SIZE; do |
||||
mkdir ./html/pages/$i/$j/$k/$l |
||||
mkdir ./html/pages/$i/$j/$k/$l/images |
||||
./tests $FT_TEST_BASE_LIB $FT_TEST_TEST_LIB $j $l $k $i |
||||
done |
||||
done |
||||
done |
||||
done |
||||
##################################################################### |
||||
echo '<label>DPI        :<select name="dpi" id="dpi" onchange="change()">'>>./html/top.html; |
||||
for i in $FT_TEST_DPI; do |
||||
echo " <option value= $i > $i </option>">>./html/top.html; |
||||
done |
||||
echo '</select> |
||||
</label><br>'>>./html/top.html; |
||||
##################################################################### |
||||
echo '<label>Font       :<select name="font" id="font" onchange="change()">'>>./html/top.html; |
||||
for i in $FT_TEST_FONT_FILE; do |
||||
echo " <option value= $i > $i </option>">>./html/top.html; |
||||
done |
||||
echo '</select> |
||||
</label><br>'>>./html/top.html; |
||||
##################################################################### |
||||
echo '<label>Render Mode:<select name="mode" id="mode" onchange="change()">'>>./html/top.html; |
||||
for i in $FT_TEST_RENDER_MODE; do |
||||
echo " <option value= $i > $i </option>">>./html/top.html; |
||||
done |
||||
echo '</select> |
||||
</label><br>'>>./html/top.html; |
||||
##################################################################### |
||||
echo '<label>Size       :<select name="size" id="size" onchange="change()">'>>./html/top.html; |
||||
for i in $FT_TEST_PT_SIZE; do |
||||
echo " <option value= $i > $i </option>">>./html/top.html; |
||||
done |
||||
echo '</select> |
||||
</label><br>'>>./html/top.html; |
||||
##################################################################### |
||||
echo '</div> |
||||
</body> |
||||
</html>'>>./html/top.html; |
||||
##################################################################### |
||||
echo "Font : " $FT_TEST_FONT_FILE |
||||
echo "Size : " $FT_TEST_PT_SIZE |
||||
echo "Render_Mode: " $FT_TEST_RENDER_MODE |
||||
echo "DPI : " $FT_TEST_DPI |
||||
|
||||
BASE_DIR=$1 |
||||
TEST_DIR=../.. |
||||
|
||||
BASE_LIB=$BASE_DIR/objs/.libs/libfreetype.so |
||||
TEST_LIB=$TEST_DIR/objs/.libs/libfreetype.so |
||||
|
||||
FONT_FILE=$2 |
||||
PT_SIZE=$3 |
||||
|
||||
echo |
||||
echo "*** Generating Images ***" |
||||
echo |
||||
|
||||
./tests $BASE_LIB $TEST_LIB $FONT_FILE $PT_SIZE |
||||
|
||||
echo "Font: " $FONT_FILE |
||||
echo "Size: " $PT_SIZE |
||||
|
||||
# Removing the current DPI and Render Mode settings |
||||
# for future compilations. |
||||
rm -f ./render_modes ./dpi |
||||
|
||||
|
||||
|
||||
|
Loading…
Reference in new issue