| Autor | Zpráva | ||
|---|---|---|---|
| Fisak Profil |
#1 · Zasláno: 13. 5. 2013, 11:11:29
Dobrý den. Rád bych se optal Vás jako zkušenějších programátorů co bych měl v kódu změnit/upravit aby se mi výrazně kód zrychlil a nebo byl bezpečnější atd. Pokud by měl někdo k tomu připomínky tak sem s nimy (a ještě lepší rada je s živou ukázkou co by jste jak upravili). Jedná se o dynamickou změnu backgroundu který je jako mapka 209 čtverců který se pospojují do jednoho obrázku a pak se dají do background-images: url("...");
index.php <script>
function updateDb(smer) {
var datastring = 'move-game='+ smer;
$.ajax({
type: "POST",
url: "game/components/move-game.php",
data: datastring,
success: function() {
$("#ReloadThis").load("game/components/call-textures.php");
}
});
return false;
}
$(document).keydown(function(e){
if (e.keyCode == 38) {
return updateDb('top');
}
});
$(document).keydown(function(e){
if (e.keyCode == 40) {
return updateDb('bottom');
}
});
$(document).keydown(function(e){
if (e.keyCode == 37) {
return updateDb('left');
}
});
$(document).keydown(function(e){
if (e.keyCode == 39) {
return updateDb('right');
}
});
</script>
<form method="post" id="arrows" onsubmit="return false">
<input type="image" src="images/img/nahoru.gif" id="nahoru-sipka-games" name="nahoru" value="Nahoru" onclick="return updateDb('top')"/>
<input type="image" src="images/img/dolu.gif" id="dolu-sipka-games" name="dolu" value="Dolu" onclick="return updateDb('bottom')"/>
<span id='postava-games'></span> <?php echo $_SESSION['move_on']; ?>
<input type="image" src="images/img/levo.gif" id="levo-sipka-games" name="doleva" value="Doleva" onclick="return updateDb('left')"/>
<input type="image" src="images/img/pravo.gif" id="pravo-sipka-games" name="doprava" value="Doprava" onclick="return updateDb('right')"/>
</form>
<span id="ReloadThis"></span>
<script>
$("#ReloadThis").load("game/components/call-textures.php");
</script><?php
session_start();
?>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.2/jquery-ui.min.js"></script>
<?php
//nacteni db
require_once ("./../../system/config.php");
require_once ("./../../system/class/class.db.php");
DB::connect(array(
'driver' => _DB_TYPE_,
'host' => _DB_SERVER_,
'username' => _DB_USER_,
'password' => _DB_PASSWD_,
'database' => _DB_NAME_,
'charset' => _DB_CHARSET_,
));
//prefix
DB::getSubstitutes()->pref = _DB_PREFIX_;
function MoveMapImg($x = 0, $y = 0) {
$uss_textures_sql = DB::query("SELECT * FROM [ch_users_characters] where [id] = %i", $_SESSION['uss_character_id'], "%lmt", "1")->fetchAll();
foreach ($uss_textures_sql as $n => $row_textures) {
$border_top = $row_textures->position_y - 5 + $y;
$border_bottom = $row_textures->position_y + 5 + $y;
$border_left = $row_textures->position_x - 9 + $x;
$border_right = $row_textures->position_x + 9 + $x;
//výpis výškových souřadnic
$map_y_sql = DB::query("SELECT DISTINCT [position_y] FROM [ch_map] where [position_z] = %i", $row_textures->position_z, " and [position_y] <= %i", $border_bottom, " and [position_y] >= %i", $border_top, "ORDER BY position_y")->fetchAll();
foreach ($map_y_sql as $n => $row_map_y) {
//výpis šířkových souřadnic
$map_x_sql = DB::query("SELECT * FROM [ch_map] where [position_y] = %i", $row_map_y->position_y, " and [position_x] <= %i", $border_right, " and [position_x] >= %i", $border_left, "ORDER BY position_x")->fetchAll();
foreach ($map_x_sql as $n => $row_map_x) {
$map_img_echo = DB::query("SELECT [url_img] FROM [ch_map_img] where [id] = %i", $row_map_x->img_id);
echo ";".$map_img_echo->fetchSingle('url_img');
}
}
}
}
//$_SESSION['move_on'] = MoveMapImg();
?>
<script>
//kdyz pujdu nahoru
$('<img/>').attr('src', './../../game/components/background-game.php?p=n<?php echo $to_top; echo MoveMapImg(0, -1); ?>').load(function() {
$('body').css('background-image', "url(./../../game/components/background-game.php?p=n<?php echo $position; echo MoveMapImg(); ?>)");
});
//kdyz pujdu dolu
$('<img/>').attr('src', './../../game/components/background-game.php?p=n<?php echo $to_bottom; echo MoveMapImg(0, +1); ?>').load(function() {
$('body').css('background-image', "url(./../../game/components/background-game.php?p=n<?php echo $position; echo MoveMapImg(); ?>)");
});
//kdyz pujdu doleva
$('<img/>').attr('src', './../../game/components/background-game.php?p=n<?php echo $to_left; echo MoveMapImg(-1, 0); ?>').load(function() {
$('body').css('background-image', "url(./../../game/components/background-game.php?p=n<?php echo $position; echo MoveMapImg(); ?>)");
});
//kdyz pujdu doprava
$('<img/>').attr('src', './../../game/components/background-game.php?p=n<?php echo $to_right; echo MoveMapImg(+1, 0); ?>').load(function() {
$('body').css('background-image', "url(./../../game/components/background-game.php?p=n<?php echo $position; echo MoveMapImg(); ?>)");
});
</script>
<style>
body {
background-repeat: no-repeat;
background-position: center;
background-attachment:fixed;
background-color:#FFFFFF;
}
</style><?php
session_start();
$im = imagecreatetruecolor(2352, 1456);
//$im = imagecreatetruecolor(1500, 900);
$white = imagecolorallocate($im, 255, 255, 255);
imagefill($im, 0, 0, $white);
//End Canvas
$vel = 112;
$p = 0;
$pieces_obr = explode(";", $_GET['p']);
//$pieces_obr = explode(";", $_SESSION['move_on']);
$images = array();
for ($y = 1; $y <= 11; $y++) { //výška
for ($x = 1; $x <= 19; $x++) { //šířka
$p++;
$sirka = $vel * $x;
$vyska = $vel * $y;
$images = imageCreateFromjpeg("./../../images/textures/".$pieces_obr[$p].".jpg");
//if(empty($images[$pieces_obr[$p]])) $images[$pieces_obr[$p]] = imageCreateFromjpeg("./../../images/textures/".$pieces_obr[$p].".jpg");
imageCopyMerge($im, $images, $sirka, $vyska, 0, 0, $vel, $vel, 100);
}
}
////-----------------------------------------------///////////////////
Header ("Content-type: image/jpeg");
//This will create the image!
Imagejpeg ($im);
ImageDestroy($images); |
||
| peta Profil |
#2 · Zasláno: 13. 5. 2013, 15:55:37
Fisak: Udelej jeden obrazek a pouzij css position + clip. Ajaxem poslej jen seznam id. Javascriptem pak nastavis pozici v css.
1,4,7,45 x = 45/10 = 4 * sirka obrazku = 4 * 20 = 100 y = 45%10 = 5 * vyska obrazku = 5 * 80 = 400 div.style.backgroundPosition = "-"+x+" -"+y; |
||
| Fisak Profil |
#3 · Zasláno: 13. 5. 2013, 16:50:05
peta:
a z toho se pak dá udělat background? Nemáte prosím nějaký hotový příklad abych viděl jak se to dělá? Jinak děkuji za tip :-) |
||
| peta Profil |
http://www.volny.cz/peter.mlich/hry/pexeso/pexeso.htm
http://www.volny.cz/peter.mlich/hry/pexeso/pismena.gif http://www.volny.cz/peter.mlich/hry/sokoban.htm http://www.volny.cz/peter.mlich/hry/soko.gif Podobne se dela menu na hover efekt, posouvanim pozadi. Divim se, ze ses s tim jeste nesetkal. Příklady na pozadí Test clip Test overflow |
||
|
Časová prodleva: 13 let
|
|||
0