spritemate
1.0.0
Spritemate เป็นตัวแก้ไข Sprite ใหม่สำหรับ Commodore 64 มันทำงานร่วมกับเบราว์เซอร์ที่ทันสมัยส่วนใหญ่บน Windows, Mac และ Linux และเป็น JavaScript และ HTML บริสุทธิ์ - ไม่มีปลั๊กอิน ข้อมูลทั้งหมดถูกประมวลผลทางฝั่งไคลเอ็นต์เท่านั้น Spritemate รองรับการนำเข้าและส่งออกรูปแบบไฟล์ที่พบบ่อยที่สุดสำหรับ Commodore 64 (เช่น Spritepad) และสามารถใช้เป็นผู้ชมและตัวแก้ไขบนอุปกรณ์เกือบทุกชนิดที่มีเบราว์เซอร์
Spritemate ยังอยู่ในระหว่างการพัฒนา หากคุณชอบโปรดแจ้งให้เราทราบ;) อย่าลังเลที่จะส่งคำขอดึงหรือส่งแนวคิดข้อบกพร่องการร้องขอในส่วนปัญหา ไชโย
เวอร์ชันที่มีเสถียรภาพล่าสุด: https://spritemate.com/
รุ่นเบต้า: https://beta.spritemate.com/
วิดีโอของเวอร์ชันก่อนหน้า: https://www.youtube.com/watch?v=n59axaeqdwe
ใช้ npm
$ npm install
$ npm run dev
| เครื่องหมาย | ทางลัด | การทำงาน |
|---|---|---|
 | - | โหลดไฟล์ รูปแบบที่รองรับ: Spritemate (SPM), Spritepad (SPD, SPR) |
 | - | บันทึกไฟล์ รูปแบบที่รองรับ: Spritemate (SPM), Spritepad 2.0 & 1.8.1 (SPD), ASM Source (TXT) |
 | Z | เลิกทำ. สำหรับเมื่อคุณเมา |
 | Shift + Z | ทำซ้ำ เพราะเมื่อคุณรู้ว่ามันไม่ได้เลวร้ายขนาดนั้น |
 | d | วาดพิกเซล |
 | f | เติมน้ำท่วม |
 | อี | ยางลบ |
 | ม. | เคลื่อนไหว |
| เครื่องหมาย | ทางลัด | การทำงาน |
|---|---|---|
 | ม. | สลับระหว่างโหมด SingleColor และ MultiColor |
 | - | เลื่อนสไปรต์ซ้าย |
 | - | Shift Sprite Right |
 | - | เปลี่ยนสไปรท์ขึ้น |
 | - | Shift Sprite Down |
 | - | พลิกสไปรต์แนวนอน |
 | - | พลิกสไปรต์แนวตั้ง |
 | - | สลับการแสดงผลกริดเปิด/ปิด |
  | - | ซูมหน้าต่างเข้า/ออก |
| 1,2,3,4 | เลือกสีแต่ละสีโปร่งใสหลายสี 1 หรือหลากสี 2 | |
| Shift + Mouse | ลบพิกเซล |
| เครื่องหมาย | ทางลัด | การทำงาน |
|---|---|---|
 | - | ยืดสไปรต์ในแนวนอน |
 | - | ยืดสไปรต์ในแนวตั้ง |
 | - | ซ้อนทับสไปรต์ถัดไป |
| - | ซูมหน้าต่างเข้า/ออก |
| เครื่องหมาย | ทางลัด | การทำงาน |
|---|---|---|
 | - | สร้าง Sprite ใหม่ |
 | - | ลบสไปรต์ที่เลือก |
 | - | คัดลอก Sprite |
 | - | วางสไปรต์ |
| - | สลับการแสดงผลกริดเปิด/ปิด |
| - | ซูมหน้าต่างเข้า/ออก |
| เคอร์เซอร์ซ้ายและขวา | ปั่นจักรยานผ่านรายการสไปรต์ |
ตอนแรกฉันต้องการลบ jQuery และ jQuery UI ออกจากโครงการนี้และแทนที่ด้วยวานิลลา JS เวลาสร้างเพิ่มขึ้นเป็น 10 วินาทีซึ่งฉันพบว่าค่อนข้างน่ารำคาญ การทำซ้ำฟังก์ชั่นโมดัลของ JQuery นั้นท้าทายกว่าที่คาดไว้ดังนั้นฉันจึงตัดสินใจที่จะแยก jQuery ออกจาก JS Bundle อีกครั้งและโหลดจาก CDN เวลาคอมไพล์ที่ลดลงอย่างมากนี้ไม่ถึง 4 วินาที โดยรวมแอพยังคงมีขนาดเล็กมากโดยมีรหัสแอพหลักประมาณ 20KB และ jQuery ประมาณ 98KB
โปรดทราบว่ามีการเปลี่ยนแปลงสองครั้งด้วยคุณสมบัติการตั้งชื่อ Sprite: Sprite เริ่มต้นด้วยหมายเลขดัชนี 0 แทน 1 เช่นสไปรต์แรกเรียกว่า "Sprite_0" แทนที่จะเป็น "Sprite_1" สิ่งนี้จำเป็นสำหรับความสม่ำเสมอและความมีสติปัญญาของฉัน - ภายในหมายเลขดัชนีมักจะเป็น 0 แทน 1 การเปลี่ยนแปลงอื่น ๆ คือข้อมูลสไปรต์ที่ส่งออกเนื่องจาก ASM หรือไฟล์พื้นฐานจะไม่ติดฉลากสไปรต์โดยการเพิ่มดัชนีอีกต่อไป ซึ่งหมายความว่าสไปรต์จะเก็บชื่อไว้ไม่ว่าคุณจะเรียงลำดับในรายการสไปรต์ไปยังตำแหน่งที่แตกต่างกัน (ซึ่งดูเหมือนชัดเจน แต่ไม่เคยเป็นเช่นนี้มาก่อน)
คุณลักษณะการตั้งชื่อสไปรต์นั้นเข้ากันได้ย้อนหลังดังนั้นเมื่อคุณโหลดไฟล์ SPM รุ่นเก่าจะมีการใช้ชื่อเริ่มต้น
สไปรต์อินเวอร์เวอร์ (หรือ "ลบ" ใน Spritepad) อาจดูแปลก ๆ ในโหมดหลากสี แต่นั่นไม่ใช่ข้อผิดพลาด ใน SingleColor ค่า 0 (โปร่งใส) จะถูกแทนที่ด้วย 1 (พิกเซล) และในทางกลับกัน แต่ในหลากสีเรามีอีกสองสี Spritemate สลับสี 3 และ 4 ในกรณีนี้เช่นเดียวกับ Spritepad
สิ่งนี้สามารถพิสูจน์ได้ว่ามีประโยชน์เมื่อทำงานกับไฟล์หลายไฟล์ นอกจากนี้ยังเป็นตัวบ่งชี้ที่ดีหากไฟล์ยังไม่ได้รับการบันทึก โปรดทราบว่าเนื่องจากลักษณะที่เบราว์เซอร์บันทึกไฟล์และระบบปฏิบัติการจัดการความปลอดภัยไฟล์อาจบันทึกด้วยชื่อที่แตกต่างกันเล็กน้อยหากชื่อไฟล์เดียวกันมีอยู่แล้วในตำแหน่งดาวน์โหลด (เช่น "mysprites (1) .spm" แทน "mysprites.spm")
แถบเมนูดูเหมือนจะทำงานผิดปกติสำหรับการตั้งค่าบางอย่าง แต่ปัญหาในปัจจุบันไม่สามารถทำซ้ำได้ THX2 ถึง Leissa สำหรับการทดสอบเพิ่มเติมและค้นหาว่าการปิด "การปิดกั้นเนื้อหา" ใน Firefox อาจแก้ไขปัญหาได้ หากคุณพบปัญหาที่สามารถทำซ้ำได้กับแถบเมนูโปรดรายงานคำอธิบายที่นี่: https://github.com/esshahn/spritemate/issues
การเปิดตัวนี้มุ่งเน้นไปที่การใช้งานที่ดีขึ้น ในขณะที่เทคนิคไม่มีการเพิ่มคุณสมบัติเวิร์กโฟลว์โดยรวมน่าจะดีขึ้นในขณะนี้ ตัวอย่างเช่นแทนที่จะมีไอคอนที่แตกต่างกันสี่แบบสำหรับการเลื่อนสไปรต์ขึ้นลงซ้ายหรือขวาเครื่องมือการย้ายใหม่ช่วยให้คุณทำสิ่งนี้ได้ง่ายขึ้นในขณะนี้ ในฐานะที่เป็นผลข้างเคียงไอคอนที่น้อยลงทำให้ UI มีความซับซ้อนน้อยลง
ตัวเลือกในการลบพิกเซลนั้นอยู่ใน Spritemate มาก่อน (โดยกดปุ่ม 'Shift' ในขณะที่วาดภาพ) แต่ตอนนี้เครื่องมือ 'ยางลบ' ทำให้มองเห็นได้ง่ายขึ้นและใช้งานง่ายขึ้นในเวิร์กโฟลว์มือเดียว
มีการแนะนำตัวเลือกใหม่ในการทำซ้ำสไปรต์ ก่อนหน้านี้เป็นไปได้โดยการรวมกันของ 'สำเนา', 'ใหม่' และ 'วาง' (และการทำซ้ำใหม่เป็นความจริงที่ว่าสิ่งนี้) แต่สิ่งนี้ควรเพิ่มประสบการณ์ที่ใช้งานง่ายมากขึ้น
มีการปรับปรุงอื่น ๆ เช่นไอคอน 'ถังขยะ' ที่แยกแยะได้มากขึ้นเพื่อลบสไปรท์ การรวมกันทั้งหมด spritemate ควรเริ่มรู้สึกคุ้นเคยมากขึ้นหากคุณคุ้นเคยกับโปรแกรมสีอื่น ๆ เช่น Photoshop
แม้ว่าจะมีการเพิ่มคุณสมบัติไม่มากนัก แต่ฉันก็ใช้เวลาสักพักกว่าจะเสร็จสิ้นการเปิดตัวครั้งนี้ ฉันต้องย้อนกลับรหัสจำนวนมากสำหรับคุณสมบัติใหม่ที่ยอดเยี่ยมที่ฉันไม่ได้ทำงานอย่างน่าเชื่อถือ ด้วยเหตุนี้ฉันจึงต้องรักษาสองสาขาและคุณสมบัติแบ็คพอร์ตไว้ในเวอร์ชันที่เสถียร ในที่สุดฉันก็ตัดสินใจที่จะวางคุณสมบัติใหม่ไว้และมุ่งเน้นไปที่ผู้อื่นแทน
ฉันไม่ได้มีโอกาสได้ทำงานกับ Spritemate เป็นเวลาหลายเดือนเนื่องจากสิ่งของเชิงพาณิชย์ของฉันดูดเวลาว่างตลอดเวลา นอกจากนี้ข้อเสนอแนะก็หยุดเมื่อเร็ว ๆ นี้ซึ่งไม่ได้กระตุ้นให้ฉันมากเกินไปเช่นกัน ในที่สุดฉันก็ตรวจสอบปริมาณการใช้งานสำหรับ spritemate และแปลกใจเกี่ยวกับจำนวนผู้ใช้ที่คงที่ ดังนั้นฉันจึงตัดสินใจอุทิศเวลาให้กับโครงการนี้อีกครั้ง ไม่ว่าในกรณีใดถ้าคุณชอบ spritemate คุณสามารถสร้างความแตกต่างได้โดยแจ้งให้เราทราบไม่ว่าจะทางไปรษณีย์ (Ingo ที่ AWSM dot de) หรือส่งทวีตให้ฉัน ( @AWSM9000) แจ้งให้เราทราบว่าฉันจะทำให้ spritemate ดีขึ้นสำหรับคุณได้อย่างไร!
Spritemate บันทึกการตั้งค่าในพื้นที่ตอนนี้ มันอาจทำงานได้เล็กน้อยและฉันรู้เกี่ยวกับกรณีอย่างน้อยหนึ่งกรณีที่รหัสทำงาน แต่ไม่ควรเข้าใจความเข้าใจของฉัน (แต่ฉันเป็นใครที่จะตัดสินนักพัฒนา ... ) อย่างไรก็ตามมีการวางรากฐานสำหรับตัวเลือกการกำหนดค่าเพิ่มเติมสำหรับการอัปเดตในอนาคต
Spritemate อยู่ในเบต้าสาธารณะ ต้องขอบคุณผู้ทดสอบเบต้าทุกคนที่ช่วยค้นหาข้อบกพร่องและแนะนำคุณสมบัติและการปรับปรุง โปรดตรวจสอบเอกสารเกี่ยวกับ GitHub เพื่อรับภาพรวมคุณสมบัติ
การกระทำที่พบบ่อยที่สุดได้รับคีย์ลัดเพื่อการเข้าถึงอย่างรวดเร็ว การใช้คีย์ลัดในเบราว์เซอร์นั้นค่อนข้างยุ่งยากอยู่เสมอ ดังนั้นทางลัดบางอย่างอาจดูง่ายน้อยกว่า ฟังก์ชั่นเหล่านี้พร้อมใช้งานโดยกดปุ่มตอนนี้:
(1,2,3,4) - ตั้งหนึ่งในสี่ปากกา/สีที่มีอยู่ (F) - สลับหน้าจอเต็มหน้าจอ (D) - สลับระหว่าง "วาด" และ "เติม" โหมด (z) - เลิกทำ (shift + z) = redo (m)
สลับการซ้อนทับสไปรต์ในหน้าต่างตัวอย่าง สไปรต์ต่อไปนี้จะใช้เป็นซ้อนทับ หน้าต่างตัวอย่างแสดงทั้งสไปรต์และหน้าต่างตัวแก้ไขแสดงสไปรต์อื่น ๆ พร้อมการมองเห็นที่ลดลง (เช่นหัวหอม) โปรดทราบว่าในปัจจุบันข้อมูลการซ้อนทับสไปรต์จะถูกเก็บไว้ในรูปแบบ spritemate ดั้งเดิมเท่านั้น
