A pixel art painter geared specifically at NES pixel art. Includes export for .chr binary file as well as palette and namespace data.
選択できるのは25トピックまでです。 トピックは、先頭が英数字で、英数字とダッシュ('-')を使用した35文字以内のものにしてください。

301 行
8.2KB

  1. import Utils from "/app/js/common/Utils.js";
  2. import ISurface from "/app/js/ifaces/ISurface.js";
  3. import NESTile from "/app/js/models/NESTile.js";
  4. import NESPalette from "/app/js/models/NESPalette.js";
  5. function LRIdx2TileIdxCo(index, lid){
  6. if (isNaN(lid) || lid < 0 || lid > 2){
  7. lid = 2;
  8. }
  9. var res = {
  10. lid: 0,
  11. index: 0,
  12. x: 0,
  13. y: 0
  14. };
  15. var w = (lid == 2) ? 256 : 128;
  16. var x = Math.floor(index % w);
  17. var y = Math.floor(index / w);
  18. if (x < 128){
  19. res.index = (Math.floor(y/8) * 16) + Math.floor(x / 8);
  20. if (lid !== 2)
  21. res.lid = lid;
  22. } else {
  23. res.index = (Math.floor(y/8) * 16) + Math.floor((x - 128) / 8);
  24. res.lid = 1;
  25. }
  26. res.x = x % 8;
  27. res.y = y % 8;
  28. return res;
  29. }
  30. export default class NESBank extends ISurface{
  31. constructor(){
  32. super();
  33. this.__LP = []; // Left Patterns (Sprites)
  34. this.__RP = []; // Right Patterns (Backgrounds)
  35. this.__AccessMode = 2; // 0 = Sprites only | 1 = BG only | 2 = Sprites and BG
  36. var handle_datachanged = Utils.debounce((function(side){
  37. if ((side == 0 && (this.__AccessMode == 0 || this.__AccessMode == 2)) ||
  38. (side == 1 && (this.__AccessMode == 1 || this.__AccessMode == 2))){
  39. this.emit("data_changed");
  40. }
  41. }).bind(this), 250);
  42. for (var i=0; i < 256; i++){
  43. this.__LP.push(new NESTile());
  44. this.__LP[i].listen("data_changed", handle_datachanged.bind(this, 0));
  45. this.__RP.push(new NESTile());
  46. this.__RP[i].listen("data_changed", handle_datachanged.bind(this, 1));
  47. }
  48. this.__palette = null;
  49. }
  50. get access_mode(){return this.__AccessMode;}
  51. set access_mode(m){
  52. if (!Utils.isInt(m))
  53. throw new TypeError("Access mode expected to be integer.");
  54. switch(m){
  55. case NESBank.ACCESSMODE_SPRITE:
  56. this.__AccessMode = NESBank.ACCESSMODE_SPRITE; break;
  57. case NESBank.ACCESSMODE_BACKGROUND:
  58. this.__AccessMode = NESBank.ACCESSMODE_BACKGROUND; break;
  59. case NESBank.ACCESSMODE_FULL:
  60. this.__AccessMode = NESBank.ACCESSMODE_FULL; break;
  61. }
  62. }
  63. get json(){
  64. JSON.stringify({
  65. LP: this.__LP.map(x=>x.base64),
  66. RP: this.__RP.map(x=>x.base64)
  67. });
  68. }
  69. get chr(){
  70. var buff = new Uint8Array(8192);
  71. var offset = 0;
  72. this.__LP.forEach(function(i){
  73. buff.set(i.chr, offset);
  74. offset += 16;
  75. });
  76. this.__RP.forEach(function(i){
  77. buff.set(i.chr, offset);
  78. offset += 16;
  79. });
  80. return buff;
  81. }
  82. set chr(buff){
  83. if (!(buff instanceof Uint8Array))
  84. throw new TypeError("Expected Uint8Array buffer.");
  85. if (buff.length !== 8192)
  86. throw new RangeError("Data buffer has invalid byte length.");
  87. var offset = 0;
  88. this.__LP.forEach((i) => {
  89. i.chr = buff.slice(offset, offset+15);
  90. offset += 16;
  91. });
  92. this.__RP.forEach((i) => {
  93. i.chr = buff.slice(offset, offset+15);
  94. offset += 16;
  95. });
  96. }
  97. get base64(){
  98. var b = "";
  99. var data = this.chr;
  100. for (var i = 0; i < data.length; i++) {
  101. b += String.fromCharCode(data[i]);
  102. }
  103. return window.btoa(b);
  104. }
  105. set base64(s){
  106. var b = window.atob(s);
  107. var len = b.length;
  108. if (b.length !== 8192){
  109. throw new Error("Base64 string contains invalid byte count.");
  110. }
  111. this.chr = b;
  112. }
  113. get palette(){return this.__palette;}
  114. set palette(p){
  115. if (p !== null && !(p instanceof NESPalette))
  116. throw new TypeError("Expected null or NESPalette object.");
  117. if (p !== this.__palette){
  118. this.__palette = p;
  119. }
  120. }
  121. get width(){return (this.__AccessMode == NESBank.ACCESSMODE_FULL) ? 256 : 128;}
  122. get height(){return 128;}
  123. get length(){return this.width * this.height;}
  124. get coloridx(){
  125. return new Proxy(this, {
  126. get:function(obj, prop){
  127. var len = obj.length * 8;
  128. if (prop === "length")
  129. return len;
  130. if (!Utils.isInt(prop))
  131. throw new TypeError("Expected integer index.");
  132. prop = parseInt(prop);
  133. if (prop < 0 || prop >= len)
  134. return NESPalette.Default[4];
  135. var res = LRIdx2TileIdxCo(prop, this.__AccessMode);
  136. var list = (res.lid === 0) ? obj.__LP : obj.__RP;
  137. return list[res.index].getPixelIndex(res.x, res.y);
  138. },
  139. set:function(obj, prop, value){
  140. if (!Utils.isInt(prop))
  141. throw new TypeError("Expected integer index.");
  142. if (!Utils.isInt(value))
  143. throw new TypeError("Color expected to be integer.");
  144. prop = parseInt(prop);
  145. value = parseInt(value);
  146. if (prop < 0 || prop >= len)
  147. throw new RangeError("Index out of bounds.");
  148. if (value < 0 || value >= 4)
  149. throw new RangeError("Color index out of bounds.");
  150. var res = LRIdx2TileIdxCo(prop, this.__AccessMode);
  151. var list = (res.lid === 0) ? obj.__LP : obj.__RP;
  152. list[res.index].setPixelIndex(res.x, res.y, value);
  153. return true;
  154. }
  155. });
  156. }
  157. get lp(){
  158. return new Proxy(this, {
  159. get: function(obj, prop){
  160. if (prop === "length")
  161. return obj.__LP.length;
  162. if (!Utils.isInt(prop))
  163. throw new TypeError("Expected integer index.");
  164. prop = parseInt(prop);
  165. if (prop < 0 || prop >= 256)
  166. throw new RangeError("Index out of bounds.");
  167. return obj.__LP[prop];
  168. },
  169. set: function(obj, prop, value){
  170. if (!Utils.isInt(prop))
  171. throw new TypeError("Expected integer index.");
  172. if (!(value instanceof NESTile))
  173. throw new TypeError("Can only assign NESTile objects.");
  174. prop = parseInt(prop);
  175. if (prop < 0 || prop >= 256)
  176. throw new RangeError("Index out of bounds.");
  177. obj.__LP[prop].copy(value);
  178. return true;
  179. }
  180. });
  181. }
  182. get rp(){
  183. return new Proxy(this, {
  184. get: function(obj, prop){
  185. if (prop === "length")
  186. return obj.__RP.length;
  187. if (!Utils.isInt(prop))
  188. throw new TypeError("Expected integer index.");
  189. prop = parseInt(prop);
  190. if (prop < 0 || prop >= 256)
  191. throw new RangeError("Index out of bounds.");
  192. return obj.__RP[prop];
  193. },
  194. set: function(obj, prop, value){
  195. if (!Utils.isInt(prop))
  196. throw new TypeError("Expected integer index.");
  197. if (!(value instanceof NESTile))
  198. throw new TypeError("Can only assign NESTile objects.");
  199. prop = parseInt(prop);
  200. if (prop < 0 || prop >= 256)
  201. throw new RangeError("Index out of bounds.");
  202. obj.__RP[prop].copy(value);
  203. return true;
  204. }
  205. });
  206. }
  207. copy(b){
  208. if (!(b instanceof NESBank))
  209. throw new TypeError("Expected NESBank object.");
  210. for (var i=0; i < 256; i++){
  211. this.lp[i] = b.lp[i];
  212. this.rp[i] = b.rp[i];
  213. }
  214. return this;
  215. }
  216. clone(){
  217. return (new NESBank()).copy(this);
  218. }
  219. getColor(x,y){
  220. if (x < 0 || x >= this.width || y < 0 || y >= this.height)
  221. return this.__default_pi[4];
  222. var res = LRIdx2TileIdxCo((y*this.width)+x, this.__AccessMode);
  223. var list = (res.lid === 0) ? this.__LP : this.__RP;
  224. var pi = list[res.index].paletteIndex;
  225. var ci = list[res.index].getPixelIndex(res.x, res.y);
  226. if (this.__palette !== null){
  227. return this.__palette.get_palette_color(pi, ci);
  228. }
  229. return NESPalette.Default[ci];
  230. }
  231. getColorIndex(x, y){
  232. if (x < 0 || x >= this.width || y < 0 || y >= this.height)
  233. return {pi: -1, ci:-1};
  234. var res = LRIdx2TileIdxCo((y*this.width)+x, this.__AccessMode);
  235. var list = (res.lid === 0) ? this.__LP : this.__RP;
  236. return {
  237. pi: list[res.index].paletteIndex,
  238. ci: list[res.index].getPixelIndex(res.x, res.y)
  239. };
  240. }
  241. setColorIndex(x, y, ci, pi){
  242. if (x < 0 || x >= this.width || y < 0 || y > this.height)
  243. throw new RangeError("Coordinates out of bounds.");
  244. if (!Utils.isInt(pi))
  245. pi = -1;
  246. if (!Utils.isInt(ci))
  247. ci = 0;
  248. if (pi < 0){
  249. this.coloridx[(y*this.width)+x] = ci;
  250. } else {
  251. var res = LRIdx2TileIdxCo((y*this.width)+x, this.__AccessMode);
  252. var list = (res.lid === 0) ? this.__LP : this.__RP;
  253. list[res.index].paletteIndex = pi;
  254. list[res.index].setPixelIndex(res.x, res.y, ci);
  255. }
  256. return this;
  257. }
  258. }
  259. NESBank.ACCESSMODE_SPRITE = 0;
  260. NESBank.ACCESSMODE_BACKGROUND = 1;
  261. NESBank.ACCESSMODE_FULL = 2;