Оптимизация вёрстки, удаление дублирующегося функционала.

This commit is contained in:
Igor Barkov (iwork) 2020-07-21 18:57:15 +03:00
parent 12feda506a
commit 7b17c51bb8
2 changed files with 145 additions and 303 deletions

View File

@ -73,6 +73,7 @@ class User
private function UserInfoDoll($isBattle = 0, $isMain = 0) private function UserInfoDoll($isBattle = 0, $isMain = 0)
{ {
//https://jsfiddle.net/ngx0yvhc //https://jsfiddle.net/ngx0yvhc
//TODO переверстать grid, чтобы он касался только куклы.
$di = new DressedItems($this->id); $di = new DressedItems($this->id);
$dressedItems = $di->getItemsInSlots(); $dressedItems = $di->getItemsInSlots();
for ($i = 1; $i <= 12; $i++) { for ($i = 1; $i <= 12; $i++) {

447
main.php
View File

@ -25,7 +25,7 @@ if (!empty($user['battle'])) {
} }
//БС //БС
if ( isset($user['in_tower']) && $user['in_tower'] == 1) { if (isset($user['in_tower']) && $user['in_tower'] == 1) {
header('Location: towerin.php'); header('Location: towerin.php');
die(); die();
} }
@ -677,141 +677,121 @@ if (isset($_GET['edit'])) {
} }
} }
if (!in_array(input::get('mZeAjax'), ['mZeInventory', 'mZeFilter'])): ?> }
<!doctype html>
<HTML lang="ru">
<HEAD>
<meta charset="utf-8">
<link rel="stylesheet" href="css/main.css">
<link rel="stylesheet" href="css/tooltip.css"/>
<script src="js/jquery.plugins.js"></script>
<script src="js/jquery-1.7.2.min.js"></script>
<script src="js/jquery.simplemodal.js"></script>
<script src="js/jquery.ui.js?100"></script>
<script src="js/tooltip.js"></script>
<script type="text/javascript" src="js/funcs.js"></script>
<script>
$(function () {
$(".tooltip").tipTip({maxWidth: "auto", edgeOffset: 0, fadeIn: 300, fadeOut: 500});
});
function saveComplect() { ?>
new miDialog({title: 'Сохранить комплект'}, {edit: 1}, function () {
document.location = '/main.php?' + $.param(this.data);
},
$('<div>Название комплекта :<br /><div style="font-size: smaller;"><b>может содеражать только буквы (англ / русс) и цифры.</b></div></div>').append(miDialog._oneInput({name: 'savecomplect'})), {width: 250});
}
let Hint3Name = ''; <!doctype html>
<HTML lang="ru">
<HEAD>
<meta charset="utf-8">
<link rel="stylesheet" href="css/main.css">
<link rel="stylesheet" href="css/tooltip.css">
<link rel="stylesheet" href="css/btn.css">
<script src="js/jquery.plugins.js"></script>
<script src="js/jquery-1.7.2.min.js"></script>
<script src="js/jquery.simplemodal.js"></script>
<script src="js/jquery.ui.js?100"></script>
<script src="js/tooltip.js"></script>
<script src="js/funcs.js"></script>
<script>
$(function () {
$(".tooltip").tipTip({maxWidth: "auto", edgeOffset: 0, fadeIn: 300, fadeOut: 500});
});
function okno(title, script, name, coma, errk) { function gotohref(filename) {
let errkom = ''; location.href = filename;
let com = ''; }
if (errk === 1) {
errkom = 'Нельзя использовать символы: /\:*?"<>|+%<br>'; function saveComplect() {
com = coma new miDialog({title: 'Сохранить комплект'}, {edit: 1}, function () {
document.location = '/main.php?' + $.param(this.data);
},
$('<div>Название комплекта :<br /><div style="font-size: smaller;"><b>может содеражать только буквы (англ / русс) и цифры.</b></div></div>').append(miDialog._oneInput({name: 'savecomplect'})), {width: 250});
}
let Hint3Name = '';
function okno(title, script, name, coma, errk) {
let errkom = '';
let com = '';
if (errk === 1) {
errkom = 'Нельзя использовать символы: /\:*?"<>|+%<br>';
com = coma
}
if (errk === 2) {
errkom = 'Такой комплект уже существует<br>';
com = coma
}
document.getElementById("hint3").innerHTML = '<table width=100% cellspacing=1 cellpadding=0 bgcolor=CCC3AA><tr><td align=center><B>' + title + '</td><td width=20 align=right valign=top style="cursor: pointer" onclick="closehint3();"><BIG><B>x</td></tr><tr><td colspan=2>' +
'<form action="' + script + '" method=POST><table width=100% cellspacing=0 cellpadding=2 bgcolor=FFF6DD><tr><INPUT TYPE=hidden name=sd4 value="6"><td colspan=2><span class="error">' +
errkom + '</span>введите название предмета</TD></TR><TR><TD width=50% align=right><INPUT TYPE=text NAME="' + name + '" value="' + com + '"></TD><TD width=50%><INPUT TYPE="submit" value=" »» "></TD></TR></TABLE></FORM></td></tr></table>';
document.getElementById("hint3").style.visibility = "visible";
document.getElementById("hint3").style.left = '100';
document.getElementById("hint3").style.top = '100';
document.getElementById(name).focus();
Hint3Name = name;
}
const delay = 30;
let TimerOn = -1, tkHP, maxHP, speed = 750;
const stLen = 185, redHP = 0.33, yellowHP = 0.66;
function setHPlocal() {
tkHP > maxHP && (tkHP = maxHP);
let a = Math.round(tkHP) + "/" + maxHP;
a = stLen - (a.length + 2) * 7;
const b = Math.round((a - 1) / maxHP * tkHP);
a -= b;
const HP = document.getElementById("hp_value");
const HP1 = document.getElementById("HP1");
const HP2 = document.getElementById("HP2");
if (HP) {
HP1.width = b, HP2.width = a, HP1.src = tkHP / maxHP < redHP ? "i/1red.gif" : tkHP / maxHP < yellowHP ? "i/1yellow.gif" : "i/1green.gif", HP.innerHTML = Math.round(tkHP) + "/" + maxHP;
}
tkHP += maxHP / 53 / 230 * (speed / 100);
TimerOn = tkHP < maxHP ? setTimeout("setHPlocal()", delay * 100) : -1
}
$(document).ready(function () {
$('a').live('click', function () {
if ($(this).attr('ajax') !== undefined) {
const ajaxModule = $(this).attr('ajax');
switch (ajaxModule) {
case'mZeInventory':
$('#mZeInventory').html('<div align="center" style="padding:10px;background-color:#d4d2d2;color:grey;"><b>Загрузка...</b></div>');
$.ajax({
url: $(this).attr('href') + '&mZeAjax=' + ajaxModule,
cache: false,
dataType: 'html',
success: function (html) {
$('#mZeInventory').html(html);
}
});
break;
} }
if (errk === 2) { return false;
errkom = 'Такой комплект уже существует<br>';
com = coma
}
document.getElementById("hint3").innerHTML = '<table width=100% cellspacing=1 cellpadding=0 bgcolor=CCC3AA><tr><td align=center><B>' + title + '</td><td width=20 align=right valign=top style="cursor: pointer" onclick="closehint3();"><BIG><B>x</td></tr><tr><td colspan=2>' +
'<form action="' + script + '" method=POST><table width=100% cellspacing=0 cellpadding=2 bgcolor=FFF6DD><tr><INPUT TYPE=hidden name=sd4 value="6"><td colspan=2><span class="error">' +
errkom + '</span>введите название предмета</TD></TR><TR><TD width=50% align=right><INPUT TYPE=text NAME="' + name + '" value="' + com + '"></TD><TD width=50%><INPUT TYPE="submit" value=" »» "></TD></TR></TABLE></FORM></td></tr></table>';
document.getElementById("hint3").style.visibility = "visible";
document.getElementById("hint3").style.left = '100';
document.getElementById("hint3").style.top = '100';
document.getElementById(name).focus();
Hint3Name = name;
} }
});
const delay = 30; });
let TimerOn = -1, tkHP, maxHP, speed = 750; </script>
const stLen = 185, redHP = 0.33, yellowHP = 0.66; <title>Окно игры</title>
</HEAD>
function setHPlocal() { <body>
tkHP > maxHP && (tkHP = maxHP); <?php
let a = Math.round(tkHP) + "/" + maxHP; try {
a = stLen - (a.length + 2) * 7; $online = db::c()->query('SELECT 1 FROM `online` WHERE `real_time` >= ?i', (time() - 60));
const b = Math.round((a - 1) / maxHP * tkHP); } catch (Exception $e) {
a -= b; echo '<div class="debug">В таблице online нет ячейки real_time так как неясно что она делает. Ошибка обращения в базу.</div>';
const HP = document.getElementById("hp_value"); }
const HP1 = document.getElementById("HP1"); ?>
const HP2 = document.getElementById("HP2"); <div id=hint3 class=ahint></div>
if (HP) { <div id="hint4" style="position: absolute;"></div>
HP1.width = b, HP2.width = a, HP1.src = tkHP / maxHP < redHP ? "i/1red.gif" : tkHP / maxHP < yellowHP ? "i/1yellow.gif" : "i/1green.gif", HP.innerHTML = Math.round(tkHP) + "/" + maxHP; <div id="chpassbank" style="display:none; position:absolute; top:50px; left:250px;"></div>
} <table width=100%>
tkHP += maxHP / 53 / 230 * (speed / 100); <TR>
TimerOn = tkHP < maxHP ? setTimeout("setHPlocal()", delay * 100) : -1 <td style="vertical-align: top; width: 350px">
}
<?= topsethp(); ?>
$(document).ready(function () {
$('a').live('click', function () {
if ($(this).attr('ajax') !== undefined) {
const ajaxModule = $(this).attr('ajax');
switch (ajaxModule) {
case'mZeInventory':
$('#mZeInventory').html('<div align="center" style="padding:10px;background-color:#d4d2d2;color:grey;"><b>Загрузка...</b></div>');
$.ajax({
url: $(this).attr('href') + '&mZeAjax=' + ajaxModule,
cache: false,
dataType: 'html',
success: function (html) {
$('#mZeInventory').html(html);
}
});
break;
}
return false;
}
});
});
</script>
<style>
.jGrowl .jGrowl-notification, .jGrowl .jGrowl-closer {
border: 2px groove threedface;
background: #E6E6E6 !important;
}
.jGrowl .jGrowl-notification, .jGrowl div.jGrowl-closer {
margin: 10px;
}
.jGrowl div.jGrowl-notification {
min-height: 40px;
}
.jGrowl .jGrowl-notification, .jGrowl .jGrowl-closer {
background-color: #000;
opacity: .85;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=85)";
filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=85);
zoom: 1;
width: 235px;
padding: 10px;
margin-top: 5px;
margin-bottom: 5px;
font-family: Tahoma, Arial, Helvetica, sans-serif;
font-size: 1em;
text-align: left;
display: none;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
}
</style>
<title></title>
</HEAD>
<body>
<div id=hint3 class=ahint></div>
<div id="hint4" style="position: absolute;"></div>
<div id="chpassbank" style="display:none; position:absolute; top:50px; left:250px;"></div>
<FORM METHOD=POST ACTION="main.php?edit=1">
<table width=100%>
<TR>
<td style="vertical-align: top; width: 250px">
<?php <?php
$showUser = new User($_SESSION['uid']); $showUser = new User($_SESSION['uid']);
$getItemsBonuses = new DressedItems($_SESSION['uid']); $getItemsBonuses = new DressedItems($_SESSION['uid']);
@ -846,7 +826,7 @@ if (isset($_GET['edit'])) {
</div> </div>
<br> <br>
</td> </td>
<TD style="vertical-align: top; width: 207px"> <!-- Второй столбец --> <td style="vertical-align: top; width: 250px"> <!-- Второй столбец -->
<div> <div>
<br>Уровень: <strong><?= $showUser->level ?></strong> <br>Уровень: <strong><?= $showUser->level ?></strong>
<br>Опыт: <strong><?= $showUser->experience ?></strong> <br>Опыт: <strong><?= $showUser->experience ?></strong>
@ -862,8 +842,10 @@ if (isset($_GET['edit'])) {
Сила: <?= $showUser->getStrength(1) ?> +<?= $getItemsBonuses->getStrengthBonus() ?><br> Сила: <?= $showUser->getStrength(1) ?> +<?= $getItemsBonuses->getStrengthBonus() ?><br>
Ловкость: <?= $showUser->getDexterity(1) ?> +<?= $getItemsBonuses->getDexterityBonus() ?><br> Ловкость: <?= $showUser->getDexterity(1) ?> +<?= $getItemsBonuses->getDexterityBonus() ?><br>
Интуиция: <?= $showUser->getIntuition(1) ?> +<?= $getItemsBonuses->getIntuitionBonus() ?><br> Интуиция: <?= $showUser->getIntuition(1) ?> +<?= $getItemsBonuses->getIntuitionBonus() ?><br>
Выносливость: <?= $showUser->getEndurance(1) ?> +<?= $getItemsBonuses->getEnduranceBonus() ?><br> Выносливость: <?= $showUser->getEndurance(1) ?> +<?= $getItemsBonuses->getEnduranceBonus() ?>
Интеллект: <?= $showUser->getIntelligence(1) ?> +<?= $getItemsBonuses->getIntelliganceBonus() ?><br> <br>
Интеллект: <?= $showUser->getIntelligence(1) ?> +<?= $getItemsBonuses->getIntelliganceBonus() ?>
<br>
Мудрость: <?= $showUser->getWisdom(1) ?> +<?= $getItemsBonuses->getWisdomBonus() ?><br> Мудрость: <?= $showUser->getWisdom(1) ?> +<?= $getItemsBonuses->getWisdomBonus() ?><br>
<small style="color: darkgreen;">Возможных увеличений: <?= $showUser->stat_points ?></small><br> <small style="color: darkgreen;">Возможных увеличений: <?= $showUser->stat_points ?></small><br>
<br> <br>
@ -886,42 +868,31 @@ if (isset($_GET['edit'])) {
</div> </div>
</div> </div>
</TD> </td>
<!--Меню--> <td valign=top>
<TD valign=top> <div align=right class="btn-control inventory"> <!--Меню-кнопки-->
<link rel="stylesheet" href="css/btn.css" type="text/css"> <FORM METHOD=POST ACTION="?edit=1" name=f1>
<div align=right class="btn-control inventory"> <?php if ($user['shadow'] == '0.gif' || $user['admin'] == 1): ?>
<FORM METHOD=POST ACTION="?edit=1" name=f1> <INPUT class="button-mid btn" TYPE="submit" name="setshadow" value="Образы" title="Образы">
<?php if ($user['shadow'] == '0.gif' || $user['admin'] == 1): ?> <?php endif; ?>
<INPUT class="button-mid btn" TYPE="submit" name="setshadow" value="Образы" title="Образы"> <button class="button-mid btn" onclick="gotohref('zayavka.php')">Поединки</button>
<?php endif; ?> <button class="button-mid btn" onclick="gotohref('module_quest.php')">Активные задания</button>
<INPUT class="button-mid btn" TYPE=button name=combats value="Поединки" <button class="button-mid btn" onclick="gotohref('main.php?edit=1')">Инвентарь</button>
onClick="location.href='zayavka.php';" style="font-weight:bold;"> <?php if ($user['room'] === 20): ?>
<INPUT class="button-mid btn" TYPE=button name=combats value="Состояние" <button class="button-mid btn" onclick="gotohref('main.php?goto=arena')">Войти внутрь
onClick="location.href='module_quest.php';" style="font-weight:bold;"> </button>
<INPUT class="button-mid btn" TYPE="button" onClick="location.href='main.php';" value="Вернуться" <?php else: ?>
title="Вернуться"> <button class="button-mid btn" onclick="gotohref('main.php?goto=plo')">Выйти на улицу
</div> </button>
<?php endif; ?>
<div id="jGrowl" class="top-right jGrowl"> <button class="button-mid btn" onclick="gotohref('main.php')">Обновить страницу</button>
<div class="jGrowl-notification"></div> </div>
</div> <div id="mZeInventory"> <!--рюкзак-->
<div id="mZeInventory">
<?php endif ?>
<table class="allzeroes" style="background-color: #a5a5a5;">
<tr>
<td align=center>
<B>Рюкзак (масса: <?= $getItemsBonuses->getItemsWeight() . '/' . $showUser->strength * 4 ?>)</B>
<tr>
<td style="text-align: center">
<table BORDER=0 WIDTH=100% CELLSPACING="1" CELLPADDING="2" BGCOLOR="#A5A5A5"> <table BORDER=0 WIDTH=100% CELLSPACING="1" CELLPADDING="2" BGCOLOR="#A5A5A5">
<?php if ($showUser->money): ?> <caption>Рюкзак
<tr style="background-color: #c7c7c7"> (масса: <?= $getItemsBonuses->getItemsWeight() . '/' . $showUser->strength * 4 ?>)
<td style="text-align: center; width: 100px;"><img src="i/sh/money-bag.png"> </caption>
<td valign="top">Мешок денег (Масса: 0)<br><b><?= $user['money'] ?> кр.</b> <?php
<?php endif;
$data_query = 'SELECT * FROM inventory WHERE owner_id = ?i AND dressed_slot = 0 AND on_sale = 0'; $data_query = 'SELECT * FROM inventory WHERE owner_id = ?i AND dressed_slot = 0 AND on_sale = 0';
$data = db::c()->query($data_query, $_SESSION['uid']); $data = db::c()->query($data_query, $_SESSION['uid']);
@ -930,9 +901,8 @@ if (isset($_GET['edit'])) {
$getItems = []; $getItems = [];
$row = []; $row = [];
$iteminfo = []; $iteminfo = [];
#while ($row = $data->fetch_assoc()) showitem($row, null, "edit=1&razdel=$_SESSION[razdel]");
#while ($row = $data->fetch_assoc()) showitem($row);
while ($row = $data->fetch_assoc()) { while ($row = $data->fetch_assoc()) {
//FIXME Какая-то хуета. Зачем я каждый прежмет делал новым классом?
$iteminfo[] = new InventoryItem($row); $iteminfo[] = new InventoryItem($row);
} }
@ -959,138 +929,9 @@ if (isset($_GET['edit'])) {
} }
?> ?>
</table> </table>
</table>
<?php if (!in_array(input::get('mZeAjax'), ['mZeInventory', 'mZeFilter'])): ?>
</div>
</td>
</form>
</tr>
</table>
</body>
</html>
<?php
endif;
die();
}
?>
<HTML lang="ru">
<HEAD>
<link rel="stylesheet" href="css/main.css">
<link rel="stylesheet" href="css/btn.css">
<meta charset="utf-8">
<link rel="stylesheet" href="css/tooltip.css">
<script src="js/jquery-1.7.2.min.js"></script>
<script src="js/tooltip.js"></script>
<script>
$(function () {
$(".tooltip").tipTip({maxWidth: "auto", edgeOffset: 0, fadeIn: 300, fadeOut: 500});
});
</script>
<script>
let Hint3Name = '';
// Заголовок, название скрипта, имя поля с логином
function findlogin(title, script, name) {
document.getElementById("hint3").innerHTML = '<table width=100% cellspacing=1 cellpadding=0 bgcolor=CCC3AA><tr><td align=center><B>' + title + '</td><td width=20 align=right valign=top style="cursor: pointer" onclick="closehint3();"><BIG><B>x</td></tr><tr><td colspan=2>' +
'<form action="' + script + '" method=POST><table width=100% cellspacing=0 cellpadding=2 bgcolor=FFF6DD><tr><INPUT TYPE=hidden name=sd4 value="6"><td colspan=2>' +
'Укажите логин персонажа:<small><BR>(можно щелкнуть по логину в чате)</TD></TR><TR><TD width=50% align=right><INPUT TYPE=text NAME="' + name + '"></TD><TD width=50%><INPUT TYPE="submit" value=" »» "></TD></TR></TABLE></FORM></td></tr></table>';
document.getElementById("hint3").style.visibility = "visible";
document.getElementById("hint3").style.left = '100';
document.getElementById("hint3").style.top = '100';
document.getElementById(name).focus();
Hint3Name = name;
}
// Заголовок, название скрипта, имя поля с шмоткой
function okno(title, script, name) {
const errkom = '';
document.getElementById("hint3").innerHTML = '<table width=100% cellspacing=1 cellpadding=0 bgcolor=CCC3AA><tr><td align=center><B>' + title + '</td><td width=20 align=right valign=top style="cursor: pointer" onclick="closehint3();"><BIG><B>x</td></tr><tr><td colspan=2>' +
'<form action="' + script + '" method=POST><table width=100% cellspacing=0 cellpadding=2 bgcolor=FFF6DD><tr><INPUT TYPE=hidden name=sd4 value="6"><td colspan=2><span class="error">' +
errkom + '</span>введите название предмета</TD></TR><TR><TD width=50% align=right><INPUT TYPE=text NAME="' + name + '"></TD><TD width=50%><INPUT TYPE="submit" value=" »» "></TD></TR></TABLE></FORM></td></tr></table>';
document.getElementById("hint3").style.visibility = "visible";
document.getElementById("hint3").style.left = '100';
document.getElementById("hint3").style.top = '100';
document.getElementById(name).focus();
Hint3Name = name;
}
function closehint3() {
document.getElementById("hint3").style.visibility = "hidden";
Hint3Name = '';
}
const delay = 30;
let TimerOn = -1, tkHP, maxHP, speed = 750;
const stLen = 185, redHP = 0.33, yellowHP = 0.66;
function setHP(a, b, c) {
tkHP = a;
maxHP = b;
TimerOn >= 0 && (clearTimeout(TimerOn), TimerOn = -1);
speed = c;
setHPlocal()
}
function setHPlocal() {
tkHP > maxHP && (tkHP = maxHP);
let a = Math.round(tkHP) + "/" + maxHP;
a = stLen - (a.length + 2) * 7;
const b = Math.round((a - 1) / maxHP * tkHP);
a -= b;
const HP = document.getElementById("hp_value");
const HP1 = document.getElementById("HP1");
const HP2 = document.getElementById("HP2");
if (HP) {
HP1.width = b, HP2.width = a, HP1.src = tkHP / maxHP < redHP ? "i/1red.gif" : tkHP / maxHP < yellowHP ? "i/1yellow.gif" : "i/1green.gif", HP.innerHTML = Math.round(tkHP) + "/" + maxHP;
}
tkHP += maxHP / 53 / 230 * (speed / 100);
TimerOn = tkHP < maxHP ? setTimeout("setHPlocal()", delay * 100) : -1
}
</script>
<title></title>
</HEAD>
<body onLoad="<?= topsethp(); ?>">
<?php
try {
$online = db::c()->query('SELECT 1 FROM `online` WHERE `real_time` >= ?i', (time() - 60));
} catch (Exception $e) {
echo '<div class="debug">В таблице online нет ячейки real_time так как неясно что она делает. Ошибка обращения в базу.</div>';
}
?>
<div id=hint3 class=ahint></div>
<table class="allzeroes">
<tr>
<td style="width:250px;">
<?php
$userInfo = new User($_SESSION['uid']);
$userInfo->showUserInfoMain();
?>
</td>
<td>&nbsp;</td>
<TD style="text-align: right;">
<div class="hint-text">Сейчас в игре: <strong><?= 'неизвестно' /*$online->getNumRows()*/ ?></strong> чел.
</div> </div>
<button onclick="gotohref('zayavka.php')">Поединки</button> </td>
<br>
<button onclick="gotohref('main.php?edit=1')">Инвентарь</button>
<br>
<button onclick="gotohref('module_quest.php')">Активные задания</button>
<br>
<?php if ($user['room'] === 20): ?>
<button onclick="gotohref('main.php?goto=arena')">Войти внутрь</button><br>
<?php else: ?>
<button onclick="gotohref('main.php?goto=plo')">Выйти на улицу</button><br>
<?php endif; ?>
<button onclick="gotohref('main.php')">Обновить страницу</button>
</TD>
</tr> </tr>
</table> </table>
<script> </body>
function gotohref(filename) { </html>
location.href = filename;
}
</script>
</BODY>
</HTML>