User like/dislike posts with show all liked or show all disliked

[mcfmullen]

Okay, I'm trying to reverse engineer a feature on a website I found - the webmaster is not replying to me. The site in question is http://www.win-free-stuff.ca/new-contests and in particular I am trying to build the Show Entered and Show not interested buttons of the site which work in tandem with the checkmarks and X's next to each post/contest.

 

I have figured out that he is using either jQuery or mootools to accomplish this probably with php and MSQL. I've also found my way into his css to build the buttons. My problem is in the coding of the javascript to get the bottons to actually function.

 

This is what I have so far for the Hide entered and Hide all not interested:

 

       

`<form id="compFilterForm" action="http://www.win-free-stuff.ca/new-contests" method="POST">	
<div id="filterInputs">	
<input id="cmFilterDisplayOption1" class="cmFilterDisplay hidden" type="checkbox" name="cm_filter_display[]" value="entered" checked />	
<input id="cmFilterDisplayOption2" class="cmFilterDisplay hidden" type="checkbox" name="cm_filter_display[]" value="notInterested" checked />	
<a id="filterEntered" class="filterEntered filterEnteredChked" href="#" title="Click here to show the competitions you’ve marked as entered" target="_self"></a>	
<a id="filterNotInterested" class="filterNotInterested filterNotInterestedChked" href="#" title="Click here to show the competitions you’ve marked as not interested" target="_self"></a>	
<a id="compFilterHelp" class="help helpAlt" href="#" title="Help" target="_self"></a> 
</div>	</form> `

 

And this is the entered/not interested for the individual posts:

 

`<form id="compListing" class="preferences" action="" method="POST">
<div class="competitionBox">	
<div class="compPref">	
<a class="updatePrefEntered entered" href="#" title="Mark as Entered" target="_self">	
<input class="hidden" type="text" name="cm_user_pref_tick" value="0" />	
</a>	
<a class="updatePrefNotInterested notInterested" href="#" title="Mark as Not Interested" target="_self"> <input class="hidden" type="text" name="cm_user_pref_cross" value="0" />	
</a>	
</div>	</div>	</form> `

 

 

So is there a $_GET function I should be calling? Is it jQuery or is it Mootools or is it php and MySQL? Can someone at least point me in the right direction if you can't help me here? Ideally this whole thing must also remember the entered/not interested every time the user returns as well, would this require cookies?

 

The goal is to allow users to see only posts they like, only posts they dislike (they might change their minds), see only posts they haven't decided on, or see everything.

 

I realize I may be in over my head but I kow someone here can point me in the right direction. Thanks.

 

You can see what I've put together at www.mcfilmmakers.com

[Adam]

This isn't "reverse engineering". You're just ripping their client-side code and have got stuck when it comes to actually working something out.

[mcfmullen]

This isn't "reverse engineering". You're just ripping their client-side code and have got stuck when it comes to actually working something out.

 

That is the definition of reverse engineering - to take something you don't understand and rebuilding it into something you can use.

 

Regardless of that, how is your comment helpful?

[Adam]

No, not "take" - build something through examination of something else. You're not doing that though, you have quite literally just taken their HTML, CSS and images, and have no idea what to do past there. You've already nicked their rating system.

 

My point wasn't supposed to be helpful to you, it was highlight the fact that we're not here to help people rip off someone else's work.

[Adam]

Do you see the copyright message in the footer of that site?

[mcfmullen]

I'm not ripping pff anyone. The rating system is a plugin for wordpress. There's no ripping off there.

 

You are saying that I want to clone his site. I clearly do not want to do that. I want users to select posts they like or dislike, not contests they've entered/ignored. I simply want to build a similar system. I have given the code I've found to help people get an idea of what is at play.

 

I don't care if the coding is the same, nor if it uses the same code. I simply want to be pointed in the right direction as to how to build such a thing. You would have known that had you read my post in the first place.

 

Please focus on being helpful rather than trolling me for stealing when I clearly am not, nor have any interest in doing such a thing.

[mcfmullen]

No, not "take" - build something through examination of something else. You're not doing that though, you have quite literally just taken their HTML, CSS and images, and have no idea what to do past there. You've already nicked their rating system.

 

My point wasn't supposed to be helpful to you, it was highlight the fact that we're not here to help people rip off someone else's work.

 

rebuild = build. You can't build through examination without first taking the code and examining it which is exactly what I have done above!

[Adam]

The rating system is a plugin for wordpress. There's no ripping off there.

 

Yeah, fair enough I'll eat my words there. The attitude you seemed to give off before though is that you've taken what code you could and now want someone to show you how to take the rest. If you reread your original post look at it from that perspective, things like; "I've also found my way into his css to build the buttons" and "This is what I have so far for the Hide entered and Hide all not interested" (with their exact code following) - it can give off that impression.

 

----

 

I would suggest scrapping the mark-up you have and writing it completely from scratch. Use the other website only as a guide if you get stuck on certain areas, such as how they bind events to each set of buttons, handle the AJAX, etc. You'll benefit far more from trying to do it yourself as opposed to figuring out how to do it following someone else's idea. There's no correct as such way of doing it.

 

Personally I would have a simple table storing the post ID, user ID and a boolean value for like. Use a left join to pull in the data as you render the posts for a user, so you can decide how to draw the buttons based on the like column; 1 being like obviously, 0 dislike and null for not chosen. Use AJAX to update/insert the table as the user chooses.

 

As for hiding/showing posts, you can assign a shared class name to the post's wrapper DIV based on whether they like it or not. Using jQuery you can then target those that are liked or disliked extremely easily:

 

$('.likeGroup').hide();
$('.dislikeGroup').hide();

[mcfmullen]

Thank you, this helps tremendously!