Hola. A continuación les comparto como utilizar el framework de Semantic UI para utilizar ratings que se pueden cambiar. Por favor de revisar las capturas para apreciar el resultado final.

Primero cambiaremos algunos templates. Los cambios abajo son utilizando el tema predeterminado y ajustes pueden ser necesarios dependiendo de sus estilos.

1. Para este tutorial solo usaremos el modulo de ratings de Semantic UI. Abrir el template `headerinclude` y agregar al final:
   
   Código:

   <script src="https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.4.1/components/rating.min.js" integrity="sha256-jprk9qns6QqU1UWGtHMwug9A/ls7tVMV8p2mueJlj74=" crossorigin="anonymous"></script>

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.4.1/components/rating.min.css" integrity="sha256-rvfNRXAaYgOVCEbNgSflI9FdWFSre18sLFjJKkiuV6w=" crossorigin="anonymous" />
   
   
2. Abrir el template `showthread_ratethread` y reemplazar por el siguiente código:
   
   Código:

   <div style="margin-top: 6px; padding-right: 10px;" class="float_right">
<div class="ui star rating" data-rating="{$thread['averagerating']}" data-max-rating="5" id="rating_thread_{$thread['tid']}"></div>
<script>
$('#rating_thread_{$thread['tid']}').rating({
initialRating: {$thread['averagerating']},
maxRating: 5,
clearable: false,
interactive: <if (int)$mybb->user['uid'] && (int)$mybb->user['uid'] === (int)$thread['uid'] then>false<else>true</if>,
onRate: function (rating) {
$.ajax(
{
url: '{$mybb->settings['bburl']}/ratethread.php?ajax=1&my_post_key='+my_post_key+'&tid={$thread['tid']}&rating='+rating,
async: true,
method: 'post',
dataType: 'json',
complete: function (request)
{
var json = JSON.parse(request.responseText);
if(json.hasOwnProperty("errors"))
{
$.each(json.errors, function(i, error)
{
$.jGrowl(lang.ratings_update_error + ' ' + error, {theme:'jgrowl_error'});
});
}
else if(json.hasOwnProperty("success"))
{
return true;
}
}
});
return false;
}
});
</script>
</div>
   
   
3. Abrir el template `forumdisplay_threadlist_rating` y reemplazar por el siguiente código (aqui solo eliminamos el JavaScript de MyBB):
   
   Código:

   <td class="tcat" align="center" width="80">
<span class="smalltext"><strong><a href="{$sorturl}&amp;sortby=rating&amp;order=desc">{$lang->rating}</a> {$orderarrow['rating']}</strong></span>
</td>
   
   
4. Abrir el template `forumdisplay_thread_rating` y reemplazar por el siguiente código:
   
   Código:

   <td align="center" class="{$bgcolor}{$thread_type_class}">
<div class="ui star rating" data-rating="{$thread['averagerating']}" data-max-rating="5" id="rating_thread_{$thread['tid']}"></div>
<script>
$('#rating_thread_{$thread['tid']}').rating({
initialRating: {$thread['averagerating']},
maxRating: 5,
interactive: <if (int)$mybb->user['uid'] && (int)$mybb->user['uid'] === (int)$thread['uid'] then>false<else>true</if>,
onRate: function (rating) {
$.ajax(
{
url: '{$mybb->settings['bburl']}/ratethread.php?ajax=1&my_post_key='+my_post_key+'&tid={$thread['tid']}&rating='+rating,
async: true,
method: 'post',
dataType: 'json',
complete: function (request)
{
var json = JSON.parse(request.responseText);
if(json.hasOwnProperty("errors"))
{
$.each(json.errors, function(i, error)
{
$.jGrowl(lang.ratings_update_error + ' ' + error, {theme:'jgrowl_error'});
});
}
else if(json.hasOwnProperty("success"))
{
return true;
}
}
});
return false;
}
});
</script>
</td>
   
   
5. Finalmente, importan el documento adjunto utilizando el plugin Hooks.
   

Al finalizar estas modificaciones sus usuarios deberían poder cambiar sus rating sin problemas. Por ele momento no es posible remover el rating pero es posible hacerlo con otra hook, en un futuro puede que actualice este tutorial con dicha modificación.


También se puede utilizar la opción de corazones en lugar de estrellas. Para eso es necesario cambiar `ui star rating` por `ui heart rating` en las dos ocasiones en que aparece en el código de arriba.

Otra idea posible es el poder utilizar las dos versiones (corazones o estrellas) dependiendo del foro o incluso dependiendo del tema. Pero eso sera para otro dia.

<!-- reservado -->