Shuffle an image with BitmapData – Part 3
My tribute (learn how I am calling a clone) to Split Personalities is growing fast and well, and after the first and second steps, now I have something playable.
The aim of the game is to rebuild the image of a stolen painting(in this case the Scream) that was broken into pieces (I just want you to notice that I also made a dramatic background…).
The new features I added are a minimap on the right representing a blueprint of the original painting and the “holes”… some trapdoors that open and close randomly. When a piece of the picture falls into an opened hole, it disappears. When a piece of the picture steps into a closed hole, the hole remains closed until the piece is moved.
It’s a very simple concept but I messed the instructions how to play… I’ll never get a job as a game manual writer… you better check the demo by yourself
Now I am planning to add **tons** of features and powerups, about 10 levels of increasing difficulty, fancy graphics and release the game
Wanna sponsor the game?
I’ll add MochiAds in the game. However, I also would like to sell four 125×125 buttons in the game. Not in the “splash screen”, I mean into the game itself.
I am selling buttons instead of looking for a sponsor because I am publishing the source code of the game, and sponsors do not want people to see the game in progress or even worse to see the code before the game is finished
If you want to purchase a button (that will link to wherever you want), the price is $50 per button.
Maybe the game will be a flop, maybe not. Anyway, it’s up to you to risk your 50 bucks. The guiderules are the same of every link sale: no heavy images or heavy animations in the buttons, no links to gambling, porno, racist sites and so on.
You can then resell your button how many times you want until the game is ready. When it’s ready, maybe some millions people will see your button while PLAYING (not WAITING for the game to load).
If you want to purchase a button, contact me at info[at]emanueleferonato.com
That’s a very unseen way to ask for a sponsorship but… hey… I am running an experiment! Bet on my game!
Now, the source code… still uncommented but with understandable variable names. You know that once finished I’ll release the complete tutorial as usual.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 148 149 150 151 152 153 154 155 156 157 158 159 160 161 162 163 164 165 166 167 168 169 170 171 172 173 174 175 176 | import flash.display.BitmapData;
import flash.geom.Rectangle;
import flash.geom.Point;
Array.prototype.shuffle = function() {
for (x=0; x<19; x++) {
var from = Math.floor(Math.random()*20);
var to = this[x];
this[x] = this[from];
this[from] = to;
}
};
big_picture = BitmapData.loadBitmap("scream");
_root.createEmptyMovieClip("big_pic_obj", _root.getNextHighestDepth());
big_pic_obj.attachBitmap(big_picture, _root.getNextHighestDepth());
big_pic_obj._visible = false;
sequence = new Array(0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19);
save_position = 0;
sequence.shuffle();
field = new Array();
holes = new Array();
for (x=0; x<25; x++) {
holes[x] = 0;
field[x] = -1;
}
for (x=1; x<=3; x++) {
do {
out = Math.floor(Math.random()*24)+1;
} while ((holes[out] != 0) or (out<5));
holes[out] = x;
hole = _root.attachMovie("out", "out_"+x, _root.getNextHighestDepth(), {_x:(out%5)*80, _y:Math.floor(out/5)*80});
hole.pos = x;
_root.attachMovie("glass", "glass_"+x, _root.getNextHighestDepth(), {_x:(out%5)*80, _y:Math.floor(out/5)*80});
hole.onEnterFrame = function() {
moving = Math.floor(Math.random()*250);
if (moving == 0) {
_root["glass_"+this.pos]._alpha = 100-_root["glass_"+this.pos]._alpha;
}
};
}
_root.createEmptyMovieClip("tiles", _root.getNextHighestDepth());
_root.attachMovie("mini", "mini", _root.getNextHighestDepth(), {_x:410});
_root.attachMovie("magnifier", "magnifier", _root.getNextHighestDepth());
_root.attachMovie("fire", "fire", _root.getNextHighestDepth());
_root.attachMovie("border", "border", _root.getNextHighestDepth());
border.onEnterFrame = function() {
magnifier._visible = false;
this.gotoAndStop(1);
if (!dragging) {
possible_direction = "";
if (_root._xmouse<400) {
this._x = Math.floor(_root._xmouse/80)*80;
this._y = Math.floor(_root._ymouse/80)*80;
position = Math.floor(_root._xmouse/80)+5*Math.floor(_root._ymouse/80);
if (field[position]>=0) {
magnifier._x = 410+(field[position]%5)*40;
magnifier._y = Math.floor(field[position]/5)*40;
magnifier._visible = true;
}
}
} else {
dist_x = _root._xmouse-save_x;
dist_y = _root._ymouse-save_y;
angle = Math.atan2(dist_y, dist_x)*180/Math.PI;
if (angle<45 and angle>-45) {
this.gotoAndStop(3);
possible_direction = "right";
}
if ((angle<-45) and (angle>-135)) {
this.gotoAndStop(2);
possible_direction = "up";
}
if (angle<-135 or angle>135) {
this.gotoAndStop(5);
possible_direction = "left";
}
if (angle<135 and angle>45) {
this.gotoAndStop(4);
possible_direction = "down";
}
}
};
for (x=0; x<20; x++) {
picture = tiles.createEmptyMovieClip("small_pic_obj_"+x, tiles.getNextHighestDepth());
small_picture = new BitmapData(80, 80);
picture.attachBitmap(small_picture, tiles.getNextHighestDepth());
small_picture.copyPixels(big_picture, new Rectangle(0+(x%5)*80, 0+Math.floor(x/5)*80, 80, 80), new Point(0, 0));
picture.id = x;
picture.falling = false;
picture.onEnterFrame = function() {
if (!this.falling) {
if (this.dir == "right") {
position = Math.floor(this._x/80)+5*Math.floor(this._y/80);
if ((position%5 != 4) and (field[position+1] == -1)) {
this._x += 80;
field[position] = -1;
field[position+1] = this.id;
} else {
this.dir = "";
}
}
if (this.dir == "down") {
position = Math.floor(this._x/80)+5*Math.floor(this._y/80);
if ((position+5<25) and (field[position+5] == -1)) {
this._y += 80;
field[position] = -1;
field[position+5] = this.id;
} else {
this.dir = "";
}
}
if (this.dir == "left") {
position = Math.floor(this._x/80)+5*Math.floor(this._y/80);
if ((position%5 != 0) and (position != 1) and (field[position-1] == -1)) {
this._x -= 80;
field[position] = -1;
field[position-1] = this.id;
} else {
this.dir = "";
}
}
if (this.dir == "up") {
position = Math.floor(this._x/80)+5*Math.floor(this._y/80);
if ((position-5>0) and (field[position-5] == -1)) {
this._y -= 80;
field[position] = -1;
field[position-5] = this.id;
} else {
this.dir = "";
}
}
position = Math.floor(this._x/80)+5*Math.floor(this._y/80);
if ((holes[position] != 0) and (_root["glass_"+holes[position]]._alpha == 0) and (this.dir != "")) {
this.dir = "";
this.falling = true;
save_position = position;
}
}
if (this.falling) {
this._width -= 2;
this._height -= 2;
this._x++;
this._y++;
this._alpha -= 2;
if (this._width == 0) {
this._alpha++;
this._width = 80;
this._height = 80;
sequence.push(field[save_position]);
field[save_position] = -1;
this._x = 0;
this._y = 0;
this.falling = false;
}
}
};
}
_root.onMouseDown = function() {
position = Math.floor(_root._xmouse/80)+5*Math.floor(_root._ymouse/80);
if (position == 0) {
if (field[1] == -1) {
picture_in = sequence.shift();
tiles["small_pic_obj_"+picture_in].dir = "right";
}
} else {
if (field[position] != -1) {
dragging = true;
save_x = border._x+50;
save_y = border._y+50;
}
}
};
_root.onMouseUp = function() {
position = Math.floor(save_x/80)+5*Math.floor(save_y/80);
tiles["small_pic_obj_"+field[position]].dir = possible_direction;
dragging = false;
}; |
176 lines… and I already have a level… give me feedback!
They can be easily customized to meet the unique requirements of your project.

























This post has 11 comments
Shuffle an image with BitmapData : Emanuele Feronato - italian geek and PROgrammer
[...] Emanuele Feronato on 12/1/07 in Flash December 4th update: part 2 released December 7th update: part 3 [...]
Shuffle an image with BitmapData - Part 2 : Emanuele Feronato - italian geek and PROgrammer
[...] 7th update: part 3 [...]
Thomas
wow!
styxtwo
waaaaaaaaay to difficult.. start with smaller pictures. get the player to enjoy the game before making them pull out their hair in frustation :P
styxtwo
maybe just get them to get 2 of all the peaces in place and then building it up to mroe peaces and more difficult paintings.
and realllllyyy needs instructions:O
abhilash
The game is too hard, chirstmas couples was better than this one, but still hte tutorial was good :)
Emanuele Feronato
this is just a demo, the game will start much easier
shiv1411
According to me this game will again get the uninteresting tag. It is more like a typical jigsaw puzzle game.
shiv1411
Anyways, ur business tactics are more interesting than shuffling paintings.
=))
shiv1411
But it looks promising however
Corey
Nice Tut! The game is easy.. just takes time to get used to and hard to understand at first.