Code

Discussion on Reaction Button jQuery Plugin Makes Everything Reactable

iceylan supports this item

Supported

This author's response time can be up to 1 business day.

24 comments found.

Hi Ismail,

this is absolutely an amazing piece of work. Well done!

I have a few questions for you: 1. How to customise what reactions are available, e.g. I want to have just love and line? 2. When a user reacts to a message how to update the counter? In our implementation a user likes a comment, your control posts data to our server and we store that in the database. But we want that like to be real time visible to all other people on the same page. For real time messaging we use pusher.com. Basically what I’m asking is how to programatically mark that XYZ user has liked an element with id=25

3. How to on page load pre set that XYZ user has liked an element with id=25

Thanks!

Thank you so much. Actually, it could have been a little more practical. You cannot understand without using it either. Anyways.

It’s not really a problem. For the first time, I have a client who asks challenging questions. Please don’t feel uncomfortable about that.

You can add a code piece in the core side. With that you can export real instance from it to the global scope.

window[ "reactable-" + item ] = this;

Place this code in the 30rd line of the reactable.js file. Now you can access suitable instance like that; “window[ “reactable-58678” ].options…” from anywhere.

and don’t forget call the “intro” method after changes because of these properties are not reactive unfortunately.

Cheers Ismail

We have all the blocks in the place , the final question how to dynamically instance a reactions object from HTML :)

we have a fully rendered page, a user posts a comment and via AJAX we get back from the server a box with HTML of the comment (photo, name, text and reaction span

<span data-toggle="reactable" class="reactable" id="chat-58716" data-id="58716" data-service-uri="/pusher/123/PushReaction"> <div class="summary" /> <span class="feelings" /> <a href="#" class="label chat-actions">Like</a> </span>

What we need to call in order to get this newly added span converted to a reaction object (basically the same thing you do on page load, just here to a specific element). Ideally i would like for pluggin to parse the whole HTML as we can have up to 250 comments on the page

thanks mate

Hi.

You can select new span blocks with jquery and call reactable method on it.

$( "new span" ).reactable( ...options );

or if you need plugin’s instances to work with them later;

let newItem = new Reactable( { target: $( "new span" ), ... })

In the first example, the plugin is installed on multiple blocks at once. In the second example, you have to initialize plugin on the blocks one by one.

Seller sells garbage software. Not properly made. Trash. Don’t buy it.

Thank you.

Hi!

1. Which folder should I upload to the server? 2. what files should be included in the header and what code should be included in the body where you need to output the script?

P.S. Make simple documentation to make it clear to everyone!

Thanks

Hi I have noticed and will help as soon as possible. Sorry for delaying.

1. you have need to these files; reactable\asset\js\reactable-1.6.0.min.js reactable\asset\css\reactable.css reactable\asset\img\reactable-icons.png reactable\asset\sound\cork-effect.mp3 reactable\asset\sound\plup-effect.mp3 for php side eactable\native-php-sdk\Reactable you can upload the Reactable folder

2. in the header you have to include; reactable-1.6.0.min.js reactable.css

3. <div href="#" class="reactable" data-toggle="reactable" data-id="ID-1" data-value="angry" data-service-uri="Reactable/action.php" data-update="yes" data-volume="100" data-mobile-direction="left" data-sound="asset/sound/plup-effect.mp3"> <div class="summary" /> <span class="feelings" /> <a href="Reactable/action?id=ID-1&reaction=like&subject-type=null" class="label">Like</a> </div>

I would like to remind you that you need to complete the MySQL setup. SQL files are available in the plugin. If you don’t know how to do it, I can help with that too.

If you run into problems I can continue to help. My e-mail address is in the documentation. You can email me directly.

Thank you.

Hi The script does not work properly… Make a demo with the output of the script. So that you can copy the code from there and paste it on your site! Make the documentation easier… not clearly! Incorrect display on the mobile phone! Thank you

Hello again.

Does it worked or not i’m confused. I can apply it on your system for free if you want. You can directly email me ismaillceylan@gmail.com

(btw i’m working on a better documentation)

I am confused by the documentation, and I cannot get this to work inside my php website. Do you have a demo somewhere with the actual code placed?

Hello!

You can try reactable\native-php-sdk\Reactable\demo.php

I’ve got to where I can choose a reaction, but I cannot seem to get it to save to my database.

Do you offer installation?

Thanks.

Yes i can handle installation for you. ismaillceylan@gmail.com
by
by
by
by
by
by

Tell us what you think!

We'd like to ask you a few questions to help improve CodeCanyon.

Sure, take me to the survey