WebDev

SMF Arcade => SMF Arcade Block Codes => Topic started by: Chen Zhen on July 06, 2013, 03:16:23 PM

Title: Horizontal Favorites Block
Post by: Chen Zhen on July 06, 2013, 03:16:23 PM
Use this as a top/bottom/header custom php block:


/* Display user's favorites for SMF Arcade v2.5 c/o Underdog @http://askusaquestion.net */

global $user_info, $smcFunc, $modSettings, $scripturl, $boardurl, $boarddir, $sourcedir;

/* Adjust these */
$lang = 'Play ';
$none = 'No games selected';
$per_row = 4;
$rows = 1;
$char_length = 35;
$prev = 'Prev';
$next = 'Next';

/* Do not edit below this line */
$query = '(favorite.id_member = ' . $user_info['id'] . ' AND enabled = 1)';
$datum = array('id_game', 'game_name', 'game_directory', 'thumbnail');
list($x, $count, $game) = array(0, 0, array());
$maindir = !empty($modSettings['gamesUrl']) ? $modSettings['gamesUrl'] : 'Games';

$pages = '
<script type="text/javascript">
var pager = new Pager("favs", ' . (int)$rows . ');
        pager.init();
        pager.showPageNav("pager", "favPagePosition");
        pager.showPage(1);
    </script>';

/* Some JavaScript to control the pages */
echo '
<script type="text/javascript">
function Pager(tableName, itemsPerPage) {
this.tableName = tableName;
this.itemsPerPage = itemsPerPage;
this.currentPage = 1;
this.pages = 0;
this.inited = false;

this.showRecords = function(from, to) {
var rows = document.getElementById(tableName).children;
// i starts from 1 to skip table header row
for (var i = 1; i < rows.length; i++) {
if (i < from || i > to)
rows[i].style.display = "none";
else
rows[i].style.display = "";
}
}

this.showPage = function(pageNumber) {
if (!this.inited) {
console.log("show page not initialized");
return;
}
var oldPageAnchor = document.getElementById("pg"+this.currentPage);
oldPageAnchor.className = "pg-normal";

this.currentPage = pageNumber;
var newPageAnchor = document.getElementById("pg"+this.currentPage);
newPageAnchor.className = "pg-selected";

var from = (pageNumber - 1) * itemsPerPage + 1;
var to = from + itemsPerPage - 1;
this.showRecords(from, to);
}

this.prev = function() {
if (this.currentPage > 1)
this.showPage(this.currentPage - 1);
}

this.next = function() {
if (this.currentPage < this.pages) {
this.showPage(this.currentPage + 1);
}
}

this.init = function() {
var rows = document.getElementById(tableName).children;
var records = (rows.length - 1);
this.pages = Math.ceil(records / itemsPerPage);
this.inited = true;
}
this.showPageNav = function(pagerName, positionId) {
if (!this.inited) {
console.log("page navigation not initialized");
return;
}
var element = document.getElementById(positionId);
var pagerHtml = \'<span onmouseover="resizePage(this, 125)" onmouseout="resizePage(this, 100)" style="cursor: pointer;" onclick="\' + pagerName + \'.prev();" class="pg-normal"> &larr; ', $prev, ' </span> | \';

for (var page = 1; page <= this.pages; page++)
pagerHtml += \'<span onmouseover="resizePage(this, 125)" onmouseout="resizePage(this, 100)" style="cursor: pointer;" id="pg\' + page + \'" class="pg-normal" onclick="\' + pagerName + \'.showPage(\' + page + \');">\' + page + \'</span> | \';
pagerHtml += \'<span onmouseover="resizePage(this, 125)" onmouseout="resizePage(this, 100)" style="cursor: pointer;" onclick="\' + pagerName + \'.next();" class="pg-normal"> ', $next,' &rarr;</span>\';
element.innerHTML = pagerHtml;
element.style.margin = "0px auto";
}
}
function resizePage(elem, percent)
{
elem.style.fontSize = percent.toString() + "%";
}
function regenerate()
{
window.location.reload();
}

function regenerate3()
{
if (document.layers)
{
appear();
setTimeout("window.onresize=regenerate",450);
}
}

function changetext(whichcontent)
{
if (document.all||document.getElementById)
{
cross_el=document.getElementById? document.getElementById("descriptions"):document.all.descriptions;
cross_el.innerHTML = \'<div style="font-family:Arial Narrow Bold;font-size:small;">\'+whichcontent+\'</div>\';
}
else if (document.layers)
{
document.d1.document.d2.document.write(\'<div style="font-family:Arial Narrow Bold;font-size:small;">\'+whichcontent+\'</div>\');
document.d1.document.d2.document.close();
}

}

function appear()
{
document.d1.visibility="show";
}
</script>';
/* end of js controller */

$result = $smcFunc['db_query']('', "
SELECT favorite.id_favorite, favorite.id_member, favorite.id_game, game.game_name, game.game_directory, game.thumbnail, game.enabled FROM {db_prefix}arcade_favorite AS favorite
LEFT JOIN {db_prefix}arcade_games AS game ON (game.id_game = favorite.id_game)
WHERE {$query} ORDER BY favorite.id_favorite DESC");
while ($val = $smcFunc['db_fetch_assoc']($result)) {
foreach ($datum as $data) {
if (empty($val[$data]))
$val[$data] = false;
if ($data == 'game_directory')
$val[$data] = rtrim($maindir . '/' . $val[$data], '/');
$game[$val['id_favorite']][$data] = $val[$data];
}
$count++;
}
$smcFunc['db_free_result']($result);
echo '
<script type="text/javascript">
if (window.addEventListener)
window.addEventListener("load", regenerate3, false);
else if (window.attachEvent)
window.attachEvent("onload", regenerate3);
else
window.onload = regenerate3();
</script>';
if ($count == 0)
echo '
<div style="text-align:center">', $none, '</div>';
else
{
echo '
<div style="overflow: hidden;margin: 0 auto;width: 100%;" align="center">
<div id="favs" style="width: 100%;display: table;overflow: hidden;margin: 0 auto;">
<div style="display: table-row;margin: 0 auto;">
<div style="display: table-cell;">&nbsp;</div>
</div>
<div style="display: table-row;margin: 0 auto;">';
foreach ($game as $myfavs)
{
$x++;
if (!$myfavs['game_directory'])
$myfavs['game_directory'] = 'Games';

$check_file = str_replace($boardurl . '/', '', $myfavs['game_directory']);
if ($myfavs['thumbnail'] == false || (!@file_exists($boarddir . '/' . $check_file . '/' . $myfavs['thumbnail'])))
$image = $boardurl . '/Themes/default/images/arc_icons/no_game-image.jpg';
else
$image = $myfavs['game_directory'] . '/' . $myfavs['thumbnail'];

$title = strlen($myfavs['game_name']) >= ((int)$char_length) ? $title = substr($myfavs['game_name'], 0, ((int)$char_length - 1)) . '...' : $myfavs['game_name'];

echo '
<div style="display: table-cell;text-align:center;width:25%;">
<div style="height:80px;overflow:hidden;">
<a href="'.$scripturl.'?action=arcade;sa=play;game=' . $myfavs['id_game'] . '" title="' . $lang . $myfavs['game_name'] . '">
<img src="' . $image . '" style="max-height:50px;max-width:50px;" alt="" />
</a>
<span style="display: block;line-height: 1em;"></span>
<a href="' . $scripturl . '?action=arcade;sa=play;game=' . $myfavs['id_game'] . '" title="' . $lang . $myfavs['game_name'] . '">', $title, '</a>
</div>
</div>';
if ($x > ((int)$per_row -1)) {
$x=0;
echo '
</div>
<div style="display: table-row;margin: 0 auto;">';
}
}

echo '
</div>
</div>
</div>
<span style="display: block;line-height: 1em;"></span>
<div id="favPagePosition" style="text-align:center;margin: 0 auto;overflow: hidden;"> </div>
<div style="text-align:center;margin: 0 auto;overflow: hidden;">', $pages, '</div>';
}


Title: Re: Horizontal Favorites Block
Post by: aquarius on April 14, 2020, 11:58:50 AM
Will try this one out. Where's the best place to show this? In other words, where do you find the optimal location to encourage people to play?
Title: Re: Horizontal Favorites Block
Post by: vince on August 15, 2020, 10:23:32 AM
this block compatable with the new arcade thats coming out ??
Title: Re: Horizontal Favorites Block
Post by: Chen Zhen on August 22, 2020, 05:17:22 PM

I need to update all the arcade blocks.
Some of these blocks still work but the code is untidy, uses document.write, etc, etc.


Here is a temporary update for this block code:
/* Display user's favorites for SMF Arcade v2.5 c/o Underdog @http://askusaquestion.net */

global $user_info, $smcFunc, $modSettings, $scripturl, $boardurl, $boarddir, $sourcedir;

/* Adjust these */
$lang = 'Play ';
$none = 'No games selected';
$per_row = 4;
$rows = 1;
$char_length = 35;
$prev = 'Prev';
$next = 'Next';

/* Do not edit below this line */
$query = '(favorite.id_member = ' . $user_info['id'] . ' AND enabled = 1)';
$datum = array( 'id_game', 'game_name', 'game_directory', 'thumbnail');
$x = 0;
$count = 0;
$game = array();
$maindir = !empty($modSettings['gamesUrl']) ? $modSettings['gamesUrl'] : 'Games';

$pages = '<script type="text/javascript"><!--
        var pager = new Pager("favs", '.(int)$rows.');
        pager.init();
        pager.showPageNav("pager", "favPagePosition");
        pager.showPage(1);
    //--></script>';

/* Some js to control the pages */
echo '<script type="text/javascript">
function Pager(tableName, itemsPerPage) {
    this.tableName = tableName;
    this.itemsPerPage = itemsPerPage;
    this.currentPage = 1;
    this.pages = 0;
    this.inited = false;
   
    this.showRecords = function(from, to) {       
        var rows = document.getElementById(tableName).rows;
        // i starts from 1 to skip table header row';
echo "
        for (var i = 1; i < rows.length; i++) {
            if (i < from || i > to)
                rows[i].style.display = 'none';
            else
                rows[i].style.display = '';
        }";
echo '
    }
   
    this.showPage = function(pageNumber) {
    if (! this.inited) {
    alert("not inited");
    return;
    }';
echo "
        var oldPageAnchor = document.getElementById('pg'+this.currentPage);
        oldPageAnchor.className = 'pg-normal';
       
        this.currentPage = pageNumber;
        var newPageAnchor = document.getElementById('pg'+this.currentPage);
        newPageAnchor.className = 'pg-selected';
       
        var from = (pageNumber - 1) * itemsPerPage + 1;
        var to = from + itemsPerPage - 1;
        this.showRecords(from, to);
    }   
   
    this.prev = function() {
        if (this.currentPage > 1)
            this.showPage(this.currentPage - 1);
    }
   
    this.next = function() {
        if (this.currentPage < this.pages) {
            this.showPage(this.currentPage + 1);
        }
    }                       
   
    this.init = function() {
        var rows = document.getElementById(tableName).rows;
        var records = (rows.length - 1);
        this.pages = Math.ceil(records / itemsPerPage);
        this.inited = true;
    }";
echo '
    this.showPageNav = function(pagerName, positionId) {
    if (! this.inited) {
    alert("not inited");
    return;
    }
    var element = document.getElementById(positionId);';
echo "
    var pagerHtml = '<span onclick=";
echo '"';
echo "' + pagerName + '.prev();";
echo '" class="pg-normal">« ', $prev, ' </span> | ';
echo "';
        for (var page = 1; page <= this.pages; page++)
            pagerHtml += '<span id=";
echo '"';
echo "pg' + page + '";
echo '" class="pg-normal" onclick="';
echo "' + pagerName + '.showPage(' + page + ');";
echo '">';
echo "' + page + '</span> | ';
        pagerHtml += '<span onclick=";
echo '"';
echo "'+pagerName+'.next();";
echo '" class="pg-normal"> ', $next,' »</span>';
echo "';           
       
        element.innerHTML = pagerHtml;
    }
}
function regenerate()
{
window.location.reload()
}

function regenerate3()
{
if (document.layers)
{
appear()
setTimeout(";
echo '"window.onresize=regenerate",450)
}
}

function changetext(whichcontent)
{
if (document.all||document.getElementById)
{
cross_el=document.getElementById? document.getElementById("descriptions"):document.all.descriptions
cross_el.innerHTML=';
echo "'<div style=";
echo '"font-family:Arial Narrow Bold;font-size:small;">';
echo "'+whichcontent+'</div>'
}
else if (document.layers)
{
document.d1.document.d2.document.write('<div style=";
echo '"font-family:Arial Narrow Bold;font-size:small;">';
echo "'+whichcontent+'</div>')
document.d1.document.d2.document.close()
}

}

function appear()
{
document.d1.visibility='show'
}
</script>";
/* end of js controller */
$counter = 0;
$result = $smcFunc['db_query']('', "SELECT favorite.id_favorite, favorite.id_member, favorite.id_game, game.game_name, game.game_directory, game.thumbnail, game.enabled FROM {db_prefix}arcade_favorite AS favorite
LEFT JOIN {db_prefix}arcade_games AS game ON (game.id_game = favorite.id_game)

WHERE {$query} ORDER BY favorite.id_favorite DESC");
while ($val = $smcFunc['db_fetch_assoc']($result))
{
$counter++;
                     
                        foreach ($datum as $data)
                        {
if (empty($val[$data])) {$val[$data] = false;}
                            if ($data == 'game_directory')
                           {
                              $val[$data] = rtrim($maindir . '/' . $val[$data], '/');
                             
                           }
                        $game[$val['id_favorite']][$data] = $val[$data];                                               
}
              $count++;

}
$smcFunc['db_free_result']($result);
$rowCount = $counter % $per_row;

echo '<script type="text/javascript">
<!--
window.onload=regenerate3
//-->
</script>';
if ($count == 0)
{echo '<div style="text-align:center">', $none, '</div>';}
else
{
echo '<table id ="favs" style="width:100%;"><tr><td>&nbsp;</td></tr><tr>';
foreach ($game as $myfavs)
{
$x++;

if (!$myfavs['game_directory']) {$myfavs['game_directory'] = 'Games';}
$check_file = str_replace($boardurl . '/', '', $myfavs['game_directory']);
if ($myfavs['thumbnail'] == false || (!@file_exists($boarddir . '/' . $check_file . '/' . $myfavs['thumbnail'])))
{$image = $boardurl . '/Themes/default/images/arc_icons/no_game-image.jpg';}
else
{$image = $myfavs['game_directory'] . '/' . $myfavs['thumbnail'];}


$title = strlen($myfavs['game_name']) >= ((int)$char_length) ? $title = substr($myfavs['game_name'],0,((int)$char_length - 1)).'...':$myfavs['game_name'];
echo '<td style="text-align:center;width:25%;"><div style="height:80px;overflow:hidden;"><a href="'.$scripturl.'?action=arcade;sa=play;game='.$myfavs['id_game'].'" title="'.$lang . $myfavs['game_name'].'"><img src="'. $image . '" style="max-height:50px;max-width:50px;" alt="" /></a><br /><a href="'.$scripturl.'?action=arcade;sa=play;game='.$myfavs['id_game'].'" title="'.$lang . $myfavs['game_name'].'">', $title, '</a></div></td>';
if ($x == $counter && $rowCount == 0)
break;
elseif ($x > ((int)$per_row -1))
{$x=0; echo '</tr><tr>';}
}

echo '</tr></table><br /><div id="favPagePosition"  style="text-align:center;"> </div><div style="text-align:center;">', $pages, '</div>';
}
Title: Re: Horizontal Favorites Block
Post by: vince on August 22, 2020, 05:45:11 PM
thanks Chen
EhPortal 1.39.6 © 2024, WebDev