Custom Like Function

Ask the community
, ,
1

Hi,
I would like to insert a custom like function on my Website. So i used this code to start (https://www.wix.com/corvid/example/custom-like-button). But I dont want a Blog on my Website because I’m building something like a Social Network. This is the reason why i can not use the first part of this code.
At this point right now i already created a like function with the code below but the likes per user are not saved so far. This means if a user leaves this page and rejoins he can like this post again.

To solve this problem I created a second database (‘PostLikeData’) with the columns ‘UserId’ and ‘Post’.
In ‘UserId’ I put the userId and the column ‘Post’ is a reference-field which is linked to the database with all the posts inside. But it doesn’t work like i want. Through the value of currentPostId the item in this column should automatically be linked to the Post which was liked by the user.

Is there anybody who knows how to realize this?

import wixData from ‘wix-data’ ;
import wixUsers from ‘wix-users’ ;

let currentLikeButtonState

const likeButtonStates = {
default : ‘default’ ,
active: ‘active’ ,
}

$w.onReady( () => {

$w( “#dynamicDataset” ).onReady( () => {

let numberOfLikes = $w( ‘#dynamicDataset’ ).getCurrentItem().likes;

let currentPostId = $w( ‘#dynamicDataset’ ).getCurrentItem()._id;

//____________________________________________________________________

$w( ‘#likeButtonDefault’ ).onClick( async () => {

numberOfLikes = numberOfLikes +  1 ; 

$w( '#dynamicDataset' ).setFieldValue( 'likes' , (numberOfLikes)); 
$w( '#dynamicDataset' ).save() 
console.log( "likes:" , numberOfLikes) 



$w( '#likeButtonActive' ).show() 
$w( '#likeButtonDefault' ).hide()

})

//____________________________________________________________________

$w( ‘#likeButtonActive’ ).onClick( async () => {

numberOfLikes = numberOfLikes - 1 ;

$w( ‘#dynamicDataset’ ).setFieldValue( ‘likes’ , (numberOfLikes));
$w( ‘#dynamicDataset’ ).save()
console.log( “likes:” , numberOfLikes);

$w( '#likeButtonActive' ).hide() 
$w( '#likeButtonDefault' ).show()

})

function setNumberOfLikes() {
$w( ‘#likesCounter’ ).text = numberOfLikes.toString()
}

} );

function setLikeButtonStateUI(state) {
switch (state) {
case likeButtonStates. default :
$w( ‘#likeButtonDefault’ ).show()
$w( ‘#likeButtonActive’ ).hide()
break

case likeButtonStates.active:
$w( ‘#likeButtonActive’ ).show()
$w( ‘#likeButtonDefault’ ).hide()

// Hide active GIF after animation ends
setTimeout(() => {
$w( ‘#likeButtonActive’ ).hide()
}, 1000 )
break
}
}

})

2

Hi,
Instead of making a new database you could use a column in yoir database as a array.
Give it a name like “userIdArray”
When a person clicks the button, loop trough the array.
In the loop check if the current user id is equal to an Id in the array.
If itbis equal, don’t do anything else use a function to add 1 to the likes.

Kind regards
Kristof.

3

This uses less code, only 1 database to connect to so faster to work with i gues

4

Hi,
first of all thank you for your answer.
But I’m not sure how I implement an array in wix…
In the database I can choose a field-type. I think I have to choose String-Array.
But how can I set up the Array in my Code or rather connect the code with this array.

Kind regards
Robert

5

sorry for the late answer, I didn’t check my mails last week