<?xml version="1.0" encoding="utf-8"?>
<templates>
<template type="admin" title="th_import_config_dpr_reactions" version_id="1001191" version_string="1.0.11 Patch Level 1"><![CDATA[<h3 class="block-header">
{{ phrase('th_map_reactions_reactions') }}
</h3>
<xf:foreach loop="$postRatings" value="$rating">
<xf:selectrow label="{$rating.title}" name="config[reaction_map][{$rating.id}]">
<xf:option value="0">{{ phrase('th_add_reaction_reactions') }}</xf:option>
<xf:foreach loop="$reactions" value="$reaction">
<xf:option value="{$reaction.reaction_id}" selected="{{ ($reaction.title == $rating.title) ? 1 : 0 }}">{$reaction.title}</xf:option>
</xf:foreach>
</xf:selectrow>
</xf:foreach>
<h3 class="block-header">
{{ phrase('th_map_reaction_types_reactions') }}
</h3>
<xf:macro name="reaction_type_map_selectrow" arg-label="Positive" arg-name="config[reaction_type_map][1]" arg-value="positive" arg-reactionTypes="{$reactionTypes}" />
<xf:macro name="reaction_type_map_selectrow" arg-label="Neutral" arg-name="config[reaction_type_map][0]" arg-value="neutral" arg-reactionTypes="{$reactionTypes}" />
<xf:macro name="reaction_type_map_selectrow" arg-label="Negative" arg-name="config[reaction_type_map][-1]" arg-value="negative" arg-reactionTypes="{$reactionTypes}" />
<xf:macro name="reaction_type_map_selectrow" arg-label="!" arg-name="!" arg-value="!" arg-reactionTypes="!">
<xf:selectrow name="{$name}" label="{$label}" value="{$value}">
<xf:foreach loop="$reactionTypes" value="$reactionType">
<xf:option value="{$reactionType.reaction_type_id}">{$reactionType.title}</xf:option>
</xf:foreach>
</xf:selectrow>
</xf:macro>]]></template>
<template type="admin" title="th_import_step_config_dpr_reactions" version_id="1001191" version_string="1.0.11 Patch Level 1"><![CDATA[]]></template>
<template type="admin" title="th_reaction_delete_reactions" version_id="1001470" version_string="1.0.14"><![CDATA[<xf:title>{{ phrase('confirm_action') }}</xf:title>
<xf:form action="{{ link('th-reactions/delete', $reaction) }}" ajax="true" class="block">
<div class="block-container">
<div class="block-body">
<xf:inforow rowtype="confirm">
{{ phrase('please_confirm_that_you_want_to_delete_following:') }}
<strong>{{ th_reaction($reaction) }}<a href="{{ link('th-reactions/edit', $reaction) }}">{$reaction.title}</a></strong>
</xf:inforow>
</div>
<xf:submitrow rowtype="simple" icon="delete" />
</div>
</xf:form>]]></template>
<template type="admin" title="th_reaction_edit_reactions" version_id="1001470" version_string="1.0.14"><![CDATA[<xf:if is="$reaction.isInsert()">
<xf:title>{{ phrase('th_add_reaction_reactions') }}</xf:title>
<xf:else />
<xf:title>{{ phrase('th_edit_reaction_reactions') }}: {$reaction.title}</xf:title>
</xf:if>
<xf:css src="public:th_reactions.less" />
<xf:pageaction if="$reaction.isUpdate()">
<span class="js-reactionPreview"></span>
<xf:button href="{{ link('th-reactions/delete', $reaction) }}" icon="delete" overlay="true" />
</xf:pageaction>
<xf:form action="{{ link('th-reactions/save', $reaction) }}" ajax="true" class="block-container">
<h2 class="block-tabHeader tabs hScroller" data-xf-init="tabs h-scroller" role="tablist">
<span class="hScroller-scroll">
<a class="tabs-tab is-active" role="tab" tabindex="0" data-controls="reaction-general">{{ phrase('th_general_reactions') }}</a>
<a class="tabs-tab" role="tab" tabindex="0" data-controls="reaction-styling">{{ phrase('th_styling_reactions') }}</a>
<a class="tabs-tab" role="tab" tabindex="0" data-controls="reaction-criteria">{{ phrase('th_criteria_reactions') }}</a>
<xf:macro template="helper_criteria" name="user_tabs" />
<a class="tabs-tab" role="tab" tabindex="0" data-controls="reaction-options">{{ phrase('options') }}</a>
</span>
</h2>
<ul class="tabPanes">
<li class="is-active" role="tabpanel" id="reaction-general">
<div class="block-body">
<xf:textboxrow label="{{ phrase('title') }}" name="title" value="{$reaction.title}" />
<hr class="formRowSep" />
<xf:textboxrow label="{{ phrase('display_order') }}" name="display_order"
value="{$reaction.display_order}" min="0" step="1" type="number" />
<xf:selectrow label="{{ phrase('th_reaction_type_reactions') }}" name="reaction_type_id" value="{$reaction.reaction_type_id}">
<xf:option />
<xf:options source="{$reactionTypes}" />
<xf:explain>{{ phrase('th_reaction_type_explain_reactions') }}</xf:explain>
</xf:selectrow>
<hr class="formRowSep" />
<xf:checkboxrow>
<xf:option name="enabled" label="{{ phrase('enabled') }}" selected="$reaction.enabled" hint="{{ phrase('th_enabled_hint_reactions') }}" />
<xf:option name="random" label="{{ phrase('th_random_reaction_reactions') }}" selected="$reaction.random" hint="{{ phrase('th_random_reaction_hint_reactions') }}" />
<xf:option name="like_wrapper" label="{{ phrase('th_like_wrapper_reactions') }}" selected="$reaction.like_wrapper" hint="{{ phrase('th_like_wrapper_hint_reactions') }}" />
<xf:option name="is_default" label="{{ phrase('threact_default_reaction') }}" selected="$reaction.is_default" hint="{{ phrase('threact_default_reaction_hint') }}" />
</xf:checkboxrow>
</div>
</li>
<li role="tabpanel" id="reaction-styling">
<div class="block-body">
<xf:radiorow label="{{ phrase('th_styling_type_reactions') }}" name="styling_type">
<xf:option value="image" label="{{ phrase('th_image_reactions') }}"
selected="{$reaction.styling_type} == 'image'" data-xf-init="disabler"
data-container=".js-imageContainer" data-hide="yes" />
<xf:option value="text" label="{{ phrase('th_text_emoji_reactions') }}"
selected="{$reaction.styling_type} == 'text'" data-xf-init="disabler"
data-container=".js-textContainer" data-hide="yes" />
<xf:option value="css_class" label="{{ phrase('th_css_class_reactions') }}"
selected="{$reaction.styling_type} == 'css_class'" data-xf-init="disabler"
data-container=".js-CSSClassContainer" data-hide="yes" />
<xf:option value="html_css" label="{{ phrase('th_html_css_reactions') }}"
selected="{$reaction.styling_type} == 'html_css'" data-xf-init="disabler"
data-container=".js-HTMLCSSClassContainer" data-hide="yes" />
<xf:explain>{{ phrase('th_styling_type_explain_reactions') }}</xf:explain>
</xf:radiorow>
<div class="js-imageContainer">
<xf:textboxrow label="{{ phrase('image_replacement_url') }}" name="image_url" value="{$reaction.image_url}" />
<div class="js-image2x">
<xf:textboxrow label="{{ phrase('2x_image_replacement_url') }}" name="image_url_2x" value="{$reaction.image_url_2x}">
<xf:hint>{{ phrase('optional') }}</xf:hint>
<xf:explain>{{ phrase('2x_image_replacement_url_explain') }}</xf:explain>
</xf:textboxrow>
</div>
<xf:radiorow label="{{ phrase('th_image_type_reactions') }}" name="image_type">
<xf:option value="normal" label="{{ phrase('th_normal_image_reactions') }}"
selected="{$reaction.image_type} == 'normal'" data-xf-init="disabler"
data-container=".js-imageNormalContainer, .js-image2x" data-hide="yes" />
<xf:option value="sprite" label="{{ phrase('th_sprite_image_reactions') }}"
selected="{$reaction.image_type} == 'sprite'" data-xf-init="disabler"
data-container=".js-imageSpriteContainer" data-hide="yes" />
<xf:explain>{{ phrase('th_image_type_explain_reactions') }}</xf:explain>
</xf:radiorow>
<div class="js-imageNormalContainer">
<xf:formrow label="{{ phrase('th_image_dimensions_reactions') }}" rowtype="input">
<div class="inputGroup">
<xf:textbox name="styling[image_normal][w]" value="{$reaction.styling.image_normal.w}" min="1"
title="{{ phrase('width') }}" type="number" data-xf-init="tooltip" />
<span class="inputGroup-text">x</span>
<xf:textbox name="styling[image_normal][h]" value="{$reaction.styling.image_normal.h}" min="1"
title="{{ phrase('height') }}" type="number" data-xf-init="tooltip" />
<span class="inputGroup-text">|</span>
<xf:textbox name="styling[image_normal][u]" value="{$reaction.styling.image_normal.u}"
placeholder="{{ phrase('unit') }}" />
</div>
</xf:formrow>
<xf:checkboxrow>
<xf:option name="styling[image_normal][style_dimensions]" label="{{ phrase('th_style_dimensions_reactions') }}" selected="{$reaction.styling.image_normal.style_dimensions}" hint="{{ phrase('th_style_dimensions_hint_reactions') }}" />
</xf:checkboxrow>
</div>
<div class="js-imageSpriteContainer">
<xf:formrow label="{{ phrase('sprite_dimensions') }}" rowtype="input">
<div class="inputGroup">
<xf:textbox name="styling[image_sprite][w]" value="{$reaction.styling.image_sprite.w}" min="1"
title="{{ phrase('width') }}" type="number" data-xf-init="tooltip" />
<span class="inputGroup-text">x</span>
<xf:textbox name="styling[image_sprite][h]" value="{$reaction.styling.image_sprite.h}" min="1"
title="{{ phrase('height') }}" type="number" data-xf-init="tooltip" />
<span class="inputGroup-text">{{ phrase('units_pixels') }}</span>
</div>
</xf:formrow>
<xf:formrow label="{{ phrase('sprite_position') }}" rowtype="input">
<div class="inputGroup">
<xf:textbox name="styling[image_sprite][x]" value="{$reaction.styling.image_sprite.x}"
title="{{ phrase('background_position_x') }}" type="number" data-xf-init="tooltip" />
<span class="inputGroup-text">x</span>
<xf:textbox name="styling[image_sprite][y]" value="{$reaction.styling.image_sprite.y}"
title="{{ phrase('background_position_y') }}" type="number" data-xf-init="tooltip" />
<span class="inputGroup-text">{{ phrase('units_pixels') }}</span>
</div>
</xf:formrow>
<xf:textboxrow label="{{ phrase('unit') }}" name="styling[image_sprite][u]" value="{$reaction.styling.image_sprite.u}" />
<xf:textboxrow label="{{ phrase('background_size') }}" name="styling[image_sprite][bs]" value="{$reaction.styling.image_sprite.bs}">
<xf:explain>{{ phrase('background_size_explain') }}</xf:explain>
</xf:textboxrow>
</div>
</div>
<div class="js-textContainer">
<xf:textboxrow label="{{ phrase('th_reaction_text_reactions') }}" name="reaction_text" value="{$reaction.reaction_text}">
<xf:explain>{{ phrase('th_reaction_text_explain_reactions') }}</xf:explain>
</xf:textboxrow>
</div>
<div class="js-CSSClassContainer">
<xf:textboxrow label="{{ phrase('th_css_class_reactions') }}" name="reaction_text" value="{$reaction.reaction_text}">
<xf:explain>{{ phrase('th_css_class_explain_reactions') }}</xf:explain>
</xf:textboxrow>
</div>
<div class="js-HTMLCSSClassContainer">
<div class="block-body" data-xf-init="code-editor-switcher-container" data-template-suffix-mode="1">
<xf:codeeditorrow name="styling[html_css][html]" value="{$reaction.styling.html_css.html}" label="{{ phrase('th_html_code_reactions') }}"
mode="html" rowclass="js-codeEditorContainer js-htmlEditorContainer"
data-submit-selector=".js-submitButton">
<xf:explain>
{{ phrase('th_html_code_explain_reactions') }}
</xf:explain>
</xf:codeeditorrow>
</div>
<hr class="formRowSep" />
<div class="block-body" data-xf-init="code-editor-switcher-container" data-template-suffix-mode="1">
<xf:codeeditorrow name="styling[html_css][css]" value="{$reaction.styling.html_css.css}" label="{{ phrase('th_css_code_reactions') }}"
mode="css" rowclass="js-codeEditorContainer js-cssEditorContainer"
data-submit-selector=".js-submitButton">
<xf:explain>
{{ phrase('th_css_code_explain_reactions') }}
</xf:explain>
</xf:codeeditorrow>
</div>
</div>
</div>
</li>
<li role="tabpanel" id="reaction-criteria">
<div class="block-body">
<xf:checkboxrow rowid="reactHandler" label="{{ phrase('th_content_handlers_reactions') }}"
name="react_handler[]" listclass="listColumns"
value="{$reaction.react_handler}">
<xf:hint><label><input type="checkbox" name="react_handler_all" value="1" data-xf-init="check-all"
data-container="#reactHandler" /> {{ phrase('select_all') }}</label></xf:hint>
<xf:explain>{{ phrase('th_content_handlers_explain_reactions') }}</xf:explain>
<xf:foreach loop="$reactHandlers" key="$id" value="$title">
<xf:option value="{{ $id }}" label="{{ $title }}"
selected="{$reaction.react_handler.{$id}}" data-xf-init="react-handler"
data-href="{{ link('th-reactions/handler') }}"
data-container=".js-reactHandler-{{ $id }}" data-hide="yes" />
</xf:foreach>
</xf:checkboxrow>
<xf:foreach loop="$reactHandlers" key="$id" value="$title">
<div class="js-reactHandler-{{ $id }}">
{{ $reactHandlersOptions.{$id}|raw }}
</div>
</xf:foreach>
</div>
</li>
<xf:macro template="helper_criteria" name="user_panes"
arg-criteria="{{ $userCriteria.getCriteriaForTemplate() }}"
arg-data="{{ $userCriteria.getExtraTemplateData() }}" />
<li role="tabpanel" id="reaction-general">
<div class="block-body">
<xf:checkboxrow>
<xf:option name="options[alerts]" label="{{ phrase('th_send_alerts_reactions') }}" selected="$reaction.options.alerts" hint="{{ phrase('th_send_alerts_hint_reactions') }}" />
<xf:option name="options[newsfeed]" label="{{ phrase('th_publish_newsfeed_reactions') }}" selected="$reaction.options.newsfeed" hint="{{ phrase('th_publish_newsfeed_hint_reactions') }}" />
<xf:option name="options[prevent_unreact]" label="{{ phrase('th_prevent_unreact_reactions') }}" selected="$reaction.options.prevent_unreact" hint="{{ phrase('th_prevent_unreact_hint_reactions') }}" />
<xf:option label="{{ phrase('th_max_per_day_user_reactions') }}" selected="{$reaction.options.user_max_per_day}" hint="{{ phrase('th_max_per_day_user_hint_reactions') }}">
<xf:textbox label="" name="options[user_max_per_day]" value="{$reaction.options.user_max_per_day}" min="1" step="1" type="number" />
</xf:option>
</xf:checkboxrow>
</div>
</li>
<xf:submitrow class="js-submitButton" sticky="true" icon="save">
<xf:html>
<xf:button type="submit" icon="save" name="exit" accesskey="s">{{ phrase('save_and_exit') }}</xf:button>
</xf:html>
</xf:submitrow>
</ul>
</xf:form>
<xf:js>
/** @param {jQuery} $ jQuery Object */
!function($, window, document)
{
"use strict";
XF.ReactHandler = XF.extend(XF.Disabler, {
__backup: {
'click': '_click'
},
options: $.extend({}, XF.Disabler.prototype.options, {
href: ''
}),
click: function()
{
if (this.$target.is(':checked:enabled') && this.options.href) {
if (this.xhr)
{
this.xhr.abort();
}
this.xhr = XF.ajax(
'post',
this.options.href,
{ react_handler_id: this.$target.val() },
$.proxy(this, 'showReactHandlerOptions'),
{ global: false, error: true }
);
}
this._click();
},
showReactHandlerOptions: function(results)
{
if (this.xhr)
{
this.xhr = false;
}
var $container = this.$container;
if (results.options_rendered)
{
$container.html(results.options_rendered);
}
},
});
XF.Element.register('react-handler', 'XF.ReactHandler');
}
(jQuery, window, document);
$(document).ready(function () {
$('.js-codeEditorContainer .CodeMirror').click(function() {
var codeMirror = $(this)[0].CodeMirror;
codeMirror.refresh();
});
$("input").on("input", debounce(function () {
generatePreview();
}, 500));
$('.js-codeEditorContainer .CodeMirror').each(function () {
var codeMirror = $(this)[0].CodeMirror;
codeMirror.on('change', function(cm, change) {
generatePreview();
});
});
function debounce(func, wait, immediate) {
var timeout;
return function() {
var context = this, args = arguments;
var later = function() {
timeout = null;
if (!immediate) func.apply(context, args);
};
var callNow = immediate && !timeout;
clearTimeout(timeout);
timeout = setTimeout(later, wait);
if (callNow) func.apply(context, args);
};
};
function generatePreview() {
var output = '<span class="reaction" title="' + {$reaction.title|json} + '">';
var css = '';
var reactionId = "{$reaction.reaction_id|json}";
var stylingType = $("input[name='styling_type']:checked").val();
if (stylingType == 'image') {
var imageUrl = $("input[name='image_url']").val();
var imageType = $("input[name='image_type']:checked").val();
if (imageType == 'normal') {
var width = $("input[name='styling[image_normal][w]']").val();
var height = $("input[name='styling[image_normal][h]']").val();
var unit = $("input[name='styling[image_normal][u]']").val();
output += '<img src="' + imageUrl + '" width="' + width + unit + '" height="' + height + unit + '" />';
}
if (imageType == 'sprite') {
var width = $("input[name='styling[image_sprite][w]']").val();
var height = $("input[name='styling[image_sprite][h]']").val();
var unit = $("input[name='styling[image_sprite][u]']").val();
var bsX = $("input[name='styling[image_sprite][x]']").val();
var bsY = $("input[name='styling[image_sprite][y]']").val();
var reactionClass = 'reaction--sprite reaction--sprite' + reactionId;
output += '<img class="' + reactionClass + '" src="data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==" style="width: ' + width + unit + '; height: ' + height + unit + '; background: url(\'' + imageUrl + '\') no-repeat ' + bsX + unit + ' ' + bsY + unit + ';" />';
}
}
if (stylingType == 'text') {
var reactionText = $("input[name='reaction_text']:visible").val();
output += reactionText;
}
if (stylingType == 'css_class') {
var reactionText = $("input[name='reaction_text']:visible").val();
output += '<i class="' + reactionText + '"></i>';
}
output += '</span>';
if (stylingType == 'html_css') {
var htmlCM = $('.js-htmlEditorContainer .CodeMirror')[0].CodeMirror;
var cssCM = $('.js-cssEditorContainer .CodeMirror')[0].CodeMirror;
if (reactionId) {
editorHtml = htmlCM.getValue().replace(/\{reactionId\}/g, reactionId);
editorCss = cssCM.getValue().replace(/\{reactionId\}/g, reactionId);
}
output += editorHtml;
css = editorCss;
}
var html = '<span class="reaction reaction-dev">' + output + '</span>' + css + '</style>';
$('.js-reactionPreview').html(html);
}
generatePreview();
});
</xf:js>]]></template>
<template type="admin" title="th_reaction_handler_post_reactions" version_id="1001191" version_string="1.0.11 Patch Level 1"><![CDATA[<xf:formrow rowtype="input" label="{{ phrase('th_allowed_forums_reactions') }}">
<ul class="inputList">
<li>
<xf:select name="options[allowed_node_ids][]" value="{$reaction.options.allowed_node_ids}" size="7" multiple="multiple" class="js-applicableForums">
<xf:option value="all" selected="{$reaction.options.allowed_node_ids} == 'all'">{{ phrase('(all)') }}</xf:option>
<xf:foreach loop="$nodeTree.getFlattened(0)" value="$treeEntry">
<xf:option value="{$treeEntry.record.node_id}"
disabled="{{ $treeEntry.record.node_type_id == 'Category' }}"
label="{{ repeat(' ', $treeEntry.depth)|raw }} {$treeEntry.record.title}"
selected="{$treeEntry.record.node_type_id} == 'Forum' && ({$reaction.options.allowed_node_ids} == 'all' || {{ in_array({$treeEntry.record.node_id}, {$reaction.options.allowed_node_ids}) }})" />
</xf:foreach>
</xf:select>
</li>
<xf:hiddenval name="nodeCount">{{ count($nodeTree.getFlattened(0)) }}</xf:hiddenval>
</ul>
</xf:formrow>
<xf:formrow rowtype="input" label="{{ phrase('th_disabled_forums_reactions') }}">
<ul class="inputList">
<li>
<xf:select name="options[disabled_node_ids][]" value="{$reaction.options.disabled_node_ids}" size="7" multiple="multiple" class="js-applicableForums">
<xf:option value="none" selected="{$reaction.options.disabled_node_ids} == 'none' || !{$reaction.options.disabled_node_ids}">{{ phrase('(none)') }}</xf:option>
<xf:foreach loop="$nodeTree.getFlattened(0)" value="$treeEntry">
<xf:option value="{$treeEntry.record.node_id}"
disabled="{{ $treeEntry.record.node_type_id == 'Category' }}"
label="{{ repeat(' ', $treeEntry.depth)|raw }} {$treeEntry.record.title}"
selected="{$treeEntry.record.node_type_id} == 'Forum' && ({$reaction.options.allowed_node_ids} != 'none' && {{ in_array({$treeEntry.record.node_id}, {$reaction.options.disabled_node_ids}) }})" />
</xf:foreach>
</xf:select>
</li>
<xf:hiddenval name="nodeCount">{{ count($nodeTree.getFlattened(0)) }}</xf:hiddenval>
</ul>
</xf:formrow>]]></template>
<template type="admin" title="th_reaction_import_reactions" version_id="1001470" version_string="1.0.14"><![CDATA[<xf:title>{{ phrase('th_import_reactions_reactions') }}</xf:title>
<xf:form action="{{ link('th-reactions/import') }}" upload="true" ajax="true" class="block">
<div class="block-container">
<div class="block-body">
<xf:uploadrow name="upload" accept=".xml"
label="{{ phrase('import_from_uploaded_xml_file') }}"
hint="{{ phrase('th_reactions_pre_import_explain_ml') }}"/>
</div>
<xf:submitrow submit="{{ phrase('proceed...') }}" />
</div>
</xf:form>]]></template>
<template type="admin" title="th_reaction_list_reactions" version_id="1001470" version_string="1.0.14"><![CDATA[<xf:title>{{ phrase('th_reactions') }}</xf:title>
<xf:pageaction>
<div class="buttonGroup">
<xf:button href="{{ link('th-reactions/add') }}" icon="add">{{ phrase('th_add_reaction_reactions') }}</xf:button>
<xf:button href="{{ link('th-reactions/import') }}" icon="import" />
<xf:if is="$reactions">
<xf:button href="{{ link('th-reactions', null, {'export': ($exportView ? '' : '1')}) }}" icon="export" />
</xf:if>
</div>
</xf:pageaction>
<xf:css src="public:th_reactions.less" />
<xf:css>
.dataList-cell.dataList-cell--imageSmall .reaction img
{
padding: 3px;
}
</xf:css>
<xf:if is="$reactions is not empty">
<xf:form action="{{ link(($exportView ? 'th-reactions/export' : 'th-reactions/toggle')) }}"
ajax="{{ $exportView ? false : true }}" class="block"
>
<div class="block-outer">
<xf:macro template="filter_macros" name="quick_filter" arg-key="reactions" arg-class="block-outer-opposite" />
</div>
<div class="block-container">
<div class="block-body">
<xf:datalist>
<xf:foreach loop="{$reactions}" key="$reactionId" value="$reaction">
<tbody class="dataList-rowGroup">
<xf:datarow>
<xf:if is="$exportView">
<xf:toggle name="export[]" value="{$reaction.reaction_id}" />
</xf:if>
<xf:cell href="{{ link('th-reactions/edit', $reaction) }}" class="dataList-cell--min dataList-cell--image dataList-cell--imageSmall">
{{ th_reaction($reaction, 'admin', true) }}
</xf:cell>
<xf:cell href="{{ link('th-reactions/edit', $reaction) }}">
{$reaction.title} <xf:if is="!{$reaction.random}"><span style="color: {{ $reaction.ReactionType.color }};">({{ $reaction.ReactionType.title }})</span><xf:else /><span>({{ phrase('th_random_reaction_reactions') }})</span></xf:if>
</xf:cell>
<xf:if is="!$exportView">
<xf:toggle name="enabled[{$reactionId}]" selected="$reaction.enabled" class="dataList-cell--separated" submit="true" />
<xf:delete href="{{ link('th-reactions/delete', $reaction) }}" />
</xf:if>
</xf:datarow>
</tbody>
</xf:foreach>
</xf:datalist>
</div>
<div class="block-footer block-footer--split">
<span class="block-footer-counter">{{ display_totals($reactions) }}</span>
<xf:if is="$exportView">
<span class="block-footer-select"><xf:checkbox standalone="true"><xf:option check-all=".dataList" label="{{ phrase('select_all') }}" /></xf:checkbox></span>
<span class="block-footer-controls"><xf:button type="submit" icon="export" accesskey="s" /></span>
</xf:if>
</div>
</div>
</xf:form>
<xf:else />
<div class="blockMessage">{{ phrase('th_no_reactions_have_been_added_yet_reactions') }}</div>
</xf:if>]]></template>
<template type="admin" title="th_reaction_tool_list_reactions" version_id="1001191" version_string="1.0.11 Patch Level 1"><![CDATA[<xf:title>{{ phrase('th_reaction_tools_reactions') }}</xf:title>
<xf:if is="$success">
<div class="blockMessage blockMessage--success blockMessage--iconic">{{ phrase('cache_rebuilt_successfully') }}</div>
</xf:if>
<xf:if is="$hasStoppedManualJobs">
<div class="blockMessage blockMessage--important blockMessage--iconic">
{{ phrase('there_manual_rebuild_jobs_awaiting_completion_continue_running', {'link': link('tools/run-job')}) }}
</div>
</xf:if>
<xf:form action="{{ link('tools/rebuild') }}" class="block">
<div class="block-container">
<h2 class="block-header">{{ phrase('th_convert_likes_to_reactions_reactions') }}</h2>
<div class="block-body">
<xf:inforow>{{ phrase('th_this_will_convert_likes_into_reactions') }}</xf:inforow>
</div>
<xf:submitrow submit="{{ phrase('rebuild_now') }}" />
</div>
<xf:hiddenval name="job">ThemeHouse\Reactions:ConvertLike</xf:hiddenval>
</xf:form>
<xf:form action="{{ link('tools/rebuild') }}" class="block">
<div class="block-container">
<h2 class="block-header">{{ phrase('th_convert_reactions_to_likes_reactions') }}</h2>
<div class="block-body">
<xf:inforow>{{ phrase('th_this_will_convert_reactions_into_likes_reactions') }}</xf:inforow>
</div>
<xf:submitrow submit="{{ phrase('rebuild_now') }}" />
</div>
<xf:hiddenval name="job">ThemeHouse\Reactions:ConvertLikeReaction</xf:hiddenval>
</xf:form>
<xf:form action="{{ link('tools/rebuild') }}" class="block">
<div class="block-container">
<h2 class="block-header">{{ phrase('th_rebuild_reacts_counted_status_reactions') }}</h2>
<div class="block-body">
<xf:selectrow name="options[type]"
label="{{ phrase('content_type') }}">
<xf:option value="">{{ phrase('all') }}</xf:option>
<xf:options source="{{ $xf.app.getContentTypePhrases(true, 'react_handler_class') }}" />
</xf:selectrow>
</div>
<xf:submitrow submit="{{ phrase('rebuild_now') }}" />
</div>
<xf:hiddenval name="job">ThemeHouse\Reactions:ReactIsCounted</xf:hiddenval>
</xf:form>
<xf:form action="{{ link('tools/rebuild') }}" class="block">
<div class="block-container">
<h2 class="block-header">{{ phrase('th_rebuild_content_react_counts_reactions') }}</h2>
<div class="block-body">
<xf:selectrow name="options[type]"
label="{{ phrase('content_type') }}">
<xf:option value="">{{ phrase('all') }}</xf:option>
<xf:options source="{{ $xf.app.getContentTypePhrases(true, 'react_handler_class') }}" />
</xf:selectrow>
</div>
<xf:submitrow submit="{{ phrase('rebuild_now') }}" />
</div>
<xf:hiddenval name="job">ThemeHouse\Reactions:ContentReactCount</xf:hiddenval>
</xf:form>
<xf:form action="{{ link('tools/rebuild') }}" class="block">
<div class="block-container">
<h2 class="block-header">{{ phrase('th_rebuild_user_react_total_reactions') }}</h2>
<xf:submitrow submit="{{ phrase('rebuild_now') }}" />
</div>
<xf:hiddenval name="job">ThemeHouse\Reactions:UserReactTotal</xf:hiddenval>
</xf:form>
<xf:form action="{{ link('tools/rebuild') }}" class="block">
<div class="block-container">
<h2 class="block-header">{{ phrase('th_rebuild_user_reaction_count_reactions') }}</h2>
<xf:checkboxrow>
<xf:option name="options[truncate]">{{ phrase('delete_index_before_rebuilding') }}</xf:option>
</xf:checkboxrow>
<xf:submitrow submit="{{ phrase('rebuild_now') }}" />
</div>
<xf:hiddenval name="job">ThemeHouse\Reactions:UserReactionCount</xf:hiddenval>
</xf:form>
<xf:form action="{{ link('tools/rebuild') }}" class="block">
<div class="block-container">
<h2 class="block-header">{{ phrase('th_remove_unassociated_reactions_reactions') }}</h2>
<xf:submitrow submit="{{ phrase('rebuild_now') }}" />
</div>
<xf:hiddenval name="job">ThemeHouse\Reactions:RemoveUnassociatedReactions</xf:hiddenval>
</xf:form>
<xf:form action="{{ link('reaction-tools/addon') }}" class="block">
<div class="block-container">
<h2 class="block-header">{{ phrase('th_rebuild_addon_columns_reactions') }}</h2>
<xf:submitrow submit="{{ phrase('rebuild_now') }}" />
</div>
</xf:form>]]></template>
<template type="admin" title="th_reaction_type_delete_reactions" version_id="1001191" version_string="1.0.11 Patch Level 1"><![CDATA[<xf:title>{{ phrase('confirm_action') }}</xf:title>
<xf:form action="{{ link('reaction-types/delete', $reactionType) }}" ajax="true" class="block">
<div class="block-container">
<div class="block-body">
<xf:inforow rowtype="confirm">
{{ phrase('please_confirm_that_you_want_to_delete_following:') }}
<strong><a href="{{ link('reaction-types/edit', $reactionType) }}">{$reactionType.title}</a></strong>
</xf:inforow>
</div>
<xf:submitrow rowtype="simple" icon="delete" />
</div>
</xf:form>]]></template>
<template type="admin" title="th_reaction_type_edit_reactions" version_id="1001191" version_string="1.0.11 Patch Level 1"><![CDATA[<xf:if is="$reactionType.isInsert()">
<xf:title>{{ phrase('th_add_reaction_type_reactions') }}</xf:title>
<xf:else />
<xf:title>{{ phrase('th_edit_reaction_type_reactions') }}: {$reactionType.title}</xf:title>
</xf:if>
<xf:pageaction if="$reactionType.isUpdate()">
<xf:button href="{{ link('reaction-types/delete', $reactionType) }}" icon="delete" overlay="true" />
</xf:pageaction>
<xf:css src="public:color_picker.less" />
<xf:js src="xf/color_picker.js" min="1" />
<xf:form action="{{ link('reaction-types/save', $reactionType) }}" ajax="true" class="block-container">
<div class="block-body">
<xf:textboxrow label="{{ phrase('th_reaction_type_id_reactions') }}" name="reaction_type_id" value="{$reactionType.reaction_type_id}" class="{{ {$reactionType.reaction_type_id} ? 'is-disabled' : '' }}" readonly="{{ {$reactionType.reaction_type_id} ? 'readonly' : '' }}">
<xf:explain>{{ !$reactionType.reaction_type_id ? phrase('th_reaction_type_id_explain_reactions') : '' }}</xf:explain>
</xf:textboxrow>
<hr class="formRowSep" />
<xf:textboxrow label="{{ phrase('title') }}" name="title" value="{$reactionType.title}" />
<xf:textboxrow label="{{ phrase('display_order') }}" name="display_order"
value="{$reactionType.display_order}" min="0" step="10" type="number" />
<hr class="formRowSep" />
<xf:formrow
label="{{ phrase('color') }}"
rowclass="formRow--input"
>
<div class="inputGroup inputGroup--joined inputGroup--color"
data-xf-init="color-picker"
data-map-name="{$reactionType.color}"
>
<xf:textbox name="color" value="{$reactionType.color}" />
<div class="inputGroup-text"><span class="colorPickerBox js-colorPickerTrigger"></span></div>
</div>
</xf:formrow>
<hr class="formRowSep" />
<xf:comment>
<xf:checkboxrow>
<xf:option name="notable_member" label="{{ phrase('th_reaction_notable_member_entry_reactions') }}" selected="$reactionType.notable_member" hint="{{ phrase('th_reaction_notable_member_entry_hint_reactions') }}" />
</xf:checkboxrow>
</xf:comment>
</div>
<xf:submitrow sticky="true" icon="save" />
</xf:form>]]></template>
<template type="admin" title="th_reaction_type_list_reactions" version_id="1001191" version_string="1.0.11 Patch Level 1"><![CDATA[<xf:title>{{ phrase('th_reaction_types_reactions') }}</xf:title>
<xf:pageaction>
<div class="buttonGroup">
<xf:button href="{{ link('reaction-types/add') }}" icon="add">{{ phrase('th_add_reaction_type_reactions') }}</xf:button>
</div>
</xf:pageaction>
<xf:css src="public:th_reactions.less" />
<xf:if is="$reactionTypes is not empty">
<xf:form action="{{ link('reaction-types/toggle') }}"
ajax="true" class="block"
>
<div class="block-outer">
<xf:macro template="filter_macros" name="quick_filter" arg-key="reaction-types" arg-class="block-outer-opposite" />
</div>
<div class="block-container">
<div class="block-body">
<xf:datalist>
<xf:foreach loop="{$reactionTypes}" key="$reactionTypeId" value="$reactionType">
<tbody class="dataList-rowGroup">
<xf:datarow>
<xf:cell href="{{ link('reaction-types/edit', $reactionType) }}" class="dataList-cell--min dataList-cell--image dataList-cell--imageSmall">
<img src="data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==" style="background-color: {{ $reactionType.color }};" />
</xf:cell>
<xf:cell href="{{ link('reaction-types/edit', $reactionType) }}">
{$reactionType.title}
</xf:cell>
<xf:delete href="{{ link('reaction-types/delete', $reactionType) }}" />
</xf:datarow>
</tbody>
</xf:foreach>
</xf:datalist>
</div>
</div>
</xf:form>
<xf:else />
<div class="blockMessage">{{ phrase('th_no_reactions_types_have_been_added_yet_reactions') }}</div>
</xf:if>]]></template>
<template type="admin" title="th_style_property_reaction_bar_position_reactions" version_id="1001470" version_string="1.0.14"><![CDATA[<xf:formrow label="{$titleHtml}" hint="{$hintHtml}" rowclass="{$rowClass}" explain="{$property.description}" rowtype="input">
<div class="inputGroup">
<xf:foreach loop="{{ th_react_handlers() }}" key="$contentType" value="$reactHandler">
<xf:if is="$reactHandler.object.getReactionBarPositions()">
<xf:radiorow label="{{ $reactHandler.object.getTitle() }}" name="{$formBaseKey}[{$contentType}]">
<xf:foreach loop="$reactHandler.object.getReactionBarPositions()" key="$positionId" value="$positionPhrase">
<xf:option value="{{ $positionId }}" label="{{ $positionPhrase }}" selected="{$property.property_value.{$contentType}} == $positionId"/>
</xf:foreach>
</xf:radiorow>
</xf:if>
</xf:foreach>
</div>
</xf:formrow>]]></template>
<template type="admin" title="th_style_property_template_dimensions_reactions" version_id="1001191" version_string="1.0.11 Patch Level 1"><![CDATA[<xf:formrow label="{$titleHtml}" hint="{$hintHtml}" rowclass="{$rowClass}" explain="{$property.description}" rowtype="input">
<div class="inputGroup">
<xf:textbox name="{$formBaseKey}[width]" value="{$property.property_value.width}" min="1"
title="{{ phrase('width') }}" type="number" data-xf-init="tooltip" />
<span class="inputGroup-text">x</span>
<xf:textbox name="{$formBaseKey}[height]" value="{$property.property_value.height}" min="1"
title="{{ phrase('height') }}" type="number" data-xf-init="tooltip" />
<span class="inputGroup-text">|</span>
<xf:textbox name="{$formBaseKey}[unit]" value="{$property.property_value.unit}"
placeholder="{{ phrase('unit') }}" />
</div>
</xf:formrow>]]></template>
<template type="admin" title="threact_criteria_user" version_id="1001191" version_string="1.0.11 Patch Level 1"><![CDATA[<xf:checkboxrow label="{{ phrase('threact_reactions') }}">
<xf:option name="user_criteria[threact_min_reactions][rule]" value="threact_min_reactions" selected="{$criteria.threact_min_reactions}"
label="{{ phrase('threact_user_has_received_at_least_x_reactions:') }}">
<xf:numberbox name="user_criteria[threact_min_reactions][data][reactions]" value="{$criteria.threact_min_reactions.reactions}"
size="5" min="0" step="1" />
</xf:option>
<xf:option name="user_criteria[threact_max_reactions][rule]" value="threact_max_reactions" selected="{$criteria.threact_max_reactions}"
label="{{ phrase('threact_user_has_received_no_more_than_x_reactions:') }}">
<xf:numberbox name="user_criteria[threact_max_reactions][data][reactions]" value="{$criteria.threact_max_reactions.reactions}"
size="5" min="0" step="1" />
</xf:option>
</xf:checkboxrow>
<hr class="formRowSep" />]]></template>
<template type="admin" title="widget_def_options_th_memberReact_reactions" version_id="1001191" version_string="1.0.11 Patch Level 1"><![CDATA[]]></template>
<template type="public" title="_help_page_threactions" version_id="1001370" version_string="1.0.13"><![CDATA[<xf:if is="$reactions is not empty">
<xf:foreach loop="$reaction_types" value="$reaction_type">
<div class="block">
<div class="block-container">
<xf:datalist data-xf-init="responsive-data-list">
<xf:datarow rowtype="header">
<xf:cell class="dataList-cell--min" style="background-color: {$reaction_type.color};">
<img src="data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==">
</xf:cell>
<xf:cell>{$reaction_type.title}</xf:cell>
</xf:datarow>
<xf:foreach loop="{$reactions.{$reaction_type.reaction_type_id}}" value="$reaction">
<xf:datarow rowclass="dataList-row--noHover">
<xf:cell class="dataList-cell--min dataList-cell--imageSmall dataList-cell--alt">
<img src="/{$reaction.image_url}" />
</xf:cell>
<xf:main label="{$reaction.title}" />
</xf:datarow>
</xf:foreach>
</xf:datalist>
</div>
</div>
</xf:foreach>
<xf:else />
<div class="blockMessage">{{ phrase('no_items_have_been_created_yet') }}</div>
</xf:if>]]></template>
<template type="public" title="alert_conversation_message_react" version_id="1001470" version_string="1.0.14"><![CDATA[<xf:css src="th_reactions.less" />
{{ phrase('th_x_reacted_y_to_your_message_in_conversation_z_reactions', {
'name': username_link($sender, false, {'defaultname': $alert.username}),
'title': '<a href="' . link('conversations/messages', $content) . '">' . $content.Conversation.title . '</a>',
'reaction': th_reaction($alert.extra_data.reaction_id, 'alert')
}) }}]]></template>
<template type="public" title="alert_post_react" version_id="1001470" version_string="1.0.14"><![CDATA[<xf:css src="th_reactions.less" />
{{ phrase('th_x_reacted_y_to_your_post_in_thread_z_reactions', {
'name': username_link($sender, false, {'defaultname': $alert.username}),
'reaction': th_reaction($alert.extra_data.reaction_id, 'alert'),
'title': '<a href="' . link('posts', $content) . '" class="fauxBlockLink-blockLink">' . prefix('thread', $content.Thread) . $content.Thread.title . '</a>'
}) }}]]></template>
<template type="public" title="alert_profile_post_comment_react" version_id="1001470" version_string="1.0.14"><![CDATA[<xf:css src="th_reactions.less" />
<xf:if is="$xf.visitor.user_id == $content.ProfilePost.user_id">
{{ phrase('th_x_reacted_y_your_comment_on_your_profile_post_reactions', {
'name': username_link($user, false, {'defaultname': $alert.username}),
'reaction': th_reaction($alert.extra_data.reaction_id, 'alert'),
'post_attributes': 'href="' . link('profile-posts/comments', $content) . '" class="fauxBlockLink-blockLink"'
}) }}
<xf:else />
{{ phrase('th_x_reacted_y_your_comment_on_zs_profile_post_reactions', {
'name': username_link($user, false, {'defaultname': $alert.username}),
'reaction': th_reaction($alert.extra_data.reaction_id, 'alert'),
'post_attributes': 'href="' . link('profile-posts/comments', $content) . '" class="fauxBlockLink-blockLink"',
'poster': $content.ProfilePost.username
}) }}
</xf:if>]]></template>
<template type="public" title="alert_profile_post_react" version_id="1001470" version_string="1.0.14"><![CDATA[<xf:css src="th_reactions.less" />
<xf:if is="$xf.visitor.user_id == $content.ProfileUser.user_id">
{{ phrase('th_x_reacted_y_your_status_reactions', {
'name': username_link($user, false, {'defaultname': $alert.username}),
'reaction': th_reaction($alert.extra_data.reaction_id, 'alert'),
'status_attributes': 'href="' . link('profile-posts', $content) . '" class="fauxBlockLink-blockLink"'
}) }}
<xf:else />
{{ phrase('th_x_reacted_y_your_post_on_zs_profile_reactions', {
'name': username_link($user, false, {'defaultname': $alert.username}),
'reaction': th_reaction($alert.extra_data.reaction_id, 'alert'),
'post_attributes': 'href="' . link('profile-posts', $content) . '" class="fauxBlockLink-blockLink"',
'profile': $content.ProfileUser.username
}) }}
</xf:if>]]></template>
<template type="public" title="alert_resource_update_react" version_id="1001470" version_string="1.0.14"><![CDATA[<xf:css src="th_reactions.less" />
{{ phrase('th_x_reacted_y_your_resource_z_reactions', {
'name': username_link($sender, false, {'defaultname': $alert.username}),
'reaction': th_reaction($alert.extra_data.reaction_id, 'alert'),
'title': '<a href="' . link('resources', $content.Resource) . '" class="fauxBlockLink-blockLink">' . $content.title . '</a>'
}) }}]]></template>
<template type="public" title="alert_xfmg_album_react" version_id="1001470" version_string="1.0.14"><![CDATA[<xf:css src="th_reactions.less" />
{{ phrase('threactions_x_reacted_y_your_album_z', {
'name': username_link($sender, false, {'defaultname': $alert.username}),
'reaction': th_reaction($alert.extra_data.reaction_id, 'alert'),
'title': '<a href="' . link('album', $content) . '" class="fauxBlockLink-blockLink">' . $content.title . '</a>'
}) }}]]></template>
<template type="public" title="alert_xfmg_comment_react" version_id="1001470" version_string="1.0.14"><![CDATA[<xf:css src="th_reactions.less" />
{{ phrase('threactions_x_reacted_y_to_your_comment_on_z', {
'name': username_link($sender, false, {'defaultname': $alert.username}),
'title': '<a href="' . link($content.content_type === 'xfmg_media' ? 'media/comments' : 'album/comments', $content) . '">' . ($content.content_type === 'xfmg_media' ? $content.Media.title : $content.Album.title) . '</a>',
'reaction': th_reaction($alert.extra_data.reaction_id, 'alert')
}) }}]]></template>
<template type="public" title="alert_xfmg_media_react" version_id="1001470" version_string="1.0.14"><![CDATA[<xf:css src="th_reactions.less" />
{{ phrase('th_x_reacted_y_your_media_z_reactions', {
'name': username_link($sender, false, {'defaultname': $alert.username}),
'reaction': th_reaction($alert.extra_data.reaction_id, 'alert'),
'title': '<a href="' . link('media', $content) . '" class="fauxBlockLink-blockLink">' . $content.title . '</a>'
}) }}]]></template>
<template type="public" title="news_feed_item_post_react" version_id="1001470" version_string="1.0.14"><![CDATA[<xf:css src="th_reactions.less" />
<div class="contentRow-title">
<xf:if is="$content.user_id == $xf.visitor.user_id">
{{ phrase('th_x_reacted_y_your_post_in_the_thread_z_reactions', {
'name': username_link($user, false, {'defaultname': $fallbackName}),
'reaction': th_reaction($newsFeed.extra_data.reaction_id, 'newsfeed'),
'title': '<a href="' . link('posts', $content) . '">' . prefix('thread', $content.Thread) . $content.Thread.title . '</a>'
}) }}
<xf:else />
{{ phrase('th_w_reacted_x_ys_post_in_the_thread_z_reactions', {
'name': username_link($user, false, {'defaultname': $fallbackName}),
'reaction': th_reaction($newsFeed.extra_data.reaction_id, 'newsfeed'),
'posterParams': 'href="' . link('posts', $content) . '"',
'poster': $content.username,
'title': '<a href="' . link('posts', $content) . '">' . prefix('thread', $content.Thread) . $content.Thread.title . '</a>'
}) }}
</xf:if>
</div>
<div class="contentRow-snippet">{{
snippet($content.message, $xf.options.newsFeedMessageSnippetLength, {'stripQuote': true})
}}</div>
<div class="contentRow-minor"><xf:date time="{$newsFeed.event_date}" /></div>]]></template>
<template type="public" title="news_feed_item_profile_post_comment_react" version_id="1001470" version_string="1.0.14"><![CDATA[<xf:css src="th_reactions.less" />
<xf:set var="$fallbackName" value="{{ phrase('unknown_member') }}" />
<div class="contentRow-title">
<xf:if is="$content.user_id == $xf.visitor.user_id">
{{ phrase('th_x_reacted_y_your_comment_on_zs_profile_post_reactions', {
'name': username_link($user, false, {'defaultname': $fallbackName}),
'post_attributes': 'href="' . link('profile-posts/comments', $content) . '"',
'poster': $content.ProfilePost.username,
'reaction': th_reaction($newsFeed.extra_data.reaction_id, 'newsfeed')
}) }}
<xf:elseif is="$content.ProfilePost.user_id == $xf.visitor.user_id" />
{{ phrase('th_x_reacted_y_your_comment_on_zs_profile_post_reactions', {
'name': username_link($user, false, {'defaultname': $fallbackName}),
'post_attributes': 'href="' . link('profile-posts/comments', $content) . '"',
'poster': $content.ProfilePost.username,
'reaction': th_reaction($newsFeed.extra_data.reaction_id, 'newsfeed')
}) }}
<xf:else />
{{ phrase('th_x_reacted_y_zs_comment_on_zzs_profile_post_reactions', {
'name': username_link($user, false, {'defaultname': $fallbackName}),
'post_params': 'href="' . link('profile-posts/comments', $content) . '"',
'poster': $content.username,
'profile': $content.ProfilePost.username,
'reaction': th_reaction($newsFeed.extra_data.reaction_id, 'newsfeed')
}) }}
</xf:if>
</div>
<div class="contentRow-snippet">{{
snippet($content.message, $xf.options.newsFeedMessageSnippetLength, {'stripQuote': true})
}}</div>
<div class="contentRow-minor"><xf:date time="{$newsFeed.event_date}" /></div>]]></template>
<template type="public" title="news_feed_item_profile_post_react" version_id="1001470" version_string="1.0.14"><![CDATA[<xf:css src="th_reactions.less" />
<xf:set var="$fallbackName" value="{{ phrase('unknown_member') }}" />
<div class="contentRow-title">
<xf:if is="$content.user_id == $content.profile_user_id">
<xf:if is="$content.user_id == $xf.visitor.user_id">
{{ phrase('th_x_reacted_y_your_status_reactions', {
'name': username_link($liker, false, {'defaultname': $fallbackName}),
'status_attributes': 'href="' . link('profile-posts', $profilePost) . '"',
'reaction': th_reaction($newsFeed.extra_data.reaction_id, 'newsfeed')
}) }}
<xf:else />
{{ phrase('th_x_reacted_y_zs_status_reactions', {
'name': username_link($user, false, {'defaultname': $fallbackName}),
'status_params': 'href="' . link('profile-posts', $content) . '"',
'poster': $content.username,
'reaction': th_reaction($newsFeed.extra_data.reaction_id, 'newsfeed')
}) }}
</xf:if>
<xf:else />
<xf:if is="$content.user_id == $xf.visitor.user_id">
{{ phrase('th_x_reacted_y_your_post_on_zs_profile_reactions', {
'name': username_link($user, false, {'defaultname': $fallbackName}),
'post_attributes': 'href="' . link('profile-posts', $content) . '"',
'profile': $content.ProfileUser.username,
'reaction': th_reaction($newsFeed.extra_data.reaction_id, 'newsfeed')
}) }}
<xf:elseif is="$content.ProfileUser.user_id == $xf.visitor.user_id" />
{{ phrase('th_x_reacted_y_zs_post_on_your_profile_reactions', {
'name': username_link($user, false, {'defaultname': $fallbackName}),
'post_params': 'href="' . link('profile-posts', $content) . '"',
'poster': $content.username,
'reaction': th_reaction($newsFeed.extra_data.reaction_id, 'newsfeed')
}) }}
<xf:else />
{{ phrase('th_x_reacted_y_zs_post_on_zzs_profile_reactions', {
'name': username_link($user, false, {'defaultname': $fallbackName}),
'post_params': 'href="' . link('profile-posts', $content) . '"',
'poster': $content.username,
'profile': $content.ProfileUser.username,
'reaction': th_reaction($newsFeed.extra_data.reaction_id, 'newsfeed')
}) }}
</xf:if>
</xf:if>
</div>
<div class="contentRow-snippet">{{
snippet($content.message, $xf.options.newsFeedMessageSnippetLength, {'stripQuote': true})
}}</div>
<div class="contentRow-minor"><xf:date time="{$newsFeed.event_date}" /></div>]]></template>
<template type="public" title="news_feed_item_resource_update_react" version_id="1001470" version_string="1.0.14"><![CDATA[<xf:css src="th_reactions.less" />
<div class="contentRow-title">
<xf:if is="$content.user_id == $xf.visitor.user_id">
{{ phrase('th_x_reacted_y_your_resource_z_reactions', {
'name': username_link($user, false, {'defaultname': $fallbackName}),
'reaction': th_reaction($newsFeed.extra_data.reaction_id, 'newsfeed'),
'title': '<a href="' . link('resources', $content.Resource) . '">' . $content.Resource.title . '</a>'
}) }}
<xf:else />
{{ phrase('th_w_reacted_x_ys_resource_z_reactions', {
'name': username_link($user, false, {'defaultname': $fallbackName}),
'reaction': th_reaction($newsFeed.extra_data.reaction_id, 'newsfeed'),
'poster': $content.Resource.username,
'title': '<a href="' . link('resources', $content.Resource) . '">' . $content.Resource.title . '</a>'
}) }}
</xf:if>
</div>
<xf:comment>
<div class="contentRow-snippet">{{
snippet($content.description, $xf.options.newsFeedMessageSnippetLength, {'stripQuote': true})
}}</div>
</xf:comment>
<div class="contentRow-minor"><xf:date time="{$newsFeed.event_date}" /></div>]]></template>
<template type="public" title="news_feed_item_xfmg_album_react" version_id="1001470" version_string="1.0.14"><![CDATA[<xf:css src="th_reactions.less" />
<div class="contentRow-title">
<xf:if is="$content.user_id == $xf.visitor.user_id">
{{ phrase('threactions_x_reacted_y_your_album_z', {
'name': username_link($user, false, {'defaultname': $fallbackName}),
'reaction': th_reaction($newsFeed.extra_data.reaction_id, 'newsfeed'),
'title': '<a href="' . link('album', $content) . '">' . $content.title . '</a>'
}) }}
<xf:else />
{{ phrase('threactions_w_reacted_x_ys_album_z', {
'name': username_link($user, false, {'defaultname': $fallbackName}),
'reaction': th_reaction($newsFeed.extra_data.reaction_id, 'newsfeed'),
'poster': $content.username,
'title': '<a href="' . link('album', $content) . '">' . $content.title . '</a>'
}) }}
</xf:if>
</div>
<xf:comment>
<div class="contentRow-snippet">{{
snippet($content.description, $xf.options.newsFeedMessageSnippetLength, {'stripQuote': true})
}}</div>
</xf:comment>
<div class="contentRow-minor"><xf:date time="{$newsFeed.event_date}" /></div>]]></template>
<template type="public" title="news_feed_item_xfmg_comment_react" version_id="1001470" version_string="1.0.14"><![CDATA[<xf:css src="th_reactions.less" />
<div class="contentRow-title">
<xf:if is="$content.user_id == $xf.visitor.user_id">
{{ phrase('threactions_x_reacted_y_to_your_comment_on_z', {
'name': username_link($user, false, {'defaultname': $fallbackName}),
'reaction': th_reaction($newsFeed.extra_data.reaction_id, 'newsfeed'),
'title': '<a href="' . link('media', $content.Media) . '">' . $content.Media.title . '</a>'
}) }}
<xf:else />
{{ phrase('threactions_w_reacted_x_ys_media_z', {
'name': username_link($user, false, {'defaultname': $fallbackName}),
'reaction': th_reaction($newsFeed.extra_data.reaction_id, 'newsfeed'),
'poster': $content.Media.username,
'title': '<a href="' . link('media', $content.Media) . '">' . $content.Media.title . '</a>'
}) }}
</xf:if>
</div>
<xf:comment>
<div class="contentRow-snippet">{{
snippet($content.description, $xf.options.newsFeedMessageSnippetLength, {'stripQuote': true})
}}</div>
</xf:comment>
<div class="contentRow-minor"><xf:date time="{$newsFeed.event_date}" /></div>]]></template>
<template type="public" title="news_feed_item_xfmg_media_react" version_id="1001470" version_string="1.0.14"><![CDATA[<xf:css src="th_reactions.less" />
<div class="contentRow-title">
<xf:if is="$content.user_id == $xf.visitor.user_id">
{{ phrase('th_x_reacted_y_your_media_z_reactions', {
'name': username_link($user, false, {'defaultname': $fallbackName}),
'reaction': th_reaction($newsFeed.extra_data.reaction_id, 'newsfeed'),
'title': '<a href="' . link('media', $content) . '">' . $content.title . '</a>'
}) }}
<xf:else />
{{ phrase('th_w_reacted_x_ys_media_z_reactions', {
'name': username_link($user, false, {'defaultname': $fallbackName}),
'reaction': th_reaction($newsFeed.extra_data.reaction_id, 'newsfeed'),
'poster': $content.username,
'title': '<a href="' . link('media', $content) . '">' . $content.title . '</a>'
}) }}
</xf:if>
</div>
<xf:comment>
<div class="contentRow-snippet">{{
snippet($content.description, $xf.options.newsFeedMessageSnippetLength, {'stripQuote': true})
}}</div>
</xf:comment>
<div class="contentRow-minor"><xf:date time="{$newsFeed.event_date}" /></div>]]></template>
<template type="public" title="th_confirm_reactions" version_id="1001470" version_string="1.0.14"><![CDATA[<xf:title>{{ $isReacted ? phrase('th_unreact_x_content_reactions', {'contentType': $contentType}) : phrase('th_react_x_content_reactions', {'contentType': $contentType}) }}</xf:title>
<xf:form action="{$confirmUrl}" class="block">
<div class="block-container">
<div class="block-body">
<xf:inforow rowtype="confirm">
<xf:if is="$isReacted">
<xf:if is="$reactionId">
{{ phrase('th_you_sure_you_want_to_unreact_x_this_content_reactions', {
'reaction': th_reaction($reactionId, 'alert')
}) }}
<xf:else />
{{ phrase('th_you_sure_you_want_to_unreact_this_content_reactions') }}
</xf:if>
<xf:else />
{{ phrase('th_you_sure_you_want_to_react_x_to_this_content_reactions', {
'reaction': th_reaction($reactionId, 'alert')
}) }}
<xf:if is="$contentTitle"><strong>{$contentTitle}</strong></xf:if>
</xf:if>
</xf:inforow>
</div>
<xf:submitrow icon="save" rowtype="simple" />
</div>
</xf:form>]]></template>
<template type="public" title="th_display_bar_internal_reactions" version_id="1001191" version_string="1.0.11 Patch Level 1"><![CDATA[<xf:if is="{$reactionContentList}">
<xf:if contentcheck="true">
<div class="reactions-left">
<xf:contentcheck>
{$reactionContentList|raw}
</xf:contentcheck>
</div>
</xf:if>
</xf:if>
<xf:if is="{$reactionList}">
<xf:if contentcheck="true">
<div class="reactions-right">
<xf:contentcheck>
{$reactionList|raw}
</xf:contentcheck>
</div>
</xf:if>
</xf:if>]]></template>
<template type="public" title="th_display_reactions" version_id="1001470" version_string="1.0.14"><![CDATA[<xf:macro name="reactions_bar"
arg-type="!"
arg-id="!"
arg-content="!">
<xf:if is="{{ th_react_handler_status($type) }}">
<xf:css src="th_reactions.less" />
<xf:include template="th_xfrm_jsOptions" />
<xf:js src="themehouse/reactions/react.js"
addon="ThemeHouse/Reactions"/>
<xf:if contentcheck="true">
<div class="reactions-bar reactions-bar--{{ property('thReactionsAnimation') }} content"
id="reactions-bar-{{ $content.{$id} }}">
<xf:contentcheck>
<xf:include template="th_display_bar_internal_reactions">
<xf:set var="$reactionContentList"
value="{{ th_reaction_content_list($content, $content.getReactUsers(), [$type, $content.{$id}, $content.user_id], true, property('thMaxReactionsMin'), 0) }}" />
<xf:set var="$reactionList"
value="{{ th_reaction_list($content, $content.getReactUsers(), [$type, $content.{$id}, $content.user_id]) }}" />
</xf:include>
</xf:contentcheck>
</div>
</xf:if>
</xf:if>
</xf:macro>
<xf:macro name="reactions_bit_list"
arg-type="!"
arg-id="!"
arg-content="!"
arg-reactUsers="!">
<xf:if is="{{ property('th_reactions_showOnThreadList') }}">
<xf:css src="th_reactions.less" />
<xf:if contentcheck="true">
<div class="reactions-bar bit-list" id="reactions-bar-{{ $content.{$id} }}">
<xf:contentcheck>
<xf:include template="th_display_bar_internal_reactions">
<xf:set var="$reactionContentList"
value="{{ th_reaction_content_list($content, $reactUsers, [$type, $content.{$id}, $content.user_id], false, 3, {$xf.options.th_reactionsLimit}, '', true) }}" />
</xf:include>
</xf:contentcheck>
</div>
</xf:if>
</xf:if>
</xf:macro>
<xf:macro name="react_postbit"
arg-reacts="!"
arg-reactsCount="!"
arg-displayType="!"
arg-displayLocation="other">
<xf:if is="$displayType === 'bar'">
<xf:macro name="react_total_bar"
arg-reacts="{$reacts}"
arg-reactsCount="{$reactsCount}"
arg-displayLocation="{$displayLocation}" />
</xf:if>
<xf:if is="$displayType === 'text'">
<xf:macro name="react_total_text"
arg-reacts="{$reacts}"
arg-reactsCount="{$reactsCount}"
arg-displayLocation="{$displayLocation}" />
</xf:if>
<xf:if is="$displayType === 'percentage'">
<xf:macro name="react_total_percentage"
arg-reacts="{$reacts}"
arg-reactsCount="{$reactsCount}"
arg-displayLocation="{$displayLocation}" />
</xf:if>
</xf:macro>
<xf:macro name="react_total_percentage" arg-reacts="!" arg-reactsCount="!" arg-displayLocation="other">
<xf:if contentcheck="true">
<div class="reacts_total_perc reacts_total_perc--{$displayLocation}">
<div class="pairs pairs--justified">
<dt>{{ phrase('th_reactions') }}</dt>
<dd>
<xf:contentcheck>
<xf:foreach loop="$xf.thReactionTypes"
key="$reactionTypeId"
value="$reactionType">
<xf:set var="$rtTotal"
value="{{ is_array($reacts.{$reactionTypeId}) ? count($reacts.{$reactionTypeId}) : $reacts.{$reactionTypeId} }}" />
<xf:set var="$segmentPerc"
value="{{ ((is_array($reacts.{$reactionTypeId}) ? count($reacts.{$reactionTypeId}) : $reacts.{$reactionTypeId}) / ($reactsCount ? $reactsCount : 1)) * 100 }}%" />
<span data-xf-init="tooltip"
title="{$reactionType.title}"
class="reacts_total_perc__reactionType reacts_total_perc__reactionType--{$reactionTypeId}"
style="color: {$reactionType.color}">
{$segmentPerc|number}%
</span>
</xf:foreach>
</xf:contentcheck>
</dd>
</div>
</div>
</xf:if>
</xf:macro>
<xf:macro name="react_total_text" arg-reacts="!" arg-reactsCount="!" arg-displayLocation="other">
<xf:if contentcheck="true">
<xf:css src="th_reactions.less" />
<div class="reacts_total_text reacts_total_text--{$displayLocation}">
<div class="pairs pairs--justified">
<dt>{{ phrase('th_reactions') }}</dt>
<dd>
<xf:contentcheck>
<xf:foreach loop="$xf.thReactionTypes" key="$reactionTypeId" value="$reactionType">
<xf:set var="$rtTotal" value="{{ is_array($reacts.{$reactionTypeId}) ? count($reacts.{$reactionTypeId}) : $reacts.{$reactionTypeId} }}" />
<span data-xf-init="tooltip"
title="{$reactionType.title}"
class="reacts_total_text__reactionType reacts_total_text__reactionType--{$reactionTypeId}" style="color: {$reactionType.color}">{$rtTotal|number}</span>
</xf:foreach>
</xf:contentcheck>
</dd>
</div>
</div>
</xf:if>
</xf:macro>
<xf:macro name="react_total_bar"
arg-reacts="!"
arg-reactsCount="!"
arg-class=""
arg-width="100%"
arg-displayLocation="other">
<xf:if is="$reactsCount">
<xf:if contentcheck="true">
<div class="react_total_bar react_total_bar--{$displayLocation} {{ $class }}">
<xf:contentcheck>
<xf:comment>Removed new lines since they break the total bar!</xf:comment>
<xf:foreach loop="$xf.thReactionTypes" key="$reactionTypeId" value="$reactionType">
<xf:set var="$rtTotal">{{ is_array($reacts.{$reactionTypeId}) ? count($reacts.{$reactionTypeId}) : $reacts.{$reactionTypeId} }}</xf:set>
<xf:set var="$segmentWidth" value="{{ ((is_array($reacts.{$reactionTypeId}) ? count($reacts.{$reactionTypeId}) : $reacts.{$reactionTypeId}) / {$reactsCount}) * 100 }}%" />
<div class="react_bar_segment react_bar_{{ $reactionTypeId }} Tooltip" title="{{ phrase('th_x_reactions_y_reactions', {'reactionType': $reactionType.title, 'total': (empty($rtTotal) ? '0' : $rtTotal) }) }}" style="background-color: {{ $reactionType.color }}; width: {$segmentWidth}" data-xf-init="tooltip"></div>
</xf:foreach>
</xf:contentcheck>
</div>
</xf:if>
</xf:if>
</xf:macro>]]></template>
<template type="public" title="th_reaction_content_list_reactions" version_id="1001191" version_string="1.0.11 Patch Level 1"><![CDATA[<ul>
<xf:foreach loop="$reacts" value="$react" if="$reacts">
<li class="th_reactions__listItem">
<xf:if is="$react.canReact">
<a href="{$react.url}" data-xf-click="react" data-reaction-bar="< .message | .reactions-bar">
{$react.rendered}
</a>
<xf:else />
<xf:comment> -- KC ideally want something like this
<a href="{{ $react.getHandler().getUnreactSingleLink($react.react_id) }}" data-xf-click="overlay">
{$react.rendered}
</a>
</xf:comment>
{$react.rendered}
</xf:if>
<xf:if is="{{ property('th_reactions__showTitles') }}">
<xf:if is="$react.title">
<span class="reaction-title">{$react.title}</span>
</xf:if>
</xf:if>
<xf:if is="{{ property('thReactionsDivider') != '' }}">
<span class="reaction-divider"> {{ property('thReactionsDivider') }} </span>
</xf:if>
<span class="reaction-count">{$react.count}</span>
</li>
</xf:foreach>
<xf:if is="$reactionListUrl">
<li>
<a class="list-reacts" href="{$reactionListUrl}" data-xf-click="overlay" data-nocache="true" rel="nofollow">{{ phrase('th_list_reactions_reactions') }}</a>
</li>
</xf:if>
</ul>]]></template>
<template type="public" title="th_reaction_list_reactions" version_id="1001470" version_string="1.0.14"><![CDATA[<div class="th_reactions__scrollContainer">
<div class="th_reactions__scroll th_reactions__leftScrollLeft">
<div class="th_reactions__scroll__iconWrap th_reactions__leftScrollLeft__iconWrap">
<i class="fa fa-chevron-left"></i>
</div>
</div>
<ul class="reactions-right__list">
<xf:comment> -- changed to undo by clicking on display KC
<xf:if is="$modifyReactLink">
<li class="modify_reacts">
<a href="{$modifyReactLink}"
data-xf-click="menu"
data-menu-pos-ref="< .modify_reacts"
aria-expanded="true"
aria-haspopup="true">
<span>{{ phrase('th_undo_reactions_reactions') }}</span>
</a>
<div class="menu menu--modify-reacts" data-menu="menu" aria-hidden="true"
data-href="{$modifyReactLink}"
data-load-target=".js-modifyReactsMenuBody"
data-nocache="true">
<div class="menu-content js-modifyReactsMenuBody">
<div class="menu-row">
{{ phrase('loading...') }}
</div>
</div>
</div>
</li>
</xf:if>
</xf:comment>
<xf:comment> Show Default Reaction first in list </xf:comment>
<xf:foreach loop="$reactions" value="$reaction" if="$reactions">
<xf:if is="$reaction.is_default">
<li class="th_reactions__reaction">
<a href="{$reaction.url}" data-xf-click="react" data-reaction-bar="< .message | .reactions-bar">
{$reaction.rendered}
</a>
</li>
</xf:if>
</xf:foreach>
<xf:foreach loop="$reactions" value="$reaction" if="$reactions">
<xf:if is="!$reaction.is_default">
<li class="th_reactions__reaction">
<a href="{$reaction.url}" data-xf-click="react" data-reaction-bar="< .message | .reactions-bar">
{$reaction.rendered}
</a>
</li>
</xf:if>
</xf:foreach>
</ul>
<div class="th_reactions__scroll th_reactions__rightScrollRight">
<div class="th_reactions__scroll__iconWrap th_reactions__rightScrollRight__iconWrap">
<i class="fa fa-chevron-right"></i>
</div>
</div>
</div>
<xf:if is="$unreactLink || $modifyReactLink">
<div class="modify_reacts">
<a data-xf-click="menu"
data-menu-pos-ref="< .modify_reacts"
aria-expanded="true"
aria-haspopup="true">
<span>{{ phrase('th_undo_reactions_reactions') }}</span>
</a>
<div class="menu menu--modify-reacts" data-menu="menu" aria-hidden="true"
data-href="{{ $unreactLink ?: $modifyReactLink }}"
data-load-target=".js-modifyReactsMenuBody"
data-nocache="true">
<div class="menu-content js-modifyReactsMenuBody">
<div class="menu-row">
{{ phrase('loading...') }}
</div>
</div>
</div>
</div>
</xf:if>
<xf:if is="!$unreactLink && $reactions && property('thReactionsAnimation') !== 'none'">
<xf:set var="$th_reactions_defaultTrigger" value="0" />
<xf:foreach loop="$reactions" value="$reaction" if="$reactions">
<xf:if is="$reaction.is_default">
<xf:set var="$th_reactions_defaultTrigger" value="1" />
<div class="th_reactions__trigger th_reactions__triggerPrimary">
<span href="{$reaction.url}" data-xf-click="react" data-reaction-bar="< .message | .reactions-bar">
{$reaction.rendered}
</span>
</div>
</xf:if>
</xf:foreach>
<xf:if is="!$th_reactions_defaultTrigger || property('th_reactions_secondaryTrigger')">
<div class="th_reactions__trigger th_reactions__triggerSecondary">
{{ th_reaction_trigger_icon() }}
</div>
</xf:if>
</xf:if>]]></template>
<template type="public" title="th_reaction_trigger_reactions" version_id="1001191" version_string="1.0.11 Patch Level 1"><![CDATA[<svg width="22px" height="22px" viewBox="0 0 256 219" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: Sketch 47 (45396) - http://www.bohemiancoding.com/sketch -->
<title>{{ phrase('th_reactions') }}</title>
<desc></desc>
<defs></defs>
<g id="Migration-Case-Studies" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="Reactions" transform="translate(-1.000000, -19.000000)">
<rect id="Bounds" transform="translate(128.000000, 128.000000) scale(-1, 1) rotate(-180.000000) translate(-128.000000, -128.000000) " x="0" y="0" width="256" height="256"></rect>
<g id="Icon" transform="translate(1.000000, 19.000000)" fill-rule="nonzero" fill="#2577B1">
<g id="Group">
<path d="M12.6792453,128 L12.6792453,128 L12.6792453,128 C5.67669147,128 -6.69081694e-15,122.323309 -1.0658141e-14,115.320755 L0,69.4339623 L-1.77635684e-15,69.4339623 C-2.63392235e-15,62.4314085 5.67669147,56.754717 12.6792453,56.754717 L12.6792453,56.754717 L12.6792453,56.754717 C19.6817991,56.754717 25.3584906,62.4314085 25.3584906,69.4339623 L25.3584906,115.320755 L25.3584906,115.320755 C25.3584906,122.323309 19.6817991,128 12.6792453,128 Z" id="Path"></path>
<g id="Group-2" transform="translate(30.188679, 0.000000)">
<g id="Path">
<path d="M92.1177324,49.1300158 C96.2977966,52.1298941 98.4774016,57.5059136 97.6115311,62.8522314 L89.6395515,113.434338 C88.1765291,125.344746 79.0699606,127.839694 71.6652754,127.839694 L14.2545795,127.839694 C6.49160314,127.839694 0.191649229,121.572621 0.191649229,113.850162 L0.191649229,59.9714097 L0.191649229,59.9714097 C0.191649229,58.4097219 1.18928789,57.0226086 2.66983015,56.5257554 L2.66983015,56.5257554 C3.53570059,56.2881412 10.1939457,54.2684212 16.9417636,49.486437 C26.5260537,42.7144345 31.601846,33.655396 31.601846,23.2894799 L31.601846,9.08478039 L31.6018298,9.08478039 C31.6018298,4.27346418 35.5021722,0.373121764 40.3134884,0.373121764 C42.1623866,0.373121764 43.9633399,0.961357158 45.455773,2.05271774 C45.455773,2.05271774 45.455773,2.05271774 45.455773,2.05271774 C49.277546,4.84468368 51.2182901,10.0424926 51.2182901,17.4976357 L51.2182901,43.8431016 C51.2182901,45.3281898 52.4424518,46.5459622 53.9353318,46.5459622 L83.9666072,46.5459622 C86.9225098,46.5162604 89.7291243,47.4073134 92.1177324,49.1300158 Z" id="path-1"></path>
</g>
</g>
</g>
<g id="Group" transform="translate(192.000000, 154.566038) rotate(180.000000) translate(-192.000000, -154.566038) translate(128.000000, 90.566038)">
<path d="M12.6792453,128 L12.6792453,128 L12.6792453,128 C5.67669147,128 7.96299287e-15,122.323309 7.10542736e-15,115.320755 L0,69.4339623 L1.77635684e-15,69.4339623 C9.18791329e-16,62.4314085 5.67669147,56.754717 12.6792453,56.754717 L12.6792453,56.754717 L12.6792453,56.754717 C19.6817991,56.754717 25.3584906,62.4314085 25.3584906,69.4339623 L25.3584906,115.320755 L25.3584906,115.320755 C25.3584906,122.323309 19.6817991,128 12.6792453,128 Z" id="Path"></path>
<path d="M122.306411,49.1300158 C126.486476,52.1298941 128.666081,57.5059136 127.80021,62.8522314 L119.82823,113.434338 C118.365208,125.344746 109.25864,127.839694 101.853954,127.839694 L44.4432585,127.839694 C36.6802821,127.839694 30.3803282,121.572621 30.3803282,113.850162 L30.3803282,59.9714097 L30.3803282,59.9714097 C30.3803282,58.4097219 31.3779669,57.0226086 32.8585092,56.5257554 L32.8585092,56.5257554 C33.7243796,56.2881412 40.3826247,54.2684212 47.1304426,49.486437 C56.7147327,42.7144345 61.790525,33.655396 61.790525,23.2894799 L61.790525,9.08478039 L61.7905088,9.08478039 C61.7905088,4.27346418 65.6908512,0.373121764 70.5021674,0.373121764 C72.3510656,0.373121764 74.1520189,0.961357158 75.644452,2.05271774 C75.644452,2.05271774 75.644452,2.05271774 75.644452,2.05271774 C79.466225,4.84468368 81.4069691,10.0424926 81.4069691,17.4976357 L81.4069691,43.8431016 C81.4069691,45.3281898 82.6311308,46.5459622 84.1240108,46.5459622 L114.155286,46.5459622 C117.111189,46.5162604 119.917803,47.4073134 122.306411,49.1300158 Z" id="path-3"></path>
</g>
</g>
</g>
</g>
</svg>]]></template>
<template type="public" title="th_reactions.less" version_id="1001470" version_string="1.0.14"><![CDATA[<xf:comment>Fix for animation flicker of other elements</xf:comment>
.p-body {
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
}
.modify_reacts {
margin: 4px 0 4px 10px;
display: inline-block;
}
.th_reactions__triggerSecondary {
margin-left: 10px;
}
.th_reactions__triggerPrimary img {
pointer-events: none;
}
.reactions-bar
{
.m-clearFix();
display: flex;
align-items: center;
justify-content: space-between;
margin: 10px 0;
}
.reactions-bar.content
{
margin: 0;
.xf-th_reactions__barStyle();
padding-top: 0;
padding-bottom: 0;
}
.reactions-bar.bit-list
{
float: right;
margin: 0;
@media (max-width: @xf-responsiveMedium) {display: none;}
.reactions-left {
margin-right: -5px;
.th_reactions__listItem {
// transform: scale(.75);
img {height: 14px; width: 14px;}
}
}
}
.structItem-minor {
// clear: both;
}
.reactions-bar ul
{
padding: 0px;
margin: 0px;
list-style-type: none;
display: inline-flex;
align-items: center;
}
.reactions-left > ul { flex-wrap: wrap; }
.structItem .reactions-bar {
margin-top: 0;
font-size: 12px;
margin-left: 5px;
ul {max-height: 21px;}
.reactions-left .th_reactions__listItem {line-height: 16px;}
}
.reactions-bar li
{
display: flex;
align-items: inherit;
img {
vertical-align: middle;
height: 18px;
}
}
.th_reactions__reaction {
flex: 0 0 auto;
}
.reactions-bar .reactions-left
{
.m-clearFix();
margin-right: auto;
display: flex;
justify-items: left;
.th_reactions__listItem
{
margin-right: 5px;
.xf-th_reactions__listItemStyle();
span {
padding: 2px;
vertical-align: middle;
}
.reaction-count {
.xf-th_reactions__listItemRightStyle();
}
}
}
.reactions-bar .reactions-right
{
.m-clearFix();
margin-left: auto;
display: flex;
justify-items: right;
align-items: center;
li
{
padding-left: 5px;
}
}
.unreact-link {
height: 42px;
line-height: 42px;
}
.th_reactions__trigger {
cursor: pointer;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
.xf-th_reactions__triggerStyle();
.th_reactions__trigger__image {
.xf-th_triggerImageStyling_reactions();
}
svg path {
fill: @xf-th_reactions__triggerStyle--color;
}
span {
display: flex;
align-items: center;
}
/*
&:hover {
transform: scale(1, 1);
animation-name: th_reactions_triggerHover;
animation-duration: 0.3s;
animation-direction: normal;
animation-fill-mode: both;
}
&--hoverOut {
//transform: scale(1.2, 1.2);
animation-name: th_reactions_triggerHover;
animation-duration: 0.3s;
animation-direction: reverse;
animation-fill-mode: both;
}
*/
}
.reactions-bar .list-reactions
{
}
.reacts_total_text .reacts_total_text__reactionType:after,
.reacts_total_perc .reacts_total_perc__reactionType:after
{
content: "|";
padding-left: 2px;
color: @xf-textColor;
}
.reacts_total_text .reacts_total_text__reactionType:last-child:after,
.reacts_total_perc .reacts_total_perc__reactionType:last-child:after
{
content: "";
}
.react-modify .menu-row
{
padding: 0;
margin: 0;
}
.reactions-bar a
{
text-decoration: none;
white-space: nowrap;
}
.reaction
{
display: flex;
max-width: none;
display: inline-block;
vertical-align: middle;
}
.reaction-item
{
display: flex;
align-items: center;
.reaction-title
{
padding-left: 5px;
}
}
/* Handling display for specific classes */
.reaction.alert img,
.reaction.bit-list img
{
max-width: 20px;
vertical-align: middle;
}
.reaction.newsfeed img,
.reaction.list img,
{
max-width: 20px;
vertical-align: sub;
}
.react_total_bar
{
padding: 0;
margin: 0;
width: 100%;
display: flex;
height: 16px;
border-radius: @xf-borderRadiusSmall;
overflow: hidden;
display: flex;
.react_bar_segment
{
display: inline-block;
height: inherit;
min-width: 3px;
}
&--top {
margin-top: @xf-paddingSmall;
}
}
.overlay-content .react_total_bar {border-radius: 0 !important;}
.reactOverviewBlocks
{
.m-listPlain();
display: flex;
flex-wrap: wrap;
align-items: stretch;
> li
{
.has-no-flexbox &
{
display: inline-block;
vertical-align: top;
}
width: 33.3%;
max-width: 100%;
padding: @xf-blockPaddingV @xf-blockPaddingH;
@media (max-width: 1150px)
{
width: 50%;
}
@media (max-width: 580px)
{
width: 100%;
}
}
}
.reactOverviewBlock
{
display: flex;
flex-direction: column;
}
.has-no-touchevents .reactOverviewBlock .reactOverviewBlock-list li
{
.contentRow-extra
{
opacity: 0;
}
&:hover .contentRow-extra
{
opacity: 1;
}
}
.reactOverviewBlock-list
{
.m-listPlain();
> li
{
margin: @xf-paddingMedium 0;
}
}
<xf:if is="{{ $thReactions }}">
<xf:foreach loop="{{ $thReactions }}" key="$reactionId" value="$reaction">
<xf:if is="$reaction.styling_type == 'image'">
<xf:if is="$reaction.image_type == 'sprite' && $reaction.image_sprite_css">
.reaction--sprite.reaction--sprite{$reactionId}
{
{$reaction.image_sprite_css|raw}
}
<xf:elseif is="$reaction.image_type == 'normal' && $reaction.image_url" />
.reaction--normal.reaction--normal{$reactionId}
{
<xf:if is="$reaction.styling.image_normal.style_dimensions">
width: @{thReactionsImageDimensions[width]}@{thReactionsImageDimensions[unit]};
height: @{thReactionsImageDimensions[height]}@{thReactionsImageDimensions[unit]};
<xf:else />
width: {$reaction.styling.image_normal.w}{$reaction.styling.image_normal.u};
height: {$reaction.styling.image_normal.h}{$reaction.styling.image_normal.u};
</xf:if>
}
</xf:if>
</xf:if>
<xf:if is="$reaction.styling_type == 'html_css'">
{$reaction.styling.html_css.css|raw}
</xf:if>
</xf:foreach>
</xf:if>
//linear
.linear(@start, @end, @ratio) {
@linear: @start + ((@end - @start) * @ratio)
}
//ease
.ease(@start, @end, @ratio) {
@ease: @start + ((@end - @start) * (pow(@ratio, 2) / (pow(@ratio, 2) + pow((1 - @ratio), 2))))
}
// wobbly
.tween(@start, @end, @ratio) {
@tween: @start + (-0.5 * pow(2.71828, (-6 * @ratio)) * (-2 * pow(2.71828, (6 * @ratio)) + sin(12 * @ratio) + 2 * cos(12 * @ratio))) * (@end - @start);
}
.tween2(@start, @end, @ratio) {
@tween2: @start + (-0.5 * pow(2.71828, (-6 * @ratio)) * (-2 * pow(2.71828, (6 * @ratio)) + sin(12 * @ratio) + 2 * cos(12 * @ratio))) * (@end - @start);
}
.tween3(@start, @end, @ratio) {
@tween3: @start + (-0.5 * pow(2.71828, (-6 * @ratio)) * (-2 * pow(2.71828, (6 * @ratio)) + sin(12 * @ratio) + 2 * cos(12 * @ratio))) * (@end - @start);
}
// gentle wobble
.tweenGentle(@start, @end, @ratio) {
@tweenGentle: @start + (((7 * pow(2.71828, (-7 * @ratio)) * sin(sqrt(71) * @ratio)) / sqrt(71)) - (pow(2.71828, (-7 * @ratio)) * cos(sqrt(71) * @ratio)) + 1) * (@end - @start);
}
.tweenGentle2(@start, @end, @ratio) {
@tweenGentle2: @start + (((7 * pow(2.71828, (-7 * @ratio)) * sin(sqrt(71) * @ratio)) / sqrt(71)) - (pow(2.71828, (-7 * @ratio)) * cos(sqrt(71) * @ratio)) + 1) * (@end - @start);
}
.tweenGentle3(@start, @end, @ratio) {
@tweenGentle3: @start + (((7 * pow(2.71828, (-7 * @ratio)) * sin(sqrt(71) * @ratio)) / sqrt(71)) - (pow(2.71828, (-7 * @ratio)) * cos(sqrt(71) * @ratio)) + 1) * (@end - @start);
}
// no wobble
.tweenStiff(@start, @end, @ratio) {
@tweenStiff: @start + (pow(2.71828, (-13 * @ratio)) * (pow(2.71828, (13 * @ratio)) - 13 * sin(@ratio) - cos(@ratio))) * (@end - @start);
}
.tweenStiff2(@start, @end, @ratio) {
@tweenStiff2: @start + (pow(2.71828, (-13 * @ratio)) * (pow(2.71828, (13 * @ratio)) - 13 * sin(@ratio) - cos(@ratio))) * (@end - @start);
}
.tweenStiff3(@start, @end, @ratio) {
@tweenStiff3: @start + (pow(2.71828, (-13 * @ratio)) * (pow(2.71828, (13 * @ratio)) - 13 * sin(@ratio) - cos(@ratio))) * (@end - @start);
}
.th_reactions_triggerHover(@n, @i: 0) when (@i =< @n) {
@selector: e('@{i}%');
@{selector}{
.tween(1, 1.2, (@i / @n));
transform: scale(@tween, @tween);
}
.th_reactions_triggerHover(@n, (@i + 1));
}
@keyframes th_reactions_triggerHover {
.th_reactions_triggerHover(100);
}
.th_reactions_triggerHoverLarge(@n, @i: 0) when (@i =< @n) {
@selector: e('@{i}%');
@{selector}{
.tween(1, 1.5, (@i / @n));
transform: scale(@tween, @tween)
}
.th_reactions_triggerHoverLarge(@n, (@i + 1));
}
@keyframes th_reactions_triggerHoverLarge {
.th_reactions_triggerHoverLarge(100);
}
.reactions-bar .reactions-right__list {
margin: 0 10px;
align-items: center;
justify-content: space-between;
}
.reactions-bar--modal .reactions-right__list {
justify-content: center;
flex-wrap: wrap;
margin: 10px;
width: 250px;
}
.reactions-bar--modal .th_reactions__scrollContainer {
border-radius: 6px;
}
.reactions-bar--out .reactions-right__list {
transform: none;
opacity: 0;
transform-origin: 100% 50%;
transform-style: flat;
display: inline-flex;
pointer-events: none;
}
.th_reactions_expandShow(@n, @i: 0) when (@i =< @n) {
@selector: e('@{i}%');
@{selector}{
.tweenGentle(0, 1, (@i / @n));
.tweenGentle2(0.5, 1, (@i / @n));
transform: scale(@tweenGentle, @tweenGentle2);
opacity: (0.1 + ((@i / @n) * 1.5));
& when (@i = 0) {
pointer-events: none;
overflow-x: hidden !important;
will-change: unset;
}
& when (@i = 1) {
will-change: transform;
}
& when (@i = 99) {
overflow-x: hidden !important;
will-change: transform;
}
& when (@i = 100) {
transform: scale(1, 1);
overflow-x: auto !important;
pointer-events: all;
will-change: unset;
}
}
.th_reactions_expandShow(@n, (@i + 1));
}
@keyframes th_reactions_expandShow {
.th_reactions_expandShow(100);
}
.reactions-bar--out .reactions-bar--show {
animation-name: th_reactions_expandShow;
animation-duration: 0.5s;
animation-direction: normal;
animation-fill-mode: both;
opacity: 1;
display: inline-flex;
}
.reactions-bar--out .reactions-bar--hide {
opacity: 0;
display: inline-flex;
animation-name: th_reactions_expandShow;
animation-duration: 0.5s;
animation-direction: reverse;
animation-fill-mode: both;
}
.reactions-bar--up .reactions-right__list {
li {
transform: translateY(20px);
transform-origin: center;
transform-style: flat;
visibility: hidden;
}
a {
transform: scale(0.4, 0.4);
}
}
.th_reactions_slideUpShow(@n, @i: 0) when (@i =< @n) {
@selector: e('@{i}%');
.tweenGentle(20, 0, (@i / @n));
@translateY: e('@{tweenGentle}px');
@{selector}{
transform: translateY(@translateY);
opacity: (0.4 + ((@i / @n)));
& when (@i = 0) {
display: none;
visibility: hidden;
width: 0;
height: 0;
}
& when (@i = 1) {
display: inline-flex;
visibility: visible;
width: auto;
height: auto;
}
& when (@i = 100) {
display: inline-flex;
visibility: visible;
}
}
.th_reactions_slideUpShow(@n, (@i + 1));
}
@keyframes th_reactions_slideUpShow {
.th_reactions_slideUpShow(100);
}
.th_reactions_slideExpandShow(@n, @i: 0) when (@i =< @n) {
@selector: e('@{i}%');
.tween(0.4, 1, (@i / @n));
@{selector}{
transform: scale(@tween, @tween);
}
.th_reactions_slideExpandShow(@n, (@i + 1));
}
@keyframes th_reactions_slideExpandShow {
.th_reactions_slideExpandShow(100);
}
.th_reactions_delay(@n, @i: 0) when (@i =< @n) {
@selector: e('.reactions-bar--up .reactions-right:not(.th_reactions__reactionsBar--overflowing) .reactions-bar--show li:nth-last-of-type(@{i}), .reactions-bar--up .reactions-right:not(.th_reactions__reactionsBar--overflowing) .reactions-bar--show a:nth-last-of-type(@{i})');
@{selector}{
animation-delay: (0.025s * @i);
}
.th_reactions_delay(@n, (@i + 1));
}
// .th_reactions_delay(50);
.reactions-bar--up .reactions-bar--show {
li {
animation-name: th_reactions_slideUpShow;
animation-duration: 0.5s;
animation-direction: normal;
animation-fill-mode: both;
display: inline-flex;
visibility: visible;;
}
a {
animation-name: th_reactions_slideExpandShow;
animation-duration: 0.5s;
animation-direction: normal;
animation-fill-mode: both;
@media(max-width: @xf-responsiveMedium) {
padding: @xf-paddingSmall;
}
}
}
.reactions-bar--up .reactions-bar--hide {
li {
animation-name: th_reactions_slideUpShow;
animation-duration: 0.5s;
animation-direction: reverse;
animation-fill-mode: both;
display: inline-flex;
visibility: visible;
}
a {
animation-name: th_reactions_slideExpandShow;
animation-duration: 0.5s;
animation-direction: reverse;
animation-fill-mode: both;
}
}
.reactions-bar--out .reactions-right__list,
.reactions-bar--up .reactions-right__list,
.reactions-bar--none .reactions-right__list {
@media(max-width: @xf-responsiveWide) {
margin-top: 3px;
margin-bottom: 3px;
flex-wrap: nowrap;
a {
padding: @xf-paddingSmall;
}
overflow: hidden;
}
}
.reactions-bar--none .reactions-right__list {
overflow-x: auto;
}
.reactions-right {
position: relative;
max-width: 100%;
}
.th_reactions__scroll {
display: none;
}
.th_reactions__scroll__iconWrap {
transition: opacity 0.3s, color 0.3s;
opacity: 0;
color: @xf-linkColor;
}
@keyframes th_reactions__modalBackground {
0% {
opacity: 0;
}
100% {
opacity: 1;
}
}
.reactions-right__list {
li.th_reactions__reaction {
padding: 5px;
z-index: 2;
}
@media(max-width: @xf-responsiveMedium) {
li.th_reactions__reaction {
padding: 0 9px;
}
a {
padding: @xf-paddingSmall;
}
}
li.th_reactions__reaction:first-of-type {
padding-left: 5px;
}
li.th_reactions__reaction:last-of-type {
padding-right: 5px;
}
}
.reactions-bar:not(.reactions-bar--none) .th_reactions__scrollContainer {
opacity: 0;
pointer-events: none;
&.reactions-barChildren--show {
opacity: 1;
pointer-events: all;
}
}
:not(.reactions-bar--none) .th_reactions__scrollContainer,
.reactions-bar--modal .th_reactions__scrollContainer {
position: absolute;
transition: opacity 0.2s;
.xf-th_reactions__modalStyle();
}
.th_reactions__scrollContainer {
justify-content: space-between;
display: flex;
min-height: 50px;
overflow: hidden;
border-radius: 1000px;
.xf-th_reactions__modalWrapperStyle();
}
.th_reactions__reactionsBar--overflowing {
.th_reactions__scrollContainer {
width: calc(~"100vw - 30px");
}
.th_reactions__scroll {
display: flex;
padding: 10px 14px;
font-size: 16px;
align-items: center;
justify-content: center;
}
.reactions-right__list {
margin: 0;
}
& .reactions-barChildren--show .th_reactions__scroll__iconWrap,
.reactions-bar--none & .th_reactions__scroll__iconWrap {
opacity: 1;
}
&.th_reactions__rightScroll--inactive .reactions-barChildren--show .th_reactions__rightScrollRight__iconWrap,
.reactions-bar--none &.th_reactions__rightScroll--inactive .th_reactions__rightScrollRight__iconWrap,
&.th_reactions__leftScroll--inactive .reactions-barChildren--show .th_reactions__leftScrollLeft__iconWrap,
.reactions-bar--none &.th_reactions__leftScroll--inactive .th_reactions__leftScrollLeft__iconWrap {
color: @xf-textColorMuted;
opacity: 0.4;
}
}
@keyframes th_reactions__label {
0% {
opacity: 0;
}
100% {
opacity: 1;
}
}
.th_reactions__reactionLabel {
text-align: center;
opacity: 0;
animation-name: th_reactions__label;
animation-duration: 0.2s;
animation-fill-mode: both;
animation-direction: normal;
pointer-events: none;
position: absolute;
transform: translate(-50%, 0);
padding: 3px 8px;
font-size: 12px;
border-radius: 1000px;
background: rgba(0, 0, 0, 0.6);
color: #FFF;
margin-top: -@xf-paddingMedium;
z-index: 10;
}
.th_reactions__reactionLabel--out {
opacity: 1;
animation-name: th_reactions__label;
animation-duration: 0.1s;
animation-fill-mode: both;
animation-direction: reverse;
}
/*
.th_reactions__reaction--hovered {
img {
transform: scale(1, 1);
animation-name: th_reactions_triggerHoverLarge;
animation-duration: 0.3s;
animation-direction: normal;
animation-fill-mode: both;
}
}
.th_reactions__reaction--hoveredOut {
img {
transform: scale(1.5, 1.5);
animation-name: th_reactions_triggerHoverLarge;
animation-duration: 0.3s;
animation-direction: reverse;
animation-fill-mode: forwards;
}
}
*/
.reactions-bar--modal {
.reactions-bar--show {
li.th_reactions__reaction {
animation-name: th_reactions_slideUpShow;
animation-duration: 0.5s;
animation-direction: normal;
animation-fill-mode: both;
display: inline-flex;
visibility: visible;;
}
a {
animation-name: th_reactions_slideExpandShow;
animation-duration: 0.5s;
animation-direction: normal;
animation-fill-mode: both;
}
}
}
.reactionCount {
display: table;
width: 100%;
}
.reactionCount-row {
display: table-row;
}
.reactionCount-row-cell {
display: table-cell;
padding: 0 @xf-paddingSmall;
&--primary {
color: @xf-textColorMuted;
}
&--secondary {
text-align: right;
}
}]]></template>
<template type="public" title="th_reactions_list_reactions" version_id="1001470" version_string="1.0.14"><![CDATA[<xf:if is="$title">
<xf:title>{$title}</xf:title>
<xf:else />
<xf:title>{{ phrase('th_members_who_reacted_this_reactions') }}</xf:title>
</xf:if>
<xf:if is="$breadcrumbs">
<xf:breadcrumb source="$breadcrumbs" />
</xf:if>
<xf:css src="th_reactions.less" />
<xf:include template="th_xfrm_jsOptions" />
<xf:js src="themehouse/reactions/react.js" addon="ThemeHouse/Reactions"/>
<div class="block js-reactList js-reactList-{$type}{$id}">
<div class="block-container">
<xf:macro template="th_display_reactions" name="react_total_bar" arg-reacts="{$reactsByType}" arg-reactsCount="{$reactsCount}" />
<div class="block-body">
<h2 class="block-tabHeader block-tabHeader--reactionsList tabs"
data-xf-init="tabs"
data-panes=".js-reactionTabPanes-{$type}{$id}"
data-state="replace"
role="tablist">
<span class="hScroller-scroll">
<span class="tabs-tab"
id="all"
role="tab">{{ phrase('all') }} ({{ $reactsCount }})</span>
<xf:foreach loop="$xf.thReactionTypes" key="$reactionTypeId" value="$reactionType">
<xf:if is="count({$reactsByReactionType.{$reactionTypeId}})">
<span class="tabs-tab"
id="{{ $reactionTypeId }}"
role="tab">{{ $reactionType.title }} ({{ count({$reactsByType.{$reactionTypeId}}) }})</span>
</xf:if>
</xf:foreach>
</span>
</h2>
</div>
</div>
<div class="block-container">
<ul class="tabPanes js-reactionTabPanes-{$type}{$id}">
<xf:foreach loop="$reactsByReactionType" key="$reactionTypeId" value="$reactions">
<li class="is-active" role="tabpanel" id="{{ $reactionTypeId }}">
<div class="block-body">
<ol class="reactOverviewBlocks">
<xf:foreach loop="$reactions" key="$reactionId" value="$reacts">
<xf:macro name="react_block"
arg-reactionId="{$reactionId}"
arg-reacts="{$reacts}" />
</xf:foreach>
</ol>
</div>
</li>
</xf:foreach>
</ul>
</div>
</div>
<xf:macro name="react_block" arg-reactionId="!" arg-reacts="!">
<xf:if contentcheck="true">
<li class="reactOverviewBlock">
<h3 class="reaction-item block-textHeader">
{{ th_reaction($reactionId, 'list') }}
<span class="reaction-title">{{ $xf.thReactions.{$reactionId}.title}}</span>
</h3>
<ol class="reactOverviewBlock-list">
<xf:contentcheck>
<xf:foreach loop="$reacts" key="$reactId" value="$react">
<li>
<div class="contentRow contentRow--alignMiddle">
<div class="contentRow-figure">
<xf:avatar user="$react.Reactor" size="xs" />
</div>
<div class="contentRow-main">
<xf:if is="$react.canUnreact()">
<div class="contentRow-extra contentRow-extra--large">
<a href="{{ $react.getHandler().getUnreactSingleLink($react.react_id) }}" data-xf-click="overlay">
<i class="fa fa-times" aria-hidden="true"></i>
</a>
</div>
</xf:if>
<h3 class="contentRow-title"><xf:username user="$react.Reactor" rich="true" class="reactOverviewBlock-header" /></h3>
<div class="contentRow-lesser">
<xf:date time="$react.react_date" />
</div>
</div>
</div>
</li>
</xf:foreach>
</xf:contentcheck>
</ol>
</li>
</xf:if>
</xf:macro>]]></template>
<template type="public" title="th_reactions_modify_reactions" version_id="1001470" version_string="1.0.14"><![CDATA[<div class="react-modify">
<div class="menu-row">
<ul class="listPlain">
<xf:foreach loop="$reacts" value="$react">
<a href="{{ $react.getHandler().getUnreactSingleLink($react.react_id) }}" data-xf-click="overlay">
<li class="reaction-item menu-linkRow">
{{ th_reaction($react.reaction_id, 'modify') }}
<span class="reaction-title">{{ $xf.thReactions.{$react.reaction_id}.title }}</span>
</li>
</a>
</xf:foreach>
</ul>
</div>
</div>]]></template>
<template type="public" title="th_widget_member_reactions" version_id="1001470" version_string="1.0.14"><![CDATA[<div class="block" data-widget-section="memberReactions"{{ widget_data($widget) }}>
<div class="block-container">
<div class="block-minorHeader">{$title}</div>
<div class="block-body">
<div class="block-row">
<div class="reactionCount">
<div class="reactionCount-row reactionCount-row--heading">
<div class="reactionCount-row-cell">{{ phrase('th_reaction_reactions') }}</div>
<div class="reactionCount-row-cell">{{ phrase('th_given_reactions') }}</div>
<div class="reactionCount-row-cell">{{ phrase('th_received_reactions') }}</div>
</div>
<xf:foreach loop="$reactionCounts" value="$reactionCount">
<div class="reactionCount-row">
<div class="reactionCount-row-cell">{{ th_reaction($reactionCount.reaction) }}</div>
<div class="reactionCount-row-cell"><a href="{{ link('members/reactions', $user, {'type': 'given', 'reaction_id': $reactionCount.reaction.reaction_id}) }}">{$reactionCount.count_given|number_short}</a></div>
<div class="reactionCount-row-cell"><a href="{{ link('members/reactions', $user, {'type': 'received', 'reaction_id': $reactionCount.reaction.reaction_id}) }}">{$reactionCount.count_received|number_short}</a></div>
</div>
</xf:foreach>
</div>
</div>
</div>
</div>
</div>
<xf:css src="th_reactions.less" />]]></template>
<template type="public" title="th_xfrm_jsOptions" version_id="1001191" version_string="1.0.11 Patch Level 1"><![CDATA[<script>
window.th_reactionsEnableHover = !!{$xf.options.th_reactionsEnableHover};
window.th_reactionsSecondaryTrigger = !!{{property('th_reactions_secondaryTrigger')}};
</script>
]]></template>
<template type="public" title="threact_member_reactions" version_id="1001393" version_string="1.0.13 Patch Level 3"><![CDATA[<xf:if is="$type === 'given'">
<xf:title>{{ phrase('threact_reactions_given_by_x', { 'username': $user.username }) }}</xf:title>
<xf:elseif is="$type === 'received'" />
<xf:title>{{ phrase('threact_reactions_received_by_x', { 'username': $user.username }) }}</xf:title>
<xf:else />
<xf:title>{{ phrase('th_xs_reactions_reactions', { 'name': $user.username }) }}</xf:title>
</xf:if>
<xf:breadcrumb href="{{ link('members', $user) }}">{$user.username}</xf:breadcrumb>
<div class="block">
<div class="block-outer">
<xf:pagenav page="{$page}" perpage="{$perPage}" total="{$total}"
link="members/reactions" data="{$user}" params="{$filters}" />
</div>
<div class="block-container">
<ul class="block-body">
<xf:if is="$reactedContent is not empty">
<xf:if contentcheck="true">
<xf:contentcheck>
<xf:foreach loop="$reactedContent" value="$react">
<xf:if contentcheck="true">
<li class="block-row block-row--separated">
<div class="contentRow">
<span class="contentRow-figure">
<xf:avatar user="$react.Reactor" size="s" defaultname="{$item.username}" />
</span>
<div class="contentRow-main">
<xf:contentcheck>
{$react->render()|raw}
</xf:contentcheck>
</div>
</div>
</li>
</xf:if>
</xf:foreach>
</xf:contentcheck>
<xf:else />
<li class="block-row">
{{ phrase('threact_no_viewable_reactions_on_this_page') }}
</li>
</xf:if>
<xf:else />
<li class="block-row">
{{ phrase('threact_no_reactions_to_display') }}
</li>
</xf:if>
</ul>
</div>
<div class="block-outer block-outer--after">
<xf:pagenav page="{$page}" perpage="{$perPage}" total="{$total}"
link="members/reactions" data="{$user}" params="{$filters}" />
</div>
</div>]]></template>
<template type="public" title="threactions_member_react_stats" version_id="1001470" version_string="1.0.14"><![CDATA[<xf:title>{$user.username}</xf:title>
<xf:css src="threactions_profile.less" />
<div class="block">
<div class="block-container">
<div class="block-body">
<div class="block-row">
<div class="reactionCount reactionCount--profile">
<div class="reactionCount-row reactionCount-row--heading">
<div class="reactionCount-row-cell">{{ phrase('th_reaction_reactions') }}</div>
<div class="reactionCount-row-cell">{{ phrase('th_given_reactions') }}</div>
<div class="reactionCount-row-cell">{{ phrase('th_received_reactions') }}</div>
</div>
<div class="reactionCount-row reactionCount-row--heading">
<div class="reactionCount-row-cell">{{ phrase('th_reaction_reactions') }}</div>
<div class="reactionCount-row-cell">{{ phrase('th_given_reactions') }}</div>
<div class="reactionCount-row-cell">{{ phrase('th_received_reactions') }}</div>
</div>
<div class="reactionCount-row reactionCount-row--heading">
<div class="reactionCount-row-cell">{{ phrase('th_reaction_reactions') }}</div>
<div class="reactionCount-row-cell">{{ phrase('th_given_reactions') }}</div>
<div class="reactionCount-row-cell">{{ phrase('th_received_reactions') }}</div>
</div>
<xf:foreach loop="$reactionCounts" value="$reactionCount">
<div class="reactionCount-row">
<div class="reactionCount-row-cell">{{ th_reaction($reactionCount.reaction) }}</div>
<div class="reactionCount-row-cell"><a href="{{ link('members/reactions', $user, {'type': 'given', 'reaction_id': $reactionCount.reaction.reaction_id}) }}">{$reactionCount.count_given|number_short}</a></div>
<div class="reactionCount-row-cell"><a href="{{ link('members/reactions', $user, {'type': 'received', 'reaction_id': $reactionCount.reaction.reaction_id}) }}">{$reactionCount.count_received|number_short}</a></div>
</div>
</xf:foreach>
</div>
</div>
</div>
</div>
</div>
<xf:css src="th_reactions.less" />]]></template>
<template type="public" title="threactions_profile.less" version_id="1001370" version_string="1.0.13"><![CDATA[.reactionCount--profile {
display: flex;
flex-wrap: wrap;
.reactionCount-row {
display: flex;
flex-grow: 0;
flex-basis: 33%;
&--heading {
font-weight: bold;
padding-bottom: @xf-paddingSmall;
}
&-cell {
flex-grow: 0;
flex-basis: 33%;
text-align: center;
}
}
}
@media (max-width: @xf-responsiveMedium) {
.reactionCount--profile {
.reactionCount-row {
flex-basis: 50%;
&--heading:nth-child(3) {
display: none;
}
&-cell {
flex-basis: 50%;
}
}
}
}
@media (max-width: @xf-responsiveNarrow) {
.reactionCount--profile {
.reactionCount-row {
flex-basis: 100%;
&--heading:nth-child(2) {
display: none;
}
&-cell {
flex-basis: 100%;
}
}
}
}]]></template>
</templates>