Javascript-форум (https://javascript.ru/forum/)
-   Общие вопросы Javascript (https://javascript.ru/forum/misc/)
-   -   веб морда машинки (https://javascript.ru/forum/misc/28523-veb-morda-mashinki.html)

berkut 23.05.2012 09:51

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

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>ROBOT</title>
<link rel="stylesheet" type="text/css" href="res/main.css"/>
<script type="text/javascript">
var lastTurn = -1;
var lastPress = -1;
var lastPos = -1;

function submitUART(uartString)
{
document.getElementById('serialData').value=uartSt ring+"\n";
document.getElementById('serialForm').submit()
};

function scrollCam(val)
{
document.getElementById("scr").parentNode.scrollLe ft=val;
};
window.setInterval(
function(){
var pos = document.getElementById("scr").parentNode.scrollLe ft;
if(lastPos!=pos){
submitUART("#9 P" +(pos + 700));
lastPos=pos;
};
},100
);

</pre>
<table>

<tr>
<td>
<br/>
Camera control:<br>
<div style="width:320px;height: 20px;margin-top: 15px;overflow-x: scroll;display: inline-block;"onscroll="scrollCam(this.scrollLeft)">
<div id="scr" style="width:1920px;height: 1px;display: block;" ></div>

</div>
</td>
</tr>
<tr>
<td>
</body>
</html>

vadim5june 23.05.2012 19:14

А подробней можешь рассказать?
в том виде как написана программа не может работать
вместо </pre> должен быть </script>
где второй ползунок рядом или внизу?

berkut 25.05.2012 08:44

Я накосячил код такой:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>ROBOT</title>
<link rel="stylesheet" type="text/css" href="res/main.css"/>
<script type="text/javascript">
var lastTurn = -1;
var lastPress = -1;
var lastPos = -1;

function submitUART(uartString)
{
document.getElementById('serialData').value=uartSt ring+"\n";
document.getElementById('serialForm').submit()
};

function scrollCam(val)
{
document.getElementById("scr").parentNode.scrollLe ft=val;
};
window.setInterval(
function(){
var pos = document.getElementById("scr").parentNode.scrollLe ft;
if(lastPos!=pos){
submitUART("#9 P" +(pos + 700));
lastPos=pos;
};
},100
);

</script>
</head>

<tr>
<td>
<br/>
Camera control:<br>
<div style="width:320px;height: 20px;margin-top: 15px;overflow-x: scroll;display: inline-block;"onscroll="scrollCam(this.scrollLeft)">
<div id="scr" style="width:1920px;height: 1px;display: block;" ></div>
</div>
</td>
</tr>
<tr>
<td>
</body>
</html>

второго ползунка нет в скрипте, его хоть куда можно воткнуть, смысл в том , чтобы второй ползунок отправлял данные не на #9 серву (9-ая серва) а дапустим на 2-ю серву т.е (#2)

berkut 25.05.2012 10:12

Есть машинка, управляется она с веб страницы через UART, ког который я привел пиал не я а ребята с форума, я хочу его доработать а именно добавить еже ползунок или несколько ползунков для управления сервоприводами. Я пробывал сам код править но не получается.

Значит Двигая этим ползунком:
<div style="width:320px;height: 20px;margin-top: 15px;overflow-x: scroll;display: inline-block;"onscroll="scrollCam(this.scrollLeft)">
<div id="scr" style="width:1920px;height: 1px;display: block;" ></div>
Я отправляю команды на девятую серву т.е. сюда:
window.setInterval(
function(){
var pos = document.getElementById("scr").parentNode.scrollLe ft;
if(lastPos!=pos){
submitUART("#9 P" +(pos + 700));
lastPos=pos;

Вооот.... я хочу добавить еще одни ползунок: но чтобы управлять не девятой сервой а дапустим второй......??? как??? я не знаю...

vadim5june 25.05.2012 11:03

Мне сама идея нравится-хотел себе что то подобное сделать
Подробности интересуют как сделана сама связь с серваками-на блютуз или вайфай или еще как
со скриптом помогу-он простой
но нужен еще один файл
там есть ссылка на таблицу стилей
res/main.css
вот это файл если он есть тоже выложи
кроме того там в скрипте есть ссылки на несуществующие элементы
с id 'serialData' и 'serialForm'-это что то связанное непосредственно сервоприводами
где эти элементы?

vadim5june 25.05.2012 12:17

Пока вот в таком состоянии-можно лобавить любое кол-во ползунков
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>ROBOT</title>
<link rel="stylesheet" type="text/css" href="res/main.css"/>
</head>
<table>
<tr>
<td>
Camera control:9<br>
<div style="width:320px;height: 20px;margin-top: 15px;overflow-x: 
scroll;display: inline-block;"  onscroll="scrollCam(this)">
<div id="9" style="width:1920px;height:1px;display: block;" ></div>
</div>
</td></tr><tr><td>
Camera control:2<br>
<div style="width:320px;height: 20px;margin-top: 15px;overflow-x: 
scroll;display: inline-block;" onscroll="scrollCam(this)">
<div id="2"  style="width:1920px;height: 1px;display: block;" ></div>
</div>
</td>
</tr>
</tab>
<div id='vv'></div>
<script type="text/javascript">
var lastTurn = -1;
var lastPress = -1;
var lastPos = {};
lastPos[9]=-1;
var teks=9;//текущий сервопривод
function submitUART(uartString)
{document.getElementById('vv').innerHTML=
uartString;
};
function scrollCam(el)
{ var el1=el.getElementsByTagName('div')[0];
teks=el1.id;
el.parentNode.scrollLeft=
el.scrollLeft;
};
window.setInterval(
function(){
var pos = document.getElementById(teks).parentNode.scrollLeft;
if(lastPos[teks]!=pos){
submitUART("#"+teks+" P" +(pos + 700));
lastPos[teks]=pos;
};
},100
);
</script>
</body>
</html>

berkut 25.05.2012 12:36

Вложений: 1
http://roboforum.ru/forum69/topic10929.html - обсуждение проекта, там есть все что нужно.
Идея в том, что прошивается роутер прошивкой OR далеее роутер подключается к платам OpenRobotic и к ним уже моторы сервы и датчики... Сам роутер конектится по вафле к домашней точке доступа там ip маршрут прописываеш и зная ip заходиш через инет на роутер робота и рулиш... Как то так)))

serialData' и 'serialForm я не знаю что это такое))) они с сервами не связаны..

Я по простому скажу когда ползунок передвигаеш, значение ползунка получается разное дапустим как пример 1000. Эта тысяча подставляется в этот код submitUART("#9 P" +(pos + 700)); и что получается 1700!?
А дальше формируется пасылка в порт UART (#9 1700) - означает что серва №9 перейдет в это (1700) положение.

vadim5june 25.05.2012 13:08

Цитата:

Сообщение от berkut (Сообщение 176517)

serialData' и 'serialForm я не знаю что это такое))) они с сервами не связаны..

Именно через них связь осуществляется как то
Код в таком виде неработоспособный потому что не хватает элементов связи с серверами
а функция submitUART пока что ничего не делает хотя должна передавать данные в какую то форму-которой здесь нет-а из этой формы уже на сервоприводы
zip что то не распаковывается

berkut 25.05.2012 13:13

вот веб морда целиком
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>OR-WIFI-ROBOT</title>
<link rel="stylesheet" type="text/css" href="res/main.css"/>
<script type="text/javascript">
var lastTurn = -1;
var lastPress = -1;
var lastPos = -1;

function submitUART(uartString)
{
document.getElementById('serialData').value=uartSt ring+"\n";
document.getElementById('serialForm').submit()
};

function scrollCam(val)
{
document.getElementById("scr").parentNode.scrollLe ft=val;
};

function keyPressed(e)
{
var keynum
var keychar
var numcheck

if(window.event) // IE
{
keynum = e.keyCode
}
else if(e.which) // Netscape/Firefox/Opera
{
keynum = e.which
}
keychar = String.fromCharCode(keynum);
if(keychar == "w" || keychar == "ц" || keychar == "W" || keychar == "Ц") submitUART("DrvLR=100,100");
if(keychar == "a" || keychar == "ф" || keychar == "A" || keychar == "Ф") submitUART("DrvLR=-100,100");
if(keychar == "s" || keychar == "ы" || keychar == "S" || keychar == "Ы") submitUART("DrvLR=-100,-100");
if(keychar == "d" || keychar == "в" || keychar == "D" || keychar == "В") submitUART("DrvLR=100,-100");
return true;
};

function keyUp(e)
{
var keynum
var keychar
var numcheck

if(window.event) // IE
{
keynum = e.keyCode
}
else if(e.which) // Netscape/Firefox/Opera
{
keynum = e.which
}
keychar = String.fromCharCode(keynum);
if(keychar == "w" || keychar == "ц" || keychar == "W" || keychar == "Ц") submitUART("DrvLR=0,0");
if(keychar == "a" || keychar == "ф" || keychar == "A" || keychar == "Ф") submitUART("DrvLR=0,0");
if(keychar == "s" || keychar == "ы" || keychar == "S" || keychar == "Ы") submitUART("DrvLR=0,0");
if(keychar == "d" || keychar == "в" || keychar == "D" || keychar == "В") submitUART("DrvLR=0,0");
return true;
};

window.setInterval(
function(){
var pos = document.getElementById("scr").parentNode.scrollLe ft;
if(lastPos!=pos){
submitUART("#9 P" +(pos + 700));
lastPos=pos;
};
},100
);

</script>
</head>
<body onKeyPress="return keyPressed(event)" onKeyUp="keyUp(event)">
<pre class="banner">
************************************************** ******************************************
* ____ ____ __ __ _ *
* / __ \____ ___ ____ / __ \____ / /_ ____ / /_(_)__________ _______ __ *
* / / / / __ \/ _ \/ __ \______/ /_/ / __ \/ __ \/ __ \/ __/ // ___/ ___/ / ___/ / / / *
* / /_/ / /_/ / __/ / / /_____/ _, _/ /_/ / /_/ / /_/ / /_/ // /__(__ )_ / / / /_/ / *
* \____/ .___/\___/_/ /_/ /_/ |_|\____/_.___/\____/\__/_/ \___/____/(_)_/ \__,_/ *
* /_/ *
* *
************************************************** ******************************************
</pre>
<table>

<tr>
<td>
<script type="text/javascript">
document.write("<img alt='Robot Eye' class='bot-eye' src='http://" + document.location.host + ":8080/?action=stream'/>")
</script>
<br/>
Camera control:<br>
<button type="button" onclick="scrollCam(0)">Left</button>
<button type="button" onclick="scrollCam(800)">Center</button>
<button type="button" onclick="scrollCam(1600)">Right</button>
<br/>
<div style="width:320px;height: 20px;margin-top: 15px;overflow-x: scroll;display: inline-block;"
onscroll="scrollCam(this.scrollLeft)">
<div id="scr" style="width:1920px;height: 1px;display: block;" ></div>
</div>
</td>
</tr>
<tr>
<td>
<hr style="width: 240px;margin-top: 15px">
Chassis control:<br>
<button type="button" onclick="submitUART('DrvLR=100,100')">Forward</button><br>
<button type="button" onclick="submitUART('DrvLR=-100,100')">Left</button>
<button type="button" onclick="submitUART('DrvLR=0,0')">STOP</button>
<button type="button" onclick="submitUART('DrvLR=100,-100')">Right</button><br>
<button type="button" onclick="submitUART('DrvLR=-100,-100')">Backward</button>
</td>
</tr>
<tr>
<td>
<hr style="width: 240px;margin-top: 15px">
<form id="serialForm" action="/cgi-bin/serial.cgi" method="POST" target="hidden">
<label>Serial data:<br/>
<textarea id="serialData" name="SERIAL_DATA" rows="2" cols="40">TEST SERIAL</textarea>
</label><br/>
<input type="submit" value="Send">
</form>
</td>
</tr>
</table>
<hr/>
<iframe name="hidden" src="/nothing.html" style="width: 1px;height: 1px;visibility: hidden"></iframe>
<a href="admin/index.html">Robot administration</a>
</body>
</html>

berkut 25.05.2012 13:20

вот что в файле main:
.bot-eye {
background-color: yellow;
width: 320px;
height: 240px;
border: black dashed 10px;
margin-bottom: 15px
}

.banner {
background-color: #A0a0a0;
text-align: center;
}

td {
text-align: center;
}
table{width: 100%}

.admin-title {
font-size: 150%;
font-weight: bold;
background-color: #600000;
color: #d0d0d0
}

.form-title {
text-align: right;
width: 40%
}

.form-value {
text-align: left;
}

.controlRow TD {
border-bottom: 1px solid #a9a9a9
}

vadim5june 25.05.2012 13:54

ну вот здесь все есть что надо
сейчас работает?

berkut 25.05.2012 15:01

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

vadim5june 25.05.2012 15:12

вот попробуй-чтобы скопировать в буфер справа кнопка есть
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>OR-WIFI-ROBOT</title>
<link rel="stylesheet" type="text/css" href="res/main.css"/>
<script type="text/javascript">
var lastTurn = -1;
var lastPress = -1;
var lastPos = {};
lastPos[9]=-1;
var teks=9;//текущий сервопривод
function submitUART(uartString)
{
document.getElementById('serialData').value=uartString+"\n";
document.getElementById('serialForm').submit()
};

function scrollCam(el,l)
{var el1;if(l!=undefined){el1=document.getElementById(teks);el1.parentNode.scrollLeft=l;}else
{el1=el.getElementsByTagName('div')[0];
teks=el1.id;};
};

function keyPressed(e)
{
var keynum
var keychar
var numcheck

if(window.event) // IE
{
keynum = e.keyCode
}
else if(e.which) 
{
keynum = e.which
}
keychar = String.fromCharCode(keynum);
if(keychar == "w" || keychar == "ц" || keychar == "W" || keychar == "Ц") submitUART("DrvLR=100,100");
if(keychar == "a" || keychar == "ф" || keychar == "A" || keychar == "Ф") submitUART("DrvLR=-100,100");
if(keychar == "s" || keychar == "ы" || keychar == "S" || keychar == "Ы") submitUART("DrvLR=-100,-100");
if(keychar == "d" || keychar == "в" || keychar == "D" || keychar == "В") submitUART("DrvLR=100,-100");
return true;
};

function keyUp(e)
{
var keynum
var keychar
var numcheck

if(window.event) // IE
{
keynum = e.keyCode
}
else if(e.which) 
{
keynum = e.which
}
keychar = String.fromCharCode(keynum);
if(keychar == "w" || keychar == "ц" || keychar == "W" || keychar == "Ц") submitUART("DrvLR=0,0");
if(keychar == "a" || keychar == "ф" || keychar == "A" || keychar == "Ф") submitUART("DrvLR=0,0");
if(keychar == "s" || keychar == "ы" || keychar == "S" || keychar == "Ы") submitUART("DrvLR=0,0");
if(keychar == "d" || keychar == "в" || keychar == "D" || keychar == "В") submitUART("DrvLR=0,0");
return true;
};

window.setInterval(
function(){
var pos = document.getElementById(teks).parentNode.scrollLeft;
if(lastPos[teks]!=pos){
submitUART("#"+teks+" P" +(pos + 700));
lastPos[teks]=pos;
};
},100
);

</script>
</head>
<body onKeyPress="return keyPressed(event)" onKeyUp="keyUp(event)">
<pre class="banner">
************************************************** ******************************************
* ____ ____ __ __ _ *
* / __ \____ ___ ____ / __ \____ / /_ ____ / /_(_)__________ _______ __ *
* / / / / __ \/ _ \/ __ \______/ /_/ / __ \/ __ \/ __ \/ __/ // ___/ ___/ / ___/ / / / *
* / /_/ / /_/ / __/ / / /_____/ _, _/ /_/ / /_/ / /_/ / /_/ // /__(__ )_ / / / /_/ / *
* \____/ .___/\___/_/ /_/ /_/ |_|\____/_.___/\____/\__/_/ \___/____/(_)_/ \__,_/ *
* /_/ *
* *
************************************************** ******************************************
</pre>
<table>
<tr>
<td>
<script type="text/javascript">
document.write("<img alt='RobotEye' class='bot-eye' src='http://" + document.location.host + ":8080/?action=stream'/>")
</script>
<br/>
Camera control:<br>
<button type="button" onclick="scrollCam(1,0)">Left</button>
<button type="button" onclick="scrollCam(1,800)">Center</button>
<button type="button" onclick="scrollCam(1,1600)">Right</button>
<br/>
</td>
</tr>
<tr>
<td>
<div style="width:320px;height: 20px;margin-top: 15px;overflow-x: scroll;display: inline-block;"
onscroll="scrollCam(this)">
<div id="9" style="width:1920px;height: 1px;display:block;" ></div>
</div>
</td>
</tr>
<tr>
<td>
<div style="width:320px;height: 20px;margin-top: 15px;overflow-x: scroll;display: inline-block;"
onscroll="scrollCam(this)">
<div id="2" style="width:1920px;height: 1px;display:block;" ></div>
</td>
</tr>
<tr>
<td>
<hr style="width: 240px;margin-top: 15px">
Chassis control:<br>
<button type="button" onclick="submitUART('DrvLR=100,100')">Forward</button><br>
<button type="button" onclick="submitUART('DrvLR=-100,100')">Left</button>
<button type="button" onclick="submitUART('DrvLR=0,0')">STOP</button>
<button type="button" onclick="submitUART('DrvLR=100,-100')">Right</button><br>
<button type="button" onclick="submitUART('DrvLR=-100,-100')">Backward</button>
</td>
</tr>
<tr>
<td>
<hr style="width: 240px;margin-top: 15px">
<form id="serialForm" action="/cgi-bin/serial.cgi" method="POST" target="hidden">
<label>Serial data:<br/>
<textarea id="serialData" name="SERIAL_DATA" rows="2" cols="40">TEST SERIAL</textarea>
</label><br/>
<input type="submit" value="Send">
</form>
</td>
</tr>
</table>
<hr/>
<iframe name="hidden" src="/nothing.html" style="width: 1px;height: 1px;visibility: hidden"></iframe>
<a href="admin/index.html">Robot administration</a>
</body>
</html>

berkut 25.05.2012 15:27

Спасибо большое. Ты мне очень помог. Работает :)
Можно еще вопрос....... можно ли ползунками управлять с кнопок?

vadim5june 25.05.2012 15:33

Цитата:

Сообщение от berkut (Сообщение 176566)
Спасибо большое. Ты мне очень помог. Работает :)
Можно еще вопрос....... можно ли ползунками управлять с кнопок?

Если надо ползунков добавить то это просто
с кнопок каких?с клавиатуры?

berkut 25.05.2012 15:34

Дружище, блин спасибо!!!!!! Работает же)))) Радуюсь как ребенок )))

berkut 25.05.2012 15:36

да с клавиатуры, допустим (стрелки)

vadim5june 25.05.2012 15:39

Цитата:

Сообщение от berkut (Сообщение 176572)
да с клавиатуры, допустим (стрелки)

можно конечно-там есть какоето управление-попробуй клавиши w a s d-соответственно русские ц-ф-ы-в если неработают завтра разберусь что они должны делать-сегодня занят-

berkut 25.05.2012 15:43

Цитата:

Сообщение от vadim5june (Сообщение 176573)
можно конечно-там есть какоето управление-попробуй клавиши w a s d-соответственно русские ц-ф-ы-в если неработают завтра разберусь что они должны делать-сегодня занят-

w a s d я сам добавил, они управляют движением робота....с ними все ясно. А вот ползунками управлять с кнопок попробывать бы :). Я понял тебя, спасибо еще раз!!!!

vadim5june 25.05.2012 15:52

Цитата:

Сообщение от berkut (Сообщение 176575)
w a s d я сам добавил, они управляют движением робота....с ними все ясно. А вот ползунками управлять с кнопок попробывать бы :).

собственно кнопки какие нужно вправо влево-это ползунок вправо влево а еще?Как то еще надо сервоприводы переключать.9 или 2-можно просто набирать 2 или 9
Раз ты добавлял уже клавиши то эти добавь а код функции для них я завтра напишу

berkut 25.05.2012 16:14

Как я себе пердставляю это - дапустим стрелка в "лево и право" она управляет 9 сервой и держа ту или иную стрелку она будет перемещать ползунок равномерно до конца (а не так что нажал она переместилась на какоето значение и все, нужно снова нажимать чтобы на следующее значение переместилось). А стрелки "вверх и вниз" управляет 2 сервой и аналогично .......
Можно конечно и с переключением ползунков, как ты предложил....

Я сам попробую конечно тоже :)

berkut 25.05.2012 16:25

Если ентересно я могу фотки сделать... посмотриш как само железо у меня сделано.

vadim5june 25.05.2012 16:42

Цитата:

Сообщение от berkut (Сообщение 176588)
Если ентересно я могу фотки сделать... посмотриш как само железо у меня сделано.

Да сделай фото или видео-меня интересует
продумай как удобней клавишами будет работать-сделать это несложно

vadim5june 25.05.2012 18:59

Цитата:

Сообщение от berkut (Сообщение 176586)
Как я себе пердставляю это - дапустим стрелка в "лево и право" она управляет 9 сервой и держа ту или иную стрелку она будет перемещать ползунок равномерно до конца (а не так что нажал она переместилась на какоето значение и все, нужно снова нажимать чтобы на следующее значение переместилось). А стрелки "вверх и вниз" управляет 2 сервой и аналогично .......

Если не в курсе как это делается то вот код-нажимай клавиши вправо влево
<script>
var b=1;
var ent_press=0;
var a=100;
window.onkeydown = function(event){
  events = event || window.event;if(events.keyCode==37){b=-1;ent_press=1}else if(events.keyCode==39){b=1;  ent_press = 1};
  };
window.onkeyup = function(){
  ent_press = 0;
  };
function process(){  if (!ent_press) return;
 a+=b;document.getElementById('d1').innerHTML=a;  };
setInterval(process,100);
</script>
<div id=d1></div>

Deff 25.05.2012 19:26

:) Проще наверно два узких div блока со скроллом и отслеживать/задавать
скролл одного и второго
скролл div(ы) можно делать как горизонтальными так и ветикальными, оформление в большинстве браузеров (кроме Оперы - хотя в последней не знаю) скроллблоков можно сделать любым

vadim5june 25.05.2012 20:02

Цитата:

Сообщение от Deff (Сообщение 176609)
:) Проще наверно два узких div блока со скроллом и отслеживать/задавать
скролл одного и второго
скролл div(ы) можно делать как горизонтальными так и ветикальными, оформление в большинстве браузеров (кроме Оперы - хотя в последней не знаю) скроллблоков можно сделать любым

Сейчас так и сделано скроллы на дивах-но он говорит что клавишами клавиатуры будет удобней

berkut 27.05.2012 20:14

заснял. первый раз делаю видео, не серчайте сильно http://www.youtube.com/watch?v=W_OM5...ature=youtu.be

vadim5june 27.05.2012 20:47

Посмотрел-нормально--только я думал он будет ехать а там еще не все у тебя пришло-я так понимаю и до того что он поедет еще пройдет время-ну эту часть с веб интерфейсом мы сделаем

vadim5june 28.05.2012 11:04

Cервоприводы двигают камеру-один вправо-влево а другой вверх-вниз?

berkut 28.05.2012 11:42

Да именно так.

vadim5june 28.05.2012 11:51

Цитата:

Сообщение от berkut (Сообщение 177104)
Да именно так.

Ты определился что еще нужно сделать
на клавиши перейти оставив ползунки или без них
может еще чтото изменить-сегодня-завтра сделаю
кстати когда сервоприводы должны прийти?

berkut 28.05.2012 12:04

Думаю стоит оставить ползунки + управление с клавиш, дело в том что если управлять с планшета то сам понимаеш там клавы нет :). Пока достаточно двух ползунков для камеры.
В дальнейшем планирую еще добавить ползунки (хочу манипулятор туда поставить).
Сервы придут на этой недели я думаю....

Еще хотел спросить код, для переворачивания ползунка вертикально?

vadim5june 28.05.2012 12:12

Цитата:

Сообщение от berkut (Сообщение 177108)
Еще хотел спросить код, для переворачивания ползунка вертикально?

ты хочешь повернуть один вертикально?
этот код слегка переделать наверно-
это я сделаю-сегодня вечером начну сегодня завтра скину тебе
больше ничего?

berkut 28.05.2012 12:14

Да нет, больше ни чего. Спасибо большое.

vadim5june 28.05.2012 12:14

Цитата:

Сообщение от berkut (Сообщение 177108)
В дальнейшем планирую еще добавить ползунки (хочу манипулятор туда поставить).

А что он будет делать?
что то грузить что ли
Ползунки добавляются просто

berkut 28.05.2012 12:15

да хочу повернуть один вертикально рядом с окном от камеры его поставить и один внизу

vadim5june 28.05.2012 12:16

Цитата:

Сообщение от berkut (Сообщение 177112)
Да нет, больше ни чего. Спасибо большое.

Чистый энтузиазм-меня такие вещи всегда интересовали-подумаю может себе сделаю-а роутер ты уже прошил?

berkut 28.05.2012 12:17

Цитата:

Сообщение от vadim5june (Сообщение 177113)
А что он будет делать?
что то грузить что ли
Ползунки добавляются просто

Хотябы грузить :))

berkut 28.05.2012 12:18

Роутер прошил конечно.

vadim5june 28.05.2012 18:30

попробуй с клавишами
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>OR-WIFI-ROBOT</title>
<link rel="stylesheet" type="text/css" 
href="res/main.css"/>
<script type="text/javascript">
var speed=10;
var tspeed=10;
var ent_press=0;
var lastTurn = -1;
var lastPress = -1;
var lastPos = {};
lastPos[9]=-1;
var teks=9;//текущий сервопривод
function submitUART(uartString)
{
document.getElementById('serialData').value=uartString+"\n";
document.getElementById('serialForm').submit()
};
function scrollCam(el,l)
{var el1;if(l!=undefined)
{el1=document.getElementById
(teks);el1.parentNode.scrollLeft=l;}
else
{el1=el.getElementsByTagName('div')[0];
teks=el1.id;};
};
function keyPressed(e)
{
var keynum
var keychar
var numcheck
if(window.event) // IE
{
keynum = e.keyCode
}
else if(e.which) 
{
keynum = e.which
}
keychar = String.fromCharCode(keynum);
if(keychar == "w" || keychar == "ц" || 
keychar == "W" || keychar == "Ц") 
submitUART("DrvLR=100,100");
if(keychar == "a" || keychar == "ф" || 
keychar == "A" || keychar == "Ф") 
submitUART("DrvLR=-100,100");
if(keychar == "s" || keychar == "ы" || 
keychar == "S" || keychar == "Ы") 
submitUART("DrvLR=-100,-100");
if(keychar == "d" || keychar == "в" || 
keychar == "D" || keychar == "В") 
submitUART("DrvLR=100,-100");
return true;
};
function keyUp(e)
{
var keynum
var keychar
var numcheck
if(window.event) // IE
{
keynum = e.keyCode
}
else if(e.which) 
{
keynum = e.which
};
if((keynum==37)||(keynum==39)||
(keynum==38)||(keynum==40))
{ent_press=0;return};
keychar = String.fromCharCode(keynum);
if(keychar == "w" || keychar == "ц" || 
keychar == "W" || keychar == "Ц") 
submitUART("DrvLR=0,0");
if(keychar == "a" || keychar == "ф" || 
keychar == "A" || keychar == "Ф") 
submitUART("DrvLR=0,0");
if(keychar == "s" || keychar == "ы" || 

keychar == "S" || keychar == "Ы") 

submitUART("DrvLR=0,0");
if(keychar == "d" || keychar == "в" || 

keychar == "D" || keychar == "В") 

submitUART("DrvLR=0,0");
return true;
};
//--
function keyDown(e)
{e.preventDefault();
var keynum
var keychar
var numcheck
if(window.event) // IE
{
keynum = e.keyCode
}
else if(e.which) 
{
keynum = e.which
};
if(keynum==37)
{ent_press=1;teks=9;tspeed=-speed};
if(keynum==39)
{ent_press=1;teks=9;tspeed=speed};
if(keynum==38)
{ent_press=1;teks=2;tspeed=speed};
if(keynum==40)
{ent_press=1;teks=2;tspeed=-speed};
return true;
};
//---
window.setInterval(
function(){var pos;
if(ent_press){ pos = 
document.getElementById(teks).parentNode.scrollLeft;
pos+=tspeed;document.getElementById
(teks).parentNode.scrollLeft=pos;};
 pos = document.getElementById
(teks).parentNode.scrollLeft;
if(lastPos[teks]!=pos){
submitUART("#"+teks+" P" +(pos + 700));
lastPos[teks]=pos;
};
},100
);
</script>
</head>
<body onKeyPress="return keyPressed

(event)" onKeyUp="keyUp(event)" 

onkeydown="keyDown(event)">
<pre class="banner">
**************************************

************ 

**************************************

****
* ____ ____ __ __ _ *
* / __ \____ ___ ____ / __ \____ / /_ 

____ / /_(_)__________ _______ __ *
* / / / / __ \/ _ \/ __ \______/ /_/ / 

__ \/ __ \/ __ \/ __/ // ___/ ___/ / 

___/ / / / *
* / /_/ / /_/ / __/ / / /_____/ _, _/ 

/_/ / /_/ / /_/ / /_/ // /__(__ )_ / / 

/ /_/ / *
* \____/ .___/\___/_/ /_/ /_/ |_|

\____/_.___/\____/\__/_/ \___/____/

(_)_/ \__,_/ *
* /_/ *
* *
**************************************

************ 

**************************************

****
</pre>
<table>
<tr>
<td>
<script type="text/javascript">
document.write("<img alt='RobotEye' 

class='bot-eye' src='http://" + 

document.location.host + ":8080/?

action=stream'/>")
</script>
<br/>
Camera control:<br>
<button type="button" 

onclick="scrollCam(1,0)">Left</button>
<button type="button" 

onclick="scrollCam

(1,800)">Center</button>
<button type="button" 

onclick="scrollCam

(1,1600)">Right</button>
<br/>
</td>
</tr>
<tr>
<td>
<div style="width:320px;height: 

20px;margin-top: 15px;overflow-x: 

scroll;display: inline-block;"
onscroll="scrollCam(this)">
<div id="9" 

style="width:1920px;height: 

1px;display:block;" ></div>
</div>
</td>
</tr>
<tr>
<td>
<div style="width:320px;height: 

20px;margin-top: 15px;overflow-x: 

scroll;display: inline-block;"
onscroll="scrollCam(this)">
<div id="2" 

style="width:1920px;height: 

1px;display:block;" ></div>
</td>
</tr>
<tr>
<td>
<hr style="width: 240px;margin-top: 

15px">
Chassis control:<br>
<button type="button" 

onclick="submitUART

('DrvLR=100,100')">Forward</button><br

>
<button type="button" 

onclick="submitUART('DrvLR=-

100,100')">Left</button>
<button type="button" 

onclick="submitUART

('DrvLR=0,0')">STOP</button>
<button type="button" 

onclick="submitUART('DrvLR=100,-

100')">Right</button><br>
<button type="button" 

onclick="submitUART('DrvLR=-100,-

100')">Backward</button>
</td>
</tr>
<tr>
<td>
<hr style="width: 240px;margin-top: 15px">
<form id="serialForm" action="/cgi-bin/serial.cgi" method="POST" 
target="hidden">
<label>Serial data:<br/>
<textarea id="serialData" 
name="SERIAL_DATA" rows="2" 
cols="40">TEST SERIAL</textarea>
</label><br/>
<input type="submit" value="Send">
</form>
</td>
</tr>
</table>
<hr/>
<iframe name="hidden" 
src="/nothing.html" style="width: 
1px;height: 1px;visibility: hidden"></iframe>
<a href="admin/index.html">Robot  administration</a>
</body>
</html>


Часовой пояс GMT +3, время: 12:52.