Code from 'Have You Seen' Videos

[Kier]

I've been asked to provide the code from my Have You Seen videos, so in the instances when it's useful, I will.

Note that the code I use in examples is usually thrown together very quickly, so I make no promises when it comes to performance, stability or security. These snippets should be used for learning purposes only.

 

[Kier]

Editing Templates and Defining a Callback for Pageshttp://xenforo.com/community/threads/editing-templates-and-defining-a-callback-for-pages.7226/

My page callback:

<?php

class Dev_PageCallback_TemplateDemo
{
	public static function respond(XenForo_ControllerPublic_Abstract $controller, XenForo_ControllerResponse_Abstract $response)
	{
		$visitor = XenForo_Visitor::getInstance()->toArray();

		$sessionModel = $controller->getModelFromCache('XenForo_Model_Session');

		$response->params['onlineUsers'] = $sessionModel->getSessionActivityQuickList(
			$visitor,
			array('cutOff' => array('>', $sessionModel->getOnlineStatusTimeout())),
			($visitor['user_id'] ? $visitor : null)
		);

		// fetch recent registrations
		$userModel = $controller->getModelFromCache('XenForo_Model_User');
		$response->params['users'] = $userModel->getLatestUsers(array(), array('limit' => 5));

		// fetch most recent posts
		$response->params['posts'] = self::_getPostModel($controller)->getMostRecentPosts(5, $visitor);

		$response->templateName = 'template_demo';
	}

	/**
	 * @return Dev_Model_Post
	 */
	protected static function _getPostModel(XenForo_ControllerPublic_Abstract $controller)
	{
		return $controller->getModelFromCache('Dev_Model_Post');
	}
}

My extended user model:

<?php

class Dev_Model_Post extends XenForo_Model_Post
{
	public function getMostRecentPosts($maxResults, array $viewingUser = array())
	{
		$postIds = $this->_getDb()->fetchCol(
			$this->limitQueryResults('
				SELECT post_id
				FROM xf_post
				ORDER BY post_date DESC
			', $maxResults * 2
			)
		);

		$postResults = $this->getPostsByIds($postIds, array(
			'join' => XenForo_Model_Post::FETCH_THREAD
				| XenForo_Model_Post::FETCH_FORUM
				| XenForo_Model_Post::FETCH_USER
				| XenForo_Model_Post::FETCH_USER_PROFILE,
			'permissionCombinationId' => $viewingUser['permission_combination_id']
		));

		$posts = array();

		foreach ($postResults AS $postId => $post)
		{
			$posts[$post['post_date'] . '_' . $post['post_id']] = $post;
		}

		krsort($posts);

		return array_slice($posts, 0, $maxResults, true);
	}
}

Template template_demo:

<xen:title>{$page.title}</xen:title>

<xen:navigation>
	<xen:breadcrumb source="$nodeBreadCrumbs" />
</xen:navigation>

<link rel="xenforo_stylesheet" type="text/css" href="template_demo.css" />

<div class="sectionMain">
	<h2 class="subHeading">Most Recent Registrations</h2>
	<ol>
		<xen:foreach loop="$users" value="$user">
			<xen:include template="template_demo_user">
				<xen:set var="$dateThingy">{$user.register_date}</xen:set>
				<xen:set var="$showUserTitle">0</xen:set>
			</xen:include>
		</xen:foreach>
	</ol>
	<div class="sectionFooter">Showing {xen:count $users} users.</div>
</div>

<div class="sectionMain">
	<h2 class="subHeading">Most Recent Post Authors</h2>
	<ol>
		<xen:foreach loop="$posts" value="$post">
			<xen:include template="template_demo_user">
				<xen:map from="$post" to="$user" />
				<xen:set var="$dateThingy">{$post.post_date}</xen:set>
				<xen:set var="$showUserTitle">1</xen:set>
			</xen:include>
		</xen:foreach>
	</ol>
	<div class="sectionFooter">Showing {xen:count $posts} post authors.</div>
</div>

<xen:sidebar>
	<xen:include template="sidebar_online_users" />
</xen:sidebar>

Template template_demo.css:

.userThing
{
	overflow: hidden; zoom: 1;
}

.userThing .avatar
{
	float: left;
	margin-right: 10px;
}

.userThing .username
{
	font-size: 11pt;
}

.userThing .DateTime
{
	color: @mutedTextColor;
	font-size: 11px;
}

Template: template_demo_user:

<li class="secondaryContent userThing">
	<xen:avatar user="$user" size="s" />
	<a href="{xen:link members, $user}" class="username">{$user.username}</a>
	<xen:if is="{$showUserTitle}">
		<div class="userTitle">{xen:helper usertitle, $user}</div>
	</xen:if>
	<xen:datetime time="$dateThingy" />
</li>

 

[Kier]

XenForo AJAX Tutorial

test.js

/** @param {jQuery} $ jQuery Object */
!function($, window, document, _undefined)
{
	XenForo.ContentLoader = function($link)
	{
		$link.click(function(e)
		{
			e.preventDefault();

			XenForo.ajax(
				$link.attr('href'),
				{},
				function (ajaxData, textStatus)
				{
					if (ajaxData.templateHtml)
					{
						new XenForo.ExtLoader(ajaxData, function()
						{
							$(ajaxData.templateHtml).xfInsert('appendTo', $link.data('target'));
						});
					}
					else if (ajaxData.colors)
					{
						for (var i = 0; i < ajaxData.colors.length; i++)
						{
							$('<div>')
								.text(ajaxData.colors[i].masterTitle)
								.css({
									backgroundColor: ajaxData.colors[i].property_value,
									width: '100px',
									padding: '5px'
								})
								.xfInsert('appendTo', $link.data('target'));
						}
					}
				}
			);

		});
	}

	// *********************************************************************

	XenForo.register('a.ContentLoader', 'XenForo.ContentLoader');
}
(jQuery, this, document);

template: _test_index

<xen:title>My Test Page</xen:title>

<xen:navigation>
	<xen:breadcrumb href="{xen:link test}">My Test Page</xen:breadcrumb>
</xen:navigation>

<xen:require js="js/dev/test.js" />

<div class="section" id="RootNode">
	<h3 class="subHeading">Stuff on my Test Page</h3>
	<div class="primaryContent">
		<a href="{xen:link test/palette}" class="OverlayTrigger">Palette</a>
		<br />
		<a href="{xen:link test}" class="OverlayTrigger">Test Page</a>
		<br />
		<a href="{xen:link test/palette}" class="ContentLoader" data-target="#RootNode">Palette Loader</a>
	</div>
</div>

template: _test_palette

<xen:title>XenForo Color Palette</xen:title>

<xen:navigation>
	<xen:breadcrumb href="{xen:link test}">My Test Page</xen:breadcrumb>
	<xen:breadcrumb href="{xen:link test/palette}">XenForo Color Palette</xen:breadcrumb>
</xen:navigation>

<xen:require css="_test_palette.css" />
<xen:require css="xenforo.css" />

<div class="sectionMain">
	<h3 class="subHeading">All Colors Used by XenForo</h3>
	<ol id="palette" class="secondaryContent">
		<xen:foreach loop="$colorPalette" value="$color">		
			<li style="background-color: {$color.property_value}">
				{$color.title}
				<dfn>{$color.property_value}</dfn>
			</li>		
		</xen:foreach>
	</ol>
</div>

Action for ControllerPublic: index

public function actionIndex()
{
	$viewParams = array();

	return $this->responseView('Dev_ViewPublic_Test_Index', '_test_index', $viewParams);
}

Action for ControllerPublic: palette

public function actionPalette()
{
	/* @var $propertyModel XenForo_Model_StyleProperty */
	$propertyModel = $this->getModelFromCache('XenForo_Model_StyleProperty');

	$groups = $propertyModel->getEffectiveStylePropertiesByGroup(0);
	$group = $groups['color'];

	$viewParams = array(
		'group' => $propertyModel->prepareStylePropertyGroup($group, 0),
		'colorPalette' => $propertyModel->prepareStyleProperties($groups['color']['properties'], 0),
	);

	return $this->responseView('Dev_ViewPublic_Test_Palette', '_test_palette', $viewParams);
}