Делаем таблицу рекордов

Страница 1 из 3 1, 2, 3  Следующий

Перейти вниз

Делаем таблицу рекордов

Сообщение автор Pyro338 в Ср Дек 27, 2017 7:59 pm

Спрашивали - отвечаем. JavaScript - это очень хороший язык. Но его минус в том, что он исполняется в браузере. То есть если мы хотим сохранить какие-то данные и получить их потом, JS нам становится уже недостаточно. По этому умные люди придумали такую штуку как Ajax. Это такая штуковина, которая позволяет нам отправить данные на сервер и получить от сервера ответ.

Как это сделано в уроках у Сканера:

Код:

var sendData = function (params, func) {//params - параметры, которые мы передаем на сервер, func - функция обработки полученных данных
  var ajax = new XMLHttpRequest();
  ajax.open('GET', './records/records.php?' + params, true);//выполняем GET запрос
  ajax.onreadystatechange = function () {
    if (ajax.readyState == 4) {//запрос завершился, ответ получен
      if (ajax.status == 200) {//все Ок
        func(ajax.responseText);//обрабатываем полученные данные
      }
    }
  }
  ajax.send(null);
};

как это делаю я:

Код:

function sendRecordData(params, callback) {//params - параметры, которые мы передаем на сервер, callback - функция обработки полученных данных
  $.ajax({
    url    : './records/records.php?' + params,//передаем параметры серверу
    dataType: "json",//в формате json
    success : function (data) {//если 200, то
      callback(data);//обрабатываем полученные данные
    }
  });
}

собственно сто стороны Javascript'а - это все. дальше делаем с этими данными что хотим. например чтобы передать новый рекорд на сервер выполняем

Код:
var setData = function (score, name) {
  sendRecordData('score=' + score + '&name=' + encodeURI(name), function (name) {
  })
}

чтобы получить нашу табличку с данными выполняем

Код:

var getData = function (score) {
  if (!score) {
    score = 1;//почему тут единичка? да просто чтобы не было пустого значения
  }
  sendRecordData('score=' + score, function (jText) {
    for (var i = 0; i < 10; i++) {
      if (jText[i].name && jText[i].score) {
        recordText.lines[i] = jText[i].name + ' - ' + jText[i].score + ' Points';
      }
    }
    ;
  })
}

вуаля. конечно если у вас есть к чему обращаться на сервере. как-то так
avatar
Pyro338
Админ

Сообщения : 587
Дата регистрации : 2017-12-25
Возраст : 33
Откуда : Ставрополь

Посмотреть профиль http://pyro338.ru/

Вернуться к началу Перейти вниз

Re: Делаем таблицу рекордов

Сообщение автор Pyro338 в Ср Дек 27, 2017 8:03 pm

ах да. чтобы использовать вот такую запись "$.ajax({", нужно подключить библиотеку Jquery
avatar
Pyro338
Админ

Сообщения : 587
Дата регистрации : 2017-12-25
Возраст : 33
Откуда : Ставрополь

Посмотреть профиль http://pyro338.ru/

Вернуться к началу Перейти вниз

Re: Делаем таблицу рекордов

Сообщение автор Pyro338 в Ср Дек 27, 2017 8:09 pm

ну и собственно файл records.php, к которому мы обращаемся с помощью Ajax'a

Код:
<?php
ini_set('display_errors','Off');

$score = '';

if (isset($_GET['score']) && $_GET['score']) {
    $score = trim(urldecode($_GET['score']));
}

if (isset($_GET['name']) && $_GET['name']) {
    if (!$score) {
        $score = 0;
    }
    $name = urldecode($_GET['name']);
    writeToLog($score, $name);
} elseif ($score) {
    $log = getParsedLog();
    echo json_encode($log);
}

/**
 * @return array
 */
function getParsedLog()
{
    $parsed_log  = array();
    $data        = file_get_contents('log.txt');
    $data_strings = explode(PHP_EOL, $data);

    $i = 0;

    foreach ($data_strings as $string) {
        $fields                = explode('|', $string);
        $parsed_log[$i]['score']  = $fields[0];
        $formaated_text = trim($fields[1]);
        if($formaated_text != ''){
            $parsed_log[$i]['name'] = $formaated_text;
        }else{
            $parsed_log[$i]['name'] = 'Unnamed';
        }
        $i++;
    }

    return $parsed_log;
}

/**
 * @param $score  string
 * @param $name string
 *
 * @throws Exception
 */
function writeToLog($score, $name)
{
    $new_string = $score . '|' . $name . PHP_EOL;
    $got_it = false;
    $record_table = getParsedLog();
    for($i = 0; $i < 10; $i++){
      if($score >= $record_table[$i]['score'] && !$got_it){
        array_splice($record_table, $i, 0, $new_string);
        $got_it = true;
      }
      else{
        $record_table[$i] = $record_table[$i]['score']."|".$record_table[$i]['name'].PHP_EOL;
      }
    }

    if ($result = file_put_contents('log.txt', $record_table)) {
        echo('Saved');
    } else {
        throw new Exception('Error writing to file');
    }
}

я тут конечно нагородил огород, но в принципе это работает. но конечно проще и лучше все это дело писать в БД, если есть такая возможность. хранить рекорды в файликах - прошлый век например


Последний раз редактировалось: Pyro338 (Ср Дек 27, 2017 8:35 pm), всего редактировалось 1 раз(а)
avatar
Pyro338
Админ

Сообщения : 587
Дата регистрации : 2017-12-25
Возраст : 33
Откуда : Ставрополь

Посмотреть профиль http://pyro338.ru/

Вернуться к началу Перейти вниз

Re: Делаем таблицу рекордов

Сообщение автор Dessan в Ср Дек 27, 2017 8:24 pm

https://www.youtube.com/watch?v=Li6vC082mWo&t=615s
https://www.youtube.com/watch?v=YvDeQnvRIxU&t=1845s
вот похожее, а то у pyro такой php лист, что мне лично смотреть страшно)А я тоже новичок в программировании.

Dessan
Юный падаван

Сообщения : 426
Дата регистрации : 2017-12-25

Посмотреть профиль

Вернуться к началу Перейти вниз

Re: Делаем таблицу рекордов

Сообщение автор Pyro338 в Ср Дек 27, 2017 8:32 pm

мне лично смотреть страшно

мне тоже что-то стало страшно смотреть. перепишу-ка
avatar
Pyro338
Админ

Сообщения : 587
Дата регистрации : 2017-12-25
Возраст : 33
Откуда : Ставрополь

Посмотреть профиль http://pyro338.ru/

Вернуться к началу Перейти вниз

Re: Делаем таблицу рекордов

Сообщение автор Pyro338 в Ср Дек 27, 2017 9:26 pm

Даже вот: мусор убрал сейчас - вот так выглядит records.js

Код:
function sendRecordData(params) {
  $.ajax({
    url    : './records/records.php?' + params,
    dataType: "json",
    complete : function () {
      getRecordData();
    }
  });
}

function getRecordData(){
  $.ajax({
    url    : './records/records.php?score=1',
    dataType: "json",
    success : function (data) {
      for (var i = 0; i < 10; i++) {
        if (data[i].name && data[i].score) {
          recordText.lines[i] = data[i].name + ' - ' + data[i].score + ' Points';
        }
      }
    }
  });
}

var setData = function (score, name) {
  sendRecordData('score=' + score + '&name=' + encodeURI(name));
}

Можно еще проще - можно переделать records.php, чтобы он сразу в респонсе выдавал табличку рекордов, чтобы 2 раза на сервер не обращаться.

если не лень будет, то позже переделаю
avatar
Pyro338
Админ

Сообщения : 587
Дата регистрации : 2017-12-25
Возраст : 33
Откуда : Ставрополь

Посмотреть профиль http://pyro338.ru/

Вернуться к началу Перейти вниз

Re: Делаем таблицу рекордов

Сообщение автор Pyro338 в Ср Дек 27, 2017 9:28 pm

тихо сам с собою я веду беседу...
avatar
Pyro338
Админ

Сообщения : 587
Дата регистрации : 2017-12-25
Возраст : 33
Откуда : Ставрополь

Посмотреть профиль http://pyro338.ru/

Вернуться к началу Перейти вниз

Re: Делаем таблицу рекордов

Сообщение автор Dessan в Ср Дек 27, 2017 9:34 pm

js файл и так отличный был, я про php говорил))а php ему нужен, чтоб никто в код не заглядывал)

Dessan
Юный падаван

Сообщения : 426
Дата регистрации : 2017-12-25

Посмотреть профиль

Вернуться к началу Перейти вниз

Re: Делаем таблицу рекордов

Сообщение автор Pyro338 в Ср Дек 27, 2017 9:38 pm

ну спрашивайте - в какой строчке чего не понятно - объясню
avatar
Pyro338
Админ

Сообщения : 587
Дата регистрации : 2017-12-25
Возраст : 33
Откуда : Ставрополь

Посмотреть профиль http://pyro338.ru/

Вернуться к началу Перейти вниз

Re: Делаем таблицу рекордов

Сообщение автор Dessan в Ср Дек 27, 2017 9:46 pm

Лично мне после повторения уроков сканера и дударя в общем-то всё понятно в твоём коде, достаточно будет просто посмотреть как он отработает. Я больше за нашего форумчанина переживаю, который попросил помощи в этом вопросе.

Dessan
Юный падаван

Сообщения : 426
Дата регистрации : 2017-12-25

Посмотреть профиль

Вернуться к началу Перейти вниз

Re: Делаем таблицу рекордов

Сообщение автор GooodWin67 в Ср Дек 27, 2017 10:10 pm

Ну как текущую игру доделаю, вернусь в air assault и попробую туда таблицу рекордов запилить. Пока сходу мало что понял, но думаю справлюсь. Если будут вопросы, буду тут задавать.
avatar
GooodWin67

Сообщения : 94
Дата регистрации : 2017-12-27

Посмотреть профиль

Вернуться к началу Перейти вниз

Re: Делаем таблицу рекордов

Сообщение автор Pyro338 в Ср Дек 27, 2017 10:19 pm

Если будут вопросы, буду тут задавать.

оке)
avatar
Pyro338
Админ

Сообщения : 587
Дата регистрации : 2017-12-25
Возраст : 33
Откуда : Ставрополь

Посмотреть профиль http://pyro338.ru/

Вернуться к началу Перейти вниз

Re: Делаем таблицу рекордов

Сообщение автор GooodWin67 в Сб Дек 30, 2017 12:12 pm

Сходу не получается)) Итак давайте по порядку.
Вот это я вставляю до игрового цикла в свой файл game1.js?
Код:
var sendData = function (params, func) {//params - параметры, которые мы передаем на сервер, func - функция обработки полученных данных
  var ajax = new XMLHttpRequest();
  ajax.open('GET', './records/records.php?' + params, true);//выполняем GET запрос
  ajax.onreadystatechange = function () {
    if (ajax.readyState == 4) {//запрос завершился, ответ получен
      if (ajax.status == 200) {//все Ок
        func(ajax.responseText);//обрабатываем полученные данные
      }
    }
  }
  ajax.send(null);
};
var setData = function (score, name) {
  sendData('score=' + score + '&name=' + encodeURI(name), function (name) {
  })
}
И дальше в игровом цикле я выполняю функцию с параметрами?, например setData(5, 'test')

Также создаю файл records.php кидаю его в папку records?
Надо ли создавать log.txt или он сам создастся?
avatar
GooodWin67

Сообщения : 94
Дата регистрации : 2017-12-27

Посмотреть профиль

Вернуться к началу Перейти вниз

Re: Делаем таблицу рекордов

Сообщение автор GooodWin67 в Сб Дек 30, 2017 12:12 pm

Взял код сканера, так как пока не хочу jquery подцеплять, вроде как он с поинтом конфликтует
avatar
GooodWin67

Сообщения : 94
Дата регистрации : 2017-12-27

Посмотреть профиль

Вернуться к началу Перейти вниз

Re: Делаем таблицу рекордов

Сообщение автор Dessan в Сб Дек 30, 2017 12:17 pm

у сканера все видео рабочие на 100%, лог файл создастся сам

Dessan
Юный падаван

Сообщения : 426
Дата регистрации : 2017-12-25

Посмотреть профиль

Вернуться к началу Перейти вниз

Re: Делаем таблицу рекордов

Сообщение автор Pyro338 в Сб Дек 30, 2017 12:18 pm

не хочу jquery подцеплять, вроде как он с поинтом конфликтует

у меня ничего не конфликтует

Вот это я вставляю до игрового цикла в свой файл game1.js?

до или после или вообще в отдельном файле можешь запилить

Также создаю файл records.php кидаю его в папку records?
да

Надо ли создавать log.txt или он сам создастся?
я не помню - писал ли я проверку на наличие файла. вроде нет. лучше создай пустой.
avatar
Pyro338
Админ

Сообщения : 587
Дата регистрации : 2017-12-25
Возраст : 33
Откуда : Ставрополь

Посмотреть профиль http://pyro338.ru/

Вернуться к началу Перейти вниз

Re: Делаем таблицу рекордов

Сообщение автор Pyro338 в Сб Дек 30, 2017 12:21 pm

И дальше в игровом цикле я выполняю функцию с параметрами?, например setData(5, 'test')

да
avatar
Pyro338
Админ

Сообщения : 587
Дата регистрации : 2017-12-25
Возраст : 33
Откуда : Ставрополь

Посмотреть профиль http://pyro338.ru/

Вернуться к началу Перейти вниз

Re: Делаем таблицу рекордов

Сообщение автор GooodWin67 в Сб Дек 30, 2017 12:23 pm

ааа, понял проблему, код с локалки не будет работать, надо на хост залить.
avatar
GooodWin67

Сообщения : 94
Дата регистрации : 2017-12-27

Посмотреть профиль

Вернуться к началу Перейти вниз

Re: Делаем таблицу рекордов

Сообщение автор Pyro338 в Сб Дек 30, 2017 12:25 pm

код с локалки не будет работать

как минимум поставь себе денвер. самое простое. у меня например стоит виртуальная машина на vagrant и homestead, но ее ставить - те еще танцы с бубнами
avatar
Pyro338
Админ

Сообщения : 587
Дата регистрации : 2017-12-25
Возраст : 33
Откуда : Ставрополь

Посмотреть профиль http://pyro338.ru/

Вернуться к началу Перейти вниз

Re: Делаем таблицу рекордов

Сообщение автор GooodWin67 в Сб Дек 30, 2017 12:26 pm

Да, денвер конечно же стоит, я ж сайты иногда делаю)
avatar
GooodWin67

Сообщения : 94
Дата регистрации : 2017-12-27

Посмотреть профиль

Вернуться к началу Перейти вниз

Re: Делаем таблицу рекордов

Сообщение автор Pyro338 в Сб Дек 30, 2017 12:28 pm

ну вот через денвер и запускай - все должно заработать
avatar
Pyro338
Админ

Сообщения : 587
Дата регистрации : 2017-12-25
Возраст : 33
Откуда : Ставрополь

Посмотреть профиль http://pyro338.ru/

Вернуться к началу Перейти вниз

Re: Делаем таблицу рекордов

Сообщение автор GooodWin67 в Сб Дек 30, 2017 12:31 pm

Итак данные внес. В лог.тхт вот такая строчка прописалась: 5|test|Unnamed||||||||
Что за unnamed и как мне теперь ее вывести на экран.
Как я понимаю по нажатию кнопки выполняю функцию getData(score), а что за параметр score, зачем он здесь?
И когда функция сработает мне же надо как то вывести данные, то есть как я понимаю в браш запихнуть можно, но что запихивать?
avatar
GooodWin67

Сообщения : 94
Дата регистрации : 2017-12-27

Посмотреть профиль

Вернуться к началу Перейти вниз

Re: Делаем таблицу рекордов

Сообщение автор Pyro338 в Сб Дек 30, 2017 12:40 pm

score - это твое количество очков, которые ты отправляешь на сервер, чтобы php скрипт проверил - попадает ли это количество очков в десятку лучших, если да, то записал рекорд в файл и вывел таблицу рекордов, если нет, то просто вывел таблицу рекордов

как я понимаю в браш запихнуть можно, но что запихивать?

вот этот кусох кода запихивает полученные данные в браш

Код:

var getData = function (score) {
  if (!score) {
    score = 1;//почему тут единичка? да просто чтобы не было пустого значения
  }
  sendRecordData('score=' + score, function (jText) {
    for (var i = 0; i < 10; i++) {
      if (jText[i].name && jText[i].score) {
        recordText.lines[i] = jText[i].name + ' - ' + jText[i].score + ' Points';
      }
    }
    ;
  })
}

сам браш выглядит так

Код:
var recordText = {
  lines: [],
  x    : 250 * unit,
  y    : 200 * unit,
  color: "#fff",
  font : 'courier',
  size : 18,
};

и в игровом цикле при геймовере выводим

Код:
brush.drawTextLines(recordText);
avatar
Pyro338
Админ

Сообщения : 587
Дата регистрации : 2017-12-25
Возраст : 33
Откуда : Ставрополь

Посмотреть профиль http://pyro338.ru/

Вернуться к началу Перейти вниз

Re: Делаем таблицу рекордов

Сообщение автор Dessan в Сб Дек 30, 2017 12:40 pm

Можно начать с более простого. В js файле можно писать сразу:
Код:

var user_id = $(".user-id").text(); //это jquery
var ig = user_id.replace(/\D/g, "");//это я что-то там фильтровал в цифрах id

var username = $(".username").text(); //это jquery
var gfn = username.replace(/\s/g, "");//это я что-то там фильтровал в названии
$.post('http://mySiteUrl.com/db.php',{id: 3, ig: ig, gfn: gfn});

А вот php и его на сервер кидаешь:
Код:
header('Access-Control-Allow-Origin: *');
  //header('Content-Type: text/html; charset=utf-8');
  //header('Content-Type: text/html; charset=windows-1251');
//header("Content-Type: text/plain");
//header("Content-Type: text/html");

  date_default_timezone_set('Europe/Kiev');

  $in = trim(urldecode($_POST['id']));

$Smarta = ' Smarta';
$Vienna_Sky = ' Vienna_Sky';
$Liberty = ' Liberty';

if (isset($_POST['ig'])) {
//запись
if ($in == '1') $in = date ('d/m/y H:i').$Smarta;
if ($in == '2') $in = date ('d/m/y H:i').$Vienna_Sky;
if ($in == '3') $in = date ('d/m/y H:i').$Liberty;

$f = fopen ('logins.txt', 'a+');//a+ запись в конец документа
fwrite($f, $in.' > '.'has entered the system => '.urldecode($_POST['ig']).' '.urldecode($_POST['gfn'])."\n");
fclose($f);
}


Последний раз редактировалось: Dessan (Сб Дек 30, 2017 12:45 pm), всего редактировалось 1 раз(а)

Dessan
Юный падаван

Сообщения : 426
Дата регистрации : 2017-12-25

Посмотреть профиль

Вернуться к началу Перейти вниз

Re: Делаем таблицу рекордов

Сообщение автор Pyro338 в Сб Дек 30, 2017 12:42 pm

вот такая строчка прописалась: 5|test|Unnamed||||||||

в принципе все правильно прописалось. но можешь например ввести тестовые данные ручками, чтобы проще было. например

Код:
67550|Pyro339
56050|Pyro338
13800|ewgfewgwerf
2750|Pyrrrrrrro
2650|Narn
2550|edf
1650|dsc
1400|zzz
1200|Pyrrrrrrro1
1200|rrr
avatar
Pyro338
Админ

Сообщения : 587
Дата регистрации : 2017-12-25
Возраст : 33
Откуда : Ставрополь

Посмотреть профиль http://pyro338.ru/

Вернуться к началу Перейти вниз

Re: Делаем таблицу рекордов

Сообщение автор Спонсируемый контент


Спонсируемый контент


Вернуться к началу Перейти вниз

Страница 1 из 3 1, 2, 3  Следующий

Вернуться к началу

- Похожие темы

 
Права доступа к этому форуму:
Вы не можете отвечать на сообщения