3D - Lịch sử thay đổi

Een: /* Setting the default point of view and enabling 3d by default */

2017-07-27T09:28:11Z

Setting the default point of view and enabling 3d by default

← Phiên bản cũ		Phiên bản lúc 11:28, ngày 27 tháng 7 năm 2017
Dòng 85:		Dòng 85:
	Your game may require to use 3D mode enabled by default and also with a certain custom default PoinOfView. You can achieve this setting in your constructor section of your game:		Your game may require to use 3D mode enabled by default and also with a certain custom default PoinOfView. You can achieve this setting in your constructor section of your game:

			'''Important: you must use this only if your game doesn't work without 3D mode.''' As a general platform policy, interface must be optimised for 2D and display in 2D by default. 3D is meant as an option that can be activated by the user if he wants it.

	if (!dojo.hasClass("ebd-body", "mode_3d")) {		if (!dojo.hasClass("ebd-body", "mode_3d")) {

Victoria la: /* Setting the default point of view and enabling 3d by default */

2017-07-18T00:11:30Z

Setting the default point of view and enabling 3d by default

← Phiên bản cũ		Phiên bản lúc 02:11, ngày 18 tháng 7 năm 2017
Dòng 86:		Dòng 86:


	if (!dojo.hasClass("ebd-body", "mode_3d")) {		if (!dojo.hasClass("ebd-body", "mode_3d")) {
	dojo.addClass("ebd-body", "mode_3d");		dojo.addClass("ebd-body", "mode_3d");
	dojo.addClass("ebd-body", "enableTransitions");		dojo.addClass("ebd-body", "enableTransitions");
Dòng 96:		Dòng 96:
	this.control3dscale = 1.4; // zoom level, 1 is default 2 is double normal size,		this.control3dscale = 1.4; // zoom level, 1 is default 2 is double normal size,
	this.control3dmode3d = true ; // is the 3d enabled		this.control3dmode3d = true ; // is the 3d enabled
	$("game_play_area").style.transform = "rotatex(" + this.control3dxaxis + "deg) translate(" + this.control3dypos + "px," + this.control3dxpos + "px) rotateZ(" + this.control3dzaxis + "deg) scale3d(" + this.control3dscale + "," + this.control3dscale + "," + this.control3dscale + ")";		$("game_play_area").style.transform =
	}		"rotatex(" + this.control3dxaxis + "deg) translate(" + this.control3dypos + "px," + this.control3dxpos + "px) rotateZ(" + this.control3dzaxis + "deg) scale3d(" + this.control3dscale
			+ "," + this.control3dscale + "," + this.control3dscale + ")";
			}

Galehar: Fix formatting

2017-07-09T20:19:18Z

Fix formatting

← Phiên bản cũ		Phiên bản lúc 22:19, ngày 9 tháng 7 năm 2017
Dòng 24:		Dòng 24:
	In CSS, you should prefix all your 3D mode specific directives by ".mode_3d".		In CSS, you should prefix all your 3D mode specific directives by ".mode_3d".

	.mode_3d .board {		.mode_3d .board {
	overflow: visible;		overflow: visible;
	}		}

	In Javascript, you can detect 3D by using the following :		In Javascript, you can detect 3D by using the following :

Morgalad: /* Setting the default point of view and enabling 3d by default */

2017-07-07T15:20:08Z

Setting the default point of view and enabling 3d by default

← Phiên bản cũ		Phiên bản lúc 17:20, ngày 7 tháng 7 năm 2017
Dòng 87:		Dòng 87:

	if (!dojo.hasClass("ebd-body", "mode_3d")) {		if (!dojo.hasClass("ebd-body", "mode_3d")) {
	dojo.addClass("ebd-body", "mode_3d");		dojo.addClass("ebd-body", "mode_3d");
	dojo.addClass("ebd-body", "enableTransitions");		dojo.addClass("ebd-body", "enableTransitions");
	$("globalaction_3d").innerHTML = "2D"; // controls the upper right button		$("globalaction_3d").innerHTML = "2D"; // controls the upper right button
	this.control3dxaxis = 30; // rotation in degrees of x axis (it has a limit of 0 to 80 degrees in the frameword so users cannot turn it upsidedown)		this.control3dxaxis = 30; // rotation in degrees of x axis (it has a limit of 0 to 80 degrees in the frameword so users cannot turn it upsidedown)
	this.control3dzaxis = 0; // rotation in degrees of z axis		this.control3dzaxis = 0; // rotation in degrees of z axis
	this.control3dxpos = 100; // center of screen in pixels		this.control3dxpos = 100; // center of screen in pixels
	this.control3dypos = 300; // center of screen in pixels		this.control3dypos = 300; // center of screen in pixels
	this.control3dscale = 1.4; // zoom level, 1 is default 2 is double normal size,		this.control3dscale = 1.4; // zoom level, 1 is default 2 is double normal size,
	this.control3dmode3d = true ; // is the 3d enabled		this.control3dmode3d = true ; // is the 3d enabled
	$("game_play_area").style.transform = "rotatex(" + this.control3dxaxis + "deg) translate(" + this.control3dypos + "px," + this.control3dxpos + "px) rotateZ(" + this.control3dzaxis + "deg) scale3d(" + this.control3dscale + "," + this.control3dscale + "," + this.control3dscale + ")";		$("game_play_area").style.transform = "rotatex(" + this.control3dxaxis + "deg) translate(" + this.control3dypos + "px," + this.control3dxpos + "px) rotateZ(" + this.control3dzaxis + "deg) scale3d(" + this.control3dscale + "," + this.control3dscale + "," + this.control3dscale + ")";
	}		}

Morgalad: /* Setting the default point of view and enabling 3d by default */

2017-07-07T15:19:27Z

Setting the default point of view and enabling 3d by default

← Phiên bản cũ		Phiên bản lúc 17:19, ngày 7 tháng 7 năm 2017
Dòng 93:		Dòng 93:
	this.control3dzaxis = 0; // rotation in degrees of z axis		this.control3dzaxis = 0; // rotation in degrees of z axis
	this.control3dxpos = 100; // center of screen in pixels		this.control3dxpos = 100; // center of screen in pixels
	this.control3dypos = 300; // center of screen in pixels		this.control3dypos = 300; // center of screen in pixels
	this.control3dscale = 1.4; // zoom level, 1 is default 2 is double normal size,		this.control3dscale = 1.4; // zoom level, 1 is default 2 is double normal size,
	this.control3dmode3d = true ; // is the 3d enabled		this.control3dmode3d = true ; // is the 3d enabled
	$("game_play_area").style.transform = "rotatex(" + this.control3dxaxis + "deg) translate(" + this.control3dypos + "px," + this.control3dxpos + "px) rotateZ(" + this.control3dzaxis + "deg) scale3d(" + this.control3dscale + "," + this.control3dscale + "," + this.control3dscale + ")";		$("game_play_area").style.transform = "rotatex(" + this.control3dxaxis + "deg) translate(" + this.control3dypos + "px," + this.control3dxpos + "px) rotateZ(" + this.control3dzaxis + "deg) scale3d(" + this.control3dscale + "," + this.control3dscale + "," + this.control3dscale + ")";
	}		}

Morgalad vào lúc 15:18, ngày 7 tháng 7 năm 2017

2017-07-07T15:18:56Z

← Phiên bản cũ		Phiên bản lúc 17:18, ngày 7 tháng 7 năm 2017
Dòng 79:		Dòng 79:

	Note: if you found some generic CSS that may help some other developers for 3D enhancements, please send it to us so we can add it there.		Note: if you found some generic CSS that may help some other developers for 3D enhancements, please send it to us so we can add it there.


			== Setting the default point of view and enabling 3d by default ==

			Your game may require to use 3D mode enabled by default and also with a certain custom default PoinOfView. You can achieve this setting in your constructor section of your game:


			if (!dojo.hasClass("ebd-body", "mode_3d")) {
			dojo.addClass("ebd-body", "mode_3d");
			dojo.addClass("ebd-body", "enableTransitions");
			$("globalaction_3d").innerHTML = "2D"; // controls the upper right button
			this.control3dxaxis = 30; // rotation in degrees of x axis (it has a limit of 0 to 80 degrees in the frameword so users cannot turn it upsidedown)
			this.control3dzaxis = 0; // rotation in degrees of z axis
			this.control3dxpos = 100; // center of screen in pixels
			this.control3dypos = 300; // center of screen in pixels
			this.control3dscale = 1.4; // zoom level, 1 is default 2 is double normal size,
			this.control3dmode3d = true ; // is the 3d enabled
			$("game_play_area").style.transform = "rotatex(" + this.control3dxaxis + "deg) translate(" + this.control3dypos + "px," + this.control3dxpos + "px) rotateZ(" + this.control3dzaxis + "deg) scale3d(" + this.control3dscale + "," + this.control3dscale + "," + this.control3dscale + ")";
			}

Morgalad: /* Use Z axis */

2017-06-22T15:44:43Z

Use Z axis

← Phiên bản cũ		Phiên bản lúc 17:44, ngày 22 tháng 6 năm 2017
Dòng 52:		Dòng 52:
	transform: translateZ( 20px ); /* This element is going to float 20px above the surface */		transform: translateZ( 20px ); /* This element is going to float 20px above the surface */
	}		}

			The framework will add the following to all your divs:
			transform-style: preserve-3d;

			So they will keep their position in 3D space relative to other elemens with the transformation defined. Note that some CSS artifacts can break the css inheritance of the "preserve-3d" like "overflow:auto"


Dòng 57:		Dòng 62:

	this.getComputedTranslateZ( html_element );		this.getComputedTranslateZ( html_element );


	== Use pre-build BGA 3D CSS classes ==		== Use pre-build BGA 3D CSS classes ==

Morgalad: /* Use pre-build BGA 3D classes */

2017-06-22T15:38:36Z

Use pre-build BGA 3D classes

← Phiên bản cũ		Phiên bản lúc 17:38, ngày 22 tháng 6 năm 2017
Dòng 59:		Dòng 59:


	== Use pre-build BGA 3D classes ==		== Use pre-build BGA 3D CSS classes ==

	By adding the following classes to your objects, they will look nicer in 3D:		By adding the following classes to your objects, they will look nicer in 3D:

Victoria la: /* Detecting 3D */

2017-06-22T01:46:02Z

Detecting 3D

← Phiên bản cũ		Phiên bản lúc 03:46, ngày 22 tháng 6 năm 2017
Dòng 24:		Dòng 24:
	In CSS, you should prefix all your 3D mode specific directives by ".mode_3d".		In CSS, you should prefix all your 3D mode specific directives by ".mode_3d".

	.mode_3d .~~meeple~~ {		.mode_3d .board {
	~~// something 3d specific~~		overflow: visible;
	}		}

	In Javascript, you can detect 3D by using the following :		In Javascript, you can detect 3D by using the following :

Victoria la: /* Detecting 3D */

2017-06-21T22:57:22Z

Detecting 3D

← Phiên bản cũ		Phiên bản lúc 00:57, ngày 22 tháng 6 năm 2017
Dòng 23:		Dòng 23:

	In CSS, you should prefix all your 3D mode specific directives by ".mode_3d".		In CSS, you should prefix all your 3D mode specific directives by ".mode_3d".

			.mode_3d .meeple {
			// something 3d specific
			}

	In Javascript, you can detect 3D by using the following :		In Javascript, you can detect 3D by using the following :
Dòng 30:		Dòng 34:
	// Only executed in 3d mode		// Only executed in 3d mode
	}		}


	= Built-in 3D enhancements =		= Built-in 3D enhancements =