refactored some stuff, also took advantage of the native js sort function

This commit is contained in:
Dominick Pham 2010-05-04 21:34:07 -04:00
parent 560a57e506
commit e1ca9115ea
3 changed files with 133 additions and 181 deletions

View file

@ -4,42 +4,41 @@
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Franz - client side color palettes from logos</title>
<link rel="stylesheet" type="text/css" media="screen" href="css/example.css">
<script type="text/javascript" src="http://images.webs.com/static/global/js/jquery/jquery-1.3.2.min.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
<script type="text/javascript" src="js/franz.js"></script>
<script type="text/javascript">
var lol;
$(document).ready(function() {
lol = new franz({
canvas: "lol",
src: "awesome/lol.png",
callback: function() {
console.log("Instantiated new Franz instance");
}
});
$("#franz_form").submit(function(){
lol = new franz({
canvas: "lol",
src: $("#img_input").val(),
callback: function() {
console.log("Instantiated new Franz instance");
$("#options").show();
}
});
return false;
});
$("#try_these a").click(function(){
$("#img_input").val(this.title);
return false;
});
$("#sort_hue").click(function() {
franz.displayHue();
lol.displayHue();
return false;
});
$("#sort_sat").click(function() {
franz.displaySat();
lol.displaySat();
return false;
});
$("#sort_val").click(function() {
franz.displayVal();
return false;
});
$("#sort_light").click(function() {
franz.displayLight();
return false;
});
$("#sort_satL").click(function() {
franz.displaySatL();
lol.displayBright();
return false;
});
});
@ -81,10 +80,8 @@
<div id="options">
<p id="hsv">
<a href="#" id="sort_hue" title="Sort by Hue">Sort by Hue</a>
<a href="#" id="sort_sat" title="Sort by Saturation HSV">Saturation (HSV)</a>
<a href="#" id="sort_satL" title="Sort by Saturation HSL">Saturation (HSL)</a>
<a href="#" id="sort_val" title="Sort by Value">Value (HSV)</a>
<a href="#" id="sort_light" title="Sort by Lightness">Lightness (HSL)</a>
<a href="#" id="sort_sat" title="Sort by Saturation">Saturation</a>
<a href="#" id="sort_val" title="Sort by Brightness">Brightness</a>
</p>
</div>