SOURCE

const frame = new Frame("fit", 1024, 768, green, dark, "puzzle.jpg", "https://assets.codepen.io/2104200/");
frame.on("ready", ()=>{ // ES6 Arrow Function - similar to function(){}
	zog("ready from ZIM Frame"); // logs in console (F12 - choose console)

	// often need below - so consider it part of the template
	const stage = frame.stage;
	const stageW = frame.width;
	const stageH = frame.height;

	// REFERENCES for ZIM at https://zimjs.com
	// see https://zimjs.com/intro.html for an intro example
	// see https://zimjs.com/learn.html for video and code tutorials
	// see https://zimjs.com/docs.html for documentation
	// see https://codepen.io/topic/zim/ for ZIM on CodePen

	// CODE HERE
	
	const thumbs = [];
	const cols = 3;
	const rows = 3;

	const image = asset("puzzle.jpg");
	const w = image.width/cols;
	const h = image.height/rows;

	// cut up the image and shift its location
	loop(rows, r=>{
		loop(cols, c=>{
			thumbs.push(new Bitmap(image, w, h, c*w, r*h));
		});
	});

	// normally a Tile makes copies of the object passed to it 
	// and if we passed an array, it would randomly pick from the array 
	// As of ZIM Cat... an unique parameter has been added to Tile (true here)
	// that means it will just use the array to make a unique series
	var tile = new Tile(thumbs, cols, rows, 0, 0, true);
	
	
	// the Scrambler will let the user slide the tile elements!
	const puzzle = new Scrambler({
		tile:tile,
		time:2, // optional time to scramble and number of scrambles
		num:3
	}).center();
	puzzle.on("complete", function () {
		image.centerReg().animate({
			props:{rotation:-360},
			time:2,
			ease:"backInOut",
			call:()=>{
				image.tap(()=>{
					// time, wait, num
					puzzle.addTo().scramble(2,0,4);
					image.removeFrom();
				}, true); // once				
			}
		});
		puzzle.removeFrom();
	});

	stage.update(); // this is needed to show any changes

	// DOCS FOR ITEMS USED
	// http://zimjs.com/docs.html?item=frame

	// FOOTER
	// call remote script to make ZIM icon - you will not need this
	createIcon(); 

}); // end of ready
console 命令行工具 X clear

                    
>
console