[JS] звёздочки, оценки сообщений...

И всё прочее, что касается HTML
Правила форума
Убедительная просьба юзать теги [code] при оформлении листингов.
Сообщения не оформленные должным образом имеют все шансы быть незамеченными.
Аватара пользователя
Alex Keda
стреляли...
Сообщения: 35200
Зарегистрирован: 2004-10-18 14:25:19
Откуда: Made in USSR
Контактная информация:

[JS] звёздочки, оценки сообщений...

Непрочитанное сообщение Alex Keda » 2012-01-30 22:31:04

есть такой вот код, рождённый в муках - большей частью до меня, я тока сделал что работало как мне надо, и немного скривил =)

Код: Выделить всё

<img style="cursor: pointer;" onclick="AjaxCall('/API/TicketVote',{MessageID:67122,VoteBall:1},'Оценка сообщения','ShowTick("Ваша оценка \'Совсем плохо\' успешно сохранена");');" onmouseover="selectStars(event, 67122, 0);PromptShow(event,'Совсем плохо',this);" src="/styles/billing/Images/Icons/EnableStar.png" id="star_67122_0"/>
<img style="cursor: pointer;" onclick="AjaxCall('/API/TicketVote',{MessageID:67122,VoteBall:2},'Оценка сообщения','ShowTick("Ваша оценка \'Очень плохо\' успешно сохранена");');" onmouseover="selectStars(event, 67122, 1);PromptShow(event,'Очень плохо',this);" src="/styles/billing/Images/Icons/EnableStar.png" id="star_67122_1"/>
<img style="cursor: pointer;" onclick="AjaxCall('/API/TicketVote',{MessageID:67122,VoteBall:3},'Оценка сообщения','ShowTick("Ваша оценка \'Плохо\' успешно сохранена");');" onmouseover="selectStars(event, 67122, 2);PromptShow(event,'Плохо',this);" src="/styles/billing/Images/Icons/EnableStar.png" id="star_67122_2"/>
<img style="cursor: pointer;" onclick="AjaxCall('/API/TicketVote',{MessageID:67122,VoteBall:4},'Оценка сообщения','ShowTick("Ваша оценка \'Не очень хорошо\' успешно сохранена");');" onmouseover="selectStars(event, 67122, 3);PromptShow(event,'Не очень хорошо',this);" src="/styles/billing/Images/Icons/EnableStar.png" id="star_67122_3"/>
<img style="cursor: pointer;" onclick="AjaxCall('/API/TicketVote',{MessageID:67122,VoteBall:5},'Оценка сообщения','ShowTick("Ваша оценка \'Нейтрально\' успешно сохранена");');" onmouseover="selectStars(event, 67122, 4);PromptShow(event,'Нейтрально',this);" src="/styles/billing/Images/Icons/EnableStar.png" id="star_67122_4"/>
<img style="cursor: pointer;" onclick="AjaxCall('/API/TicketVote',{MessageID:67122,VoteBall:6},'Оценка сообщения','ShowTick("Ваша оценка \'Удовлетворительно\' успешно сохранена");');" onmouseover="selectStars(event, 67122, 5);PromptShow(event,'Удовлетворительно',this);" src="/styles/billing/Images/Icons/EnableStar.png" id="star_67122_5"/>
<img style="cursor: pointer;" onclick="AjaxCall('/API/TicketVote',{MessageID:67122,VoteBall:7},'Оценка сообщения','ShowTick("Ваша оценка \'Хорошо\' успешно сохранена");');" onmouseover="selectStars(event, 67122, 6);PromptShow(event,'Хорошо',this);" src="/styles/billing/Images/Icons/EnableStar.png" id="star_67122_6"/>
<img style="cursor: pointer;" onclick="AjaxCall('/API/TicketVote',{MessageID:67122,VoteBall:8},'Оценка сообщения','ShowTick("Ваша оценка \'Очень хорошо\' успешно сохранена");');" onmouseover="selectStars(event, 67122, 7);PromptShow(event,'Очень хорошо',this);" src="/styles/billing/Images/Icons/DisableStar.png" id="star_67122_7"/>
<img style="cursor: pointer;" onclick="AjaxCall('/API/TicketVote',{MessageID:67122,VoteBall:9},'Оценка сообщения','ShowTick("Ваша оценка \'Отлично\' успешно сохранена");');" onmouseover="selectStars(event, 67122, 8);PromptShow(event,'Отлично',this);" src="/styles/billing/Images/Icons/DisableStar.png" id="star_67122_8"/>

Код: Выделить всё

function selectStars(e, $ticketId, $starId) {
  for(var $i = 0; $i < 9; $i++) {
    document.getElementById('star_'+$ticketId+'_'+$i).src = '/styles/billing/Images/Icons/DisableStar.png';
  }

  for(var $i = 0; $i <= $starId; $i++) {
    document.getElementById('star_'+$ticketId+'_'+$i).src = '/styles/billing/Images/Icons/EnableStar.png';
  }
}
собсно эффект - когда наводишь - получается полоса звёдочек другого цвета (дефолт серые, когда наводит мышь - красные - слева и до мыши)

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

саму возможность голосвания надо оставить - т.к. юзер может передумать.

пните в ту сторону, откуда начать.
JS не знаю совсем =((
Убей их всех! Бог потом рассортирует...

Хостинговая компания Host-Food.ru
Хостинг HostFood.ru
 

Услуги хостинговой компании Host-Food.ru

Хостинг HostFood.ru

Тарифы на хостинг в России, от 12 рублей: https://www.host-food.ru/tariffs/hosting/
Тарифы на виртуальные сервера (VPS/VDS/KVM) в РФ, от 189 руб.: https://www.host-food.ru/tariffs/virtualny-server-vps/
Выделенные сервера, Россия, Москва, от 2000 рублей (HP Proliant G5, Intel Xeon E5430 (2.66GHz, Quad-Core, 12Mb), 8Gb RAM, 2x300Gb SAS HDD, P400i, 512Mb, BBU):
https://www.host-food.ru/tariffs/vydelennyi-server-ds/
Недорогие домены в популярных зонах: https://www.host-food.ru/domains/

Overseer
сержант
Сообщения: 218
Зарегистрирован: 2008-03-20 23:00:42

Re: [JS] звёздочки, оценки сообщений...

Непрочитанное сообщение Overseer » 2012-02-06 23:06:45

если еще актуально, то вот мои мысли.

1) здесь я заменил цикл, т.к. в лишнем обходе нет смысла:

Код: Выделить всё

function selectStars(e, $ticketId, $starId) {
  for(var $i = 0; $i <= $starId; $i++) {
    document.getElementById('star_'+$ticketId+'_'+$i).src = '/styles/billing/Images/Icons/EnableStar.png';
  }
  for(var $i = $starId+1; $i < 9; $i++) {
    document.getElementById('star_'+$ticketId+'_'+$i).src = '/styles/billing/Images/Icons/DisableStar.png';
  }
}
2) функция подцветки:

Код: Выделить всё

function selectVotedStars(e, $ticketId, $starId) {
  if ($IsVoted != 777) {
    for(var $i = 0; $i <= $starId; $i++) {
      document.getElementById('star_'+$ticketId+'_'+$i).src = '/styles/billing/Images/Icons/EnableVotedStar.png';
    }
    for(var $i = $starId+1; $i < 9; $i++) {
      document.getElementById('star_'+$ticketId+'_'+$i).src = '/styles/billing/Images/Icons/DisableVotedStar.png';
    }
  }
}
selectVotedStars вызывать по событию onmouseout. $IsVoted нужно объявить/задекларировать где-то выше, как глобальную переменную, и держать в ней значение голоса (только не провтыкать с размерностью, 0-8 или 1-9) или левое значение, например, 777, если не голосовал еще.

Аватара пользователя
Alex Keda
стреляли...
Сообщения: 35200
Зарегистрирован: 2004-10-18 14:25:19
Откуда: Made in USSR
Контактная информация:

Re: [JS] звёздочки, оценки сообщений...

Непрочитанное сообщение Alex Keda » 2012-02-07 8:26:43

не фурычит =((
ошибок никаких нет, ни на что не ругается, просто не пашет =(
может не так задал

Код: Выделить всё

                                'onMouseOver'   => SPrintF('selectStars(event, %d, %d);PromptShow(event,\'%s\',this);',$MessageID, $i, $VoteTitle[$i]),
                                'onMouseOut'    => SPrintF('selectVotedStars(event, %d, %d);',$MessageID, $i),
?
и про глобальную переменную - я непонял.
сообщений в одном открытом окне может быть несколько.
и у каждого своя оценка...
Убей их всех! Бог потом рассортирует...

Аватара пользователя
FreeBSP
майор
Сообщения: 2020
Зарегистрирован: 2009-05-24 20:20:19
Откуда: Москва

Re: [JS] звёздочки, оценки сообщений...

Непрочитанное сообщение FreeBSP » 2012-02-07 13:22:45

три цвета мне кажется это слишком..
может лучше сделать какую нить княпочку при наведении на которую в лотке голосования показывались бы предыдущие результаты
нашел плагин к жиквери, ща попробую что нить настругать
Человек начинает получать первые наслаждения от знакомства с unix системами. Ему нужно помочь - дальше он сможет получать наслаждение самостоятельно ©
Ламер — не желающий самостоятельно разбираться. Не путать с новичком: ламер опасен и знает это!

Overseer
сержант
Сообщения: 218
Зарегистрирован: 2008-03-20 23:00:42

Re: [JS] звёздочки, оценки сообщений...

Непрочитанное сообщение Overseer » 2012-02-07 13:31:31

Alex Keda писал(а):не фурычит =((
ошибок никаких нет, ни на что не ругается, просто не пашет =(

и про глобальную переменную - я непонял.
в самом коде страницы появляется onmouseout="selectVotedStars...?

Код: Выделить всё

<img style="cursor: pointer;" onclick="AjaxCall('/API/TicketVote',{MessageID:67122,VoteBall:2},'Оценка сообщения','ShowTick("Ваша оценка \'Очень плохо\' успешно сохранена");');" onmouseover="selectStars(event, 67122, 1);PromptShow(event,'Очень плохо',this);" onmouseout="selectVotedStars(event, 67122);" src="/styles/billing/Images/Icons/EnableStar.png" id="star_67122_1"/>
картинки *VotedStar.png есть?

нужна глобальная переменная (массив), куда бы втягивались результаты голосования этого конкретного пользователя, они где-то записаны или надо составлять Ajax-запрос для их вытягивания?

> три цвета мне кажется это слишком..
как вариант, можно оставлять цвет подсветки как цвет сделанного выбора, так на многих сайтах.

Аватара пользователя
Alex Keda
стреляли...
Сообщения: 35200
Зарегистрирован: 2004-10-18 14:25:19
Откуда: Made in USSR
Контактная информация:

Re: [JS] звёздочки, оценки сообщений...

Непрочитанное сообщение Alex Keda » 2012-02-07 13:39:27

да.

Код: Выделить всё

<img style="cursor: pointer;" onclick="AjaxCall('/API/TicketVote',{MessageID:69949,VoteBall:1},'Оценка сообщения','ShowTick("Ваша оценка \'Совсем плохо\' успешно сохранена");');" onmouseout="selectVotedStars(event, 69949, 0);" onmouseover="selectStars(event, 69949, 0);PromptShow(event,'Совсем плохо',this);" src="/styles/billing/Images/Icons/EnableStar.png" id="star_69949_0"/>
<img style="cursor: pointer;" onclick="AjaxCall('/API/TicketVote',{MessageID:69949,VoteBall:2},'Оценка сообщения','ShowTick("Ваша оценка \'Очень плохо\' успешно сохранена");');" onmouseout="selectVotedStars(event, 69949, 1);" onmouseover="selectStars(event, 69949, 1);PromptShow(event,'Очень плохо',this);" src="/styles/billing/Images/Icons/DisableStar.png" id="star_69949_1"/>
картинок - нету. но я смотрел веб-консоль в FF - туда вообще ничё не пишется когда мышь выводишь.
тыкалось бы к картинке - писал бы запрос и ответ - 404
Убей их всех! Бог потом рассортирует...

Аватара пользователя
Alex Keda
стреляли...
Сообщения: 35200
Зарегистрирован: 2004-10-18 14:25:19
Откуда: Made in USSR
Контактная информация:

Re: [JS] звёздочки, оценки сообщений...

Непрочитанное сообщение Alex Keda » 2012-02-07 13:42:04

про переменные и ajax - снова непонял.
могу в html всунуть тег

Код: Выделить всё

<script>...</script>
но как там прописать?
Убей их всех! Бог потом рассортирует...

Overseer
сержант
Сообщения: 218
Зарегистрирован: 2008-03-20 23:00:42

Re: [JS] звёздочки, оценки сообщений...

Непрочитанное сообщение Overseer » 2012-02-07 13:46:30

Alex Keda писал(а):про переменные и ajax - снова непонял.
> голос известен, он есть при построении этого кода.
где он хранится?

Аватара пользователя
Alex Keda
стреляли...
Сообщения: 35200
Зарегистрирован: 2004-10-18 14:25:19
Откуда: Made in USSR
Контактная информация:

Re: [JS] звёздочки, оценки сообщений...

Непрочитанное сообщение Alex Keda » 2012-02-07 14:51:53

в БД.
в той же строке что и само сообщение, к которому относится
т.е. в процессе построения этого куска - он доступен из php
Убей их всех! Бог потом рассортирует...

Overseer
сержант
Сообщения: 218
Зарегистрирован: 2008-03-20 23:00:42

Re: [JS] звёздочки, оценки сообщений...

Непрочитанное сообщение Overseer » 2012-02-07 15:00:19

я так понимаю, там содержится итоговое число голосов, а не поименное? тогда не получится показать пользователю *его голос*.
непосредственно после голосования показать можно, просто запомнив в js-переменную или js-массив, что за такое-то сообщение отдан голос.

Аватара пользователя
Alex Keda
стреляли...
Сообщения: 35200
Зарегистрирован: 2004-10-18 14:25:19
Откуда: Made in USSR
Контактная информация:

Re: [JS] звёздочки, оценки сообщений...

Непрочитанное сообщение Alex Keda » 2012-02-07 15:05:40

нет. там содержится именно его голос, именно для этого сообщения.
это тикетница. там нет массовости - там клиенты оценивают ответы сотрудников
Убей их всех! Бог потом рассортирует...

Overseer
сержант
Сообщения: 218
Зарегистрирован: 2008-03-20 23:00:42

Re: [JS] звёздочки, оценки сообщений...

Непрочитанное сообщение Overseer » 2012-02-07 15:28:42

замечательно. при построении страницы формируется блок с java-скриптами или они в отдельном файле?
в любом случае, при формировании страницы где-то в начале страницы нужно "запомнить" имеющиеся данные в js-массив, например так:

Код: Выделить всё

var dVoteArr = [];
dVoteArr[67122] = 0; // 67122 - номер топика ака MessageID
dVoteArr[67123] = 1;
dVoteArr[67124] = 9;
dVoteArr[67125] = 3; // значение - оценка, 0 - не голосовал (оценки ведь от 1 до 9?)
// (и так столько раз, сколько топиков на странице)
// в массиве нет элементов с 1 по 67121-й, они память не занимают. так проще идентифицировать "голос", без лишних приседаний

var msgs = [67122, 67123, 67124, 67125]; // номера топиков

function ShowUserVotes {
  for (i = 0; i < msgs.length; i++) {
    selectVotedStars(e, msgs[i], dVoteArr[msgs[i]]);
  }
}
этот массив нужно формировать на уровне PHP-страницы, там же из базы вытягиваются сами топики, добавить только голоса.
дальше нужно на ивент загрузки страницы вызвать функцию, которая проставит эти самые "голоса".

Код: Выделить всё

<BODY onLoad="ShowUserVotes();">
кстати, зачем в функции selectStars переменные с $? в js он же не используется.
и в циклах var не нужен

Код: Выделить всё

for(var $i = 0; $i < 9; $i++) {
// нужно:
for(i = 0; i < 9; i++) {

Аватара пользователя
Alex Keda
стреляли...
Сообщения: 35200
Зарегистрирован: 2004-10-18 14:25:19
Откуда: Made in USSR
Контактная информация:

Re: [JS] звёздочки, оценки сообщений...

Непрочитанное сообщение Alex Keda » 2012-02-08 8:05:57

Overseer писал(а):замечательно. при построении страницы формируется блок с java-скриптами или они в отдельном файле?

Код: Выделить всё

function selectVotedStars
в отдельном файле
Overseer писал(а):

Код: Выделить всё

<BODY onLoad="ShowUserVotes();">
а вот с этим могут быть проблемы =))
там не совсем страницы, какбе...
я даже не знаю как это правильно называется... это "отростки" от страницы, чтоли... незнаю как сказать.
зайдите в тикетницу - посмотрите - http://demo.joonte.com/Administrator/Ti ... ReOpen=yes
Overseer писал(а): кстати, зачем в функции selectStars переменные с $? в js он же не используется.
и в циклах var не нужен
тот кто начинал писать - писал в таком стиле. я просто стараюсь его придерживаться.
да и незнаю - нужен, не нужен, но факт что код становится понятней и читабельней на порядок.
Убей их всех! Бог потом рассортирует...

Overseer
сержант
Сообщения: 218
Зарегистрирован: 2008-03-20 23:00:42

Re: [JS] звёздочки, оценки сообщений...

Непрочитанное сообщение Overseer » 2012-02-08 9:46:17

уу.. надо смотреть исходники, телепатировать такие пепелацы нереально..
надо искать как при загрузке страницы (или отпрыска) дернуть функцию, которая бы показала голоса + место для хранения самих голосов и этой функции.

Аватара пользователя
Alex Keda
стреляли...
Сообщения: 35200
Зарегистрирован: 2004-10-18 14:25:19
Откуда: Made in USSR
Контактная информация:

Re: [JS] звёздочки, оценки сообщений...

Непрочитанное сообщение Alex Keda » 2012-02-08 14:35:40

да исходники-то открыты.
от этого не сильно легче - стиль написанного php там ну оччень своеобразный =))
Убей их всех! Бог потом рассортирует...

Overseer
сержант
Сообщения: 218
Зарегистрирован: 2008-03-20 23:00:42

Re: [JS] звёздочки, оценки сообщений...

Непрочитанное сообщение Overseer » 2012-02-08 17:01:44

Alex Keda писал(а):да исходники-то открыты.
от этого не сильно легче - стиль написанного php там ну оччень своеобразный =))
да потому что это Joomla... :crazy:
я там встречал такие перлы, что просто прозревал. правил дыры вроде возможности инклуда любых файлов, а suhosin проблевался на такое:

Код: Выделить всё

include ("../../../../../../../../../../filename.php");

Overseer
сержант
Сообщения: 218
Зарегистрирован: 2008-03-20 23:00:42

Re: [JS] звёздочки, оценки сообщений...

Непрочитанное сообщение Overseer » 2012-02-08 18:16:18

пардон, был не прав, это не Joomla, в названии Joonte Software смутило "Joo".

Аватара пользователя
ADRE
майор
Сообщения: 2641
Зарегистрирован: 2007-07-26 8:53:49
Контактная информация:

Re: [JS] звёздочки, оценки сообщений...

Непрочитанное сообщение ADRE » 2012-02-13 10:24:45

Overseer писал(а):
Alex Keda писал(а):про переменные и ajax - снова непонял.
> голос известен, он есть при построении этого кода.
где он хранится?
а как еще?
Запрос делать через туже библиотеку что и тикеты получают своё наполнение. просто вместо буков тикета - будет уровень или цыфра, а прикрепить результат голоса - либо через доп таблицу, либо просто через бесконечные куки браузера. вот и всё.
--
если чел не нажимал - вывести среднее значение предложить проголосовать. и обновить учёт.
если есть куки (через JS можно получить), убрать кликабельность. ну если голосовалка для билинга.
//del

Overseer
сержант
Сообщения: 218
Зарегистрирован: 2008-03-20 23:00:42

Re: [JS] звёздочки, оценки сообщений...

Непрочитанное сообщение Overseer » 2012-02-17 12:13:56

установил этот биллинг - тормозит покруче, чем Wordpress обвешанный плагинами =О
еще и Smarty, бррр. зачем такой динозавр?

Аватара пользователя
Alex Keda
стреляли...
Сообщения: 35200
Зарегистрирован: 2004-10-18 14:25:19
Откуда: Made in USSR
Контактная информация:

Re: [JS] звёздочки, оценки сообщений...

Непрочитанное сообщение Alex Keda » 2012-02-17 19:48:23

Overseer писал(а):установил этот биллинг - тормозит покруче, чем Wordpress обвешанный плагинами =О
еще и Smarty, бррр. зачем такой динозавр?
работает. код открытый - можно под себя доработать.

больше ничего и не надо
Убей их всех! Бог потом рассортирует...