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个字符

126 行
2.9KB

  1. import GlobalEvents from "/app/js/common/EventCaller.js";
  2. import Utils from "/app/js/common/Utils.js";
  3. import NESBank from "/app/js/models/NESBank.js";
  4. import NESPalette from "/app/js/models/NESPalette.js";
  5. import CTRLPalettesStore from "/app/js/ctrls/CTRLPalettesStore.js";
  6. import CTRLBanksStore from "/app/js/ctrls/CTRLBanksStore.js";
  7. var SURF = null;
  8. function JSONFromProject(){
  9. var proj = {
  10. palettesStore:CTRLPalettesStore.obj,
  11. banksStore:CTRLBanksStore.obj
  12. };
  13. return JSON.stringify(proj);
  14. }
  15. function LoadFile(file){
  16. if (SURF !== null){
  17. var reader = new FileReader();
  18. if (SURF instanceof NESBank){
  19. reader.onload = function(e){
  20. try {
  21. SURF.chr = new Uint8Array(e.target.result);
  22. } catch (e) {
  23. console.log(e.toString());
  24. }
  25. }
  26. reader.readAsArrayBuffer(file);
  27. }
  28. }
  29. }
  30. function HANDLE_DragOver(e){
  31. e.stopPropagation();
  32. e.preventDefault();
  33. e.dataTransfer.dropEffect = 'copy';
  34. };
  35. function HANDLE_FileDrop(e){
  36. e.stopPropagation();
  37. e.preventDefault();
  38. var files = e.dataTransfer.files;
  39. for (let i=0; i < files.length; i++){
  40. LoadFile(files[i]);
  41. }
  42. }
  43. function HANDLE_SaveProject(e){
  44. var a = document.createElement("a");
  45. var file = new Blob([JSONFromProject()], {type: "text/plain"});
  46. a.href = window.URL.createObjectURL(file);
  47. a.download = "nesproject.json";
  48. var body = document.querySelector("body");
  49. body.appendChild(a);
  50. a.click();
  51. setTimeout(function(){ // fixes firefox html removal bug
  52. window.URL.revokeObjectURL(url);
  53. a.remove();
  54. }, 500);
  55. }
  56. function HANDLE_LoadProjectRequest(){
  57. var input = document.querySelectorAll("input.project-loader");
  58. if (input.length > 0){
  59. input[0].click();
  60. }
  61. }
  62. function HANDLE_LoadProject(e){
  63. if (this.files && this.files.length > 0){
  64. var reader = new FileReader();
  65. reader.onload = function(e) {
  66. var content = e.target.result;
  67. console.log(content);
  68. // TODO: Need to clear out the selected files after load.
  69. };
  70. reader.readAsText(this.files[0]);
  71. } else {
  72. console.log("Project file not found or no file selected.");
  73. }
  74. }
  75. function HANDLE_SurfChange(surf){
  76. if (surf instanceof NESBank){
  77. SURF = surf;
  78. } else {
  79. SURF = null;
  80. }
  81. }
  82. class CTRLIO{
  83. constructor(){
  84. GlobalEvents.listen("change_surface", HANDLE_SurfChange);
  85. GlobalEvents.listen("save-project", HANDLE_SaveProject);
  86. GlobalEvents.listen("load-project", HANDLE_LoadProjectRequest);
  87. var input = document.querySelectorAll("input.project-loader");
  88. if (input.length > 0){
  89. input[0].addEventListener("change", HANDLE_LoadProject);
  90. }
  91. }
  92. initialize(){
  93. var e = document.querySelectorAll(".drop-zone");
  94. for (let i=0; i < e.length; e++){
  95. e[i].addEventListener("dragover", HANDLE_DragOver);
  96. e[i].addEventListener("drop", HANDLE_FileDrop);
  97. }
  98. CTRLPalettesStore.initialize();
  99. CTRLBanksStore.initialize();
  100. }
  101. }
  102. const instance = new CTRLIO();
  103. export default instance;