![](/stc/img/evkova.png)
Разработка сайта приюта для домашних животных
Содержание:
Введение
Веб-сайт - это такой ресурс, который состоит из одной или нескольких веб-страниц с гипер-текстовым, текстовым, медийным содержанием
Веб страницы и другие веб-файлы обслуживаются веб-серверами - специальным программным обеспечением, которое доставляет веб-контент клиентам по веб-протоколам.
Веб-сайт является одной из очень важных вещей для того чтобы люди о вас узнали поэтому сайты для приютов очень важны, так как они могут привлечь внимание к проблеме оставшихся без дома животных и помочь им и их хозяевам обрести друг друга.
Важной частью такого сайта является добавление новых животных и удаление тех кого забрали. Так же для этого сайта очень важно иметь обратную связь с людьми которые готовы забрать животных из приюта.
В курсовой работе была поставлена задача изучения HTML, CSS, PHP, SQL, баз данных MySQL в процессе разработки и создания веб-сайта для приюта животных.
Таким образом, работа разделяется на:
- Процесс изучения
- Процесс разработки
Соответственно, в ходе выполнения курсового проектирования было запланировано:
- Изучить HTML и CSS, основы дизайна веб-страниц.
- Разработать концепцию сайта и техническое задание.
- Разработать макеты страниц сайта на основе HTML и CSS.
- Изучить язык PHP для создания динамических страниц сайта.
- Изучить MySQL и язык запросов к базам данных SQL.
- Разработать логику работы сайта с использованием PHP, MySQL.
- Внедрить базу данных в разработанный макет сайта в соответствии с разработанной логикой.
Данный сайт предназначается для поиска хозяев для питомцев, оставшихся без них. На сайте предусмотрен механизм авторизации для избирательного доступа к информации
В настоящее время Интернет, Web-технологии – это эффективное средство заявления о себе. Поэтому представляется актуальным и практически важным рассмотреть проблему проектирования такого Web-сайта в современных условиях с использованием всего спектра достижений, накопленных в данной области.
Основная функция сайта – помочь людям узнать о животных, которые были брошены хозяевами. Все разделы сайта и информация должны быть легко доступны, а навигация эргономична.
При создании веб-сайта ООО «Лапочка» использовались следующие инструменты:
- HTML/CSS.
- PHP/MySQL/PHPMyAdmin.
- Веб-сервер Apache.
- Denwer.
Глава 1. Техническое задание и выбор средств реализации.
Предполагается, что техническое задание на создание сайты для приюта было дано организацией ООО «Лапочка». На сайте отображены разделы:
- Каталог собак
- Каталог кошек
- Нашли дом
- Стать волонтером
Сайт предоставляет возможность знакомиться с актуальными питомцами обитающими в приюте, а так же оформить анкету для того чтобы взять животное из приюта или стать волонтером.
Пользоваться сайтом могут любые люди переходящие по ссылке на сайт, а добавлять информацию о животных может только администратор.
Доступ к информации осуществляется по логину и паролю.
Контент для каталога животных на сайте хранится в базе данных MySQL на сервере. Администраторы сайта имеют возможность редактировать базу данных через внутренние страницы сайта.
Для реализации статической части сайта использовались HTML/CSS.
HTML – это язык гипертекстовой разметки документов в Интернете. В данной работе использовалась версия HTML5.
Рисунок 1. Пример кода HTML.
Рисунок 2. Пример страницы HTML.
Для описания внешнего вида HTML-страниц использовался формальный язык описания внешнего вида документа CSS. (Cascading Style Sheets)
Рисунок 3. Пример кода CSS.
Рисунок 4. Пример HTML-страницы с использованием файла CSS.
Рисунок 5. HTML-страница без применения CSS.
В качестве серверной платформы выбран веб-сервер Apache. Для удобства установки и управления использовалась программная оболочка Denwer.
Для управления базами данных применялся веб-интерфейс PHPMyAdmin.
Рисунок 6. Интерфейс PHPMyAdmin.
Кроме этого для управления базой данных были созданы специальные внутренние страницы сайта.
Работа динамической составляющей части сайта заключается в синергии средств PHP/MySQL. (Приложение 1)
Глава 2. Описание модулей серверной части программы и их взаимодействие.
Этап 1. Разработка системы авторизации. (vhod.php).
В начале была поставлена задача разработать систему авторизации для администратора. Так как администратор у нас один то все реализовано без участия PHPMyAdmin.
Для этого на странице vhod.php была создана форма ввода с полями «Имя пользователя» (логин) и «пароль», а также кнопкой входа.
Рисунок 7. Страница входа на сайт (vhod.php).
- Если данные, введенные в форме, найдены, инициализируется сессия, в которой создается переменная $rules, принимающая значение ‘admin’.
- Вызывается страница index.php, содержание которой будет зависеть от значения переменной $rules.
Рисунок 8. Главная страница при входе от имени администратора (main.php).
Рисунок 9. Главная страница со стороны стороннего человека
- Если данные, введенные в форму, не найдены в таблице, тогда перехода на index.php не происходит, и отображается сообщение об ошибке авторизации.
Этап 2. Разработка интерфейса администратора для измения и пополнения каталога животных (modify.php, adminplus.php).
Для удобства работы администратора была поставлена задача разработать интерфейс с возможностью просматривать и редактировать, и добавлять данные животных.
Для решения этой задачи было выполнено:
- Вывод каталога животных из базы данных с кнопками «добавить», «изменить», «удалить».
Рисунок 10. Страница каталога животных от имени администратора.
- При нажатии кнопки «изменить» происходит переход на страницу редактирования modify.php с формой для изменения данных.
Рисунок 11. Страница изменения учетных данных пользователя (modify.php).
- При нажатии кнопки «Сохранить» на странице modify.php происходит соединение с БД pets с таблицей animal. После соединения данные, введенные в форму заменяются и сохраняются.
- Для добавления новых элементов каталога была создана следующая форма
- Рисунок 12. Форма для добавления питомца в каталог страница adminplus.php
- Для добавления животного в каталог включается модуль adminplus.php, в котором производится отображение формы, ее текста и запросом изображения, добавление данных о животном в таблицу animal, а также сохранение соответствующего изображения в специальную папку (pet).
- После нажатия кнопки удалить включается модуль delete.php он связывается с таблицей animal и удаляет данные о животном, а так же удаляет фотографию из папки (pet).
Этап 3. Разработка движка страницы с анкетами (doc.php)
Была поставлена задача, чтобы любой пользователь зашедший на сайт смог связаться с руководством ООО «Лапочка». Для решения этой задачи была создана страница с анкетами для пользователей которая потом оправлялась в базу данных и там обрабатывалась:
Рисунок 12. Страница с анкетой для пользователей(doc.php).
- После нажатия пользователем на кнопку (отправить) файл который он прикрепил к анкете сохраняется в папку (fanketa) далее происходит связь с таблицей базы данных anketa куда записываются данные введенные пользователем.
Рисунок 13. Таблица anketa в PHPmyAdmin
Глава 3. Описание структуры базы данных и ее функций.
Для хранения информации на сервере была создана база данных pet. В базе данных были созданы 2 таблицы:
- Анкеты для связи с приютом (anketa);
- Каталог животных (animal);
Рисунок 14. Структура базы данных pet.
Таблица anketa.
Таблица anketa предназначена для хранения обращений от пользователя к администрации приюта и содержит в себе 10 полей:
-
-
-
- “id” – идентификационный номер. Представляет собой переменную целочисленного типа (INT) с автоинкрементом (свойство A_I). Количество цифр ограничено 11. Является ключевым полем таблицы (свойство PRIMARY).
- “address” – адрес своего проживания который заполняет в форму пользователь. Представляет собой переменную строкового типа (VARCHAR). Длина строки ограничена 255 символами.
- “Name” – Имя человека, подавшего заявку. Представляет собой переменную строкового типа (VARCHAR). Длина строки ограничена 50 символами.
- “fname” – фамилия человека подавшего заявку. Представляет собой переменную строкового типа (VARCHAR). Длина строки ограничена 50 символами.
- “foto” – фотография которую пользователь добавил к анкете. Представляет собой переменную строкового типа (VARCHAR). Длина строки ограничена 800 символами.
- “mel” – пол человека. Представляет собой переменную строкового типа (VARCHAR). Длина строки ограничена 10 символами.
- “rdate” – дата рождения. Представляет собой переменную строкового типа (VARCHAR). Длина строки ограничена 12 символами.
- “reason” – устанавливается флажок на причину обращения к администрации приюта. Представляет собой переменную строкового типа (VARCHAR). Длина строки ограничена 20 символами.
- “tel” – телефон который указал пользователь. Представляет собой переменную строкового типа (VARCHAR). Длина строки ограничена 11 символами.
- “text” - рассказ о себе. Представляет собой переменную строкового типа (TEXT). Длина строки ограничена 1200 символами.
-
-
Для отображения данных добавленных пользователем в таблице anketa используется следующий запрос:
"INSERT INTO `anketa` INSERT INTO `anketa` (`name`, `fname`, `rdate`, `address`, `tel`, `mel`, `reason`, `text`, `foto`) VALUES ('".$name."', '".$fname."', '".$rdate."', '".$address."', '".$tel."', '".$mel."', '".$reason."', '".$text."', '".$_FILES['filename']['name'].”’)
С помощью переменных PHP данные, введенные случайным пользователем сайта в html-форму на странице doc.php, а также имя выбранного файла, попадают в SQL-запрос, в результате выполнения которого они добавляются в таблицу.
Рисунок 15. Структура таблицы anketa.
Таблица animal.
Таблица animal предназначена для хранения каталога животных и содержит 9 полей:
-
-
-
- “id” – идентификационный номер. Представляет собой переменную целочисленного типа (INT) с автоинкрементом (свойство A_I). Количество цифр ограничено 11. Является ключевым полем таблицы (свойство PRIMARY).
- “klichka” – имя животного. Представляет собой переменную строкового типа (VARCHAR). Длина строки ограничена 50 символами.
- “pol” – пол животного. Представляет собой переменную строкового типа (VARCHAR). Длина строки ограничена 20 символами.
- “vidpeta” – вид животного. Нужен для понимания какое животное мы добавляем после чего оно будет отображаться на нужной странице. Представляет собой переменную строкового типа (VARCHAR). Длина строки ограничена 20 символами.
- “vozrast” – возраст животного. Представляет собой переменную строкового типа (VARCHAR). Длина строки ограничена 20 символами.
- “zabrali” – если животное забрали, то ставится галочка, что его забрали и оно отображается на странице с животными, которых забрали. Представляет собой переменную строкового типа (VARCHAR). Длина строки ограничена 20 символами.
- “date” – дата публикации. Представляет собой переменную строкового типа (VARCHAR). Длина строки ограничена 20 символами.
- “opis” – описание животного. Представляет собой переменную текстового типа (TEXT).
- “foto” – имя файла изображения для соответствующего животного. Представляет собой переменную строкового типа (VARCHAR). Длина строки ограничена 100 символами.
-
-
Для доступа к данным в таблице news и их отображения используется SQL-запрос:
SELECT * FROM `animal`
При выполнении этого запроса информация о содержимом таблицы считывается в переменную $result с помощью PHP-запроса, а затем построчно передается в переменную $row и при помощи PHP-кода выводится на экран.
Для добавления данных в таблицу animal используется SQL-запрос с добавлением переменных PHP:
INSERT INTO `animal`
С помощью переменных PHP данные, введенные администратором в html-форму на странице aminplus.php, а также имя выбранного файла, попадают в SQL-запрос, в результате выполнения которого они добавляются в таблицу.
Для удаления данных из таблицы news используется SQL-запрос с добавлением переменных PHP:
DELETE FROM `animal` WHERE `animal`.`id` = '$id'
С помощью переменной $id данные о записи, которую необходимо удалить из таблицы, попадают в SQL-запрос и запись удаляется.
Для изменения записи в таблице animal используется SQL-запрос с добавлением переменных PHP:
"UPDATE `animal` SET `klichka`='".$klichka."', `vozrast`='".$vozrast."', `pol`='".$pol."', `opis`='".$opis."', `zabrali`='".$zabrali."' WHERE `id`='".$id."'"
Рисунок 16. Структура таблицы anketa.
Глава 4. Описание структуры клиентской части.
Описание интерфейса «Обычный человек».
Интерфейс стороннего пользователя, заходящего на сайт, согласно техническому заданию, должен быть удобным и простым в использовании. Для реализации данной задачи был выбран интерфейс с верхним и нижним меню навигации, отображающимся на всех страницах и позволяющим в любой момент посетить любой раздел сайта.
На главной странице пользователь может ознакомится с видео о проблемах животных.
Рисунок 17. Главная страница стороннего пользователя.
Рисунок 18. Интерфейс страницы с анкетами.
Рисунок 19. Интерфейс страницы каталога.
Интерфейс сайта обладает всем необходимым функционалом для стороннего пользователя. За информационным наполнением следят администраторы сайта.
Описание интерфейса «Администратор».
Интерфейс администратора сайта во многом совпадает с интерфейсом обычного пользователя, но его отличает наличие функциональных кнопок и ссылок, а так же невозможность посетить страницы которые он не может редактировать, исключая главную страницу.
Рисунок 28. Интерфейс каталога животных при входе с правами администратора.
Заключение
В ходе курсового проектирования была поставлена цель разработать прототип сайта для приюта домашних животных «Лапочка». В связи с этим, также предполагалось решить задачу по изучению языка гипертекстовой разметки HTML, CSS, языка программирования PHP, языка запросов SQL и базы данных MySQL. Эти задачи были решены.
Прототип сайта для приюта обладает гибкостью для внедрения в информационную среду различных организаций и предполагает доработку под конкретную задачу.
Сайт организации обладает следующим функционалом и особенностями:
- Удобным навигационным меню.
- Логотипом организации на каждой странице.
- Страницей, на которой отображен каталог животных.
- Страницей со связью с приютом.
- Страницами для осуществления администрирования сайта.
Вся информация, содержащаяся на сайте, находится в базе данных MySQL, что повышает уровень защищенности сайта.
Интерфейс сайта предполагает возможность обслуживания веб-сайта и изменения содержащейся на нем информации администраторами, не обладающими специальными навыками программирования и работы с базами данных.
Выполненная работа по созданию сайта соответствует техническому заданию организации и требованиям по информационной безопасности приюта ООО «Лапочка».
Список использованной литературы
- Мейер, Б. Инструменты, алгоритмы и структуры данных / Б. Мейер. - 2-е изд., испр. - М. : Национальный Открытый Университет «ИНТУИТ», 2016.
- Савельева, Н.В. Язык программирования PHP / Н.В. Савельева. - 2-е изд., испр. - М. : Национальный Открытый Университет «ИНТУИТ», 2016
- Прохоренок, Н. HTML, JavaScript, PHP и MySQL. Джентльменский набор Web-мастера / Н. Прохоренок. - СПб.: БХВ - Петербург., 2010. - 900 с.
- Мазуркевич, А. PHP: настольная книга программиста / А. Мазуркевич. - М.: Новое знание, 2003. - 480 с.
- Харрис, Э. PHP/MySQL для начинающих / Э. Харрис. - М.: Кудиц - образ, 2005.
Приложение 1
Главная страница index.php, main.css
index.php
<?
session_start();
if ($_SESSION['rules'] == "")
session_unset();
if ($_GET['logout'] == 'yes')
session_unset();
?>
<html>
<head>
<title>Приют для домашних животных "Лапочка"(Главная страница)</title>
<meta html-equiv="Content-Type" content="text/html"; charset="utf-8" />
<meta name="description" content="Прют Лапочка-муниципальный приют для бездомных животных в Московской области. Существует с 2019 года " />
<meta name="keywords" content="взять собаку, взять кошку, прют, питомцы" />
<Link href="http://petlife/css/main.css" rel="stylesheet" type="text/css" />
<script src="http://ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js"></script>
</head>
<body>
<header id="shapka">
<div id="logo"><img src="http://petlife/img/logo.png" width="20%" height="80%" align="right">
</div>
<div id="topcent">
<br><br>
Адрес: г.Москва Левофортово д.15<br>
почтовый индекс: 145000<br>
тел: 8-800-000-22
</div>
<div id="topright">
<?
if ($_SESSION['rules']==1){
?>
<a href="http://petlife/index.php?logout=yes"><img src="http://petlife/img/vhod.jpg" width="10%" height="40%" align="left"></a>
Выход
<?
} else
{
?>
<a href="http://petlife/vhod.php"><img src="http://petlife/img/vhod.jpg" width="10%" height="40%" align="left"></a>
Вход
<?
}
?>
</div>
</header>
<div id="vso">
<div id="menu">
<menu>
<div id="dog"><details>
<summary>Cобаки</summary>
<?
if ($_SESSION['rules'] == '')
{
?>
<p><a href="http://petlife/doc.php" class="rin" title="Взять собаку домой">Взять собаку</a></p>
<?
}
?>
<p><a href="http://petlife/wish.php?vid=dog&zabrali=no" class="rin" title="Свободные собаки">Каталог собак</a></p>
</details>
</div>
<div id="cat">
<details>
<summary>Кошки</summary>
<?
if ($_SESSION['rules'] == '')
{
?>
<p><a href="http://petlife/doc.php" class="rin" title="Взять кошку домой">Взять кошку</a></p>
<?
}
?>
<p><a href="http://petlife/wish.php?vid=cat&zabrali=no" class="rin" title="Свободные кошки">Каталог кошек</a></p>
</details>
</div>
<div id="mau">
<details>
<summary><a href="http://petlife/wish.php?zabrali=yes" class="rin" title="Счастливые питомцы нашедшие дом">Нашли дом</a></summary>
</details>
</div>
<div id="Onas">
<details>
<summary><a href="http://petlife/news.php" class="rin" title="О приюте Лапочка">О нас</a></summary>
</details>
</div>
</menu>
<iframe id="video" width="520" height="300"
src="https://www.youtube.com/embed/8-6Xy4ak1m8" frameborder="0" allow="accelerometer; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</div>
<?
if ($_SESSION['rules'] == '')
{
?>
<div id="banner">
<pre id="nizpre">
<a href="http://petlife/news.php" class="rin">О приюте</a></pre>
<pre id="nizdog">
<a href="http://petlife/doc.php#dog" class="rin">Взять собаку</a></pre>
<pre id="nizcat">
<a href="http://petlife/doc.php#cat" class="rin">Взять кошку</a></pre>
<pre id="nizvol">
<a href="http://petlife/doc.php#volunteer" class="rin">Стать волонтером</a></pre>
</div>
<?
}
?>
</div>
<footer id="podval">
<div id="imya">
<pre>Иванова Анна СБИ-411
2020 год</pre>
</div>
<div id="textx">
<br>Помоги нашим маленьким друзьям - Возьми питомца из приюта!
</div>
<div id="email">
<img src="http://petlife/img/e-mail.png" width="10%" height="40%" align="left">
<i>lapochka-priut@mail.ru</i>
</div>
</footer>
</body>
</html>
main.css
* {
text-decoration: none;
text-indent: 1em;
}
html
{
background-image: url('http://petlife/img/FON.jpg');
}
.rin {color: #000;
}
h1 {font-family:arial;}
p {
font-size: 1em; font-family:Times new roman;
text-indent:0;
border-right: 0.5px solid white;
border-right: 0.5px solid white;
border-bottom: 1px dotted White;
margin:0;
float:inherit;
background-color:#F4A460;
border-radius: 3px;
}
p:hover {background-color: #FF8C00}
summary
{
border: 1px outset;
background-color:#F4A460;
font-size: 1em; font-family:Times new roman;
text-indent:0;
margin:0;
float:inherit;
border-radius: 3px;
}
summary:hover {background-color: #FF8C00}
details summary::-webkit-details-marker {
display: none;
font-size: 1em;
font-family:Times new roman;
font-weight: bold; }
a {font-size: 1.1em; font-family:Times new roman; }
pre {font-size: 1.1em; font-weight: bold; font-family:Times new roman; color: black; text-indent:0;}
footer {font-size: 1.1em; }
#shapka {
margin:0;
height: 8em;
width: 98em;
}
#vso
{
height: 34em;
width: 98em;
}
#podval {
margin-left: -2em;
height: 5em;
width: 94em;
background-color: #F4A460;
}
#menu {
margin: auto;
background-color: #FFDEAD;
box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22);
height: 27em;
width: 40em;
}
#banner
{
margin: auto;
height: 3em;
width: 42em;
}
menu
{
margin:0;
height: 6em;
width: 37.5em;
text-align:center;
}
#video
{
margin-top: 1em;
margin-left: 7em;
}
#cat
{
float:left;
width: 8.1em;
text-align:center;
}
#dog
{
float:left;
margin-left: 8em;
width: 8.2em;
text-align:center;
}
#mau
{
float:left;
text-align:center;
width: 7.2em;
border-radius: 3px;
font-size: 0.9em;
}
#onas
{
float:left;
text-align:center;
width: 5.2em;
border-radius: 3px;
font-size: 0.9em;
}
#onas:hover {background-color: #FF8C00}
#mau:hover {background-color: #FF8C00}
#nizpre
{
margin:0;
border: 0.5px outset white;
float:left;
width: 9em;
height: 2.8em;
text-align:center;
background-color:#F4A460;
}
#nizdog
{
margin:0;
border: 0.5px outset white;
float:left;
width: 9em;
height: 2.8em;
text-align:center;
background-color:#F4A460;
}
#nizcat
{
margin:0;
border: 0.5px outset white;
float:left;
width: 9em;
height: 2.8em;
text-align:center;
background-color:#F4A460;
}
#nizvol
{
margin:0;
border: 0.5px outset white;
float:left;
width: 10.72em;
height: 2.8em;
text-align:center;
background-color:#F4A460;
}
#nizpre:hover {background-color: #D2691E}
#nizdog:hover {background-color: #D2691E}
#nizcat:hover {background-color: #D2691E}
#nizvol:hover {background-color: #D2691E}
#logo{
float:left;
width: 38em;
height:8em;
}
#topcent{
float:left;
width: 20em;
height:7.2em;
text-align:center;
font-size: 1.1em;
font-family:Times new roman;
}
#topright{
float:left;
width: 32em;
height:8em;
}
#imya{
float:left;
width: 25em;
height:4.9em;
text-align:center;
}
#textx{
float:left;
width: 42em;
height:4.44em;
text-align:center;
font-size: 1.1em;
color: #FF0000; text-shadow:1px 1px 2px white, 0 0 1em white;
font-family:Times new roman;
font-weight: bold; font-family:Times new roman; text-align:center; text-transform: uppercase;
}
#email{
float:left;
width: 18em;
height:4.9em;
font-family:Times new roman;
font-size: 1em;
padding-left: 10px;
text-align: left;
}
Приложение 2. Страница с анкетами для пользователей (doc.php, docs.css)
doc.php
<?
if (isset($_POST["mail"])){
print_r ($_POST);
$name = $_POST['name'];
$fname = $_POST['name1'];
$rdate = $_POST['age'];
$address = $_POST['adress'];
$tel = $_POST['phone'];
$mel = $_POST['state'];
$reason = $_POST['reason'];
$text = $_POST['text'];
$foto = $_POST['filename'];
$mysqli = new mysqli ("localhost", "root", "root", "pet");
$mysqli ->query("SET_NAMES 'utf8'");
$result = $mysqli ->query("INSERT INTO `anketa` (`name`, `fname`, `rdate`, `address`, `tel`, `mel`, `reason`, `text`, `foto`) VALUES ('".$name."', '".$fname."', '".$rdate."', '".$address."', '".$tel."', '".$mel."', '".$reason."', '".$text."', '".$_FILES['filename']['name']."')");
if ($result) echo('Успех!');
}
if ((is_uploaded_file($_FILES["filename"]["tmp_name"]))&&($_FILES["filename"]["size"] < 1024*20*1024)&&($_FILES["filename"]["type"] == 'image/jpeg')){
// $mysqli ->query("INSERT INTO `anketa` (`foto`) VALUES ('".$_FILES['filename']['name']."')");
move_uploaded_file
(
$_FILES["filename"]["tmp_name"],
"fanketa"."/".iconv('utf-8','cp1251',$_FILES["filename"]["name"])
);
}
//$mysqli ->close();
?>
<html>
<head>
<title>Приют для домашних животных "Лапочка"(Документы)</title>
<meta html-equiv="Content-Type" content="text/html"; charset="utf-8" />
<Link href="http://petlife/css/docs.css" rel="stylesheet" type="text/css" />
<script src="http://ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js"></script>
</head>
<body>
<header id="shapka">
<div id="logo"><a href="http://petlife/index.php"><img src="http://petlife/img/logo.png" width="20%" height="80%" align="right"></a>
</div>
<div id="topcent">
<br><br>
Адрес: г.Москва Левофортово д.15<br>
почтовый индекс: 145000<br>
тел: 8-800-000-22
</div>
<div id="topright">
</div>
</header>
<div id="vso">
<div id="menu">
<menu>
<div id="dog1"><details>
<summary>Cобаки</summary>
<p class="ron"><a href="http://petlife/doc.php" class="rin" title="Взять собаку домой">Взять собаку</a></p>
<p class="ron"><a href="http://petlife/wish.php?vid=dog&zabrali=no" class="rin" title="Свободные собаки">Каталог собак</a></p>
</details>
</div>
<div id="cat1">
<details>
<summary>Кошки</summary>
<p class="ron"><a href="http://petlife/doc.php" class="rin" title="Взять кошку домой">Взять кошку</a></p>
<p class="ron"><a href="http://petlife/wish.php?vid=cat&zabrali=no" class="rin" title="Свободные кошки">Каталог кошек</a></p>
</details>
</div>
<div id="mau">
<details>
<summary><a href="http://petlife/wish.php?zabrali=yes" class="rin" title="Счастливые питомцы нашедшие дом">Нашли дом</a></summary>
</details>
</div>
<div id="Onas">
<details>
<summary><a href="http://petlife/news.php" class="rin" title="О приюте Лапочка">О нас</a></summary>
</details>
</div>
</menu>
<h1>Что нужно чтобы взять питомца из приюта?</h1></a>
<p>Первое, что нужно сделать человеку, который хочет взять питомца – убедиться в том, что у него и его домочадцев нет аллергии на животных. Если же есть какие-то сомнения на этот счет, то лучше провериться, такие анализы можно сдать в любой лаборатории. </p><br>
<p>Затем нужно выбрать само животное – в Интернете (по фото/видео) или вживую в одном из приютов. Далее нужно связаться с куратором или с приютом, где находится животное, и начать выяснять про него конкретную информацию. </p><br>
<p>Возможно, кто-то из животных уже «запал вам в душу» по фотографии в Интернете. Тогда вы связываетесь с конкретным куратором этого питомца или с конкретным приютом, где он находится. Далее вы едете с ним знакомиться и уже за первую поездку можно понять: ваш это питомец или нет.</p><br>
<p>Важно понимать, что животные тоже нас выбирают! Часто бывают такие ситуации: люди приезжают, чтобы усыновить конкретного питомца, а уезжают с другим, потому что животное, к которому они приезжали изначально, их не выбрало. Зато им очень понравился другой четвероногий, который сразу же пошел на контакт с новыми хозяевами. Понять, кто тебе подходит, можно только вживую. </p><br>
<p>В приюте Лапочка приветствуется, когда люди приезжают на знакомство с будущим домашним питомцем не один раз, а несколько.</p><br>
<p>Животные в муниципальных приютах ничем не хуже, просто о них имеется меньше информации. Стоит приложить немного усилий, несколько раз приехать и немножко с ними познакомиться. Когда люди берут щенка, вне зависимости от того, покупают они его или берут из приюта, либо с улицы, – это всегда будет «кот в мешке».</p><br>
<p>В нашем приюте при передаче животного оформляется договор с будущим хозяином животного. В нем фиксируются данные обеих сторон, оговариваются пункты ответственного содержания животного. Мы также всегда ненавязчиво отслеживаем судьбу наших бывших подопечных. Всех наших питомцев мы лично провожаем до места их дальнейшего жительства. </p><br>
<p>Все животные разные. Кому-то сразу после приюта не требуется никакой социализации, они ведут себя так, как будто жили в вашей квартире всегда. </p><br>
<p>Безусловно, необходимо ознакомиться с соответствующей информацией, благо сейчас есть очень много статей и даже различных обучающих видеоматериалов на Youtube. Также сразу стоит озаботиться тем, чтобы у животного было свое место. Вы должны заранее подумать о том, где ему будет комфортно и при этом удобно вам.</p><br>
<p>Первые несколько недель животного в новом доме – это адаптация и социализация, поэтому нужно быть готовым к тому, что животное может ходить за вами по пятам, даже в душ. </p><br>
<p>Обязательно нужно купить шлейку – это такое приспособление вместо ошейника, к которому крепится поводок. Оно более надежно и служит для того, чтобы животное на улице не вырвалось и не побежало от вас в другую сторону, испугавшись какого-то шума.
Из разочарований я могу предположить только то, что человек переоценил свои силы. Ему сложно с животным, он оказался не готов гулять с ним, общаться, заниматься и воспитывать его. Все эти моменты лучше всего решить для себя еще до появления питомца в доме. </p><br>
<p>Нужно понимать ответственность шага, после которого человек будет отвечать не только за свою жизнь, но и за жизнь хвостатого. Если вы не готовы к этому, то, конечно, лучше никого не брать. </p><br>
<a name="volunteer">
<h1>Для связи с нашим приютом при желании взять питомца или стать волонтером нужно заполнить следующую форму:</h1>
<div id="anketa1">
<form action="" method="post" enctype="multipart/form-data"><br />
<label for="name"><p id="1a">Bведите имя: </label><input type="text" placeholder="Анна" name="name" id="name" maxlenght="25" /></p><br />
<label for="name1"><p>Bведите фамилию: </label><input type="text" placeholder="Иванова" name="name1" id="name1" maxlenght="54" /></p><br />
<label for="age"><p>Bведите дату рождения: </label><input type="date" name="age" id="age" maxlenght="4" /></p><br />
<label for="adress"><p>Bведите адрес проживания: </label><input type="text" placeholder="Моск.Обл ул.Гордон д.6" name="adress" id="adress" maxlenght="400" /></p><br />
<label for="phone"><p>Bведите номер телефона: </label><input type="tel" name="phone" id="phone" maxlenght="15" /></p><br />
<p>Выберите пол:</p><br />
<label for="m"><p>М: </label> <input type="radio" name="state" id="m" value="м" /></p>
<label for="j"><p>Ж: </label> <input type="radio" name="state" id="j" value="ж" /></p><br />
<p>Выберите причину обращения</p><br />
<p><label for="v">Стать волонтером </label> <input type="radio" name="reason" id="v" value="волонтер"/></p>
<p><label for="dog">Забрать собаку </label> <input type="radio" name="reason" id="dog" value="собака" /></p>
<p><label for="cat">Забрать кошку </label> <input type="radio" name="reason" id="cat" value="кошка" /></p>
<br />
<p><label for="filename">Приложите свое фото к анкете: </label><br /><br /><input type="file" name="filename" /></p><br />
<p><b>Расскажите о себе:</b><br /><br /><textarea name="text" ></textarea></p><br />
<p><input required type="checkbox" name="personal" id="personal" /><label for="personal">Согласен на обработку персональных данных </p></label><br />
<p><input required type="checkbox" name="personal" id="personal" /><label for="personal">Мне есть 18 лет </p></label><br />
<p><input name="mail" type="submit" value="Отправить" /></p>
</form>
</div>
</div>
</div>
<footer id="podval">
<div id="imya">
<pre>Иванова Анна СБИ-411
2020 год</pre>
</div>
<div id="textx">
<br>Помоги нашим маленьким друзьям - Возьми питомца из приюта!
</div>
<div id="email">
<img src="http://petlife/img/e-mail.png" width="10%" height="40%" align="left">
<i>lapochka-priut@mail.ru</i>
</div>
</footer>
</body>
</html>
docs.css
* {
text-decoration: none;
text-indent: 1em;
}
html
{
background-image: url('http://petlife/img/FON.jpg');
}
.rin {color: #000;
}
.ron{
font-size: 1em; font-family:Times new roman;
text-indent:0;
border-right: 0.5px solid white;
border-right: 0.5px solid white;
border-bottom: 1px dotted White;
margin:0;
float:inherit;
background-color:#F4A460;
border-radius: 3px;
}
.ron:hover {background-color: #FF8C00}
h1 {font-family:arial;}
p {
margin:0em 1em 0em 1em;
}
h1
{
font-size: 1.1em; font-family:Times new roman;
margin:1em;
}
summary
{
border: 1px outset;
background-color:#F4A460;
font-size: 1em; font-family:Times new roman;
text-indent:0;
margin:0;
float:inherit;
border-radius: 3px;
}
summary:hover {background-color: #FF8C00}
details summary::-webkit-details-marker {
display: none;
font-size: 1em;
font-family:Times new roman;
font-weight: bold; }
a {font-size: 1.1em; font-family:Times new roman; }
pre {font-size: 1.1em; font-weight: bold; font-family:Times new roman; color: black; text-indent:0;}
footer {font-size: 1.1em; }
#shapka {
margin:0;
height: 8em;
width: 98em;
}
#vso
{
height: 135em;
width: 98em;
}
#podval {
margin-left: -2em;
height: 5em;
width: 94em;
background-color: #F4A460;
}
#menu {
margin: auto;
background-color: #FFDEAD;
box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22);
height: 134em;
width: 40em;
}
#banner
{
margin: auto;
height: 3em;
width: 42em;
}
menu
{
margin:0;
height: 6em;
width: 37.5em;
text-align:center;
}
#cat1
{
float:left;
width: 8.1em;
text-align:center;
}
#dog1
{
float:left;
margin-left: 8em;
width: 8.2em;
text-align:center;
}
#mau
{
float:left;
text-align:center;
width: 7.2em;
border-radius: 3px;
font-size: 0.9em;
}
#onas
{
float:left;
text-align:center;
width: 5.2em;
border-radius: 3px;
font-size: 0.9em;
}
#onas:hover {background-color: #FF8C00}
#mau:hover {background-color: #FF8C00}
#logo{
float:left;
width: 38em;
height:8em;
}
#topcent{
float:left;
width: 20em;
height:7.2em;
text-align:center;
font-size: 1.1em;
font-family:Times new roman;
}
#topright{
float:left;
width: 32em;
height:8em;
}
#imya{
float:left;
width: 25em;
height:4.9em;
text-align:center;
}
#textx{
float:left;
width: 40em;
height:4.44em;
text-align:center;
font-size: 1.1em;
color: #FF0000; text-shadow:1px 1px 2px white, 0 0 1em white;
font-family:Times new roman;
font-weight: bold; font-family:Times new roman; text-align:center; text-transform: uppercase;
}
#email{
float:left;
width: 18em;
height:4.9em;
font-family:Times new roman;
font-size: 1em;
padding-left: 10px;
text-align: left;
}
#anketa1
{
margin: auto;
background-color: #fff;
border: 1px solid;
height: 48em;
width: 32em;
}
#1a
{
margin:1em 1em 0em 1em;
}
Приложение 4. Страница входа vhod.php, vhod css
vhod.php
<?
if (isset($_POST['mail'])){
if ($_POST['login']=='admin')
if ($_POST['parol']=='admin')
{
session_start();
$_SESSION['rules'] = 1;
header ('Location: index.php');
}
}
?>
<html>
<head>
<title>Приют для домашних животных "Лапочка"(Главная страница)</title>
<meta html-equiv="Content-Type" content="text/html"; charset="utf-8" />
<meta name="description" content="Прют Лапочка-муниципальный приют для бездомных животных в Московской области. Существует с 2019 года " />
<meta name="keywords" content="взять собаку, взять кошку, прют, питомцы" />
<Link href="css/vhod.css" rel="stylesheet" type="text/css" />
<script src="http://ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js"></script>
</head>
<body>
<header id="shapka">
<div id="logo"><img src="http://petlife/img/logo.png" width="20%" height="80%" align="right">
</div>
<div id="topcent">
<br><br>
Адрес: г.Москва Левофортово д.15<br>
почтовый индекс: 145000<br>
тел: 8-800-000-22
</div>
<div id="topright">
<?
if ($_SESSION['rules']==1){
?>
<a href="http://petlife/vhod.php"><img src="http://petlife/img/vhod.jpg" width="10%" height="40%" align="left"></a>
Выход
<?
} else
{
?>
<a href="http://petlife/vhod.php"><img src="http://petlife/img/vhod.jpg" width="10%" height="40%" align="left"></a>
Вход
<?
}
?>
</div>
</header>
<div id="vso">
<div id="menu">
<menu>
<div id="dog"><details>
<summary>Cобаки</summary>
<p class="nay"><a href="http://petlife/doc.php#dog" class="rin" title="Взять собаку домой">Взять собаку</a></p>
<p class="nay"><a href="http://petlife/wish.php?vid=dog&zabrali=no" class="rin" title="Свободные собаки">Каталог собак</a></p>
</details>
</div>
<div id="cat">
<details>
<summary>Кошки</summary>
<p class="nay"><a href="http://petlife/doc.php#cat" class="rin" title="Взять кошку домой">Взять кошку</a></p>
<p class="nay"><a href="http://petlife/wish.php?vid=cat&zabrali=no" class="rin" title="Свободные кошки">Каталог кошек</a></p>
</details>
</div>
<div id="mau">
<details>
<summary><a href="http://petlife/wish.php?zabrali=yes" class="rin" title="Счастливые питомцы нашедшие дом">Нашли дом</a></summary>
</details>
</div>
<div id="Onas">
<details>
<summary><a href="http://petlife/news.php" class="rin" title="О приюте Лапочка">О нас</a></summary>
</details>
</div>
</menu>
<div id="avtorizacia">
<br /><br /><h1>Авторизация</h1>
<form action="" method="post" enctype="multipart/form-data"><br />
<label for="login"><p>Bведите логин:   </label><input type="text" name="login" id="login" maxlenght="25" /></p><br />
<label for="parol"><p>Bведите пароль: </label><input type="password" name="parol" id="parol" maxlenght="25" /></p><br />
<center><input name="mail" type="submit" value="Войти" /></center>
</form>
<?
if (isset($_POST['mail'])){
if (($_POST['login']!='admin') or ($_POST['parol']!='admin'))
{
?>
<p>Убей себя!</p>
<?
}
}
?>
</div>
</div>
<div id="banner">
<pre id="nizpre">
<a href="http://petlife/news.php" class="rin">О приюте</a></pre>
<pre id="nizdog">
<a href="http://petlife/doc.php#dog" class="rin">Взять собаку</a></pre>
<pre id="nizcat">
<a href="http://petlife/doc.php#cat" class="rin">Взять кошку</a></pre>
<pre id="nizvol">
<a href="http://petlife/doc.php#volunteer" class="rin">Стать волонтером</a></pre>
</div>
</div>
<footer id="podval">
<div id="imya">
<pre>Иванова Анна СБИ-411
2020 год</pre>
</div>
<div id="textx">
<br>Помоги нашим маленьким друзьям - Возьми питомца из приюта!
</div>
<div id="email">
<img src="http://petlife/img/e-mail.png" width="10%" height="40%" align="left">
<i>lapochka-priut@mail.ru</i>
</div>
</footer>
</body>
</html>
vhod.css
* {
text-decoration: none;
}
html
{
background-image: url('http://petlife/img/FON.jpg');
}
.rin {color: #000;
}
h1 {font-family:arial;}
.nay {
font-size: 1em; font-family:Times new roman;
text-indent:0;
border-right: 0.5px solid white;
border-right: 0.5px solid white;
border-bottom: 1px dotted White;
margin:0;
float:inherit;
background-color:#F4A460;
border-radius: 3px;
}
.nay:hover {background-color: #FF8C00}
summary
{
border: 1px outset;
background-color:#F4A460;
font-size: 1em; font-family:Times new roman;
text-indent:0;
margin:0;
float:inherit;
border-radius: 3px;
}
summary:hover {background-color: #FF8C00}
details summary::-webkit-details-marker {
display: none;
font-size: 1em;
font-family:Times new roman;
font-weight: bold; }
a {font-size: 1.1em; font-family:Times new roman; }
pre {font-size: 1.1em; font-weight: bold; font-family:Times new roman; color: black; text-indent:0;}
footer {font-size: 1.1em; }
#shapka {
margin:0;
height: 8em;
width: 98em;
}
#vso
{
height: 34em;
width: 98em;
}
#podval {
margin-left: -2em;
height: 5em;
width: 94em;
background-color: #F4A460;
}
#menu {
margin: auto;
background-color: #FFDEAD;
box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22);
height: 27em;
width: 40em;
}
#banner
{
margin: auto;
height: 3em;
width: 42em;
}
menu
{
margin:0;
height: 6em;
width: 37.5em;
text-align:center;
}
#video
{
margin-top: 1em;
margin-left: 7em;
}
#cat
{
float:left;
width: 8.1em;
text-align:center;
}
#dog
{
float:left;
margin-left: 8em;
width: 8.2em;
text-align:center;
}
#mau
{
float:left;
text-align:center;
width: 7.2em;
border-radius: 3px;
font-size: 0.9em;
}
#onas
{
float:left;
text-align:center;
width: 5.2em;
border-radius: 3px;
font-size: 0.9em;
}
#onas:hover {background-color: #FF8C00}
#mau:hover {background-color: #FF8C00}
#nizpre
{
margin:0;
border: 0.5px outset white;
float:left;
width: 9em;
height: 2.8em;
text-align:center;
background-color:#F4A460;
}
#nizdog
{
margin:0;
border: 0.5px outset white;
float:left;
width: 9em;
height: 2.8em;
text-align:center;
background-color:#F4A460;
}
#nizcat
{
margin:0;
border: 0.5px outset white;
float:left;
width: 9em;
height: 2.8em;
text-align:center;
background-color:#F4A460;
}
#nizvol
{
margin:0;
border: 0.5px outset white;
float:left;
width: 10.72em;
height: 2.8em;
text-align:center;
background-color:#F4A460;
}
#nizpre:hover {background-color: #D2691E}
#nizdog:hover {background-color: #D2691E}
#nizcat:hover {background-color: #D2691E}
#nizvol:hover {background-color: #D2691E}
#logo{
float:left;
width: 38em;
height:8em;
}
#topcent{
float:left;
width: 20em;
height:7.2em;
text-align:center;
font-size: 1.1em;
font-family:Times new roman;
}
#topright{
float:left;
width: 32em;
height:8em;
}
#imya{
float:left;
width: 25em;
height:4.9em;
text-align:center;
}
#textx{
float:left;
width: 42em;
height:4.44em;
text-align:center;
font-size: 1.1em;
color: #FF0000; text-shadow:1px 1px 2px white, 0 0 1em white;
font-family:Times new roman;
font-weight: bold; font-family:Times new roman; text-align:center; text-transform: uppercase;
}
#email{
float:left;
width: 18em;
height:4.9em;
font-family:Times new roman;
font-size: 1em;
padding-left: 10px;
text-align: left;
}
#avtorizacia
{
margin: auto;
background-color: #fff;
box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22);
height: 15em;
width: 27em;
}
h1 {font-family:arial;}
p {
margin:0em 1em 0em 3em;
}
h1
{
font-size: 1.1em; font-family:Times new roman;
margin: 1em 2em 0em 9.5em
}
.knopka
{
text-align:center;
}
#log
{
font-size: 1em; font-family:Times new roman; color: black; text-indent:0;
}
Приложение 5. Страница с каталогом животных (wish.php) и административные инструменты (adminplus.php, delete.php, modify.php) (pet.css)
wish.php
<?
session_start();
if ($_SESSION['rules'] == "")
session_unset();
if ($_GET['logout'] == 'yes')
session_unset();
$vid = $_GET['vid'];
$zabrali = $_GET['zabrali'];
?>
<html>
<head>
<title>Приют для домашних животных "Лапочка"(Главная страница)</title>
<meta html-equiv="Content-Type" content="text/html"; charset="utf-8" />
<meta name="description" content="Прют Лапочка-муниципальный приют для бездомных животных в Московской области. Существует с 2019 года " />
<meta name="keywords" content="взять собаку, взять кошку, прют, питомцы" />
<Link href="http://petlife/css/pet.css" rel="stylesheet" type="text/css" />
<script src="http://ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js"></script>
</head>
<body>
<header id="shapka">
<div id="logo"><a href="http://petlife/index.php"><img src="http://petlife/img/logo.png" width="20%" height="80%" align="right"></a>
</div>
<div id="topcent">
<br><br>
Адрес: г.Москва Левофортово д.15<br>
почтовый индекс: 145000<br>
тел: 8-800-000-22
</div>
<div id="topright">
<?
if ($_SESSION['rules']==1){
?>
<a href="http://petlife/index.php?logout=yes"><img src="http://petlife/img/vhod.jpg" width="10%" height="40%" align="left"></a>
Выход
<?
} else
{
?>
<a href="http://petlife/vhod.php"><img src="http://petlife/img/vhod.jpg" width="10%" height="40%" align="left"></a>
Вход
<?
}
?>
</div>
</header>
<div id="vso">
<div id="menu">
<menu>
<div id="dog"><details>
<summary>Cобаки</summary>
<?
if ($_SESSION['rules'] == '')
{
?>
<p class="ron"><a href="http://petlife/doc.php" class="rin" title="Взять собаку домой">Взять собаку</a></p>
<?
}
?>
<p class="ron"><a href="http://petlife/wish.php?vid=dog&zabrali=no" class="rin" title="Свободные собаки">Каталог собак</a></p>
</details>
</div>
<div id="cat">
<details>
<summary>Кошки</summary>
<?
if ($_SESSION['rules'] == '')
{
?>
<p class="ron"><a href="http://petlife/doc.php" class="rin" title="Взять кошку домой">Взять кошку</a></p>
<?
}
?>
<p class="ron"><a href="http://petlife/wish.php?vid=cat&zabrali=no" class="rin" title="Свободные кошки">Каталог кошек</a></p>
</details>
</div>
<div id="mau">
<details>
<summary><a href="http://petlife/wish.php?zabrali=yes" class="rin" title="Счастливые питомцы нашедшие дом">Нашли дом</a></summary>
</details>
</div>
<div id="Onas">
<details>
<summary><a href="http://petlife/news.php" class="rin" title="О приюте Лапочка">О нас</a></summary>
</details>
</div>
</menu>
<?
$mysqli = new mysqli ("localhost", "root", "root", "pet");
$mysqli ->query("SET_NAMES 'utf8'");
if ($zabrali == "no")
$result = $mysqli ->query("SELECT * FROM `animal` WHERE (vidpeta LIKE '".$vid."') AND (zabrali LIKE '".$zabrali."') ORDER BY date DESC");
if ($zabrali == "yes")
$result = $mysqli ->query("SELECT * FROM `animal` WHERE (zabrali LIKE '".$zabrali."') ORDER BY date DESC");
while (($row = $result->fetch_assoc()) !=false){
$id = $row['id'];
$klichka = $row['klichka'];
$vozrast = $row['vozrast'];
$pol = $row['pol'];
$opis = $row['opis'];
$date = $row['date'];
$foto = $row['foto'];
?>
<div id="pets">
<?
if (($_SESSION['rules'] == 1) and ($_GET['zabrali'] == 'no')){
?>
<div class="plus" align="right" ><a href="http://petlife/adminplus.php?vid=<?echo ($_GET['vid']);?>" ><input type="submit" value="Добавить" /></a></div>
<?
}
?>
<div id="fpet">
<img src="http://petlife/pet/<?echo ($foto);?>" height="230px" width="200px">
</div>
<div id="opet">
<p><?echo ($klichka);?></p>
<p><?echo ($vozrast);?></p>
<p>Пол:<?echo ($pol);?></p>
<p><?echo ($opis);?></p>
<?
$date = date("d.m.Y")." ".date("H:i");
?>
<?
if ($_SESSION['rules'] == 1){
?>
<center><a href="http://petlife/modify.php?id=<? echo ($id);?>&vid=<? echo($vid);?>"><input name="typ" type="submit" value="Изменить" /></a>   <a href="http://petlife/delete.php?id=<? echo ($id);?>&vid=<? echo($vid);?>&zabrali=<? echo ($zabrali);?>"> <input name="del" type="submit" value="Удалить" /></a></center>
<?
}
?>
</div>
</div>
<?
}
?>
</div>
</div>
</div>
</body>
</html>
adminplus.php
<?
session_start();
if ($_SESSION['rules'] == "")
session_unset();
if ($_GET['logout'] == 'yes')
session_unset();
if (isset($_POST['pluspet'])){
$vidpeta = $_GET['vid'];
$klichka = $_POST['klichka'];
$vozrast = $_POST['vozrast'];
$pol = $_POST['pol'];
$opis = $_POST['opis'];
$date = date("d.m.Y")." ".date("H:i");
$foto = $_POST['foto'];
if ($_POST['zabrali'] == "on")
$zabrali = "yes";
else
$zabrali = "no";
$mysqli = new mysqli ("localhost", "root", "root", "pet");
$mysqli ->query("SET_NAMES 'utf8'");
$result = $mysqli ->query("INSERT INTO `animal` (`vidpeta`, `klichka`, `vozrast`, `pol`, `opis`, `date`, `foto`, `zabrali`) VALUES ('".$vidpeta."', '".$klichka."', '".$vozrast."', '".$pol."', '".$opis."', '".$date."', '".$_FILES['foto']['name']."', '".$zabrali."')");
}
if ((is_uploaded_file($_FILES["foto"]["tmp_name"]))&&($_FILES["foto"]["size"] < 1024*20*1024)&&($_FILES["foto"]["type"] == 'image/jpeg')){
// $mysqli ->query("INSERT INTO `anketa` (`foto`) VALUES ('".$_FILES['filename']['name']."')");
move_uploaded_file
(
$_FILES["foto"]["tmp_name"],
"pet"."/".iconv('utf-8','cp1251',$_FILES["foto"]["name"])
);
}
?>
<html>
<head>
<title>Приют для домашних животных "Лапочка"(Главная страница)</title>
<meta html-equiv="Content-Type" content="text/html"; charset="utf-8" />
<meta name="description" content="Прют Лапочка-муниципальный приют для бездомных животных в Московской области. Существует с 2019 года " />
<meta name="keywords" content="взять собаку, взять кошку, прют, питомцы" />
<Link href="http://petlife/css/pet.css" rel="stylesheet" type="text/css" />
<script src="http://ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js"></script>
</head>
<body>
<header id="shapka">
<div id="logo"><img src="http://petlife/img/logo.png" width="20%" height="80%" align="right">
</div>
<div id="topcent">
<br><br>
Адрес: г.Москва Левофортово д.15<br>
почтовый индекс: 145000<br>
тел: 8-800-000-22
</div>
<div id="topright">
<?
if ($_SESSION['rules']==1){
?>
<a href="http://petlife/index.php?logout=yes"><img src="http://petlife/img/vhod.jpg" width="10%" height="40%" align="left"></a>
Выход
<?
} else
{
?>
<a href="http://petlife/vhod.php"><img src="http://petlife/img/vhod.jpg" width="10%" height="40%" align="left"></a>
Вход
<?
}
?>
</div>
</header>
<div id="vso">
<div id="menu">
<menu>
<div id="dog"><details>
<summary>Cобаки</summary>
<?
if ($_SESSION['rules'] == '')
{
?>
<p class="ron"><a href="http://petlife/doc.php" class="rin" title="Взять собаку домой">Взять собаку</a></p>
<?
}
?>
<p class="ron"><a href="http://petlife/wish.php?vid=dog&zabrali=no" class="rin" title="Свободные собаки">Каталог собак</a></p>
</details>
</div>
<div id="cat">
<details>
<summary>Кошки</summary>
<?
if ($_SESSION['rules'] == '')
{
?>
<p class="ron"><a href="http://petlife/doc.php" class="rin" title="Взять кошку домой">Взять кошку</a></p>
<?
}
?>
<p class="ron"><a href="http://petlife/wish.php?vid=cat&zabrali=no" class="rin" title="Свободные кошки">Каталог кошек</a></p>
</details>
</div>
<div id="mau">
<details>
<summary><a href="http://petlife/wish.php?zabrali=yes" class="rin" title="Счастливые питомцы нашедшие дом">Нашли дом</a></summary>
</details>
</div>
<div id="Onas">
<details>
<summary><a href="http://petlife/news.php" class="rin" title="О приюте Лапочка">О нас</a></summary>
</details>
</div>
</menu>
<div id="letsme">
<form action="" method="post" enctype="multipart/form-data">
<p><label for="foto">Фото животного: </label><input type="file" name="foto" /><br />не более 250х250px</p>
<label for="klichka"><p>Кличка питомца: </label><input type="text" name="klichka" id="klichka" maxlenght="25" /></p>
<label for="vozrast"><p>Возраст питомца: </label><input type="text" name="vozrast" id="vozrast" maxlenght="10" /></p>
<label for="polpet"><p>Пол питомца: </label><input type="text" name="pol" id="polpet" maxlenght="30" /></p>
<p>Описание питомца: <textarea name="opis" ></textarea></p>
<p><input type="checkbox" name="zabrali" id="netu" /><label for="netu">Питомца забрали </p></label>
<input name="pluspet" type="submit" value="Добавить" />
</form>
</div>
</div>
</div>
</body>
</html>
delete.php
<?
session_start();
if ($_SESSION['rules'] == 1){
$id=$_GET['id'];
$vid=$_GET['vid'];
$zabrali=$_GET['zabrali'];
$mysqli = new mysqli ("localhost", "root", "root", "pet");
$mysqli ->query("SET_NAMES 'utf8'");
$result = $mysqli ->query("SELECT * FROM `animal` WHERE `animal`.`id` = '".$id."'");
while (($row = $result->fetch_assoc()) !=false){
$delfoto = $row['foto'];
}
unlink ("pet"."/".iconv('utf-8','cp1251',$delfoto));
$mysqli ->query("DELETE FROM `animal` WHERE `animal`.`id` = '".$id."'");
$mysqli ->close();
header ('Location: /wish.php?vid='.$vid.'&zabrali='.$zabrali);
}
?>
modify.php
<?
session_start();
if ($_SESSION['rules'] == "")
session_unset();
if ($_GET['logout'] == 'yes')
session_unset();
$id=$_GET['id'];
$vid=$_GET['vid'];
$mysqli = new mysqli ("localhost", "root", "root", "pet");
$mysqli ->query("SET_NAMES 'utf8'");
$result = $mysqli ->query("SELECT * FROM `animal` WHERE `animal`.`id` = '".$id."'");
while (($row = $result->fetch_assoc()) !=false){
$klichkaprev = $row['klichka'];
$vozrastprev = $row['vozrast'];
$polprev = $row['pol'];
$opisprev = $row['opis'];
$fotoprev = $row['foto'];
$zabraliprev = $row['zabrali'];
}
$mysqli ->close();
$klichka = $klichkaprev;
$vozrast = $vozrastprev;
$pol = $polprev;
$opis = $opisprev;
$foto = $fotoprev;
$zabrali = $zabraliprev;
if (isset ($_POST['save'])){
$klichka = $_POST['klichka'];
$vozrast = $_POST['vozrast'];
$pol = $_POST['pol'];
$opis = $_POST['opis'];
if ($_POST['zabrali'] == "on")
$zabrali = "yes";
else
$zabrali = "no";
}
?>
<html>
<head>
<title>Приют для домашних животных "Лапочка"(Главная страница)</title>
<meta html-equiv="Content-Type" content="text/html"; charset="utf-8" />
<meta name="description" content="Прют Лапочка-муниципальный приют для бездомных животных в Московской области. Существует с 2019 года " />
<meta name="keywords" content="взять собаку, взять кошку, прют, питомцы" />
<Link href="http://petlife/css/pet.css" rel="stylesheet" type="text/css" />
<script src="http://ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js"></script>
</head>
<body>
<header id="shapka">
<div id="logo"><img src="http://petlife/img/logo.png" width="20%" height="80%" align="right">
</div>
<div id="topcent">
<br><br>
Адрес: г.Москва Левофортово д.15<br>
почтовый индекс: 145000<br>
тел: 8-800-000-22
</div>
<div id="topright">
<?
if ($_SESSION['rules']==1){
?>
<a href="http://petlife/index.php?logout=yes"><img src="http://petlife/img/vhod.jpg" width="10%" height="40%" align="left"></a>
Выход
<?
} else
{
?>
<a href="http://petlife/vhod.php"><img src="http://petlife/img/vhod.jpg" width="10%" height="40%" align="left"></a>
Вход
<?
}
?>
</div>
</header>
<div id="vso">
<div id="menu">
<menu>
<div id="dog"><details>
<summary>Cобаки</summary>
<?
if ($_SESSION['rules'] == '')
{
?>
<p class="ron"><a href="http://petlife/doc.php" class="rin" title="Взять собаку домой">Взять собаку</a></p>
<?
}
?>
<p class="ron"><a href="http://petlife/wish.php?vid=dog&zabrali=no" class="rin" title="Свободные собаки">Каталог собак</a></p>
</details>
</div>
<div id="cat">
<details>
<summary>Кошки</summary>
<?
if ($_SESSION['rules'] == '')
{
?>
<p class="ron"><a href="http://petlife/doc.php" class="rin" title="Взять кошку домой">Взять кошку</a></p>
<?
}
?>
<p class="ron"><a href="http://petlife/wish.php?vid=cat&zabrali=no" class="rin" title="Свободные кошки">Каталог кошек</a></p>
</details>
</div>
<div id="mau">
<details>
<summary><a href="http://petlife/wish.php?zabrali=yes" class="rin" title="Счастливые питомцы нашедшие дом">Нашли дом</a></summary>
</details>
</div>
<div id="Onas">
<details>
<summary><a href="http://petlife/news.php" class="rin" title="О приюте Лапочка">О нас</a></summary>
</details>
</div>
</menu>
<div id="letsme">
<form action="" method="post" enctype="multipart/form-data">
<p><label for="petfoto">Фото животного: </label><input type="file" name="foto" /><br />не более 250х250px</p>
<label for="klichka"><p>Кличка питомца: </label><input type="text" name="klichka" value="<? echo ($klichka)?>" id="klichka" maxlenght="25" /></p>
<label for="vozrast"><p>Возраст питомца: </label><input type="text" name="vozrast" value="<? echo ($vozrast)?>" id="vozrast" maxlenght="10" /></p>
<label for="pol"><p>Пол питомца: </label><input type="text" name="pol" value="<? echo ($pol)?>" id="pol" maxlenght="30" /></p>
<p>Описание питомца: <textarea name="opis" ><? echo ($opis)?></textarea></p>
<p><input type="checkbox" name="zabrali" id="netu" <? if ($zabrali == "yes") echo ('checked'); ?> /><label for="netu">Питомца забрали </p></label>
<input name="save" type="submit" value="Сохранить" />
</form>
<? if (isset($_POST['save'])){
$mysqli = new mysqli ("localhost", "root", "root", "pet");
$mysqli ->query("SET_NAMES 'utf8'");
$mysqli ->query("UPDATE `animal` SET `klichka`='".$klichka."', `vozrast`='".$vozrast."', `pol`='".$pol."', `opis`='".$opis."', `zabrali`='".$zabrali."' WHERE `id`='".$id."'");
$mysqli ->close();
if ((is_uploaded_file($_FILES["foto"]["tmp_name"]))&&($_FILES["foto"]["size"] < 1024*3*1024)&&($_FILES["foto"]["type"] == 'image/jpeg')){
unlink ('pet/'.$fotoprev);
$mysqli = new mysqli ("localhost", "root", "root", "pet");
$mysqli ->query("SET_NAMES 'utf8'");
$mysqli ->query("UPDATE `animal` SET `foto`='".$_FILES['foto']['name']."' WHERE id="."'".$id."'");
$mysqli ->close();
move_uploaded_file
(
$_FILES["foto"]["tmp_name"],
"pet"."/".iconv('utf-8','cp1251',$_FILES["foto"]["name"])
);
}
?>
<?
}
?>
</div>
</div>
</div>
</body>
</html>
pet.css
* {
text-decoration: none;
}
html
{
background-image: url('http://petlife/img/FON.jpg');
}
.rin {color: #000;
}
h1 {font-family:arial;}
.ron{
font-size: 1em; font-family:Times new roman;
text-indent:0;
border-right: 0.5px solid white;
border-right: 0.5px solid white;
border-bottom: 1px dotted White;
margin:0;
float:inherit;
background-color:#F4A460;
border-radius: 3px;
}
.ron:hover {background-color: #FF8C00}
summary
{
border: 1px outset;
background-color:#F4A460;
font-size: 1em; font-family:Times new roman;
text-indent:0;
margin:0;
float:inherit;
border-radius: 3px;
}
summary:hover {background-color: #FF8C00}
details summary::-webkit-details-marker {
display: none;
font-size: 1em;
font-family:Times new roman;
font-weight: bold; }
a {font-size: 1.1em; font-family:Times new roman; }
pre {font-size: 1.1em; font-weight: bold; font-family:Times new roman; color: black; text-indent:0;}
footer {font-size: 1.1em; }
#shapka {
margin:0;
height: 8em;
width: 98em;
}
#vso
{
height: 34em;
width: 98em;
}
#podval {
margin-left: -2em;
height: 5em;
width: 94em;
background-color: #F4A460;
}
#menu {
margin: auto;
background-color: #FFDEAD;
box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22);
width: 40em;
}
#banner
{
margin: auto;
height: 3em;
width: 42em;
}
menu
{
margin:0;
height: 6em;
width: 37.5em;
text-align:center;
}
#cat
{
float:left;
width: 8.1em;
text-align:center;
}
#dog
{
float:left;
margin-left: 8em;
width: 8.2em;
text-align:center;
}
#mau
{
float:left;
text-align:center;
width: 7.2em;
border-radius: 3px;
font-size: 0.9em;
}
#onas
{
float:left;
text-align:center;
width: 5.2em;
border-radius: 3px;
font-size: 0.9em;
}
#onas:hover {background-color: #FF8C00}
#mau:hover {background-color: #FF8C00}
#nizpre
{
margin:0;
border: 0.5px outset white;
float:left;
width: 9em;
height: 2.8em;
text-align:center;
background-color:#F4A460;
}
#logo{
float:left;
width: 38em;
height:8em;
}
#topcent{
float:left;
width: 20em;
height:7.2em;
text-align:center;
font-size: 1.1em;
font-family:Times new roman;
}
#topright{
float:left;
width: 32em;
height:8em;
}
#imya{
float:left;
width: 25em;
height:4.9em;
text-align:center;
}
#textx{
float:left;
width: 42em;
height:4.44em;
text-align:center;
font-size: 1.1em;
color: #FF0000; text-shadow:1px 1px 2px white, 0 0 1em white;
font-family:Times new roman;
font-weight: bold; font-family:Times new roman; text-align:center; text-transform: uppercase;
}
#email{
float:left;
width: 18em;
height:4.9em;
font-family:Times new roman;
font-size: 1em;
padding-left: 10px;
text-align: left;
}
#pets
{
margin: 1em 0em 1em 5%;
background-color: #fff;
border: 1px solid;
height: 19em;
width: 36em;
}
#fpet
{
float:left;
margin: 0.5em 0em 0.5em 0.5em;
}
#opet
{
float:right;
width:21em;
margin: 1em 0em 0em 1em;
}
.plus
{
margin: 0.5em ;
}
#letsme
{
margin: 1em 0em 0em 5%;
background-color: #fff;
border: 1px solid;
height: 22em;
width: 36em;
text-align: center;
}
- Товарная информация: виды, средства, способы, методы
- Жизненный цикл проекта
- Маркетинговая деятельность банков по продвижению через спонсорство в спорте на примере банка ПАО ВТБ.
- Основные этапы развития инновационного проектного менеджмента
- Технологии основной и дополнительной оплаты труда персонала в различных секторах экономики
- Корпоративная культура организации и управление ее персоналом (Понятие и сущность корпоративной культуры)
- Цветопередача и сущность картины Альберта Марке «Гавань в Ментоне» (Цветопередача живописного произведения)
- Цветопередача и сущность картины Альберта Марке «Гавань в Ментоне» (ИНФОРМАЦИОННЫЙ БЛОК КАРТИНЫ)
- Колористическая, цветовая и тональная организация живописного произведения Клода Моне «Кувшинки» (Информационный блок картины)
- Анализ деятельности спортивной организации на примере Natus Vincere.
- Анализ клиентской базы ПАО «Сбербанк России»
- Управление мотивацией сотрудников на предприятиях ГиРБ (Сущность мотивационных теорий)