18.08.2016, 13:44
|
|
Профессор
|
|
Регистрация: 08.07.2016
Сообщений: 1,332
|
|
|
Короче, по-человечески надо передавать сразу все данные и пусть функция уже там рендерит из в ul li li li ul
|
|
19.08.2016, 07:47
|
|
Новичок на форуме
|
|
Регистрация: 17.08.2016
Сообщений: 9
|
|
|
Сообщение от warren buffet
|
|
передавать сразу все данные и пусть функция уже там рендерит
|
Мысль хороша, буду потом пытаться так сделать |
|
19.08.2016, 08:00
|
|
Новичок на форуме
|
|
Регистрация: 17.08.2016
Сообщений: 9
|
|
У меня снова глупый вопрос, что-то не пойму, как выводить расчет времени, определенного массива на отдельной страничке html(schedule_1_1, schedule_1_2 итд)
<!doctype html>
<html>
<head>
<title>My Page</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta http-equiv="Content-type" content="text/html; charset=utf-8">
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.4.3/jquery.mobile-1.4.3.min.css">
<script src="http://code.jquery.com/jquery-1.8.2.min.js"></script>
<script src="http://code.jquery.com/mobile/1.4.3/jquery.mobile-1.4.3.min.js"></script>
<script>
var timeBuss = {
0:['9:30','10:30','11:40','12:30','13:20','14:06'],
1:['8:04','9:55','10:35','11:44','12:30','13:50'],
2:['7:22','8:53','9:44','10:59','11:56']
}
function timerCurrentBuss(time) {
var timeBuss = time;
setInterval(currentTimeForBuss, 1000);
function currentTimeForBuss() {
var date = new Date()//Получили текущую дату
var time = {
hours: date.getHours(),
minutes: date.getMinutes(),
seconds: date.getSeconds()
}//получили часы и минуты
document.getElementById("current_time").innerHTML = ('Текущее время: ' + (time.hours + ':' + time.minutes + ':' + time.seconds));
for (var i = 0; i < timeBuss.length-1; i++) {//Цикл по массиву с расписанием
var tmp = timeBuss[i].split(':');//разбили время расписания на часы и минуты
var bussTime = {
hours: tmp[0], minutes: tmp[1]
}
tmp = timeBuss[i + 1].split(':');
var nextBussTime = {
hours: tmp[0], minutes: tmp[1]
}
if ((time.hours >= bussTime.hours && time.hours <= nextBussTime.hours)) {
var timeLeft = bussTime;
}
}
document.getElementById("nextbusleft").innerHTML = ("Осталось минут: " + (timeLeft.minutes - time.minutes))
};
}
for(var t in timeBuss)
timerCurrentBuss(timeBuss[0]);
</script>
</head>
<body>
<div data-role="page">
<div data-role="content">
<ul data-role="listview">
<li><a href="#second_page">Маршрут №1</a></li>
</ul>
</div><!-- /content -->
</div><!-- /page -->
<div data-role="page" id="second_page">
<div data-role="content">
<ul data-role="listview">
<li><a href="#busstop_1_1">Конечная 1 — Конечная 2</a></li>
<li><a href="#busstop_1_2">Конечная 2 — Конечная 1</a></li>
</ul>
</div><!-- /content -->
</div><!-- /page -->
<div data-role="page" id="busstop_1_1">
<div data-role="content">
<ul data-role="listview">
<li><a href="#schedule_1_1">Остановка 1</a></li>
<li><a href="#schedule_1_2">Остановка 2</a></li>
<li><a href="#schedule_1_3">Остановка 3</a></li>
</ul>
</div><!-- /content -->
</div><!-- /page -->
<div data-role="page" id="schedule_1_1">
<div data-role="content">
<div id="schedule">'9:30','10:30','11:40','12:30','13:20','14:06'</div>
<div id="current_time"></div>
<div id="nextbusleft"></div>
</div><!-- /content -->
</div><!-- /page -->
<div data-role="page" id="schedule_1_2">
<div data-role="content">
<div id="schedule">'8:04','9:55','10:35','11:44','12:30','13:50'</div>
<div id="current_time"></div>
<div id="nextbusleft"></div>
</div><!-- /content -->
</div><!-- /page -->
<div data-role="page" id="schedule_1_3">
<div data-role="content">
<div id="schedule">'7:22','8:53','9:44','10:59','11:56'</div>
<div id="current_time"></div>
<div id="nextbusleft"></div>
</div><!-- /content -->
</div><!-- /page -->
</body>
</html>
Последний раз редактировалось AlTiantum, 19.08.2016 в 08:28.
|
|
19.08.2016, 10:38
|
|
Профессор
|
|
Регистрация: 08.07.2016
Сообщений: 1,332
|
|
|
Отдельный массив это timeBuss[0], или timeBuss[1], или что там еще есть. По-моему тебе этого не надо делать вообще, иначе бы ты переделал свой рендер, а не запускал его в цикле затирая предыдущий результат.
|
|
19.08.2016, 10:46
|
|
Новичок на форуме
|
|
Регистрация: 17.08.2016
Сообщений: 9
|
|
|
Сообщение от warren buffet
|
|
не запускал его в цикле затирая предыдущий результат
|
Значит мне нужно передать каждый массив в цикл? |
|
19.08.2016, 11:15
|
|
Профессор
|
|
Регистрация: 08.07.2016
Сообщений: 1,332
|
|
Всякую хрень не пиши. На какой блин "отдельной страничке"? У тебя ровно одна страница тут, один html, одно body. Визуальное представление твоей страницы - неизвестно и никогда не будет известно пока вопрос не касается визуального представления. Не пиши хрень, ибо люди просто ЧИТАЮТ и понимают то, что написано.
Понял тащемта. Надо удалить текст вот этой хрени
|
Цитата:
|
|
document.getElementById("current_time").innerHTML = ('Текущее время: ' + (time.hours + ':' + time.minutes + ':' + time.seconds));
|
И заменить текст этой хрени:
|
Сообщение от AlTiantum
|
|
document.getElementById("nextbusleft").innerHTML = ("Осталось минут: " + (timeLeft.minutes - time.minutes))
|
на вот эту хрень:
document.getElementById("schedule_1_"+num).innerHTML=
'<div data-role="content">
<div>'+time.join(',')+'</div>
<div>'+'Текущее время: ' + (time.hours + ':' + time.minutes + ':' + time.seconds)+'</div>
<div>'+"Осталось минут: " + (timeLeft.minutes - time.minutes)+'</div>
</div>';
Для чего выпилить вручную прописанные контент во всех <div data-role="page" id="schedule_1_2">, поскольку он будет вставляться той функцией весь. Понял?
Последний раз редактировалось warren buffet, 19.08.2016 в 11:19.
|
|
19.08.2016, 11:19
|
|
Профессор
|
|
Регистрация: 08.07.2016
Сообщений: 1,332
|
|
PS Обрати внимание на конкатенацию идентификатора: "schedule_1_"+num - номер дива нужно передавать в функцию и он должен совпадать с тем, что написано в хтмл. Или вообще целиком рендери свои "отдельные странички" чтобы ничего не передавать и не искать.
for(var t in timeBuss)
timerCurrentBuss(timeBuss[0],t);
и в функции должно быть 2 аргумента
timerCurrentBuss(time,num)
Всю твою лапшу надо переделывать целиком. |
|
19.08.2016, 11:31
|
|
Новичок на форуме
|
|
Регистрация: 17.08.2016
Сообщений: 9
|
|
Спасибо! Начинаю понимать, извиняюсь за странички  |
|
19.08.2016, 13:24
|
|
Профессор
|
|
Регистрация: 08.07.2016
Сообщений: 1,332
|
|
У тебя и расчет ближайшего рейса - хрень. ))) Вот смотри как можно сделать эту часть:
<!DOCTYPE html>
<html lang="ru" dir="ltr">
<head>
<meta charset="utf-8">
<script>
var timeBuss = [
{num:13, tms:['9:30','10:30','11:40','12:30','13:20','14:06']},
{num:45, tms:['8:04','9:55','10:35','11:44','12:30','13:50']},
{num:1245, tms:['7:22','8:53','9:44','10:59','11:56']}
];
function renderBusSchedule() {
var date = new Date('2016-08-19T09:28:00'), /* remove test date after testing */
time = {
tt: date.getHours()+':'+date.getMinutes()+':'+date.getSeconds(),
tm: date.getMinutes()+60*date.getHours()
},
getTimeLeft=function(t){
for (var i=0; i<t.length; i++) {
var
tmp=t[i].split(':'),
tm=(+tmp[1]+60*tmp[0])-time.tm;
if (tm>0) return {tm:tm,i:i};
}
return {tm:null,i:-1};
};
for(var tms, tl, j=0; j<timeBuss.length; j++) {
tms=timeBuss[j].tms;
tl=getTimeLeft(tms);
if(tl.i>-1) /* it here since fckin js does not have variable references */
tms[tl.i]='<span style="color:red;">'+tms[tl.i]+'</span>'+', осталось минут: '+tl.tm;
document.getElementById('schedule-'+j).innerHTML=
'<div>'+
'<p>Расписание рейса № '+timeBuss[j].num+'</p>'+
'<p>'+'Сейчас: '+time.tt+'</p>'+
'<ul><li>'+tms.join('</li><li>')+'</li></ul>'+
'</div>';
}
}
</script>
</head>
<body>
<div id="schedule-0"></div>
<div id="schedule-1"></div>
<div id="schedule-2"></div>
<script>renderBusSchedule();</script>
</body>
</html>
|
|
19.08.2016, 13:31
|
|
Профессор
|
|
Регистрация: 08.07.2016
Сообщений: 1,332
|
|
|
Это если требуется, чтобы эти<div id="schedule-0"></div> уже были до скрипта - это же вроде у тебя табы? - то их надо вручную писать на странице, а иначе можно сразу рендерить и писать в общий родительский элемент, и тогда у тебя появится столько "отдельных страничек", сколько будет нарисовано рейсов в массиве timeBuss
|
|
|
|
