|
1
|
|
|
<?php |
|
2
|
|
|
|
|
3
|
|
|
/** |
|
4
|
|
|
* Class WP_REST_React_Controller |
|
5
|
|
|
*/ |
|
6
|
|
|
|
|
7
|
|
|
class React { |
|
8
|
|
|
|
|
9
|
|
|
/** |
|
10
|
|
|
* API endpoints |
|
11
|
|
|
* @var WP_REST_React_Controller |
|
12
|
|
|
*/ |
|
13
|
|
|
public $api; |
|
14
|
|
|
|
|
15
|
|
|
/** |
|
16
|
|
|
* React constructor. |
|
17
|
|
|
*/ |
|
18
|
|
|
public function __construct() { |
|
19
|
|
|
$this->api = new WP_REST_React_Controller(); |
|
20
|
|
|
|
|
21
|
|
|
add_action( 'rest_api_init', array( $this->api, 'register_routes' ) ); |
|
22
|
|
|
|
|
23
|
|
|
if ( is_admin() ) { |
|
24
|
|
|
return; |
|
25
|
|
|
} |
|
26
|
|
|
|
|
27
|
|
|
$this->enqueue(); |
|
28
|
|
|
|
|
29
|
|
|
add_action( 'wp_head', array( $this, 'print_settings' ) ); |
|
30
|
|
|
add_action( 'wp_footer', array( $this, 'print_selector' ) ); |
|
31
|
|
|
|
|
32
|
|
|
add_filter( 'the_content', array( $this, 'the_content' ) ); |
|
33
|
|
|
} |
|
34
|
|
|
|
|
35
|
|
|
/** |
|
36
|
|
|
* Initialises the reactions. |
|
37
|
|
|
* |
|
38
|
|
|
* @return React Static instance of the React class. |
|
39
|
|
|
*/ |
|
40
|
|
|
public static function init() { |
|
41
|
|
|
static $instance; |
|
42
|
|
|
|
|
43
|
|
|
if ( ! $instance ) { |
|
44
|
|
|
$instance = new React; |
|
45
|
|
|
} |
|
46
|
|
|
|
|
47
|
|
|
return $instance; |
|
48
|
|
|
} |
|
49
|
|
|
|
|
50
|
|
|
/** |
|
51
|
|
|
* Print the JavaScript settings. |
|
52
|
|
|
*/ |
|
53
|
|
|
public function print_settings() { |
|
54
|
|
|
?> |
|
55
|
|
|
<script type="text/javascript"> |
|
56
|
|
|
window.wp = window.wp || {}; |
|
57
|
|
|
window.wp.react = window.wp.react || {}; |
|
58
|
|
|
window.wp.react.settings = { |
|
59
|
|
|
emoji_url: '<?php echo REACT_URL . '/static/emoji.json' ?>', |
|
60
|
|
|
endpoint: '<?php echo get_rest_url( null, $this->api->namespace . '/' . $this->api->rest_base ); ?>' |
|
61
|
|
|
} |
|
62
|
|
|
</script> |
|
63
|
|
|
<?php |
|
64
|
|
|
} |
|
65
|
|
|
|
|
66
|
|
|
/** |
|
67
|
|
|
* Enqueue relevant JS and CSS |
|
68
|
|
|
*/ |
|
69
|
|
|
public function enqueue() { |
|
70
|
|
|
wp_enqueue_style( 'react-emoji', REACT_URL . '/static/react.css' ); |
|
71
|
|
|
|
|
72
|
|
|
wp_enqueue_script( 'react-emoji', REACT_URL . '/static/react.js', array(), false, true ); |
|
73
|
|
|
} |
|
74
|
|
|
|
|
75
|
|
|
/** |
|
76
|
|
|
* Add the reaction buttons to the post content. |
|
77
|
|
|
* @param string $content The content HTML |
|
78
|
|
|
* @return string The content HTML, with the react buttons attached |
|
79
|
|
|
*/ |
|
80
|
|
|
public function the_content( $content ) { |
|
81
|
|
|
$post_id = get_the_ID(); |
|
82
|
|
|
if ( ! $post_id ) { |
|
83
|
|
|
return $content; |
|
84
|
|
|
} |
|
85
|
|
|
|
|
86
|
|
|
$reactions = get_comments( array( |
|
87
|
|
|
'post_id' => $post_id, |
|
88
|
|
|
'type' => 'reaction', |
|
89
|
|
|
) ); |
|
90
|
|
|
|
|
91
|
|
|
$reactions_summary = array(); |
|
92
|
|
|
foreach ( $reactions as $reaction ) { |
|
93
|
|
|
if ( ! isset( $reactions_summary[ $reaction->comment_content ] ) ) { |
|
94
|
|
|
$reactions_summary[ $reaction->comment_content ] = 0; |
|
95
|
|
|
} |
|
96
|
|
|
|
|
97
|
|
|
$reactions_summary[ $reaction->comment_content ]++; |
|
98
|
|
|
} |
|
99
|
|
|
|
|
100
|
|
|
$content .= '<div class="emoji-reactions">'; |
|
101
|
|
|
|
|
102
|
|
|
foreach ( $reactions_summary as $emoji => $count ) { |
|
103
|
|
|
$content .= "<div data-emoji='$emoji' data-count='$count' data-post='$post_id' class='emoji-reaction'><div class='emoji'>$emoji</div><div class='count'>$count</div></div>"; |
|
104
|
|
|
} |
|
105
|
|
|
|
|
106
|
|
|
/* translators: This is the emoji used for the "Add new emoji reaction" button */ |
|
107
|
|
|
$content .= "<div data-post='$post_id' class='emoji-reaction-add'><div class='emoji'>" . __( '😃+', 'reactions' ) . '</div></div>'; |
|
108
|
|
|
$content .= '</div>'; |
|
109
|
|
|
return $content; |
|
110
|
|
|
} |
|
111
|
|
|
|
|
112
|
|
|
public function print_selector() { |
|
113
|
|
|
?> |
|
114
|
|
|
<div id="emoji-reaction-selector" style="display: none;"> |
|
115
|
|
|
<div class="tabs"> |
|
116
|
|
|
<div data-tab="0" alt="<?php echo __( 'People', 'reactions' ); ?>" class="emoji-reaction-tab"><?php echo __( '😀', 'reactions' ); ?></div> |
|
117
|
|
|
<div data-tab="1" alt="<?php echo __( 'Nature', 'reactions' ); ?>" class="emoji-reaction-tab"><?php echo __( '🌿', 'reactions' ); ?></div> |
|
118
|
|
|
<div data-tab="2" alt="<?php echo __( 'Food', 'reactions' ); ?>" class="emoji-reaction-tab"><?php echo __( '🍔', 'reactions' ); ?></div> |
|
119
|
|
|
<div data-tab="3" alt="<?php echo __( 'Activity', 'reactions' ); ?>" class="emoji-reaction-tab"><?php echo __( '⚽️', 'reactions' ); ?></div> |
|
120
|
|
|
<div data-tab="4" alt="<?php echo __( 'Places', 'reactions' ); ?>" class="emoji-reaction-tab"><?php echo __( '✈️', 'reactions' ); ?></div> |
|
121
|
|
|
<div data-tab="5" alt="<?php echo __( 'Objects', 'reactions' ); ?>" class="emoji-reaction-tab"><?php echo __( '💡', 'reactions' ); ?></div> |
|
122
|
|
|
<div data-tab="6" alt="<?php echo __( 'Symbols', 'reactions' ); ?>" class="emoji-reaction-tab"><?php echo __( '❤', 'reactions' ); ?></div> |
|
123
|
|
|
<div data-tab="7" alt="<?php echo __( 'Flags', 'reactions' ); ?>" class="emoji-reaction-tab"><?php echo __( '🇺🇸', 'reactions' ); ?></div> |
|
124
|
|
|
</div> |
|
125
|
|
|
<div class="container container-0"></div> |
|
126
|
|
|
<div class="container container-1"></div> |
|
127
|
|
|
<div class="container container-2"></div> |
|
128
|
|
|
<div class="container container-3"></div> |
|
129
|
|
|
<div class="container container-4"></div> |
|
130
|
|
|
<div class="container container-5"></div> |
|
131
|
|
|
<div class="container container-6"></div> |
|
132
|
|
|
<div class="container container-7"></div> |
|
133
|
|
|
</div> |
|
134
|
|
|
<?php |
|
135
|
|
|
} |
|
136
|
|
|
} |
|
137
|
|
|
|
pento /
reactions
