djekl
1/25/2013 - 7:48 PM

Bordem playing with CSS XboxAPI and the XboxAPI Catalog

Bordem playing with CSS XboxAPI and the XboxAPI Catalog

djekl_achievements.php
content_copyfile_download
<html>
<head>
    <title>djekl Achievements</title>

    <style type="text/css">
        body {
            text-align: center;
        }

        .achievement {
            /*display: block;*/
            display: inline-block;
            text-align: left;
            width: 420px;
            height: 167px;
            margin: 10px auto;
            border: 2px outset #aeaeae;
            border-radius: 8px;
            position: relative;
        }

            .achievement .info {
                /*display: block;*/
            }

                .achievement .info .achievement_img {
                    display: inline-block;
                    border-radius: 7px;
                    position: absolute;
                    top: 0;
                    left: 0;
                }

                .achievement .info .achievement_name {
                    display: inline-block;
                    border-radius: 7px;
                    position: absolute;
                    top: 5;
                    left: 70;
                }

                .achievement .info .achievement_g {
                    display: inline-block;
                    border-radius: 7px;
                    position: absolute;
                    top: 35;
                    left: 70;
                }

                .achievement .info .achievement_desc {
                    display: inline-block;
                    border-radius: 7px;
                    position: absolute;
                    top: 30;
                    left: 120;
                    width: 280px;
                    height: 35px;
                }

            .achievement .banner {
                display: inline-block;
                border-radius: 7px;
                position: absolute;
                top: 72px;
                left: 0;
            }

    </style>
</head>
<body>

<?php

    $djekl = json_decode(file_get_contents('http://djekl.co.uk/djekl_achievements.json'));

    foreach ($djekl as $achievement) :
        $catalog_info = json_decode(file_get_contents('http://catalog.xboxapi.com/' . $achievement->GameID)); ?>

        <div class="achievement">
            <div class="info">

                <img src="<?=$achievement->TileUrl?>" alt="<?=$achievement->Name?>" class="achievement_img">
                <span class="achievement_name"><?=$achievement->Name?></span>
                <span class="achievement_g"><?=$achievement->Score?></span>
                <span class="achievement_desc"><?=$achievement->Description?></span>

            </div>

            <a href="http://marketplace.xbox.com/en-US/Title/<?=$achievement->GameID?>" title="<?=$achievement->GameName?>" target="_blank">
                <img src="<?=$catalog_info->data->images->banner?>" alt="<?=htmlspecialchars($achievement->GameName)?>" class="banner">
            </a>
        </div>

<?php endforeach; ?>

</body>
</html>