yetangitu/canvas-based-HTML5-Comic-Book-Reader
1
0
Fork 0
Code Issues Pull requests Releases Wiki Activity

starting work on effects

Browse source
This commit is contained in:
Bala Clark 2010-07-13 17:21:54 +01:00
parent c91827ee03
commit 5dc6f6ae89
3 changed files with 41 additions and 1 deletions
Download patch file Download diff file Expand all files Collapse all files

2
lib/ComicBook.js
View file

@ -247,6 +247,8 @@ function ComicBook(id, srcs, opts) {
// draw the page(s)
context.drawImage(page, offsetW, offsetH, page_width, page_height);
if (options.displayMode === "double" && typeof page2 === "object") { context.drawImage(page2, page_width + offsetW, offsetH, page_width, page_height); }
Pixastic.process(canvas, "desaturate", {average : false});
};
/**

37
lib/Effects/desaturate.js Normal file
View file

@ -0,0 +1,37 @@
/*
* Pixastic Lib - Desaturation filter - v0.1.1
* Copyright (c) 2008 Jacob Seidelin, jseidelin@nihilogic.dk, http://blog.nihilogic.dk/
* License: [http://www.pixastic.com/lib/license.txt]
*/
Pixastic.Actions.desaturate = {
process : function(params) {
var useAverage = !!(params.options.average && params.options.average != "false");
if (Pixastic.Client.hasCanvasImageData()) {
var data = Pixastic.prepareData(params);
var rect = params.options.rect;
var w = rect.width;
var h = rect.height;
var p = w*h;
var pix = p*4, pix1, pix2;
if (useAverage) {
while (p--)
data[pix-=4] = data[pix1=pix+1] = data[pix2=pix+2] = (data[pix]+data[pix1]+data[pix2])/3
} else {
while (p--)
data[pix-=4] = data[pix1=pix+1] = data[pix2=pix+2] = (data[pix]*0.3 + data[pix1]*0.59 + data[pix2]*0.11);
}
return true;
} else if (Pixastic.Client.isIE()) {
params.image.style.filter += " gray";
return true;
}
},
checkSupport : function() {
return (Pixastic.Client.hasCanvasImageData() || Pixastic.Client.isIE());
}
}

1
reader.html
View file

@ -11,6 +11,7 @@
<link rel="stylesheet" href="styles.css" media="screen, projection" />
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script src="lib/Effects/desaturate.js"></script>
<script src="lib/ComicBook.js"></script>
</head>
<body id="body"">