| 00:50 | <Jasper> | http://www.whatwg.org/specs/web-apps/current-work/multipage/the-canvas-element.html#drawing-images |
| 00:50 | <Jasper> | " |
| 00:50 | <Jasper> | When the source rectangle is outside the source image, it must be clipped to the source image, and the destination rectangle must be clipped in the same proportion. |
| 00:50 | <Jasper> | " |
| 00:51 | <Jasper> | (whoops, didn't mean to paste line breaks). Is it possible to specify how this clipping is done? Firefox w/out acceleration, Firefox w/ acceleration and Chrome all seem to do different things. |
| 00:51 | <Jasper> | See: http://magcius.github.com/xserver.js/copyimage.html (press any key repeatedly) |
| 00:53 | <Jasper> | Firefox w/ acceleration seems to do naive clipping and stretches the image. Chrome doesn't seem to draw anything, it just aborts the request, and Firefox w/out acceleration smartly clips the source and destination so that it's as if you just drew on a larger canvas, and then clipped it. |
| 02:51 | <Hixie> | Jasper: not possible to specify what it should be exactly but iirc we do specify what it should be |
| 02:52 | <Jasper> | Hixie, as far as I can tell, it doesn't specify how things should be clipped anywhere. |
| 02:53 | <Hixie> | what rendering do you disagree with that you think the spec allows? |
| 02:55 | <Jasper> | Hixie, well, let's assume a 50x50 canvas and we do drawImage(20, 20, 20, 20, 40, 40, 20, 20); |
| 02:55 | <Jasper> | It might be interpreted as drawImage(20, 20, 20, 20, 40, 40, 10, 10);, which basically clips the extents |
| 02:55 | <Hixie> | with the drawImage image being that canvas, or another image? i'm confused, what are we drawing on what |
| 02:56 | <Jasper> | Hixie, does it matter what the source is? |
| 02:57 | <Jasper> | My demo above uses the same canvas as the source, but that really doesn't matter, I think. |
| 02:57 | <Hixie> | the part of the spec you quoted is all about the source, so yes :-) |
| 02:57 | <Jasper> | Hixie, ah, right. Just assume that the source is big enough. It's the destination I care about. |
| 02:58 | <Hixie> | then the part you quoted is of no relevance :-) |
| 02:58 | Hixie | looks at the spec |
| 02:58 | <Jasper> | "and the destination rectangle must be clipped in the same proportion" |
| 02:58 | <Jasper> | I'm assuming that means "to the destination image" |
| 02:58 | <Jasper> | not "to the source image" |
| 02:58 | <Hixie> | what's only "When the source rectangle is outside the source image" |
| 02:59 | <Jasper> | Hixie, it's very ambiguous |
| 02:59 | <Hixie> | how is that ambiguous? |
| 03:00 | <Jasper> | I initially read it as "and the destination rectangle must be clipped in the same proportion" as expanding to "... When the destination rectangle is outside the destination image, it must be clipped to the destination image" |
| 03:00 | <Hixie> | anyway, to answer your original question, looks like the spec doesn't say anything special about what happens when you paint outside the dest, so you're just required to do it, and the pixels that land outside the scratch bitmap are never used |
| 03:00 | <Hixie> | ah, ok |
| 03:00 | <Hixie> | yeah that wasn't intended |
| 03:00 | <Hixie> | let me fix that |
| 03:01 | <Jasper> | I think it would be useful to specify a behavior for what happens when you paint outside the dest, and I think the render being the same as if you had an infinite canvas. |
| 03:02 | <Hixie> | yes, that's what the spec intends |
| 03:02 | <Jasper> | Right. Only Firefox w/out acceleration does that correctly for going past the width/height. |
| 03:02 | <Jasper> | None of the browsers handle negative destination coordinates well. |
| 03:03 | <Jasper> | At least, none that I tested (Chrome Dev Channel, Firefox Nightly w/ and w/out acceleration, IE10 Preview Release) |
| 03:03 | <Hixie> | what do they do? |
| 03:04 | <Jasper> | Chrome just aborts the drawImage. |
| 03:04 | <Hixie> | o_O |
| 03:04 | <Jasper> | Yeah. |
| 03:05 | <Hixie> | you sure? works for me... |
| 03:05 | <Hixie> | e.g. http://software.hixie.ch/utilities/js/canvas/?c.clearRect(0%2C%200%2C%20640%2C%20480)%3B%0Ac.save()%3B%0Atry%20%7B%0A%20%20c.drawImage(img1%2C%2010%2C10%2C50%2C50%2C%20-20%2C-20%2C50%2C50)%3B%0A%7D%20finally%20%7B%0A%20%20c.restore()%3B%0A%7D%0A |
| 03:05 | <Jasper> | http://magcius.github.com/xserver.js/copyimage.html |
| 03:05 | <Jasper> | Hold down any key. |
| 03:06 | <Jasper> | No idea if that's a special code path. |
| 03:06 | <Hixie> | i don't understand what that page is doing |
| 03:06 | <Hixie> | can you make a simpler test case? |
| 03:06 | <Jasper> | I can try. |
| 03:06 | <Hixie> | (you can use http://software.hixie.ch/utilities/js/canvas/ to save time) |
| 03:06 | <Hixie> | (it makes writing canvas tests much easier) |
| 03:07 | <Jasper> | Thanks. |
| 03:07 | <Jasper> | That's really neat. |
| 03:08 | <Hixie> | i just checked in http://html5.org/tools/web-apps-tracker?from=7723&to=7724 to the spec to try to clarify the requirement |
| 03:08 | <Hixie> | i gotta go eat dinner, bbiab |
| 03:27 | <Jasper> | Hixie, OK, so it seems to be weird interaction coming from the source rect going beyond the source image. So, it's intended, it's just not what I expected. |
| 03:31 | <Jasper> | http://software.hixie.ch/utilities/js/canvas/?c.clearRect%280%2C%200%2C%20640%2C%20480%29%3B%0Ac.save%28%29%3B%0Atry%20{%0A%20%20var%20posX%20%3D%20c.canvas.width%20-%20img2.width%20%2B%2030%3B%0A%20%20var%20posY%20%3D%20c.canvas.height%20-%20img2.height%20%2B%2030%3B%0A%20%20c.drawImage%28img2%2C%20posX%2C%20posY%29%3B%0A%20%20c.drawImage%28c.canvas%2C%20posX%2C%20posY%2C%20img2.width%2C%20img2.height%2C%20posX%2B20%2C%20posY%2B20%2C%20img2.width%2C |
| 03:31 | <Jasper> | %20img2.height%29%3B%0A}%20finally%20{%0A%20%20c.restore%28%29%3B%0A}%0A |
| 03:31 | <Jasper> | yikes, IRC doesn't like that |
| 03:32 | <Jasper> | the cat grows larger, which isn't really what I expected for something where we're only modifying the position |
| 03:32 | <Jasper> | that's in Firefox w/ acceleration. In Chrome, it doesn't like it at all, and draws one cat. |
| 03:32 | <Jasper> | Similar cases happen for negative coordiantes as well. |
| 03:33 | <Jasper> | Perhaps there should be a special case for the source and destination being the same? |
| 05:01 | <Hixie> | Jasper: weird, i don't understand why chrome doesn't render the cat in that one |
| 05:01 | <Jasper> | Hixie, do you think that Firefox stretching the image is correct? |
| 05:02 | <Jasper> | I'd have to work out the math of how the source and destination rectangle combine. |
| 05:02 | <Hixie> | it should look exactly like it would with -30 instead of +30, except shifted over |
| 05:03 | <Jasper> | Hixie, OK, so should I file browser bugs? |
| 05:04 | <Hixie> | yeah |
| 05:04 | <Hixie> | cc me if you do? ian⊙hc |
| 05:04 | <Jasper> | OK. |
| 05:04 | <Hixie> | test case at http://goo.gl/VFSGn |
| 05:04 | <Hixie> | shows the problem well |
| 05:10 | <Jasper> | Hixie, I don't know how to CC you on the Chromium issues tracker, so here: https://code.google.com/p/chromium/issues/detail?id=176714 |
| 05:10 | <Hixie> | thanks |
| 05:10 | <Jasper> | That's a great testcase. I'll use it for the Firefox bug as well. |
| 05:10 | <Hixie> | thanks a ton for filing the bugs, btw |
| 05:11 | <Hixie> | much appreciated |
| 05:14 | <Jasper> | I work on a big open-source project as well -- I know how it feels to not get bugs reported. |
| 05:14 | <Jasper> | Thanks for being patient. |
| 05:18 | <Jasper> | Hixie, filed FF bug, CC'd you at https://bugzilla.mozilla.org/show_bug.cgi?id=842110 |
| 05:19 | <Hixie> | ta |
| 06:48 | <dbaron> | Jasper, what are the upload / download buttons and the textarea supposed to do? |
| 06:48 | <dbaron> | Jasper, are they testcase-writing tools or part of the actual testcase? |
| 06:48 | <Jasper> | dbaron, I didn't write the harness, Hixie did. |
| 06:48 | <dbaron> | Jasper, when filing bugs, it's really useful to just have the testcase |
| 06:48 | <Jasper> | dbaron, they're not part of the testcaews |
| 06:50 | <Jasper> | They apparently POST something to clipboard.cgi. I don't know what that does. |
| 09:34 | <Philip`> | Jasper: It's uploading/downloading to/from a global shared clipboard |
| 09:34 | <Philip`> | which is quite useful if you're trying to develop a test on multiple devices |
| 09:35 | <Philip`> | though obviously it's totally non-scalable and in theory it can't possibly work (though in practice it does work, like a lot of Hixie's crazy ideas) |
| 15:45 | <zewt> | sort of wish indexeddb followed mongo's data model; it works well, and is very simple (especially since it essentially needs no explicit transactions at all) |
| 17:15 | <GPHemsley> | 2004 is dead. Long live 2004! https://brendaneich.com/2004/06/the-non-world-non-wide-non-web/ |