Jump to content






Photo
* * * * * 2 votes

IP.Board 3.1.3 Developers Update: "Like" System

Posted by Matt , in 3.1.0, Beta 27 October 2010 · 2,661 views

I blogged in a previous entry about the new "like" system that is coming to IP.Gallery, IP.Downloads and IP.Blog.

This is a brand new feature in the core of IP.Board and even though we plan to make more use of it in the actual forums in 3.2, it is ready to be used by modification authors in 3.1.3.

Before I get into the mechanics of the system, I wanted to give you a brief overview of how it works.

Posted Image
This screen shot shows the "like" bar directly underneath the image. The pop-up overlay shows who has "liked" the image. This is opened when you click on the "1 other" link.

Posted Image
When you like an image, you can elect to receive notification of 'updates'. Updates can be various things, in this example it is when a comment is added. You can also elect to 'like' the item anonymously so you can receive updates without showing on the "liked by" list.

Posted Image
All content you "like" is added to your "like center". From here you can bulk remove or update the type of notification. We do plan to make this "like center" more extensive in 3.2.0 with a tabbed interface and more filters but it is ready to use in 3.1.3.

Posted Image
You can quickly access the "like center" from your username drop down at the top of the page.

Implementation
You can add "like" to almost any object by adding a single PHP class into /extensions/like/. I'll take you through the "like" class for Gallery. This file is situated in /admin/applications_addon/ips/gallery/extensions/like/images.php

The class name is as follows:

class like_{app}_{type}_composite extends classes_like_composite

So, for Gallery, this is:

class like_gallery_images_composite extends classes_like_composite

There are only three methods that need to be defined:

The first two are very straight forward:

/**
	 * Return an array of acceptable frequencies
	 * Possible: immediate, offline, daily, weekly
	 * 
	 * @return	array
	 */
	public function allowedFrequencies()
	{
		return array( 'immediate', 'offline' );
	}
	
	/**
	 * return type of notification available for this item
	 * 
	 * @return	array (key, readable name)
	 */
	public function getNotifyType()
	{
		return array( 'comments', 'comments' );
	}

Note: If this "like" will notify of new comments, then the only allowed frequencies are 'immediate' and 'offline'.

The last is getMeta

/**
	 * Returns the type of item
	 * 
	 * @param	mixed	Relationship ID or array of
	 * @param	array	Array of meta to select (title, url, type, parentTitle, parentUrl, parentType) null fetches all
	 * @return	array	Meta data
	 */
	public function getMeta( $relId, $selectType=null )
	{
		$return    = array();
		$isNumeric = false;
		
		if ( is_numeric( $relId ) )
		{
			$relId     = array( intval($relId) );
			$isNumeric = true;
		}
		
		$this->DB->build( array( 'select' => 'i.*',
								 'from'   => array( 'gallery_images' => 'i' ),
								 'where'  => 'i.id IN (' . implode( ',', $relId ) . ')',
								 'add_join' => array( array( 'select' => 'a.*',
															 'from'   => array( 'gallery_albums_main' => 'a' ),
															 'where'  => 'i.img_album_id=a.album_id',
															 'type'   => 'left'  ) ) ) );
		
		$this->DB->execute();
		
		while( $row = $this->DB->fetch() )
		{
			/* Title */
			if ( $selectType === null OR ( is_array( $selectType ) AND in_array( 'title', $selectType ) ) )
			{
				$return[ $row['id'] ]['like.title'] = $row['caption'];
			} 
			
			/* URL */
			if ( $selectType === null OR ( is_array( $selectType ) AND in_array( 'url', $selectType ) ) )
			{
				$return[ $row['id'] ]['like.url'] = $this->registry->output->buildSEOUrl( "app=gallery&image=" . $row['id'], "public", $row['caption_seo'], "viewimage" );
			}
			
			/* Type */
			if ( $selectType === null OR ( is_array( $selectType ) AND in_array( 'type', $selectType ) ) )
			{
				$return[ $row['id'] ]['like.type'] = 'Image';
			} 
			
			/* Parent title */
			if ( $selectType === null OR ( is_array( $selectType ) AND in_array( 'parentTitle', $selectType ) ) )
			{
				$return[ $row['id'] ]['like.parentTitle'] = $row['album_name'];
			} 
			
			/* Parent url */
			if ( $selectType === null OR ( is_array( $selectType ) AND in_array( 'parentTitle', $selectType ) ) )
			{
				$return[ $row['id'] ]['like.parentUrl'] = $this->registry->output->buildSEOUrl( "app=gallery&album=" . $row['album_id'], "public", $row['album_name_seo'], "viewalbum" );
			} 
			
			/* Parent Type */
			if ( $selectType === null OR ( is_array( $selectType ) AND in_array( 'parentType', $selectType ) ) )
			{
				$return[ $row['id'] ]['like.parentType'] = 'Album';
			} 
		}
		
		return ( $isNumeric === true ) ? array_pop( $return ) : $return;
	}

This method returns meta data about either a single item or an array of items. This is used to generate the data in the "like center".

To add the like bar in your own applications, all you need to do is add:

require_once( IPS_ROOT_PATH . 'sources/classes/like/composite.php' );
$likeClass = classes_like::bootstrap( '{app}', '{type}' );

$like = $likeClass->render( 'summary', $itemId );

$like now contains the HTML which you can use in your templates like so:

<div>{$like}</div>

I will go into more detail on this in our documentation and please watch out for the "comments" class blog entry as it ties in with this class to auto-send comment notifications without any additional coding!

  • Maxxius likes this



Very nice :)
Nice one :D
Photo
skinbydragonfly
Oct 27 2010 04:49 AM
"likes" oh wait :P
    • Jimi Wikman, AndyF, Daracon and 2 others like this
Nice one Matt
Awesome. I'm so glad I picked IPB.
    • Matt, AndyF, Daracon and 4 others like this
I Like it, I Like it. :)
Very good. Perhaps you can use this to build a Bookmark tool, too. Many times I want to mark a post/topic to check some time later.
    • AlexJ and Anthony. like this
Nice, but if I used it my users would just complain that I'm making the forum more like facebook. <_<
Are we going to see this featured integrated into IP.Content as well? Since we can have limitless varieties of databases, it would be awesome to be able to "Like" a particular database submission.

For example, your resources section here is built out of IP.Content I believe.. it would be great to "Like" a particular article.
    • Flowsion likes this
So, if I am reading this correctly, we could use this in tracker and retire our subscription system?

Keith
Krocheck - yup! We'll be using it over "watched" topics and forums.
Like! :cool:
Photo
Jimi Wikman
Oct 27 2010 10:40 AM
Very nice Matt!
woot! Love it! Thanks!
Looking forward to seeing if this will be included in IP.Content Articles.
Good, but the list under the user name is getting rather long.

Could My Gallery, My Blog etc all be under "My Content" ?

Or at least drop "Manage Ignored users" Do we really need a shortcut to it?
great job guys

Good, but the list under the user name is getting rather long.

Could My Gallery, My Blog etc all be under "My Content" ?

Or at least drop "Manage Ignored users" Do we really need a shortcut to it?


It's all editable in your skin templates. :)
Photo
Eduardo Bautista
Oct 27 2010 05:34 PM
What about the Dislike button :(
    • breatheheavy likes this
This would definitely work as a "Favorite Posts" feature. :D Not quite what I had been asking for, but it's definitely close enough for now. Just add in the ability to have comments (private and/or public) for why you 'liked' something and it'll kick ass.

:D :D :D

September 2014

S M T W T F S
 123456
78910111213
14151617 18 1920
21222324252627
282930    

Recent Entries

Latest Visitors

  • Photo
    IPBPlanet
    2 minutes ago
  • Photo
    StealthBravo
    26 minutes ago
  • Photo
    vinegredz
    40 minutes ago
  • Photo
    #Synerion-x7-∫'
    58 minutes ago
  • Photo
    nicovent
    Today, 02:16 PM
  • Photo
    Anto4444_
    Today, 02:11 PM
  • Photo
    haqzore
    Today, 01:50 PM
  • Photo
    elazulreal
    Today, 01:12 PM
  • Photo
    sobrenome
    Today, 01:11 PM
  • Photo
    Y0K3R
    Today, 01:07 PM

Recent Comments

Search My Blog