Домашний сайт Лугавчика:
фото, мысли, музыка и другое

Сегодня решился на добавление интерактивности статистики по одной записи, и теперь, если поставить галочку, что использовать javascript, то статистика будет выдана в браузер в виде необработанной информации, и вы уже сами сможете подобрать, что выводить, что проигнорировать и по сколько отразить. Правда я забыл сделать кат. В дальнейшем такая опция будет добавлена и другим статистикам.

А, теперь самое важное. Написанием этого обработчика, я подтвердил свои навыки в работе на javascript, а ведь когда-то он давался мне таким трудным и был таким не понятным. Мы развились друг для друга. 

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

function ProgressBar(){
	this.value	= 0;
	this.max	= 1;
	this.parent	= null;
	this.main	= null;
	this.progress	= null;
	this.info	= null;
}

ProgressBar.prototype.Create= function (element,maximum){
	this.value	=0;
	this.max	=maximum;
	this.parent	=element;
	this.main	=appendElement(element,'div',{'className':'progressbar'});
	this.progress	=appendElement(this.main,'div',{'className':'progress','innerHTML':' '});
	this.info	=appendElement(this.main,'div',{'className':'percent'});
	this.Progress(0);
}

ProgressBar.prototype.Progress= function (value){
	this.value	=value;
	this.Repaint();
}

ProgressBar.prototype.Repaint=function(){
	var percent	=this.value/this.max*100;
	this.progress.style.width	=percent+'%';
	this.info.innerHTML	=Math.round(percent*10)/10+'%';
}

ProgressBar.prototype.NewMax= function (value){
	this.max	=value;
	this.Repaint();
}

ProgressBar.prototype.Destroy= function (){
	this.parent.removeChild(this.main);
}
 

Особенностью этой полоски является то, что она создаётся в обекте передаваемом в функцию Create.

Всё оформление задаётся через описания к классу полоски, что позволяет не грузить скрипт ненужными параметрами. Для создания полоски используется функция описанная в записи создание HTML элемента в javaScript одной функцией.

Иногда требуется создать несколько элементов в javaScript. Можно, конечно описывать все действия, но можно сделать специальную функцию создания, в которую передавать. Где создать элемент, какой у него будет тег и какие дополнительные параметры.

После чего получается, вот такая не хитрая функция:

function appendElement(to,tag,value){
  var el=document.createElement(tag);
  for (var name in value)
      el[name]=value[name];
  to.appendChild(el);
  return el;
  }

Здесь не реализованы:

• Вложенные параметры начиная с второй глубины.
• Вставка элемента перед каким-нибудь элементом.

Сегодня меня пропёрло чуть-чуть попрограммировать, и вот что вышло:

• Первая версия направляющий у тех веток комментариев, которые имеют ответы ниже, чтобы было легче искать. дальше, в планах. приделать красивые полосочки им.
• Заодно сделал у себя в дневнике ссылочку на подсчёт статистики комментариев для записи. Смысл только в увеличении рейтинга у поисковиков =)
• И самое не нужное, но полезное на последок. Сделал небольшой Javascript для отображения полосы прогресса. Позже у 20947 выложу как пользоваться и с чем кушать. Но теперь будет понятно, что идёт загрузка статистик и примерно сколько она ещё собирается грузиться.

Буквально два вечера делал очередное обновление на своём сайте. Обновления коснулись раздела с музыкой и основного кода javaScript.

1. Теперь у альбомов буду обложки, когда найду и закачаю.
2. В связи с человеческим фактором, при добавлении музыки не исключены опечатки, которые стараются случиться в самый неподходящий момент. Была проработана часть с редактированием уже закаченной музыки, а именно название треков и альбомов можно редактировать. Правда это редактирование в стадии беты, и нужно будет добавить внятный ответ от сервера о результатах работы и внесение изменений на страницу
3. В части javaScript появилось несколько функций таких как: Создание элемента на странице, чтобы одним вызовом добавлять и запуска Ajax запроса. В дальнейшем, когда функции обкатаю их можно будет предоставить на суд общественности.