Date Counter Assistance - Game Development

**rbrown** · 01-12-2013 09:15 PM

Hi All,

Could anyone please assist me? I am developing a game and i've got a bit stuck.

On the link below, you'll hopefully see a date counter top right hand corner with a continue button just above it which when clicked skips the counter on a few days.

www.jadeboylan.com/game/overview

Thing is the counter skips/animates on a few days fine, but I have a problem that the counter defaults back to the current date when the page is refreshed.

And doesn't keep the current custom date, that you've skipped to. Additionally I am also trying to write/update the date to another PHP file called gamedate.php which I hope to use eventually as a save game feature.

So when you come back and load your game it will load the day you saved last from gamedate.php.

I have attached as to what I believe are probably the necessary files, hopefully one of you wonderful people will reply.

Should you require anything else please just ask. Thanks

GAMEfiles.zip

**simplypixie** · 01-13-2013 01:50 AM

Sorry I don't want to download your files, but I would like to see the relevant code for what you are trying to do.

You will need to store the chosen date in a session to ensure it is retained both on page reload and when moving through the site.

As I say, I could be much more help if you could display the code in question on here.

**rbrown** · 01-13-2013 07:08 AM

hi thanks for your reply, my code is here:

overview.php

PHP Code:


<?php 



$newdate = date ("Y,n,j,0,0,0");



require('users/gamedate.php');



$gamedate = $newdate;



$filecontent = '<?php



$gamedate = "'.$newdate.'";



?>';







$my_file = 'users/gamedate.php';

$handle = fopen($my_file, 'w') or die('Cannot open file:  '.$my_file);

$data = $filecontent;

fwrite($handle, $data);

fclose($handle);



$gamedate = $newdate;



require('pageheader.php');



?>



<body>

    <div id="header"> <!-- header start -->

        <div class="continue"><h3><a href="#" onclick="futureDate();">Continue</a></h3></div>

    <div class="topstrip"></div>

    <div class="bottomstrip"></div>

    <div id="datecounter"> <!-- date start -->

        <div class="container">

            <div class="outside">

                <div class="inside">

                    <div id="my_counter_1" style=" float: left; display: inline-block; background-color: white;"></div>

                    <div id="my_counter_2" style=" float: left; display: inline-block; margin-right: 5px;"></div>

                    <div id="my_counter_3" style=" float: left; display: inline-block; margin-right: 5px;"></div>

                    <div id="my_counter_4" style=" float: left; display: inline-block;"></div>

                </div>

            </div>

        </div>

    </div> <!-- date end -->

    </div> <!-- header end -->

    

    <div id="tabscontainer"> <!-- tabs start -->

        <ul class="tabs" persist="true">

            <li><a href="#" rel="view1">Overview</a></li>

            <li><a href="#" rel="view2">Profile</a></li>

            <li><a href="#" rel="view3">News</a></li>

            <li><a href="#" rel="view4">Notebook</a></li>

            <li><a href="#" rel="view5">History</a></li>

            <li><a href="#" rel="view6">Stats</a></li>

        </ul>

    <div class="tabcontents"> <!-- tabs content start -->

            <div id="view1" class="tabcontent">

                <div id="hm-inbox">

                    <h2 id="dateH2"></h2>

                    <script src="assets/js/hm-inbox.js" type="text/javascript"></script>

                </div>

            </div>

            <div id="view2" class="tabcontent">

                <b>Multiple Tab Contents</b>

                <p>You can have multiple tab contents on the same page, with only one copy of the CSS and JavaScript files.</p>

            </div>

            <div id="view3" class="tabcontent">

                <b>Bookmark Support</b>

                <p>You can also open a tab or a bookmark from a link anywhere on the page.</p>

                <p id="mark4">This is a paragraph with id="mark4".</p>

                <p>By clicking the bookmark link at the bottom of this Tab Content, you will see me with this Tab Content panel being opened at the same time.</p>

            </div>

            <div id="view4" class="tabcontent">

                <b>Opened by a link from another page</b>

                <p>Link from another page can select a tab on the target page when loaded.</p>                

            </div>

        </div> <!-- tabs content end -->

        <br><br>

    </div> <!-- tabs end -->





<!-- datecounter js start -->



<script type="text/javascript">



var futureDay = new Date(<?php echo $gamedate; ?>);

var myCounter = null;

var timerId = null;





function loadCounter(){

    myCounter = [

            new Counter("my_counter_1",

    {

                digitsNumber : 1,

                direction : Counter.ScrollDirection.Upwards,

    

                characterSet : "0123456",

                charsImageUrl : "assets/images/datecounter/weekdays_blackbg.png",

                markerImageUrl : "assets/images/datecounter/marker_small.png",

                extraClassName: {

                    left: "my_counter_left",

                    right: "my_counter_right",

                    inner: "my_counter_inner"

                }

            }),

            new Counter("my_counter_2",

    {

                digitsNumber : 2,

                direction : Counter.ScrollDirection.Upwards,

     

                characterSet : Counter.DefaultCharacterSets.numericUp,

                charsImageUrl : "assets/images/datecounter/numeric_up_blackbg.png",

                markerImageUrl : "assets/images/datecounter/marker_small.png",

                extraClassName: {

                    left: "my_counter_left",

                    right: "my_counter_right",

                    inner: "my_counter_inner"

                }

            }),

            new Counter("my_counter_3",

    {

                digitsNumber : 1,

                direction : Counter.ScrollDirection.Upwards,

    

                characterSet : "ABCDEFGHIJKL",

                charsImageUrl : "assets/images/datecounter/months_blackbg.png",

                markerImageUrl : "assets/images/datecounter/marker_small.png",

                extraClassName: {

                    left: "my_counter_left",

                    right: "my_counter_right",

                    inner: "my_counter_inner"

                }

            }),

            new Counter("my_counter_4",

    {

                digitsNumber : 4,

                direction : Counter.ScrollDirection.Upwards,

    

                characterSet : Counter.DefaultCharacterSets.numericUp,

                charsImageUrl : "assets/images/datecounter/numeric_up_blackbg.png",

                markerImageUrl : "assets/images/datecounter/marker_small.png",

                extraClassName: {

                    left: "my_counter_left",

                    right: "my_counter_right",

                    inner: "my_counter_inner"

                }

            })

        ];

    

    myCounter.setDate = function(newDate){

        myCounter[0].setValue(newDate.getDay(),

    800);

        myCounter[1].setValue(newDate.getDate(),

    800);

        myCounter[2].setValue(String.fromCharCode(newDate.getMonth()+65),

    800);

        myCounter[3].setValue(newDate.getFullYear(),

    800);

    }

     

    

    myCounter.setDate(new Date());

    

}



function futureDate(){

    timerId = window.setInterval(function(){

        var destTime = futureDay;

        destTime.setDate(destTime.getDate() + 3);

        futureDay = destTime;

        newDay = myCounter.setDate(destTime);

        if (newDay == destTime){ location.reload(); }

    });

}





loadCounter();

</script>



<!-- datecounter js end -->







</body>

</html>

pageheader.php

PHP Code:


<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">



<html>

<head>

<title>My Movie Production Game | Overview</title>



<!-- main css/js -->



<link href="style.css" rel="stylesheet" type="text/css">



<!-- tabs css/js -->



<script src="assets/js/tabcontent.js" type="text/javascript"></script>

<link href="assets/css/tabcontent.css" rel="stylesheet" type="text/css">    



<!-- datecounter css/js -->



<script type="text/javascript" src="assets/js/counter.js"></script>

<link rel="stylesheet" type="text/css" href="assets/css/counterstyle.css">

<link rel="stylesheet" type="text/css" href="assets/css/counter.css">



<style type="text/css">

.my_counter_left {

    margin: 0px;

}

.my_counter_right {

    margin: 0px;

}

.my_counter_inner {

    margin: 0px;

}    

</style>



</head>

gamedate.php

PHP Code:


<?php



$gamedate = "";



?>

**simplypixie** · 01-14-2013 02:46 AM

I would use session, so in your code just put this

PHP Code:


<?php  

session_start();

$newdate = date ("Y,n,j,0,0,0"); 



require('users/gamedate.php'); 



$_SESSION['gamedate'] = $newdate;

Then wherever you reference your $gamedate varaible in your current code, check if the session is set for gamedate and if so use the stored session data instead

PHP Code:


if (isset($_SESSION['gamedate'])) {

// Do whatever here to use the session data

} else {

// Use original date (i.e. the date before it has been changed by the user)

}

Thread: Date Counter Assistance - Game Development

Thread Tools

Display

Date Counter Assistance - Game Development

Thread Information

Users Browsing this Thread

Bookmarks

Bookmarks

Posting Permissions