Untitled

<?php
$date = new DateTime();
$ts = "?x=" . $date->getTimestamp();
$typeId = $_GET["typeId"];
?>
<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>HARDAC - Character</title>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" href="css/themes/borg.css" />
    <link rel="stylesheet" href="css/themes/jquery.mobile.icons.min.css" />
    <link rel="stylesheet" href="http://code.jquery.com/mobile/1.4.5/jquery.mobile.structure-1.4.5.min.css" />
    <link rel="stylesheet" type="text/css" href="css/hardac.css<?php echo $ts ?>" />
    <script src="http://code.jquery.com/jquery-1.11.1.min.js"></script>
    <script src="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js"></script>
    <script type="text/javascript" src="js/index_data.js<?php echo $ts ?>"></script>
    <script type="text/javascript" src="js/hardac.js<?php echo $ts ?>"></script>
</head>
<body>
<div data-role="page" id="CH-page">
<link rel="stylesheet" type="text/css" href="css/character.css<?php echo $ts ?>" />
<script type="text/javascript" src="js/character.js<?php echo $ts ?>"></script>
<div data-role="header" data-position="fixed">
    <div class="ui-btn-left">
        <a href="#" data-rel="back" class="ui-btn ui-corner-all ui-btn-icon-notext ui-btn-inline ui-icon-carat-l">Back</a>
        <a href="index.php" class="ui-btn ui-corner-all ui-btn-icon-notext ui-btn-inline ui-icon-home"></a>
    </div>
    <h1>HARDAC - Character</h1>
</div> <!-- data-role="header" -->
<div class="ui-content" id="CH-content">
        <div>
            <div class="CH-picture">
                <img src="" alt="" name="CH-picture" id="CH-picture"/>
            </div>
        </div>
        <div data-role="field-contain">
            <label for="CH-player-name">Player Name:</label>
            <input type="text" name="CH-player-name" id="CH-player-name" placeholder="Player Name"/>
        </div>
        <div data-role="field-contain">
            <label for="CH-character-name">Character Name:</label>
            <input type="text" name="CH-character-name" id="CH-character-name" placeholder="Character Name"/>
        </div>
        <div data-role="field-contain">
            <label for="CH-creature-type" class="select">Creature Type:</label>
            <select name="CH-creature-type" id="CH-creature-type">
                <option value="0">Unknown</option>
                <option value="1">Changeling</option>
                <option value="2">Werewolf</option>
            </select>
        </div>
        <div data-role="field-contain">
            <label for="CH-virtue" class="select">Virtue:</label>
            <select name="CH-virtue" id="CH-virtue">
                <option value="0">Unknown</option>
                <option value="3">Charity</option>
                <option value="4">Faith</option>
                <option value="5">Fortitude</option>
                <option value="6">Hope</option>
                <option value="7">Justice</option>
                <option value="8">Prudence</option>
                <option value="9">Temperance</option>
            </select>
        </div>
        <div data-role="field-contain">
            <label for="CH-vice" class="select">Vice:</label>
            <select name="CH-vice" id="CH-vice">
                <option value="0">Unknown</option>
                <option value="10">Envy</option>
                <option value="11">Gluttony</option>
                <option value="12">Greed</option>
                <option value="13">Lust</option>
                <option value="14">Pride</option>
                <option value="15">Sloth</option>
                <option value="16">Wrath</option>
            </select>
        </div>
<?php
if ($typeId == 1) {
    include("changeling.php");
} else if ($typeId == 2) {
    include("werewolf.php");
}
?>
    </div>
</div> <!-- class="ui-content" -->
<div data-role="footer">
</div> <!-- data-role="footer" -->
</div> <!-- data-role="page" -->
</body>
</html>

var character = null;
var player = null;

$(document).off("pageinit", "#CH-page").on("pageinit", "#CH-page", function (event) {
var parameters = $(this).data("url").split("?")[1];

var characterId = getUrlParameter(parameters, "characterId"); // gets characterId either from jQM or browser url
character = getCharacter(characterId);
player = getPlayer(character.playerId);

fillSelect("CH-creature-type", character.typeId);
fillSelect("CH-vice", character.viceId);
fillSelect("CH-virtue", character.virtueId);
if (player.picture) {
    $("#CH-picture").attr("src", "img/" + player.picture + "");
}
$("#CH-picture").attr("alt", player.name);
$("#CH-player-name").val(player.name);
$("#CH-character-name").val(character.name);
$("#CH-page").trigger("create");
});

function fillSelect(selectId, selectedId) {
 $("#" + selectId).each(function(){ $(this).val(selectedId); });
}