Моят първи AJAX модул

[majo]

За съжаление не мога да ви предоставя демо, щото ми е модул в админската част. Затова пък прилагам няколко шотове - да ви кажа, много по приятно е като се види това в действие - нямам думи направо!

За който се интересува, ползвам оригиналниия mod_loadgraph модул. Освен това и prototype.js библиотеката.

В mod_loadgraph.php махам всичко (без validmos rеда, разбира се) и слагам джскрипта, който ще вика шашканията, като преди него си зареждам библиотеката:

Код:

<script type="text/javascript" src="<?php echo $mosConfig_live_site; ?>/administrator/modules/mod_loadgraph/prototype.js"></script>

<script>
function getHTML()
{
var url = 'http://XXX.XX/administrator/modules/mod_loadgraph/load.php';
var urlavg = 'http://XXX.XX/administrator/modules/mod_loadgraph/loadavg.php';
var pars = 'someParameter=ABC';
var parsavg = 'someParameter=ABC';
var frequency = '10';

var myAjax = new Ajax.PeriodicalUpdater( {success: 'placeholderloadavg'}, urlavg, frequency, { method: 'get', parameters: parsavg, onFailure: reportError });
var myAjaxAvg = new Ajax.PeriodicalUpdater( {success: 'placeholderload'}, url, frequency, { method: 'get', parameters: pars, onFailure: reportError });

}

function reportError(request)
{
alert('Грешка.');
}

getHTML();
</script>

По-надолу в ссъщия файл си слагам и дивовете, които ще ми показват съдържанието:

<div id="placeholderloadavg"></div>
<div id="placeholderload"></div>

Правя си двата файла, които ще ми генерират нещата и си ги слагам на подходящото място - load.php и loadavg.php.

Съдържанието на loadavg.php е стандартното съдържание от оригиналния файл mod_loadgraph БЕЗ обаче валидмос реда и БЕЗ НИКАКВИ ПРОМЕНЛИВИ ОТ МАМБО/ДЖУМЛА СРЕДАТА.

Код:

<?php
$currentLA = explode(" ",`cat /proc/loadavg`); 
$maxLA = 5; 
$laPercent = ($currentLA[0] / $maxLA) * 100; 
?>


<div class="loadgraph">

<table width="100%" border="0" cellpadding="1" cellspacing="0">
<tr>
  <td>
  <div align="center">
<b><font class="small">
Средно натоварване на сървъра (loadavg)
</font></b>
</div>

<div align="center" style="margin-top:3px;">
<img src="/modules/mod_loadgraph/bar.gif" border="1" height="4" width="<?php echo $laPercent; ?>">
</div>
<div align="center">
  <font class="smalldark"> <?php echo $laPercent; ?> % </font></div></td>

</tr>
</table>
</div>

Само това и нищо друго. Съдържанието на load.php си е мое - работи само на линукс сървър, на който може да се изпълнява командата vmstat. М/у другото и двете неща бачкат само под линукс, щото ползват линукски шел команди. Та, load.php:

Код:

<div>
<table width="100%" border="0" cellpadding="1" cellspacing="0">
<tr>
  <td>
  <div align="center">
<b><font class="small">
Товар на процесора на сървъра</font></b>
</div>


<?php
$topcommand = preg_split("/[\s,]+/",`vmstat 1 2`); 
$totalloadcpu = $topcommand[50] + $topcommand[51];
?>

<div align="center" style="margin-top:3px;">
<img src="/modules/mod_loadgraph/bar.gif" border="1" height="4" width="<?php echo $totalloadcpu; ?>">
</div>

<div align="center">
  <font class="smalldark"> <?php echo $totalloadcpu; ?> % </font>
</div>

<div align="center">
<font class="smalldark"> <?php echo $topcommand[50]; ?> % (потребителски)</font>
<br />
<font class="smalldark"> <?php echo $topcommand[51]; ?> % (системен)</font>
</div>

</td>

</tr>
</table>
</div>

Ми това е. Ето и шотовете. Направени са в някакви интервали. Основната страница не се е презареждала, ами са се презареждали само картинките и процентите. Какъвто е и дълбокия замисъл на AJAX! И, понеже, предугаждам въпроси относно частите ПАМЕТ и ДИСКОВЕ - да, мои са си и предстоят да бъдат направени и те по метода на AJAX. В момента показват реалото състояние на памет и харддискове в момента на зареждане на страницата. С AJAX ще могат да го правят в реално време непрекъснато. Лееее, това AJAX ми стана люта мания!

[Калоян Здравков]

Леле, majo, жив и здрав да си, пионер на AJAX-а (поне в местната агитка).
И аз смятам да пускам сървър по нова година или малко след това и понеже и хабер си нямам от управление в по-тежкия клас, ще ти последвам примера и ще взема да разуча тая библиотека 

[majo]

"ТУК ЩЕ БЪДЕ AJAX-A!" Както е казал хан Маджо. 

За Kaloian Zdravkov, а и за всички сегашни и бъдещи фенове, освен книгите на хартия, попаднах и на няколко убийствени ресурса:

1. http://prototype.conio.net/ - страницата prototype.js библиотеката
2. http://www.sergiopereira.com/articles/prototype.js.html - как се ползва тази библиотека. (Има на секви езици, само не и на бг. Желаещи за превод? Дотогава - японски за тези, дето не превеждат доброволно и не шерват скриптове!)
3. http://script.aculo.us/ - страница на библиотеката Scriptaculous. Допълнителна лудница към prototype.
4. http://openrico.org/ - библиотеката Rico.

[chessko]

А виждали ли сте Google Suggest http://labs.google.com/suggest уникалния AJAX бърка в цялата базата данни на Google, докато пишеш това, което ще търсиш

[majo]

Лесна работа.   

[madjack]

Abe vijdam 4e ste zaribeni jako ot toja AJAX ama toi ne e li samo za po specifi4ni zada4i koito iskat da se pokaje sydyrjanie bez da se prezaredi stranicata.Vse o6te ne moga da napravia razlika mejdu nego i iframe da re4eme taka ili ina4e trafika se generiara 

[majo]

Ами, madjack, поне доколкото схванах, не е точно така. Значи с iframe наистина можеш да правиш нещата горе-долу като ajax, ама такъв подход, най-вече, е доста труден за прокарване. В една от книгите по темата наистина половината беше посветено за iframe и как можем да се правим на ajax с това, ама честно казано почти нищо не разбрах. То не бяха джс класове, цикли и пр. само и само да можеш да вържеш frames една с друга, да не говоримм, че там примерите бяха винаги за 2 frames - едната 100% ширина, другата 0% (т.е. един вид скрита). Мен тоз подход нещо не ме накефи.

Другото, ajax подхода е доста по-различен. Проблемацията тука е в еднотипната подръжка на джс функциите при различните браузъри. Не че при някои браузъри нищо не ставало. Просто при всички ставало по различен начин. Така поне пише.

Другата ми зарибявка по ajax е, че има много хубави джс библиотеки, написани специално по този случай. prototype например. А това за мен е дюшеш, тъй като от джс разбирам почти съвсем нищо.

А що се отнася за трафика - ми ти не можеш да не генерираш трафик. Ако ти е гадно, спри си сървъра. Добрата новина е, че с ajax този трафик се минимизира точно до този, който трябва да бъде. Пример с моя сайт. Началната страница, барабар сис всичките картинки, цсс-та и т.н. тежи около 600КБ. Ако някой иска да се логне още в началото, той значи зарежда веднъж 600 КБ, пише си САМО юзър и пас и презарежда ОТНОВО 600 КБ. Което прави 1,2 МБ само за да се логне някой, т.е. за трансфер от 20тина знака. Ако се направи с ajax първоначалното зареждане си остава. Но след като си попълни логина и го прати, обратно до браузъра му идва само <див>-а на логина, който, де да знам, може и под 1 КБ да е. Така трафика става не 1,2 МБ ами 601 КБ, което си е постижение.  Тук не става въпрос да пестим от трафика на сървъра. По-скоро идеята е да сме по-достъпни и страниците да зареждат по-бърже от гл. точка на потребителите.

Оказва се, че задачите все пак не са толкова специфични, колко ти казваш - на Гугъл всичко им ползва ajax и засега не виждам някой да роптае. А пък гледах и една схема вчера, ама не помня точно къде. Та там въпроса беше коя технология възнамерявате да въведете във вашата организация близката 1 година. На най-първо място беше ajax. Следван от Podcasting, RSS, Blogs и т.н. В дъното беше wiki.     

[madjack]

Ясно ,започна да ми се прояснява вече 

[go_joo]

Според мен, освен модата web2, по- сериозната причина за използването на тази технология е стремежът информацията да се изнесе на повърхността и да се спестят няколко умствени операции на потребителя.  На никой не му се задълбочава, клика в дълбочина (зарибява), ...

[Калоян Здравков]

Според мен, освен модата web2, по- сериозната причина за използването на тази технология е стремежът информацията да се изнесе на повърхността и да се спестят няколко умствени операции на потребителя.  На никой не му се задълбочава, клика в дълбочина (зарибява), ...

Не бих се съгласил с подобно мнение. С напредъка на развитието на технологиите информацията придобива все по-голям обем. Общата идея е тя по-бързо да може да стигне до потребителя. Не за сметка на спестяване на "умствени операции" (какво - 2-3 клика???  ), а по-скоро чрез оптимизиране скоростта на зареждане. По старата логика, че "луд и ****** на шарено се радва", народа блъска всевъзможни шарении по сайтове и форуми без да се съобразява какво коства това на клиента като време на зареждане и дали неоптимизирано изображение от 0.5 Мб е подходящо за зареждане на първа страница. Ами не може винаги да гледаме от собствената си камбанария. Аз съм на 1 Мб ADSL от БТК, но и мен ме дразни някой сайт, изпържен яко на Флаш например, който ми отнема по цяла минута за зареждане (не че има смисъл да е на Флаш, ама така, да се покажем като дизайнери), а какво да кажем за хора, които едва връзват 8-10 к връзка? И преди някой да скочи "Къде има такава връзка?" да спомена, че не цяла България се състои от 2-3 по-големи града със здрави оптични паяжини и безпроблемен нет дори в крайните квартали.

[go_joo]

Начи, Калояне,
темичката на Majo касае техничарските аспекти по внедряването на тази технология и по- специално в любимата ни система.
Аз си позволих да вметна нещо съвсем фриволно и от гледната точка на потребителската психология.
Представи си че сайта е в intranet и няма проблеми със скоростта. Туй, което казвам би трябвало да важи и  там.

[Ангел Нейчев]

majo а защо като сложа модула, той не се визоализира. Мисля че спазих инструкциите като отида в админа, не виждам от къде да запусна модул. Просто не се вижда

[majo]

Еми то това не е инсталатор. Просто тоя код трябва да си го боднеш в някакъв вече съществуващ и публикуван модул. Инак запис за модул в базата няма, да.

[Ангел Нейчев]

аха, ок
аз го изтеглих от твоя сайт, направих корекциите и го сложих с името което е написано там mod_loadgraph.php
сега ще тествам

[majo]

Еми нали ти казвам - ползвам ГОТОВ модул лоудграф. Има такъв. Инсталнал съм си го, публикувал съм го и вътре в него съм сложил моя код. Просто щото ме мързеше да вкарам един ред в джос_модулс и да си направя една картинка за оранжевия бар.