Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with
or
.
Download ZIP
Branch: master
Fetching contributors…

Cannot retrieve contributors at this time

177 lines (163 sloc) 7.652 kB
<html>
<script type="text/javascript" src="https://raw.github.com/visionmedia/mocha/master/mocha.js"></script>
<link rel="stylesheet" href="https://raw.github.com/visionmedia/mocha/master/mocha.css"></script>
<style>
.testset.success .input > div,
.testset.success .expect > div{
border : 1px green solid;
}
.testset.failed .input > div,
.testset.failed .expect > div{
border : 1px red solid;
}
</style>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script type="text/javascript" src="https://raw.github.com/Jxck/assert/master/assert.js"></script>
<!--
<script type="text/javascript" src="http://chaijs.com/chai.js"></script>
var should = chai.should();
<script type="text/javascript" src="https://raw.github.com/chaijs/chai-jquery/master/chai-jquery.js"></script>
-->
<script type="text/javascript" src="https://jquery-list-attributes.googlecode.com/files/jquery.mapAttributes.js"></script>
<script type="text/javascript" src="jquery.centerimg.js"></script>
<script type="text/javascript">
mocha.setup("bdd")
</script>
<div id="mocha"></div>
<div class="testset">
<h1 class="title">Normal test<h1>
<div class="input">
<img class="centerimg" src="landscape.png">
</div>
<div class="expect">
<div style="width: 100px; height: 100px;">
<span style="width: 100px; height: 100px; font-size: 0px; display: block; vertical-align: middle; text-align: center; text-decoration: none; outline: none;">
<img class="centerimg" src="landscape.png"
style="max-height: 100px; max-width: 100px; line-height: 100px; vertical-align: middle; border: none;">
<span style="height: 100px; display: inline-block; font-size: 0px; width: 1px; margin-left: -1px; overflow: hidden; vertical-align: middle;"></span>
</span>
</div>
</div>
</div>
<div class="testset">
<h1 class="title">Size Test(int)<h1>
<div class="input">
<img class="centerimg"
src="landscape.png"
data-width=120
data-height=109
>
</div>
<div class="expect">
<div style="width: 120px; height: 109px;">
<span style="width: 120px; height: 109px; font-size: 0px; display: block; vertical-align: middle; text-align: center; text-decoration: none; outline: none;">
<img class="centerimg" src="landscape.png" data-width="120px" data-height="109px" style="max-height: 109px; max-width: 120px; line-height: 109px; vertical-align: middle; border: none;">
<span style="height: 109px; display: inline-block; font-size: 0px; width: 1px; margin-left: -1px; overflow: hidden; vertical-align: middle;"></span>
</span>
</div>
</div>
</div>
<div class="testset">
<h1 class="title">Size Test(string)<h1>
<div class="input">
<img class="centerimg"
src="landscape.png"
data-width="120px"
data-height="109px"
>
</div>
<div class="expect">
<div style="width: 120px; height: 109px;">
<span style="width: 120px; height: 109px; font-size: 0px; display: block; vertical-align: middle; text-align: center; text-decoration: none; outline: none;">
<img class="centerimg" src="landscape.png" data-width="120px" data-height="109px" style="max-height: 109px; max-width: 120px; line-height: 109px; vertical-align: middle; border: none;">
<span style="height: 109px; display: inline-block; font-size: 0px; width: 1px; margin-left: -1px; overflow: hidden; vertical-align: middle;"></span>
</span>
</div>
</div>
</div>
</div>
<div class="testset">
<h1 class="title">Link test<h1>
<div class="input">
<img class="centerimg"
src="portrait.png"
data-link="http://google.com"
data-width="200"
data-height="100">
</div>
<div class="expect">
<div style="width: 200px; height: 100px;">
<a style="width: 200px; height: 100px; font-size: 0px; display: block; vertical-align: middle; text-align: center; text-decoration: none; outline: none;" href="http://google.com">
<img class="centerimg" data-src="portrait.png" data-link="http://google.com" data-width="200" data-height="100" src="portrait.png" style="max-height: 100px; max-width: 200px; line-height: 100px; vertical-align: middle; border: none;">
<span style="height: 100px; display: inline-block; font-size: 0px; width: 1px; margin-left: -1px; overflow: hidden; vertical-align: middle;"></span>
</a>
</div>
</div>
</div>
<div class="testset">
<h1 class="title">Parent class Test<h1>
<div class="input">
<img class="centerimg"
data-src="portrait.png"
data-parent-class="foo"
data-link-class="bar"
>
</div>
<div class="expect">
<div style="width: 100px; height: 100px;" class="foo">
<span style="width: 100px; height: 100px; font-size: 0px; display: block; vertical-align: middle; text-align: center; text-decoration: none; outline: none;" class="bar">
<img class="centerimg" data-src="portrait.png" data-parent-class="foo" data-link-class="bar" src="portrait.png" style="max-height: 100px; max-width: 100px; line-height: 100px; vertical-align: middle; border: none;">
<span style="height: 100px; display: inline-block; font-size: 0px; width: 1px; margin-left: -1px; overflow: hidden; vertical-align: middle;"></span>
</span>
</div>
</div>
</div>
<div class="testset">
<h1 class="title">Set div class<h1>
<div class="input">
<div class="centerimg">
<img src="portrait.png">
</div>
</div>
<div class="expect">
<div class="centerimg" style="width: 100px; height: 100px;">
<span style="width: 100px; height: 100px; font-size: 0px; display: block; vertical-align: middle; text-align: center; text-decoration: none; outline: none;">
<img src="portrait.png"
style="max-height: 100px; max-width: 100px; line-height: 100px; vertical-align: middle; border: none;">
<span style="height: 100px; display: inline-block; font-size: 0px; width: 1px; margin-left: -1px; overflow: hidden; vertical-align: middle;"></span>
</span>
</div>
</div>
</div>
<div class="testset">
<h1 class="title">Set link class<h1>
<div class="input">
<a class="centerimg" href="http://google.com">
<img src="portrait.png">
</a>
</div>
<div class="expect">
<div style="width: 100px; height: 100px;">
<a class="centerimg" href="http://google.com" style="width: 100px; height: 100px; font-size: 0px; display: block; vertical-align: middle; text-align: center; text-decoration: none; outline: none;">
<img src="portrait.png"
style="max-height: 100px; max-width: 100px; line-height: 100px; vertical-align: middle; border: none;">
<span style="height: 100px; display: inline-block; font-size: 0px; width: 1px; margin-left: -1px; overflow: hidden; vertical-align: middle;"></span>
</a>
</div>
</div>
</div>
<!-- TEST TEMPLATE -->
<div class="testset">
<h1 class="title"><h1>
<div class="input">
</div>
<div class="expect">
</div>
</div>
<!-- TEST TEMPLATE -->
<script type="text/javascript" src="./test/center_img_test.js"></script>
<script>
if (window.mochaPhantomJS) { mochaPhantomJS.run(); }
else { mocha.run(); }
</script>
</html>
Jump to Line
Something went wrong with that request. Please try again.