{"action":"created","issue":{"url":"https://api.github.com/repos/gsathya/SDL-emscripten/issues/15","labels_url":"https://api.github.com/repos/gsathya/SDL-emscripten/issues/15/labels{/name}","comments_url":"https://api.github.com/repos/gsathya/SDL-emscripten/issues/15/comments","events_url":"https://api.github.com/repos/gsathya/SDL-emscripten/issues/15/events","html_url":"https://github.com/gsathya/SDL-emscripten/issues/15","id":53832615,"number":15,"title":"Red and blue swapped in Firefox and Chrome","user":{"login":"dreamlayers","id":1137396,"avatar_url":"https://avatars.githubusercontent.com/u/1137396?v=3","gravatar_id":"","url":"https://api.github.com/users/dreamlayers","html_url":"https://github.com/dreamlayers","followers_url":"https://api.github.com/users/dreamlayers/followers","following_url":"https://api.github.com/users/dreamlayers/following{/other_user}","gists_url":"https://api.github.com/users/dreamlayers/gists{/gist_id}","starred_url":"https://api.github.com/users/dreamlayers/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/dreamlayers/subscriptions","organizations_url":"https://api.github.com/users/dreamlayers/orgs","repos_url":"https://api.github.com/users/dreamlayers/repos","events_url":"https://api.github.com/users/dreamlayers/events{/privacy}","received_events_url":"https://api.github.com/users/dreamlayers/received_events","type":"User","site_admin":false},"labels":[],"state":"open","locked":false,"assignee":null,"milestone":null,"comments":1,"created_at":"2015-01-09T04:26:31Z","updated_at":"2015-01-12T00:52:43Z","closed_at":null,"body":"I just tried using this library instead of Emscripten's SDL with [my DOSBox port](https://github.com/dreamlayers/em-dosbox/tree/em-dosbox-svn-sdl2). Red and blue colours were swapped in Firefox 34 and Chrome 39 due to the masks returned by SDL_MapRGB().\r\n\r\nDOSBox with the SDL 2 patch uses SDL_GetWindowSurface() and then SDL_MapRGB() using the format of that surface. The masks are set from `const Uint32 surface_format = SDL_PIXELFORMAT_RGB888;` in [src/video/emscripten/SDL_emscriptenframebuffer.c](https://github.com/gsathya/SDL-emscripten/blob/master/src/video/emscripten/SDL_emscriptenframebuffer.c#L32).\r\n\r\nI think that should be `SDL_PIXELFORMAT_BGR888` instead, to correctly match what is returned by the [HTML canvas createImageData() method](http://www.w3schools.com/tags/canvas_createimagedata.asp). This must match because of how [32 bits are copied at a time](https://github.com/gsathya/SDL-emscripten/blob/master/src/video/emscripten/SDL_emscriptenframebuffer.c#L104). According to multiple sources, and the code you can play with at that link, byte order is red, green, blue, alpha. However, the order of characters in `SDL_PIXELFORMAT` defines is *not* showing byte order in memory, but [most to least significant order in a word](https://github.com/gsathya/SDL-emscripten/blob/master/include/SDL_pixels.h#L74). Emscripten is little endian (see system/include/libc/bits/endian.h), which means the least significant byte is stored first, and BGR is the proper order.\r\n\r\nIf this change is made then 4e9c845 needs to be reverted. According to [Microsoft documentation](http://msdn.microsoft.com/en-us/library/ie/ff975056%28v=vs.85%29.aspx), CanvasPixelArray is also in red, green, blue, alpha byte order. This means `data[dst ] = val & 0xff;` will set red with `SDL_PIXELFORMAT_BGR888`. I did not test anything in IE however.\r\n\r\nI think it makes sense to also change the format for the window, set in Emscripten_VideoInit(). I have created pull request #14 with my proposed changes."},"comment":{"url":"https://api.github.com/repos/gsathya/SDL-emscripten/issues/comments/69520599","html_url":"https://github.com/gsathya/SDL-emscripten/issues/15#issuecomment-69520599","issue_url":"https://api.github.com/repos/gsathya/SDL-emscripten/issues/15","id":69520599,"user":{"login":"dreamlayers","id":1137396,"avatar_url":"https://avatars.githubusercontent.com/u/1137396?v=3","gravatar_id":"","url":"https://api.github.com/users/dreamlayers","html_url":"https://github.com/dreamlayers","followers_url":"https://api.github.com/users/dreamlayers/followers","following_url":"https://api.github.com/users/dreamlayers/following{/other_user}","gists_url":"https://api.github.com/users/dreamlayers/gists{/gist_id}","starred_url":"https://api.github.com/users/dreamlayers/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/dreamlayers/subscriptions","organizations_url":"https://api.github.com/users/dreamlayers/orgs","repos_url":"https://api.github.com/users/dreamlayers/repos","events_url":"https://api.github.com/users/dreamlayers/events{/privacy}","received_events_url":"https://api.github.com/users/dreamlayers/received_events","type":"User","site_admin":false},"created_at":"2015-01-12T00:52:43Z","updated_at":"2015-01-12T00:52:43Z","body":"[This commit](https://github.com/emscripten-ports/SDL2/commit/ec10500ce6e046fb60c05c6be21fcde3c28236e0) is identical to my pull request except only I made the Emscripten_VideoInit() change. It seems a newer version of this library is available at: https://github.com/emscripten-ports/SDL2\r\n\r\n"}}