لعبة المربعات Toggler

طريقة التركيب

انسخ الكود و ضعه حيث تريد ظهوره

***********************************************/

var max = 3;
		var score = 0;
		var moves = 0;
		
		function press(form, button) {
			name = button.name;
			x = name.substring(0,1);
			y = name.substring(2,3);
			play(form, (x-1+1), (y-1+1));
		}
		
		function play(form, x, y) {
			moves++;
			toggle(form, x, y);
			toggle(form, x-1, y);
			toggle(form, x+1, y);
			toggle(form, x, y-1);
			toggle(form, x, y+1);
			if (score == 16) {
				if (moves == 4) { w = 'مبروك هذه أفضل نتيجة'; }
                                else { w = 'حاول أن تكملها أسرع'; }
                                alert('لقد ربحت بعد ' + moves + ' حركة ! \n' + w);
				resetboard(form);
			}
		}

function showrules() {
			rules = 'Toggler - لعبة المربعات \n\n'
				+ 'الهدف من هذه اللعبة هو تحويل \n' 
				+ 'كل الازرار من  \n'
		    	+ '	[.] الى [X]   \n'
				+ 'ويتم ذلك بالضغط على بعض الازرار. \n'
				+ 'و تحتاج اللعبة الى ذكاء \n';
			alert(rules);
		}
		
		function resetboard(form) {
			var i,j,button;
			for (i = 0; i < 4; i++) {
				for (j = 0; j < 4; j++) {
					button = getelement(form, i + '_' + j);	
					button.value='X';
				}
			}
			score = 0;
			moves = 0;
		}

function getelement(form, name) {
			var k;
			var elements = form.elements;
			for (k = 0; k < elements.length; k++) {
				if (elements[k].name == name) return elements[k];
			}
		}
	
		function toggle(form, x, y) {
			if (x < 0 || y < 0 || x > max || y > max) {
				//alert('Ignore (' + x + ',' + y + ')');
				return;
			}
			name = x + '_' + y;
			button = getelement(form, name);
			a = button.value;
			button.value = '!!!';
			//alert(a + '  (' + x + ',' + y + ')') ;
			button.value = a;
			if (button.value == 'X') {
				button.value = '.';
				score ++;
			} else {
				button.value = 'X';
				score --;
			}
		}
	</script>
	
	<table border="0" cellspacing="0" cellpadding="1">
		<form>
		<tr>
			<td><input style="width:30px;" type="button" name="0_0" value="X" onclick="press(this.form, this);"></td>
			<td><input style="width:30px;" type="button" name="1_0" value="X" onclick="press(this.form, this);"></td>
			<td><input style="width:30px;" type="button" name="2_0" value="X" onclick="press(this.form, this);"></td>
			<td><input style="width:30px;" type="button" name="3_0" value="X" onclick="press(this.form, this);"></td>
		</tr>
		<tr>
			<td><input style="width:30px;" type="button" name="0_1" value="X" onclick="press(this.form, this);"></td>
			<td><input style="width:30px;" type="button" name="1_1" value="X" onclick="press(this.form, this);"></td>
			<td><input style="width:30px;" type="button" name="2_1" value="X" onclick="press(this.form, this);"></td>
			<td><input style="width:30px;" type="button" name="3_1" value="X" onclick="press(this.form, this);"></td>
		</tr>
		<tr>
			<td><input style="width:30px;" type="button" name="0_2" value="X" onclick="press(this.form, this);"></td>
			<td><input style="width:30px;" type="button" name="1_2" value="X" onclick="press(this.form, this);"></td>
			<td><input style="width:30px;" type="button" name="2_2" value="X" onclick="press(this.form, this);"></td>
			<td><input style="width:30px;" type="button" name="3_2" value="X" onclick="press(this.form, this);"></td>
		</tr>
		<tr>
			<td><input style="width:30px;" type="button" name="0_3" value="X" onclick="press(this.form, this);"></td>
			<td><input style="width:30px;" type="button" name="1_3" value="X" onclick="press(this.form, this);"></td>
			<td><input style="width:30px;" type="button" name="2_3" value="X" onclick="press(this.form, this);"></td>
			<td><input style="width:30px;" type="button" name="3_3" value="X" onclick="press(this.form, this);"></td>
		</tr>
		<tr>
			<td colspan="2">
				<input style="width:62px;" type="button" value="إعادة تعيين" onclick="resetboard(this.form);">
			</td>
			<td colspan="2">
				<input style="width:62px;" type="button" value="الشروط" onclick="showrules();">
			</td>
		</tr>
		</form>
	</table>

لعبة المربعات Toggler

لعبة-المربعات-Toggler-java-script