Панель рейтинга для iframe приложений

Готовые уроки IFrame + ВКонтакте API
Fedya
Сообщения: 174
Зарегистрирован: 21 июл 2012, 19:56

Панель рейтинга для iframe приложений

Сообщение Fedya »

В этой статье я покажу как сделать панель рейтинга для iframe приложений.
Но в моей панели не будет никаких стилей, просто список с двумя кнопками.
Как украсить этот слайдер это уже решать вам :)

Подразумевается, что у вас есть база со статистикой, где находится аватарка, имя, фамилия, id пользователя, рейтинг.
Урок по созданию базы пользователей

Конфиг, он же файл, который будет совершать запросы к базе
main.php

Код: Выделить всё

<?phpsession_start();/*Конфиг*/    //данные от базы    $db_host="localhost";    $db_user="user";    $db_password="pass";    $db_name = "user";    $table_name = "table"; //название таблицы с данными    $row1 = 'uid'; //столбец с id пользователя    $row2 = 'image'; //столбец с ссылкой на аватарку пользователя    $row3 = 'name'; //столбец с Имя Фамилия пользователя    $row4 = 'presents'; //столбец с рейтингом        // данные приложения    $app_id = '3438138'; // id приложения    $api_secret = 'qqqqqqqqqqqqqqqqqqqqq'; // защищенный ключ приложения/*Конец конфига*/     $auth_key  = $_SESSION['auth_key']; //Высовываем из сессии auth_key    $viewer_id = $_SESSION['viewer_id']; //Высовываем из сессии viewer_id    $number = $_POST['number']; //Ловим number        $real_key = md5($app_id."_".$viewer_id."_".$api_secret);     if ($auth_key == $real_key){ //проверка            // соединение с БД        mysql_connect($db_host, $db_user, $db_password) or die (mysql_error());        mysql_select_db($db_name) or die (mysql_error());        mysql_query("SET NAMES 'utf8'");                $query = "SELECT * FROM ".$table_name." order by `".$row4."` desc limit {$number},10";        $sql = mysql_query($query);            while ($sql_data = mysql_fetch_array($sql)) {            echo "={$sql_data[$row1]}={$sql_data[$row2]}={$sql_data[$row3]}={$sql_data[$row4]}|"; //выводим в таком виде, чтобы проще было записать в массив        }    }?>
index.php

Код: Выделить всё

<?phpsession_start();$_SESSION = $_GET;  //У меня данные будут храниться в сессии.?><html><head>    <script src="http://vk.com/js/api/xd_connection.js" type="text/javascript"></script>    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>    <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script>    <script type="text/javascript" charset="utf8" >    $(document).ready(function() {        //объявляем переменные        var number = 0;        var i=0;        var details = new Array();        var newdetails = new Array();        var display = '';        //Первые 10 человек        $.post('main.php',{"number": number},function(data){ //отправляем              details = data.split('|'); //записываем в массив данные для каждого пользователя                        for (i=0;i< 10; i++) {                newdetails = details[i].split('='); //разделяем данные в массиве для каждого пользователя                display += "<img src='" + newdetails[2] + "'>" + " ID: " + newdetails[1] +  " Name: " + newdetails[3] + " Level: " + newdetails[4] + "<br>"; // и сразу записываем эти данные            }                    $("#ratingbox").html(display); //выводим            display = '';        });                //По нажатию кнопки 'Вперед' посылаем запрос        $("#next").click(function() {            number = number + 10;   //увеличиваем в запросе значение LIMIT            $.post('main.php',{"number": number},function(data){ //отправляем это значение                details = data.split('|');  //опять разделяем данные                            for (i=0;i< 10; i++) {                    newdetails = details[i].split('=');                    display += "<img src='" + newdetails[2] + "'>" + " ID: " + newdetails[1] +  " Name: " + newdetails[3] + " Level: " + newdetails[4] + "<br>";                }                        $("#ratingbox").html(display);                display = '';            });            $("#back").css('display', 'block'); //после нажатии кнопки 'Вперед' можно и кнопку назад показать :)        });                // тоже самое, что при нажатии на кнопкю 'Вперед', только добавили проверку, чтобы LIMIT в минус не ушел.        $("#back").click(function() {            if(number >= 10)            {                number = number - 10;                $.post('main.php',                {"number": number},                function(data){                     details = data.split('|');                                for (i=0;i< 10; i++) {                        newdetails = details[i].split('=');                        display += "<img src='" + newdetails[2] + "'>" + " ID: " + newdetails[1] +  " Name: " + newdetails[3] + " Level: " + newdetails[4] + "<br>";                    }                            $("#ratingbox").html(display);                    display = '';                });            }            if(number < 10)            {                $("#back").css('display', 'none'); //если вернулись на первую страницу, то убираем кнопку 'Назад'.            }        });    });    </script></head><body>    <div id="ratingbox"></div>    <div id="next">Вперед</div>    <div id="back" style='display:none;'>Назад</div></body></html>
Посмотреть, что получится можно здесь http://vk.com/app3438138
Исходники http://rghost.ru/43915517
Грачик
Сообщения: 162
Зарегистрирован: 08 фев 2013, 16:04

Re: Панель рейтинга для iframe приложений

Сообщение Грачик »

Спосибо огоромное щяс попробую)
Грачик
Сообщения: 162
Зарегистрирован: 08 фев 2013, 16:04

Re: Панель рейтинга для iframe приложений

Сообщение Грачик »

так стоп я создал эти 2 файла кинул их на хост и что дольше?)))
Fedya
Сообщения: 174
Зарегистрирован: 21 июл 2012, 19:56

Re: Панель рейтинга для iframe приложений

Сообщение Fedya »

Надо заполнить файл main.php сначала

Создайте сначала новое приложение, добейтесь, чтобы оно заработало должным образом, а потом уже думайте как в свое впихнуть
Грачик
Сообщения: 162
Зарегистрирован: 08 фев 2013, 16:04

Re: Панель рейтинга для iframe приложений

Сообщение Грачик »

Fedya писал(а):Надо заполнить файл main.php сначала

Создайте сначала новое приложение, добейтесь, чтобы оно заработало должным образом, а потом уже думайте как в свое впихнуть
так у меня игра уже стоит уже на index.html

как я могу туда пихнуть php ???
Fedya
Сообщения: 174
Зарегистрирован: 21 июл 2012, 19:56

Re: Панель рейтинга для iframe приложений

Сообщение Fedya »

Сменить расширение фала на php
Грачик
Сообщения: 162
Зарегистрирован: 08 фев 2013, 16:04

Re: Панель рейтинга для iframe приложений

Сообщение Грачик »

Fedya писал(а):Сменить расширение фала на php
так содержимое файла html как себя поведёт?
ZEBC
Сообщения: 100
Зарегистрирован: 21 июн 2012, 06:42

Re: Панель рейтинга для iframe приложений

Сообщение ZEBC »

Грачик
Тут все просто даже код закоментирован а вы 2 фаила сделать неможите :lol:
Serge
WEB Team
WEB Team
Сообщения: 520
Зарегистрирован: 04 мар 2011, 21:55

Re: Панель рейтинга для iframe приложений

Сообщение Serge »

Как-то грустно писать и html и php в одном файле.
Есть более красивые и удобные методы решения этой задачи...
Грачик
Сообщения: 162
Зарегистрирован: 08 фев 2013, 16:04

Re: Панель рейтинга для iframe приложений

Сообщение Грачик »

Serge писал(а):Как-то грустно писать и html и php в одном файле.
Есть более красивые и удобные методы решения этой задачи...
к примеру?
Ответить