@ -5,99 +5,108 @@ enum parts
HTML_BEGIN ,
HTML_END ,
STYLE ,
SCRIPT ,
SCRIPT ,
ACC_CALIBRATE
} ;
const char html_begin [ ] PROGMEM = {
" <!DOCTYPE html> \n \
< html > \ n " };
const char html_begin [ ] PROGMEM = R " (
< ! DOCTYPE html >
< html >
) " ;
const char style [ ] PROGMEM = {
" <head> \n \
< style > \ n \
button { \ n \
width : 190 px ; \ n \
height : 40 px ; \ n \
} \ n \
# navs {\n\
height : 40 px ; \ n \
width : 400 px ; \ n \
position : relative ; \ n \
} \ n \
footer { \ n \
height : 5 % ; \ n \
text - align : center ; \ n \
width : 100 % ; \ n \
margin - top : 100 px ; \ n \
} \ n \
. clear { \ n \
clear : left ; \ n \
} \ n \
# hbs_text {\n\
text - align : left ; \ n \
width : 400 px ; \ n \
text - indent : 20 px ; \ n \
} \ n \
< / style > \ n \
< meta charset = \ " UTF-8 \" > \n \
< / head > \ n \
< body > \ n \
\ n \
< div id = \ " main_block \" align= \" center \" > \n \
< h2 > Л а б о р а т о р н а я р а б о т а < / h2 > \ n \
< h3 > А к с е л е р о м е т р ADW22035Z - Cемейство ADXL103 < / h3 > \ n \
< p id = \ " hbs_text \" >Акселерометр подает на выход данные по одной оси.</p> \n \
< p id = \ " hbs_text \" >Частота обновления графика - 1 раз в секунду. Данные с сенсора снимаются \n \
с ч а с т о т о й в 50 Hz . < / p > \ n \
< canvas id = \ " myCanvas \" width= \" 400 \" height= \" 200 \" style= \" border:1px solid #000000; \" > \n \
Б р а у з е р у с т а р е л ! \ n \
< / canvas > \ n " };
const char style [ ] PROGMEM = R " (
< head >
< style >
button
{
width : 190 px ;
height : 40 px ;
}
# navs
{
height : 40 px ;
width : 400 px ;
position : relative ;
}
footer
{
height : 5 % ;
text - align : center ;
width : 100 % ;
margin - top : 100 px ;
}
. clear
{
clear : left ;
}
# hbs_text
{
text - align : left ;
width : 400 px ;
text - indent : 20 px ;
}
< / style >
< meta charset = " UTF-8 " >
< / head >
< body >
< div id = " main_block " align = " center " >
< h2 > Л а б о р а т о р н а я р а б о т а < / h2 >
< h3 > А к с е л е р о м е т р ADW22035Z - Cемейство ADXL103 < / h3 >
< p id = " hbs_text " > А к с е л е р о м е т р п о д а е т н а в ы х о д д а н н ы е п о о д н о й о с и . < / p >
< p id = " hbs_text " > Ч а с т о т а о б н о в л е н и я г р а ф и к а - 1 р а з в с е к у н д у . Д а н н ы е с с е н с о р а с н и м а ю т с я
с ч а с т о т о й в 50 Hz . < / p >
< canvas id = " myCanvas " width = " 400 " height = " 200 " style = " border:1px solid #000000; " >
Б р а у з е р у с т а р е л !
< / canvas >
) " ;
const char script [ ] PROGMEM = {
" <script> \n \
var socket = new WebSocket ( \ " ws://192.168.4.1:81 \" ); \n \
var i , data ; \ n \
var c = document . getElementById ( \ " myCanvas \" ); \n \
var context = c . getContext ( \ " 2d \" ); \n \
\ n \
socket . onopen = function ( ) { \ n \
alert ( ' С о е д и н е н и е у с т а н о в л е н о . ' ) ; \ n \
} ; \ n \
socket . onclose = function ( event ) { \ n \
if ( ! event . wasClean ) { \ n \
alert ( ' О б р ы в с о е д и н е н и я ' ) ; \ n \
} \ n \
} ; \ n \
socket . onmessage = function ( event ) { \ n \
context . clearRect ( 0 , 0 , 400 , 200 ) ; \ n \
context . beginPath ( ) ; \ n \
data = JSON . parse ( event . data ) ; \ n \
context . moveTo ( 0 , data . data [ 0 ] ) ; \ n \
for ( i = 0 ; i < 200 ; i + + ) { \ n \
context . lineTo ( i * 2 , data . data [ i ] ) ; \ n \
} \ n \
context . stroke ( ) ; \ n \
} ; \ n \
function calibrateDevice ( ) { \ n \
var calibrating = 10 ; \ n \
socket . send ( JSON . stringify ( calibrating ) ) ; \ n \
document . getElementById ( \ " calibrate_text \" ).innerHTML = \ "Калибровка в течении 10 секунд - Сделайте несколько оборотов устройством перпендикулярно оси Х \" ; \n \
} \ n \
< / script > \ n \
" } ;
const char script [ ] PROGMEM = R " (
< script >
var socket = new WebSocket ( " ws://192.168.1.1:81 " ) ;
var i , data ;
var c = document . getElementById ( " myCanvas " ) ;
var context = c . getContext ( " 2d " ) ;
socket . onopen = function ( ) {
alert ( ' С о е д и н е н и е у с т а н о в л е н о . ' ) ;
} ;
socket . onclose = function ( event ) {
if ( ! event . wasClean ) {
alert ( ' О б р ы в с о е д и н е н и я ' ) ;
}
} ;
socket . onmessage = function ( event ) {
context . clearRect ( 0 , 0 , 400 , 200 ) ;
context . beginPath ( ) ;
data = JSON . parse ( event . data ) ;
context . moveTo ( 0 , data . data [ 0 ] ) ;
for ( i = 0 ; i < 200 ; i + + ) {
context . lineTo ( i * 2 , data . data [ i ] ) ;
}
context . stroke ( ) ;
} ;
function calibrateDevice ( ) {
var calibrating = 10 ;
socket . send ( JSON . stringify ( calibrating ) ) ;
document . getElementById ( " calibrate_text " ) . innerHTML = " Калибровка в течении 10 секунд - Сделайте несколько оборотов устройством перпендикулярно оси Х " ;
}
< / script >
) " ;
const char html_end [ ] PROGMEM = {
" <div class= \" clear \" ></div> \n \
< / div > \ n \
< footer > Т а м б о в с к и й Г о с у д а р с т в е н н ы й Т е х н и ч е с к и й У н и в е р с и т е т 2017 г . \ n \
< / footer > \ n \
< / body > \ n \
< / html > \ n " };
const char html_end [ ] PROGMEM = R " (
< div class = " clear " > < / div >
< / div >
< footer > Т а м б о в с к и й Г о с у д а р с т в е н н ы й Т е х н и ч е с к и й У н и в е р с и т е т 2017 - 2018 г .
< / footer >
< / body >
< / html >
) " ;
const char acc_calibrate [ ] PROGMEM = {
" <p id= \" calibrate_text \" onclick= \" calibrateDevice() \" >Устройство не откалибровано.</p> \n \
< button onclick = \ " calibrateDevice() \" >Откалибровать</button> " } ;
const char acc_calibrate [ ] PROGMEM = R " =(
< p id = " calibrate_text " > У с т р о й с т в о н е о т к а л и б р о в а н о . < / p >
< button onclick = " calibrateDevice() " > О т к а л и б р о в а т ь < / button >
) = " ;
static int getHtml ( parts p , char & adr , uint16_t buf_size , uint16_t bias )
{
