Highlighting words with Javascript, what am I missing? - javascript
I have been working with a basic javascript/PHP chatroom. I want certain words to be highlighted as they appear in the chat stream.
The html output for the chatroom looks like:
<div class="chat-container">
<div class="chat chat-message-111"><strong style="color: #840;">User 1</strong>: What is your favourite animal?</div>
<div class="chat chat-message-112"><strong style="color: #840;">User 2</strong>: I vote for #dog. </div>
<div class="chat chat-message-113"><strong style="color: #840;">User 3</strong>: I have a #cat!</div>
</div>
I have found one Javascript solution that is actually what I'm looking for (please see https://jsfiddle.net/4ny8adpg/2/ for a working example). But when I try to use it with the chatroom, it won't highlight any text in the "Chat-Container" div.
Will it not work because the contents of the chatroom is an output of the PHP/Javascript and not just HTML like in the jsfiddle example? Or maybe I am missing something obvious.
Any help or advise would seriously be appreciated.
EDIT (to show code and provide more information):
The chatroom is actually a wordpress plugin, it is made up of a PHP file and a Javascript file:
Javascript:
var last_update_received = 0;
function chatroom_check_updates() {
jQuery.post(
ajaxurl,
{
action: 'check_updates',
chatroom_slug: chatroom_slug,
last_update_id: last_update_id
},
function (response) {
chats = jQuery.parseJSON( response );
if ( chats !== null ) {
for ( i = 0; i < chats.length; i++ ) {
if ( jQuery('div.chat-container div.chat-message-'+chats[i].id).length )
continue;
jQuery('div.chat-container').html( jQuery('div.chat-container').html() + chatroom_strip_slashes(chats[i].html) );
last_update_id = chats[i].id;
jQuery('div.chat-container').animate({ scrollTop: jQuery('div.chat-container')[0].scrollHeight - jQuery('div.chat-container').height() }, 100);
}
}
}
);
setTimeout( "chatroom_check_updates()", 1000 );
}
function chatroom_strip_slashes(str) {
return (str + '').replace(/\\(.?)/g, function (s, n1) {
switch (n1) {
case '\\':
return '\\';
case '0':
return '\u0000';
case '':
return '';
default:
return n1;
}
});
}
jQuery(document).ready( function() {
last_update_id = 0;
chatroom_check_updates();
jQuery( 'textarea.chat-text-entry' ).keypress( function( event ) {
if ( event.charCode == 13 || event.keyCode == 13 ) {
chatroom_send_message();
return false;
}
});
});
function chatroom_send_message() {
message = jQuery( 'textarea.chat-text-entry' ).val();
jQuery( 'textarea.chat-text-entry' ).val('');
jQuery.post(
ajaxurl,
{
action: 'send_message',
chatroom_slug: chatroom_slug,
message: message
},
function (response) {
}
);
}
PHP:
Class Chatroom {
function __construct() {
register_activation_hook( __FILE__, array( $this, 'activation_hook' ) );
register_deactivation_hook( __FILE__, array( $this, 'deactivation_hook' ) );
add_action( 'init', array( $this, 'register_post_types' ) );
add_action( 'wp_enqueue_scripts', array( $this, 'enqueue_scripts' ) );
add_action( 'save_post', array( $this, 'maybe_create_chatroom_log_file' ), 10, 2 );
add_action( 'wp_head', array( $this, 'define_javascript_variables' ) );
add_action( 'wp_ajax_check_updates', array( $this, 'ajax_check_updates_handler' ) );
add_action( 'wp_ajax_send_message', array( $this, 'ajax_send_message_handler' ) );
add_filter( 'the_content', array( $this, 'the_content_filter' ) );
}
function activation_hook() {
$this->register_post_types();
flush_rewrite_rules();
}
function deactivation_hook() {
flush_rewrite_rules();
}
function register_post_types() {
$labels = array(
'name' => _x( 'Chat Rooms', 'post type general name', 'chatroom' ),
'singular_name' => _x( 'Chat Room', 'post type singular name', 'chatroom' ),
'add_new' => _x( 'Add New', 'book', 'chatroom' ),
'add_new_item' => __( 'Add New Chat Room', 'chatroom' ),
'edit_item' => __( 'Edit Chat Room', 'chatroom' ),
'new_item' => __( 'New Chat Room', 'chatroom' ),
'all_items' => __( 'All Chat Rooms', 'chatroom' ),
'view_item' => __( 'View Chat Room', 'chatroom' ),
'search_items' => __( 'Search Chat Rooms', 'chatroom' ),
'not_found' => __( 'No Chat Rooms found', 'chatroom' ),
'not_found_in_trash' => __( 'No Chat Rooms found in Trash', 'chatroom' ),
'parent_item_colon' => '',
'menu_name' => __( 'Chat Rooms', 'chatroom' )
);
$args = array(
'labels' => $labels,
'public' => true,
'publicly_queryable' => true,
'show_ui' => true,
'show_in_menu' => true,
'query_var' => true,
'capability_type' => 'post',
'has_archive' => true,
'hierarchical' => false,
'menu_position' => null,
'show_in_nav_menus' => true,
'supports' => array( 'title' )
);
register_post_type( 'chat-room', $args );
}
function enqueue_scripts() {
global $post;
if ( $post->post_type != 'chat-room' )
return;
wp_enqueue_script( 'jquery' );
wp_enqueue_script( 'chat-room', plugins_url( 'chat-room.js', __FILE__ ) );
wp_enqueue_style( 'chat-room-styles', plugins_url( 'chat-room.css', __FILE__ ) );
}
function maybe_create_chatroom_log_file( $post_id, $post ) {
if ( empty( $post->post_type ) || $post->post_type != 'chat-room' )
return;
$upload_dir = wp_upload_dir();
$log_filename = $upload_dir['basedir'] . '/chatter/' . $post->post_name . '-' . date( 'm-d-y', time() );
if ( file_exists( $log_filename ) )
return;
wp_mkdir_p( $upload_dir['basedir'] . '/chatter/' );
$handle = fopen( $log_filename, 'w' );
fwrite( $handle, json_encode( array() ) );
// TODO create warnings if the user can't create a file, and suggest putting FTP creds in wp-config
}
function define_javascript_variables() {
global $post;
if ( empty( $post->post_type ) || $post->post_type != 'chat-room' )
return; ?>
<script>
var ajaxurl = '<?php echo admin_url( 'admin-ajax.php' ); ?>';
var chatroom_slug = '<?echo $post->post_name; ?>';
</script>
<?php
}
function ajax_check_updates_handler() {
$upload_dir = wp_upload_dir();
$log_filename = $this->get_log_filename( $_POST['chatroom_slug'] );
$contents = $this->parse_messages_log_file( $log_filename );
$messages = json_decode( $contents );
foreach ( $messages as $key => $message ) {
if ( $message->id <= $_POST['last_update_id'] )
unset( $messages[$key] );
}
$messages = array_values( $messages );
echo json_encode( $messages );
die;
}
/**
* AJAX server-side handler for sending a message.
*
* Stores the message in a recent messages file.
*
* Clears out cache of any messages older than 10 seconds.
*/
function ajax_send_message_handler() {
$current_user = wp_get_current_user();
$this->save_message( $_POST['chatroom_slug'], $current_user->id, $_POST['message'] );
die;
}
function save_message( $chatroom_slug, $user_id, $content ) {
$user = get_userdata( $user_id );
if ( ! $user_text_color = get_user_meta( $user_id, 'user_color', true ) ) {
// Set random color for each user
$red = rand( 0, 16 );
$green = 16 - $red;
$blue = rand( 0, 16 );
$user_text_color = '#' . dechex( $red^2 ) . dechex( $green^2 ) . dechex( $blue^2 );
update_user_meta( $user_id, 'user_color', $user_text_color );
}
$content = esc_attr( $content );
// Save the message in recent messages file
$log_filename = $this->get_log_filename( $chatroom_slug );
$contents = $this->parse_messages_log_file( $log_filename );
$messages = json_decode( $contents );
$last_message_id = 0; // Helps determine the new message's ID
foreach ( $messages as $key => $message ) {
if ( time() - $message->time > 10 ) {
$last_message_id = $message->id;
unset( $messages[$key] );
}
else {
break;
}
}
$messages = array_values( $messages );
if ( ! empty( $messages ) )
$last_message_id = end( $messages )->id;
$new_message_id = $last_message_id + 1;
$messages[] = array(
'id' => $new_message_id,
'time' => time(),
'sender' => $user_id,
'contents' => $content,
'html' => '<div class="chat-message-' . $new_message_id . '"><strong style="color: ' . $user_text_color . ';">' . $user->user_login . '</strong>: ' . $content . '</div>',
);
$this->write_log_file( $log_filename, json_encode( $messages ) );
// Save the message in the daily log
$log_filename = $this->get_log_filename( $chatroom_slug, date( 'm-d-y', time() ) );
$contents = $this->parse_messages_log_file( $log_filename );
$messages = json_decode( $contents );
$messages[] = array(
'id' => $new_message_id,
'time' => time(),
'sender' => $user_id,
'contents' => $content,
'html' => '<div class="chat-message-' . $new_message_id .'"><strong style="color: ' . $user_text_color . ';">' . $user->user_login . '</strong>: ' . $content . '</div>',
);
$this->write_log_file( $log_filename, json_encode( $messages ) );
}
function write_log_file( $log_filename, $content ) {
$handle = fopen( $log_filename, 'w' );
fwrite( $handle, $content );
}
function get_log_filename( $chatroom_slug, $date = 'recent' ) {
$upload_dir = wp_upload_dir();
$log_filename = $upload_dir['basedir'] . '/chatter/' . $chatroom_slug . '-' . $date;
return $log_filename;
}
function parse_messages_log_file( $log_filename ) {
$upload_dir = wp_upload_dir();
$handle = fopen( $log_filename, 'r' );
$contents = fread( $handle, filesize( $log_filename ) );
fclose( $handle );
return $contents;
}
function the_content_filter( $content ) {
global $post;
if ( $post->post_type != 'chat-room' )
return $content;
if ( ! is_user_logged_in() ) {
?>You need to be logged in to participate in the chatroom.<?php
return;
}
?>
<div class="chat-container">
</div>
<textarea class="chat-text-entry"></textarea>
<?php
return '';
}
}
$chatroom = new Chatroom();
Example of JSON:
[{"id":129,"time":1428340673,"sender":1,"contents":"What is your favourite animal?","html":"<div class=\"chat chat-message-129\"><strong style=\"color: #840;\">User 1<\/strong>: What is your favourite animal?<\/div>"},
{"id":130,"time":1428351683,"sender":2,"contents":"I vote for #dog.","html":"<div class=\"chat chat-message-130\"><strong style=\"color: #840;\">User 2<\/strong>: I vote for #dog.<\/div>"},
{"id":131,"time":1428352376,"sender":3,"contents":"I have a #cat!","html":"<div class=\"chat chat-message-131\"><strong style=\"color: #840;\">User 3<\/strong>: I have a #cat!<\/div>"}]
If you want your highlighting code to run after an AJAX call has returned (when there are new HTML fragments), then try something along these lines:
$.ajax({
...
success : function(data) {
...
$('.chat').each(function(){
var hashtag = $(this).text()
.replace(/#dog/g, "<span class='dog'>#DOG</span>")
.replace(/#cat/g, "<span class='cat'>#CAT</span>");
$(this).html(hashtag);
});
},
...
});
In your case, call your highlighting code after you have populated all your chat fragments:
...
function (response) {
chats = jQuery.parseJSON( response );
if ( chats !== null ) {
for ( i = 0; i < chats.length; i++ ) {
if ( jQuery('div.chat-container div.chat-message-'+chats[i].id).length )
continue;
jQuery('div.chat-container').html( jQuery('div.chat-container').html() + chatroom_strip_slashes(chats[i].html) );
last_update_id = chats[i].id;
jQuery('div.chat-container').animate({ scrollTop: jQuery('div.chat-container')[0].scrollHeight - jQuery('div.chat-container').height() }, 100);
}
// Call highlighting code here
}
}
...
PS You can save time by caching the selector jQuery('div.chat-container') as a variable so that jQuery doesn't have to search your HTML each time.
Related
How to check JS Webauthn Assertion in PHP 8.1?
I'm trying to implement WebAuthn in a JavaScript/PHP project and I'm "stuck" at the final assertion verification process. In detail, I pass the "assertion" parameters from JavaScript (Jquery) to PHP script like this: navigator.credentials.get( { publicKey: { allowCredentials: [...], challenge: Uint8Array.from( ..., c => c.charCodeAt( 0 ) ), rpId: window.location.hostname, timeout: 60000, userVerification: 'preferred' } } ) .then( ( assertion ) => { $.ajax( { data: 'login=' + encodeURIComponent( JSON.stringify( { ..., 'rawid': new Uint8Array( assertion.rawId ), 'authenticatordata': new Uint8Array( assertion.response.authenticatorData ), 'clientdatajson': new Uint8Array( assertion.response.clientDataJSON ), 'signature': new Uint8Array( assertion.response.signature ) } ) ) } ) And once the "public key" corresponding to the authenticator employed by the user has been identified within a database, I try to validate in PHP 8.1 the "assertion" in this way: $jsonInput = json_decode( '{"authenticatordata":{"0":201,"1":157,"2":215,"3":147,"4":42,"5":142,"6":165,"7":93,"8":198,"9":108,"10":247,"11":140,"12":253,"13":224,"14":178,"15":122,"16":185,"17":204,"18":239,"19":151,"20":3,"21":24,"22":2,"23":25,"24":212,"25":39,"26":42,"27":95,"28":255,"29":195,"30":201,"31":113,"32":5,"33":0,"34":0,"35":0,"36":16},"clientdatajson":{"0":123,"1":34,"2":116,"3":121,"4":112,"5":101,"6":34,"7":58,"8":34,"9":119,"10":101,"11":98,"12":97,"13":117,"14":116,"15":104,"16":110,"17":46,"18":103,"19":101,"20":116,"21":34,"22":44,"23":34,"24":99,"25":104,"26":97,"27":108,"28":108,"29":101,"30":110,"31":103,"32":101,"33":34,"34":58,"35":34,"36":77,"37":68,"38":65,"39":119,"40":77,"41":68,"42":65,"43":119,"44":77,"45":68,"46":65,"47":119,"48":77,"49":103,"50":34,"51":44,"52":34,"53":111,"54":114,"55":105,"56":103,"57":105,"58":110,"59":34,"60":58,"61":34,"62":104,"63":116,"64":116,"65":112,"66":115,"67":58,"68":47,"69":47,"70":109,"71":111,"72":114,"73":109,"74":105,"75":110,"76":111,"77":46,"78":114,"79":101,"80":115,"81":105,"82":101,"83":108,"84":46,"85":99,"86":111,"87":109,"88":34,"89":44,"90":34,"91":99,"92":114,"93":111,"94":115,"95":115,"96":79,"97":114,"98":105,"99":103,"100":105,"101":110,"102":34,"103":58,"104":102,"105":97,"106":108,"107":115,"108":101,"109":125},"signature":{"0":48,"1":69,"2":2,"3":33,"4":0,"5":251,"6":22,"7":162,"8":18,"9":206,"10":81,"11":110,"12":4,"13":3,"14":217,"15":148,"16":51,"17":132,"18":130,"19":31,"20":122,"21":186,"22":65,"23":73,"24":195,"25":170,"26":106,"27":35,"28":90,"29":149,"30":56,"31":1,"32":58,"33":222,"34":51,"35":69,"36":212,"37":2,"38":32,"39":77,"40":161,"41":139,"42":133,"43":49,"44":79,"45":218,"46":34,"47":45,"48":115,"49":178,"50":156,"51":139,"52":185,"53":13,"54":197,"55":248,"56":116,"57":217,"58":81,"59":111,"60":117,"61":68,"62":44,"63":141,"64":197,"65":87,"66":68,"67":1,"68":89,"69":222,"70":154}}' ); $publickey = json_decode( '{"0":48,"1":89,"2":48,"3":19,"4":6,"5":7,"6":42,"7":134,"8":72,"9":206,"10":61,"11":2,"12":1,"13":6,"14":8,"15":42,"16":134,"17":72,"18":206,"19":61,"20":3,"21":1,"22":7,"23":3,"24":66,"25":0,"26":4,"27":229,"28":126,"29":127,"30":191,"31":207,"32":67,"33":42,"34":66,"35":212,"36":251,"37":1,"38":126,"39":36,"40":232,"41":163,"42":188,"43":151,"44":84,"45":50,"46":83,"47":251,"48":29,"49":196,"50":24,"51":208,"52":131,"53":96,"54":190,"55":14,"56":239,"57":104,"58":123,"59":78,"60":90,"61":70,"62":76,"63":54,"64":211,"65":91,"66":74,"67":243,"68":252,"69":69,"70":192,"71":132,"72":245,"73":206,"74":214,"75":67,"76":210,"77":165,"78":46,"79":230,"80":191,"81":6,"82":19,"83":241,"84":201,"85":188,"86":235,"87":232,"88":84,"89":130,"90":185}', TRUE ); $jsonInput->authenticatordata = ( array ) $jsonInput->authenticatordata; // [201,157,215,147,42,142,165,93,198,108,247,140,253,224,178,122,185,204,239,151,3,24,2,25,212,39,42,95,255,195,201,113,5,0,0,0,16] $jsonInput->clientdatajson = ( array ) $jsonInput->clientdatajson; // [123,34,116,121,112,101,34,58,34,119,101,98,97,117,116,104,110,46,103,101,116,34,44,34,99,104,97,108,108,101,110,103,101,34,58,34,77,68,65,119,77,68,65,119,77,68,65,119,77,103,34,44,34,111,114,105,103,105,110,34,58,34,104,116,116,112,115,58,47,47,109,111,114,109,105,110,111,46,114,101,115,105,101,108,46,99,111,109,34,44,34,99,114,111,115,115,79,114,105,103,105,110,34,58,102,97,108,115,101,125] $jsonInput->signature = ( array ) $jsonInput->signature; // [48,69,2,33,0,251,22,162,18,206,81,110,4,3,217,148,51,132,130,31,122,186,65,73,195,170,106,35,90,149,56,1,58,222,51,69,212,2,32,77,161,139,133,49,79,218,34,45,115,178,156,139,185,13,197,248,116,217,81,111,117,68,44,141,197,87,68,1,89,222,154] echo openssl_verify( implode( array_map( 'chr', $jsonInput->authenticatordata ) ) . hash( 'sha256', json_encode( implode( array_map( 'chr', $jsonInput->clientdatajson ) ) ) ), implode( array_map( 'chr', $jsonInput->signature ) ), "-----BEGIN PUBLIC KEY-----\r\n" . chunk_split( base64_encode( implode( array_map( 'chr', $publickey ) ) ), 64 ) . "-----END PUBLIC KEY-----", OPENSSL_ALGO_SHA256 ); echo '<br />'; echo openssl_error_string(); // error:0D07803A:asn1 encoding routines:asn1_item_embed_d2i:nested asn1 error /*The processed Windows Hello (From Windows 11) authenticator-generated public key results at the end: -----BEGIN PUBLIC KEY----- MFkwEwYHKoZIzj0CAQYIKoZIzj0DAQcDQgAE5X5/v89DKkLU+wF+JOijvJdUMlP7 HcQY0INgvg7vaHtOWkZMNtNbSvP8RcCE9c7WQ9KlLua/BhPxybzr6FSCuQ== -----END PUBLIC KEY----- */ Another example with a different authenticator (Widows Hello from Windows 10): $jsonInput = json_decode( '{"authenticatordata":[201,157,215,147,42,142,165,93,198,108,247,140,253,224,178,122,185,204,239,151,3,24,2,25,212,39,42,95,255,195,201,113,5,0,0,0,2],"clientdatajson":[123,34,116,121,112,101,34,58,34,119,101,98,97,117,116,104,110,46,103,101,116,34,44,34,99,104,97,108,108,101,110,103,101,34,58,34,77,68,65,119,77,68,65,119,77,68,65,119,77,103,34,44,34,111,114,105,103,105,110,34,58,34,104,116,116,112,115,58,47,47,109,111,114,109,105,110,111,46,114,101,115,105,101,108,46,99,111,109,34,44,34,99,114,111,115,115,79,114,105,103,105,110,34,58,102,97,108,115,101,44,34,111,116,104,101,114,95,107,101,121,115,95,99,97,110,95,98,101,95,97,100,100,101,100,95,104,101,114,101,34,58,34,100,111,32,110,111,116,32,99,111,109,112,97,114,101,32,99,108,105,101,110,116,68,97,116,97,74,83,79,78,32,97,103,97,105,110,115,116,32,97,32,116,101,109,112,108,97,116,101,46,32,83,101,101,32,104,116,116,112,115,58,47,47,103,111,111,46,103,108,47,121,97,98,80,101,120,34,125],"signature":[94,96,8,15,78,8,75,244,177,242,61,244,7,240,100,98,176,74,243,176,215,209,229,61,5,137,178,77,240,88,160,220,9,110,33,171,52,255,65,140,191,209,29,49,26,111,164,65,47,1,90,77,95,196,60,132,185,189,145,0,138,65,212,242,210,222,55,91,211,208,15,216,252,81,6,132,159,42,234,186,78,81,121,187,45,71,22,178,83,210,196,161,31,247,188,218,211,159,5,102,249,213,142,158,230,99,182,166,78,62,153,107,53,133,150,96,95,99,213,172,19,44,243,114,127,167,155,195,88,172,236,229,233,212,65,100,127,98,4,4,71,124,29,174,104,65,190,218,221,16,228,85,137,216,250,89,49,77,245,120,146,72,7,23,67,144,108,160,195,204,216,51,100,159,32,208,151,249,87,146,54,31,230,48,241,67,235,8,171,198,53,8,83,178,8,203,6,173,76,213,212,128,241,72,129,162,159,13,234,49,6,140,253,159,107,115,91,151,195,25,203,27,98,81,41,96,254,88,92,126,78,207,59,114,214,238,153,34,100,49,59,246,249,99,255,49,71,178,42,226,62,246,149,193,91,140]}' ); $publickey = json_decode( '{"0":48,"1":130,"2":1,"3":34,"4":48,"5":13,"6":6,"7":9,"8":42,"9":134,"10":72,"11":134,"12":247,"13":13,"14":1,"15":1,"16":1,"17":5,"18":0,"19":3,"20":130,"21":1,"22":15,"23":0,"24":48,"25":130,"26":1,"27":10,"28":2,"29":130,"30":1,"31":1,"32":0,"33":226,"34":31,"35":139,"36":141,"37":197,"38":58,"39":76,"40":61,"41":52,"42":104,"43":160,"44":127,"45":66,"46":27,"47":61,"48":3,"49":107,"50":228,"51":250,"52":6,"53":98,"54":104,"55":214,"56":5,"57":33,"58":182,"59":247,"60":175,"61":107,"62":236,"63":71,"64":232,"65":98,"66":163,"67":112,"68":213,"69":174,"70":56,"71":131,"72":160,"73":93,"74":200,"75":85,"76":35,"77":234,"78":116,"79":212,"80":172,"81":0,"82":232,"83":78,"84":48,"85":90,"86":122,"87":93,"88":100,"89":212,"90":88,"91":250,"92":91,"93":228,"94":248,"95":14,"96":42,"97":228,"98":123,"99":149,"100":36,"101":205,"102":21,"103":172,"104":116,"105":44,"106":113,"107":229,"108":246,"109":50,"110":110,"111":219,"112":122,"113":219,"114":26,"115":72,"116":17,"117":120,"118":63,"119":148,"120":176,"121":94,"122":110,"123":133,"124":131,"125":199,"126":213,"127":219,"128":22,"129":29,"130":88,"131":178,"132":141,"133":62,"134":170,"135":76,"136":121,"137":62,"138":237,"139":192,"140":214,"141":82,"142":122,"143":113,"144":244,"145":124,"146":2,"147":5,"148":39,"149":83,"150":68,"151":252,"152":219,"153":233,"154":27,"155":128,"156":77,"157":160,"158":241,"159":92,"160":1,"161":0,"162":171,"163":214,"164":233,"165":178,"166":240,"167":207,"168":227,"169":74,"170":134,"171":206,"172":217,"173":193,"174":89,"175":79,"176":56,"177":217,"178":152,"179":229,"180":175,"181":47,"182":146,"183":145,"184":101,"185":173,"186":39,"187":106,"188":252,"189":194,"190":107,"191":221,"192":150,"193":30,"194":122,"195":73,"196":204,"197":49,"198":242,"199":60,"200":227,"201":208,"202":10,"203":223,"204":182,"205":195,"206":105,"207":113,"208":99,"209":119,"210":41,"211":215,"212":234,"213":227,"214":166,"215":69,"216":66,"217":160,"218":83,"219":131,"220":109,"221":111,"222":216,"223":9,"224":55,"225":176,"226":107,"227":4,"228":108,"229":37,"230":235,"231":100,"232":88,"233":14,"234":154,"235":247,"236":143,"237":102,"238":106,"239":48,"240":200,"241":8,"242":152,"243":187,"244":73,"245":126,"246":95,"247":139,"248":83,"249":140,"250":199,"251":151,"252":46,"253":174,"254":25,"255":82,"256":240,"257":199,"258":41,"259":126,"260":106,"261":126,"262":93,"263":201,"264":70,"265":217,"266":151,"267":46,"268":117,"269":139,"270":144,"271":29,"272":43,"273":76,"274":59,"275":180,"276":255,"277":208,"278":43,"279":124,"280":111,"281":168,"282":50,"283":221,"284":105,"285":134,"286":153,"287":113,"288":141,"289":2,"290":3,"291":1,"292":0,"293":1}', TRUE ); $jsonInput->authenticatordata = ( array ) $jsonInput->authenticatordata; $jsonInput->clientdatajson = ( array ) $jsonInput->clientdatajson; $jsonInput->signature = ( array ) $jsonInput->signature; echo openssl_verify( implode( array_map( 'chr', $jsonInput->authenticatordata ) ) . hash( 'sha256', implode( array_map( 'chr', $jsonInput->clientdatajson ) ) ), implode( array_map( 'chr', $jsonInput->signature ) ), "-----BEGIN PUBLIC KEY-----\r\n" . chunk_split( base64_encode( implode( array_map( 'chr', $publickey ) ) ), 64 ) . "-----END PUBLIC KEY-----", OPENSSL_ALGO_SHA256 ); echo '<br />'; echo openssl_error_string(); // error:0D0680A8:asn1 encoding routines:asn1_check_tlen:wrong tag /* -----BEGIN PUBLIC KEY----- MIIBIjANBgkqhkiG9w0BAQEFAAOCAQ8AMIIBCgKCAQEA4h+LjcU6TD00aKB/Qhs9 A2vk+gZiaNYFIbb3r2vsR+hio3DVrjiDoF3IVSPqdNSsAOhOMFp6XWTUWPpb5PgO KuR7lSTNFax0LHHl9jJu23rbGkgReD+UsF5uhYPH1dsWHViyjT6qTHk+7cDWUnpx 9HwCBSdTRPzb6RuATaDxXAEAq9bpsvDP40qGztnBWU842Zjlry+SkWWtJ2r8wmvd lh56Scwx8jzj0ArftsNpcWN3Kdfq46ZFQqBTg21v2Ak3sGsEbCXrZFgOmvePZmow yAiYu0l+X4tTjMeXLq4ZUvDHKX5qfl3JRtmXLnWLkB0rTDu0/9ArfG+oMt1phplx jQIDAQAB -----END PUBLIC KEY----- */ 1. However the "openssl_verify" function returns failure (0) instead of success (1). Where am I wrong? 2. Why does Windows Hello return a short public key in the first case? Is it equally valid? 3. Is this the correct way to convert to PEM and use the public key generated by credential.response.getPublicKey()? Note: in a different context, I transfer the public key from javascript (jquery) to PHP 8.1 like this: navigator.credentials.create( { publicKey: { attestation: 'none', authenticatorSelection: { userVerification: 'preferred' }, challenge: Uint8Array.from( ..., c => c.charCodeAt( 0 ) ), excludeCredentials: [], pubKeyCredParams: [], rp: { id: window.location.hostname, name: window.document.title }, timeout: 60000, user: { id: Uint8Array.from( ..., c => c.charCodeAt( 0 ) ), displayName: ..., name: ... } } } ) .then( ( credential ) => { $.ajax( { data: 'data=' + encodeURIComponent( JSON.stringify( { ..., 'publickey': new Uint8Array( credential.response.getPublicKey() ), 'authenticatordata': new Uint8Array( credential.response.getAuthenticatorData() ), 'transports': credential.response.getTransports() } ) ) } )
I am trying to retrieve the posts via ajax call but Wordpress Ajax gives server error 500
When I click on pagination link (page number) it gives me post_type, taxonomy, term_name. I passed the variables with JQuery Variables to Ajax wordpress function. The Ajax function is receiving the vaiables. But WP_Query loop does not work with the passed data. JavaScript Code: <script> $(".category--pagination").on("click", "a", function (e) { e.preventDefault(); var link = $(this).attr("href"); if (link.indexOf("/page/") >= 0) { brands_page = parseInt(link.substr(link.indexOf("/page/") + 6, 4)); } else { brands_page = 1; } mzm_filter_taxonomy(); }); // mzm_filter_tax function mzm_filter_taxonomy() { $("#brandCategoryItemDisplay").addClass("loading"); var post_type = $("#post_type").val(); var taxonomy = $("#taxonomy").val(); var term_slug = $("#term_slug").val(); var term_name = $("#term_name").val(); //console.log(post_type); // console.log(taxonomy); // console.log(term_name); if (brands_page == undefined) { brands_page = 1; } var data = { action: "mzm_filter_taxonomy", post_type: post_type, taxonomy:taxonomy, term_slug:term_slug, term_name:term_name, page:brands_page, }; $.post(mzm_filter.ajax_url, data, function (response, textStatus, jqXHR) { if (response.success) { console.log("executed success"); $("#brandCategoryItemDisplay").removeClass("loading"); $("#brandCategoryItemDisplay").html(response.data.items); $(".category--pagination").html(response.data.pagination); //$("#taxonomy_pagination").html(response.data.pagination); } }); } </script> Wordpress Ajax Function: function mzm_filter_taxonomy() { $post_type = isset($_POST['post_type']) ? filter_var(trim($_POST['post_type']), FILTER_SANITIZE_FULL_SPECIAL_CHARS) : null; $taxonomy = isset($_POST['taxonomy']) ? filter_var(trim($_POST['taxonomy']), FILTER_SANITIZE_FULL_SPECIAL_CHARS) : null; $term_slug = isset($_POST['term_slug']) ? filter_var(trim($_POST['term_slug']), FILTER_SANITIZE_FULL_SPECIAL_CHARS) : null; $term_name = isset($_POST['term_name']) ? filter_var(trim($_POST['term_name']), FILTER_SANITIZE_FULL_SPECIAL_CHARS) : null; $perpage = mzm_brand_perpage(); $paged = (isset($_POST['page']) && intval($_POST['page'])) ? intval($_POST['page']) : 1; // $sort = ( isset( $_POST['sort'] ) && intval( $_POST['sort'] ) ) ? intval( $_POST['sort'] ) : 1; // $sort = (isset($_POST['sort'])) ? intval($_POST['sort']) : 1; // $args = array( // 'post_type' => $post_type, // 'hide_empty' => false, // 'posts_per_page' => $perpage, // 'paged' => $paged, // 'post_status' => 'publish', // 'tax_query' => array( // array ( // 'taxonomy' => $taxonomy, // 'field' => 'slug', // 'terms' => $term_slug, // ) // ), // ); $the_query = new WP_Query( array( 'post_type' => $post_type, 'tax_query' => array( array ( 'taxonomy' => $taxonomy, 'field' => 'slug', 'terms' => $term_slug, ) ), ) ); // $the_query = new WP_Query($args); ob_start(); // echo $post_type . '<br>'; // echo $taxonomy . '<br>'; // echo $term_name . '<br>'; // echo $term_slug . '<br>'; if ($the_query->have_posts()) { while ($the_query->have_posts()) { the_post(); // echo mzm_render_single_brand_card(); echo the_title(); } wp_reset_postdata(); } else { echo '<div class="no-criteria-search">Sorry, no posts matched your criteria.</div>'; } $html = ob_get_clean(); $result = array( 'items' => $html, 'pagination' => 'mzm_render_pagination($the_query)', ); wp_send_json_success($result); } add_action('wp_ajax_nopriv_mzm_filter_taxonomy', 'mzm_filter_taxonomy'); add_action('wp_ajax_mzm_filter_taxonomy', 'mzm_filter_taxonomy'); I am trying paginate via Ajax request. Other all scripts are working. But this is a single taxonomy page. On this page the loop doesn't executes. It gives server error 500.
I solved it myself. The problem was in wp_query loop. I using custom $args and the loop object was $the_query. So, the_post(); //should be $the_query->the_post();
WooCommerce: Custom OTP plugin doesn't work properly on Checkout
I have this plugin for my site that can verify OTP. It shows and works perfectly on the registration page. I wanted to add the exact same field to my checkout register. I've added the hook of Woocommerce checkout place. It shows and fits perfectly, but it doesn't work when I try to check the button. I've tested it and it doesn't send the OTP. In other words, it's just a field that verifying that does not function as it does on the register page. picture one is how it should work after I verify. The second picture is on the checkout page that only appears but doesn't do anything: Can someone kindly point out what I'm doing wrong and how to fix it? <?php if ( ! defined( 'ABSPATH' ) ) { exit; // Exit if accessed directly } class Xoo_Ml_Phone_Frontend{ protected static $_instance = null; public $settings; public static function get_instance(){ if ( is_null( self::$_instance ) ) { self::$_instance = new self(); } return self::$_instance; } public function __construct(){ $this->settings = xoo_ml_helper()->get_phone_option(); $this->hooks(); } public function hooks(){ if( $this->settings['r-default-country-code-type'] === 'geolocation' ){ add_action( 'init', array( $this, 'fetch_geolocation' ), 0 ); } if( $this->settings['l-enable-login-with-otp'] === "yes" ){ add_action( 'woocommerce_login_form_end', array( $this, 'wc_login_with_otp_form' ) ); add_filter( 'gettext', array( $this, 'wc_login_username_field_i8n' ), 999, 3 ); } if( $this->settings['r-enable-phone'] === "yes" ){ add_action( 'woocommerce_register_form_start', array( $this, 'wc_register_phone_input' ) ); add_action( 'woocommerce_edit_account_form_start', array( $this, 'wc_myaccount_edit_phone_input' ) ); } add_action( 'wp_enqueue_scripts' ,array( $this,'enqueue_styles' ) ); add_action( 'wp_enqueue_scripts' , array( $this,'enqueue_scripts' ), 0 ); } public function fetch_geolocation(){ Xoo_Ml_Geolocation::get_data(); } public function wc_login_with_otp_form(){ $args = self::wc_register_phone_input_args( array( 'cc_show' => $this->settings['l-enable-cc-field'] ) ); $args = apply_filters( 'xoo_ml_wc_otp_login_form', $args ); return xoo_ml_get_login_with_otp_form( $args ); } //Enqueue stylesheets public function enqueue_styles(){ wp_enqueue_style( 'dashicons' ); if( !wp_style_is( 'select2' ) ){ wp_enqueue_style( 'select2', "https://cdn.jsdelivr.net/npm/select2#4.1.0-beta.1/dist/css/select2.min.css" ); } wp_enqueue_style( 'xoo-ml-style', XOO_ML_URL.'/assets/css/xoo-ml-style.css', array(), XOO_ML_VERSION ); $style = ''; if( $this->settings[ 'l-login-display' ] === "yes" ){ $style = " .xoo-el-form-login{ display: none; } "; } wp_add_inline_style('xoo-ml-style', $style ); } //Enqueue javascript public function enqueue_scripts(){ if( !wp_script_is( 'select2' ) ){ wp_enqueue_script( 'select2', "https://cdn.jsdelivr.net/npm/select2#4.1.0-beta.1/dist/js/select2.min.js", array('jquery'), XOO_ML_VERSION, true ); // Main JS } if( xoo_ml_helper()->get_phone_option('m-operator') === 'firebase' ){ wp_enqueue_script( 'firebase', 'https://www.gstatic.com/firebasejs/7.21.0/firebase-app.js', array(), false, true ); wp_enqueue_script( 'firebase-auth', 'https://www.gstatic.com/firebasejs/7.21.0/firebase-auth.js', array(), false, true ); } wp_enqueue_script( 'xoo-ml-phone-js', XOO_ML_URL.'/assets/js/xoo-ml-phone-js.js', array('jquery'), XOO_ML_VERSION, true ); // Main JS $settings = $this->settings; wp_localize_script('xoo-ml-phone-js','xoo_ml_phone_localize',array( 'adminurl' => admin_url().'admin-ajax.php', 'resend_wait' => $settings['otp-resend-wait'], 'phone_form_classes' => json_encode( self::phone_form_classes() ), 'auto_submit_reg' => $settings['r-auto-submit'], 'show_phone' => $settings['r-phone-field'], 'otp_form_type' => $settings['m-otp-form-type'], 'operator' => $settings['m-operator'], 'inline_otp_verify_btn' => apply_filters( 'xoo_ml_inline_otp_verify', '<span class="xoo-ml-inline-verify">'.__( 'Verify', 'mobile-login-woocommerce' ).'</span>' ), 'strings' => array( 'verified' => __( '<span class="dashicons dashicons-yes"></span>', 'mobile-login-woocommerce' ), 'verify' => __( 'Verify', 'mobile-login-woocommerce' ), 'placeholderInlineOTP' => __( 'Enter OTP', 'mobile-login-woocommerce' ) ), 'notices' => array( 'empty_phone' => xoo_ml_add_notice( __( 'Please enter a phone number', 'mobile-login-woocommerce' ), 'error' ), 'empty_email' => xoo_ml_add_notice( __( 'Email address cannot be empty.', 'mobile-login-woocommerce' ), 'error' ), 'empty_password'=> xoo_ml_add_notice( __( 'Please enter a password.', 'mobile-login-woocommerce' ), 'error' ), 'invalid_phone' => xoo_ml_add_notice( __( 'Please enter a valid phone number without any special characters & country code.', 'mobile-login-woocommerce' ), 'error' ), 'try_later' => xoo_ml_add_notice( __( 'Something went wrong. Please try later', 'mobile-login-woocommerce' ), 'error' ), 'verify_error' => xoo_ml_add_notice( __( 'Please verify your mobile number', 'mobile-login-woocommerce' ), 'error' ), 'error_placeholder' => xoo_ml_add_notice( '%s', 'error' ), 'success_placeholder' => xoo_ml_add_notice( '%s', 'success' ), 'firebase_api_error' => xoo_ml_add_notice( __( 'Firebase API key is empty. Please setup firebase keys, read documentation.', 'mobile-login-woocommerce' ), 'error' ), ), 'login_first' => $settings['l-login-display'], 'html' => array( 'otp_form_inline' => xoo_ml_helper()->get_template( "xoo-ml-inline-otp-input.php", array(), '', true ), 'otp_form_external' => xoo_ml_helper()->get_template( "xoo-ml-external-otp-form.php", array(), '', true ), ), 'firebase' => array( 'api' => xoo_ml_helper()->get_service_option('fb-api-key'), ) )); if( $settings['m-operator'] === 'firebase' && xoo_ml_helper()->get_service_option('fb-config') ){ wp_add_inline_script('xoo-ml-phone-js', 'xoo_ml_phone_localize.firebase.config = '. htmlspecialchars_decode( xoo_ml_helper()->get_service_option('fb-config') ) ); } } public static function wc_register_phone_input_args( $args = array() ){ $default_args = array( 'label' => __('Phone', 'mobile-login-woocommerce'), 'cont_class' => array( 'woocommerce-form-row', 'woocommerce-form-row--wide', 'form-row form-row-wide' ), 'input_class' => array( 'woocommerce-Input', 'input-text', 'woocommerce-Input--text' ) ); return wp_parse_args( $args, $default_args ); } public function wc_myaccount_edit_phone_input(){ return xoo_ml_get_phone_input_field( self::wc_register_phone_input_args( array( 'form_type' => 'update_user', 'default_phone' => xoo_ml_get_user_phone( get_current_user_id(), 'number' ), 'default_cc' => xoo_ml_get_user_phone( get_current_user_id(), 'code' ), ) ) ); } public function wc_register_phone_input(){ return xoo_ml_get_phone_input_field( self::wc_register_phone_input_args() ); } public static function phone_form_classes(){ return apply_filters( 'xoo_ml_phone_form_classes', array( 'woocommerce-form-register' ) ); } public function wc_login_username_field_i8n( $translation, $text, $domain ){ if( $domain === 'woocommerce' && ( strcmp( $text, 'Username or email' ) === 0 || strcmp( $text, 'Username or email address' ) === 0 ) ){ return __( 'Phone or Email address', 'mobile-login-woocommerce' ); } return $translation; } } function xoo_ml_phone_frontend(){ return Xoo_Ml_Phone_Frontend::get_instance(); } xoo_ml_phone_frontend(); And this is what I added that doesn't work properly check the 2nd picture it has no function verify does not do anything: if( $this->settings['r-enable-phone'] === "yes" ){ add_action( 'woocommerce_before_checkout_registration_form', array( $this, 'wc_register_phone_input' ) ); add_action( 'woocommerce_register_form_start', array( $this, 'wc_register_phone_input' ) ); add_action( 'woocommerce_edit_account_form_start', array( $this, 'wc_myaccount_edit_phone_input' ) ); }
How to change a call for a WordPress user id to a call for a users display name
I am working on modifying this plugin in an attempt to make it better fit my needs. However I have been having tremendous amounts of trouble switching from it using the users id to the users display name. I have included the original and my edits below. Any help or recommendations are greatly appreciated! ORIGINAL CODE: <?php Class Chatroom { function __construct() { register_activation_hook( __FILE__, array( $this, 'activation_hook' ) ); register_deactivation_hook( __FILE__, array( $this, 'deactivation_hook' ) ); add_action( 'init', array( $this, 'register_post_types' ) ); add_action( 'wp_enqueue_scripts', array( $this, 'enqueue_scripts' ) ); add_action( 'save_post', array( $this, 'maybe_create_chatroom_log_file' ), 10, 2 ); add_action( 'wp_head', array( $this, 'define_javascript_variables' ) ); add_action( 'wp_ajax_check_updates', array( $this, 'ajax_check_updates_handler' ) ); add_action( 'wp_ajax_send_message', array( $this, 'ajax_send_message_handler' ) ); add_filter( 'the_content', array( $this, 'the_content_filter' ) ); } function activation_hook() { $this->register_post_types(); flush_rewrite_rules(); } function deactivation_hook() { flush_rewrite_rules(); } function register_post_types() { $labels = array( 'name' => _x( 'Chat Rooms', 'post type general name', 'chatroom' ), 'singular_name' => _x( 'Chat Room', 'post type singular name', 'chatroom' ), 'add_new' => _x( 'Add New', 'book', 'chatroom' ), 'add_new_item' => __( 'Add New Chat Room', 'chatroom' ), 'edit_item' => __( 'Edit Chat Room', 'chatroom' ), 'new_item' => __( 'New Chat Room', 'chatroom' ), 'all_items' => __( 'All Chat Rooms', 'chatroom' ), 'view_item' => __( 'View Chat Room', 'chatroom' ), 'search_items' => __( 'Search Chat Rooms', 'chatroom' ), 'not_found' => __( 'No Chat Rooms found', 'chatroom' ), 'not_found_in_trash' => __( 'No Chat Rooms found in Trash', 'chatroom' ), 'parent_item_colon' => '', 'menu_name' => __( 'Chat Rooms', 'chatroom' ) ); $args = array( 'labels' => $labels, 'public' => true, 'publicly_queryable' => true, 'show_ui' => true, 'show_in_menu' => true, 'query_var' => true, 'capability_type' => 'post', 'has_archive' => true, 'hierarchical' => false, 'menu_position' => null, 'show_in_nav_menus' => true, 'supports' => array( 'title' ) ); register_post_type( 'chat-room', $args ); } function enqueue_scripts() { global $post; if ( $post->post_type != 'chat-room' ) return; wp_enqueue_script( 'jquery' ); wp_enqueue_script( 'chat-room', plugins_url( 'chat-room.js', __FILE__ ) ); wp_enqueue_style( 'chat-room-styles', plugins_url( 'chat-room.css', __FILE__ ) ); } function maybe_create_chatroom_log_file( $post_id, $post ) { if ( empty( $post->post_type ) || $post->post_type != 'chat-room' ) return; $upload_dir = wp_upload_dir(); $log_filename = $upload_dir['basedir'] . '/chatter/' . $post->post_name . '-' . date( 'm-d-y', time() ); if ( file_exists( $log_filename ) ) return; wp_mkdir_p( $upload_dir['basedir'] . '/chatter/' ); $handle = fopen( $log_filename, 'w' ); fwrite( $handle, json_encode( array() ) ); // TODO create warnings if the user can't create a file, and suggest putting FTP creds in wp-config } function define_javascript_variables() { global $post; if ( empty( $post->post_type ) || $post->post_type != 'chat-room' ) return; ?> <script> var ajaxurl = '<?php echo admin_url( 'admin-ajax.php' ); ?>'; var chatroom_slug = '<?echo $post->post_name; ?>'; </script> <?php } function ajax_check_updates_handler() { $upload_dir = wp_upload_dir(); $log_filename = $this->get_log_filename( sanitize_text_field( $_POST['chatroom_slug'] ) ); $contents = $this->parse_messages_log_file( $log_filename ); $messages = json_decode( $contents ); foreach ( $messages as $key => $message ) { if ( $message->id <= $_POST['last_update_id'] ) unset( $messages[$key] ); } $messages = array_values( $messages ); echo json_encode( $messages ); die; } /** * AJAX server-side handler for sending a message. * * Stores the message in a recent messages file. * * Clears out cache of any messages older than 10 seconds. */ function ajax_send_message_handler() { $current_user = wp_get_current_user(); $this->save_message( sanitize_text_field( $_POST['chatroom_slug'] ), $current_user->id, $_POST['message'] ); die; } function save_message( $chatroom_slug, $current_user->id, $content ) { $user = get_userdata( $current_user->id ); if ( ! $user_text_color = get_user_meta( $current_user->id, 'user_color', true ) ) { // Set random color for each user $red = rand( 0, 16 ); $green = 16 - $red; $blue = rand( 0, 16 ); $user_text_color = '#' . dechex( $red^2 ) . dechex( $green^2 ) . dechex( $blue^2 ); update_user_meta( $current_user->id, 'user_color', $user_text_color ); } $content = esc_attr( $content ); // Save the message in recent messages file $log_filename = $this->get_log_filename( $chatroom_slug ); $contents = $this->parse_messages_log_file( $log_filename ); $messages = json_decode( $contents ); $last_message_id = 0; // Helps determine the new message's ID foreach ( $messages as $key => $message ) { if ( time() - $message->time > 10 ) { $last_message_id = $message->id; unset( $messages[$key] ); } else { break; } } $messages = array_values( $messages ); if ( ! empty( $messages ) ) $last_message_id = end( $messages )->id; $new_message_id = $last_message_id + 1; $messages[] = array( 'id' => $new_message_id, 'time' => time(), 'sender' => $current_user->id, 'contents' => $content, 'html' => '<div class="chat-message-' . $new_message_id . '"><strong style="color: ' . $user_text_color . ';">' . $user->user_login . '</strong>: ' . $content . '</div>', ); $this->write_log_file( $log_filename, json_encode( $messages ) ); // Save the message in the daily log $log_filename = $this->get_log_filename( $chatroom_slug, date( 'm-d-y', time() ) ); $contents = $this->parse_messages_log_file( $log_filename ); $messages = json_decode( $contents ); $messages[] = array( 'id' => $new_message_id, 'time' => time(), 'sender' => $current_user->id, 'contents' => $content, 'html' => '<div class="chat-message-' . $new_message_id .'"><strong style="color: ' . $user_text_color . ';">' . $user->user_login . '</strong>: ' . $content . '</div>', ); $this->write_log_file( $log_filename, json_encode( $messages ) ); } function write_log_file( $log_filename, $content ) { $handle = fopen( $log_filename, 'w' ); fwrite( $handle, $content ); } function get_log_filename( $chatroom_slug, $date = 'recent' ) { $upload_dir = wp_upload_dir(); $log_filename = $upload_dir['basedir'] . '/chatter/' . $chatroom_slug . '-' . $date; return $log_filename; } function parse_messages_log_file( $log_filename ) { $upload_dir = wp_upload_dir(); $handle = fopen( $log_filename, 'r' ); $contents = fread( $handle, filesize( $log_filename ) ); fclose( $handle ); return $contents; } function the_content_filter( $content ) { global $post; if ( $post->post_type != 'chat-room' ) return $content; if ( ! is_user_logged_in() ) { ?>You need to be logged in to participate in the chatroom.<?php return; } ?> <div class="chat-container"> </div> <textarea class="chat-text-entry"></textarea> <?php return ''; } } $chatroom = new Chatroom(); EDITS: <?php Class Chatroom { function __construct() { register_activation_hook( __FILE__, array( $this, 'activation_hook' ) ); register_deactivation_hook( __FILE__, array( $this, 'deactivation_hook' ) ); add_action( 'init', array( $this, 'register_post_types' ) ); add_action( 'wp_enqueue_scripts', array( $this, 'enqueue_scripts' ) ); add_action( 'save_post', array( $this, 'maybe_create_chatroom_log_file' ), 10, 2 ); add_action( 'wp_head', array( $this, 'define_javascript_variables' ) ); add_action( 'wp_ajax_check_updates', array( $this, 'ajax_check_updates_handler' ) ); add_action( 'wp_ajax_send_message', array( $this, 'ajax_send_message_handler' ) ); add_filter( 'the_content', array( $this, 'the_content_filter' ) ); } function activation_hook() { $this->register_post_types(); flush_rewrite_rules(); } function deactivation_hook() { flush_rewrite_rules(); } function register_post_types() { $labels = array( 'name' => _x( 'Chat Rooms', 'post type general name', 'chatroom' ), 'singular_name' => _x( 'Chat Room', 'post type singular name', 'chatroom' ), 'add_new' => _x( 'Add New', 'book', 'chatroom' ), 'add_new_item' => __( 'Add New Chat Room', 'chatroom' ), 'edit_item' => __( 'Edit Chat Room', 'chatroom' ), 'new_item' => __( 'New Chat Room', 'chatroom' ), 'all_items' => __( 'All Chat Rooms', 'chatroom' ), 'view_item' => __( 'View Chat Room', 'chatroom' ), 'search_items' => __( 'Search Chat Rooms', 'chatroom' ), 'not_found' => __( 'No Chat Rooms found', 'chatroom' ), 'not_found_in_trash' => __( 'No Chat Rooms found in Trash', 'chatroom' ), 'parent_item_colon' => '', 'menu_name' => __( 'Chat Rooms', 'chatroom' ) ); $args = array( 'labels' => $labels, 'public' => true, 'publicly_queryable' => true, 'show_ui' => true, 'show_in_menu' => true, 'query_var' => true, 'capability_type' => 'post', 'has_archive' => true, 'hierarchical' => false, 'menu_position' => null, 'show_in_nav_menus' => true, 'supports' => array( 'title' ) ); register_post_type( 'chat-room', $args ); } function enqueue_scripts() { global $post; if ( $post->post_type != 'chat-room' ) return; wp_enqueue_script( 'jquery' ); wp_enqueue_script( 'chat-room', plugins_url( 'chat-room.js', __FILE__ ) ); wp_enqueue_style( 'chat-room-styles', plugins_url( 'chat-room.css', __FILE__ ) ); } function maybe_create_chatroom_log_file( $post_id, $post ) { if ( empty( $post->post_type ) || $post->post_type != 'chat-room' ) return; $upload_dir = wp_upload_dir(); $log_filename = $upload_dir['basedir'] . '/chatter/' . $post->post_name . '-' . date( 'm-d-y', time() ); if ( file_exists( $log_filename ) ) return; wp_mkdir_p( $upload_dir['basedir'] . '/chatter/' ); $handle = fopen( $log_filename, 'w' ); fwrite( $handle, json_encode( array() ) ); // TODO create warnings if the user can't create a file, and suggest putting FTP creds in wp-config } function define_javascript_variables() { global $post; if ( empty( $post->post_type ) || $post->post_type != 'chat-room' ) return; ?> <script> var ajaxurl = '<?php echo admin_url( 'admin-ajax.php' ); ?>'; var chatroom_slug = '<?echo $post->post_name; ?>'; </script> <?php } function ajax_check_updates_handler() { $upload_dir = wp_upload_dir(); $log_filename = $this->get_log_filename( sanitize_text_field( $_POST['chatroom_slug'] ) ); $contents = $this->parse_messages_log_file( $log_filename ); $messages = json_decode( $contents ); foreach ( $messages as $key => $message ) { if ( $message->id <= $_POST['last_update_id'] ) unset( $messages[$key] ); } $messages = array_values( $messages ); echo json_encode( $messages ); die; } /** * AJAX server-side handler for sending a message. * * Stores the message in a recent messages file. * * Clears out cache of any messages older than 10 seconds. */ function ajax_send_message_handler() { $current_user = wp_get_current_user(); $this->save_message( sanitize_text_field( $_POST['chatroom_slug'] ), $current_user->display_name, $_POST['message'] ); die; } function save_message( $chatroom_slug, $user_id, $content ) { $user = get_userdata( $user_id ); if ( ! $user_text_color = get_user_meta( $user_id, 'user_color', true ) ) { // Set random color for each user $red = rand( 0, 16 ); $green = 16 - $red; $blue = rand( 0, 16 ); $user_text_color = '#' . dechex( $red^2 ) . dechex( $green^2 ) . dechex( $blue^2 ); update_user_meta( $user_id, 'user_color', $user_text_color ); } $content = esc_attr( $content ); // Save the message in recent messages file $log_filename = $this->get_log_filename( $chatroom_slug ); $contents = $this->parse_messages_log_file( $log_filename ); $messages = json_decode( $contents ); $last_message_id = 0; // Helps determine the new message's ID foreach ( $messages as $key => $message ) { if ( time() - $message->time > 10 ) { $last_message_id = $message->id; unset( $messages[$key] ); } else { break; } } $messages = array_values( $messages ); if ( ! empty( $messages ) ) $last_message_id = end( $messages )->id; $new_message_id = $last_message_id + 1; $messages[] = array( 'id' => $new_message_id, 'time' => time(), 'sender' => $user_id, 'contents' => $content, 'html' => '<div class="chat-message-' . $new_message_id . '"><strong style="color: ' . $user_text_color . ';">' . $user->user_login . '</strong>: ' . $content . '</div>', ); $this->write_log_file( $log_filename, json_encode( $messages ) ); // Save the message in the daily log $log_filename = $this->get_log_filename( $chatroom_slug, date( 'm-d-y', time() ) ); $contents = $this->parse_messages_log_file( $log_filename ); $messages = json_decode( $contents ); $messages[] = array( 'id' => $new_message_id, 'time' => time(), 'sender' => $user_id, 'contents' => $content, 'html' => '<div class="chat-message-' . $new_message_id .'"><strong style="color: ' . $user_text_color . ';">' . $user->user_login . '</strong>: ' . $content . '</div>', ); $this->write_log_file( $log_filename, json_encode( $messages ) ); } function write_log_file( $log_filename, $content ) { $handle = fopen( $log_filename, 'w' ); fwrite( $handle, $content ); } function get_log_filename( $chatroom_slug, $date = 'recent' ) { $upload_dir = wp_upload_dir(); $log_filename = $upload_dir['basedir'] . '/chatter/' . $chatroom_slug . '-' . $date; return $log_filename; } function parse_messages_log_file( $log_filename ) { $upload_dir = wp_upload_dir(); $handle = fopen( $log_filename, 'r' ); $contents = fread( $handle, filesize( $log_filename ) ); fclose( $handle ); return $contents; } function the_content_filter( $content ) { global $post; if ( $post->post_type != 'chat-room' ) return $content; if ( ! is_user_logged_in() ) { ?>You need to be logged in to participate in the chatroom.<?php return; } ?> <div class="chat-container"> </div> <textarea class="chat-text-entry"></textarea> <?php return ''; } } $chatroom = new Chatroom();
Wordpress page using ajax and pagination
I have my ajax running perfectly and now i need my pagination to work on the page. I have no idea how to start.. another problem is i need it to bring in 16 posts at a time.. PLease help How do i change this into a next and previous pagination html below <ul id="sermonserie1"> while ( $query->have_posts() ) : $query->the_post(); Next page <?php endwhile;?> </ul> ajax page global $post, $wpdb; if(isset($_POST['pagi'])) { if( isset($_REQUEST["locations"]) || isset($_REQUEST["speaker"]) || isset($_REQUEST["topic"])) { if ($_REQUEST["locations"]!='#' ) { $locat_termy = array('sermons', $_REQUEST['locations']); } else { $locat_termy = array('sermons'); $locations_resource = get_term_children( 16, 'category' ); foreach ( $locations_resource as $child_location ) { $location_term = get_term_by( 'id', $child_location, 'category' ); $locat_termy[] .= $location_term->slug; } //print_r($locations_resource); //print_r($locat_termy); } $all_args = array( 'post_type' => 'resources', 'author' => $speak, 'posts_per_page' => -1, 'tax_query' => array ( 'relation' => 'OR', array( 'taxonomy' => 'post_tag', 'field' => 'id', 'terms' => $topicids, ), array( 'taxonomy' => 'category', 'field' => 'slug', 'terms' => $locat_termy, ), ) ,'date_query' => $thedate ); $query = new WP_Query( $all_args ); //print_r($query); //$eevents = array(); //print_r($query); while ( $query->have_posts() ) : $query->the_post();?> <?php endwhile; ?> <?php } } ?> this is my js jQuery('.button.load-more').live('click', function() { var pagenum = parseInt(jQuery(this).attr('page'))+ 1; jQuery.ajax({ type: 'post', url: 'http://cj.co.za/back/page/'+pagenum+'', data: { pagi:1, }, success: function(data) { jQuery('#sermonserie1').append(data); jQuery('.button.load-more').attr('page', pagenum) }, error: function() { jQuery('.button.load-more').text('No page'); } }); });