templates/activate-profile.phtml

   1 <html xmlns="http://www.w3.org/1999/xhtml">
   2   <head>
   3     <meta charset="utf-8"/>
   4     <title>GameStick activation: Profile</title>
   5     <meta name="viewport" content="width=device-width, initial-scale=1"/>
   6     <link rel="stylesheet" href="css/activate.css"/>
   7     <link rel="icon" type="image/png" href="img/faviconnew.png"/>
   8   </head>
   9   <body>
  10     <img id="gslogo" src="img/logo_2.png" alt="GameStick" width="176" height="24"/>
  11
  12     <div class="content">
  13       <h1>PlayJam GameStick activation: Profile</h1>
  14
  15       <ul id="progressbar">
  16         <li>Select
  17           language</li>
  18         <li>Setup
  19           screen</li>
  20         <li>Connect to
  21           the internet</li>
  22         <li>Update
  23           software</li>
  24         <li class="active">Activate
  25           GameStick</li>
  26       </ul>
  27
  28       <form class="profile" method="post" action="activate.php">
  29         <input type="hidden" name="code" value="<?= htmlspecialchars($code) ?>"/>
  30
  31         <p class="intro-mobile">
  32           Select your user name and profile image for this GameStick
  33           to personalise your account.
  34         </p>
  35
  36         <div class="twocol">
  37           <!-- left: avatar selection -->
  38           <div class="left">
  39
  40             <span class="avatarlabel">Avatar</span>
  41             <div class="avatars">
  42               <?php foreach ($avatars as $key => $smallImagePath): ?>
  43               <div class="avatar">
  44                 <input type="radio" name="avatar"
  45                   id="avatar-<?= htmlspecialchars($key) ?>"
  46                   value="<?= htmlspecialchars($key) ?>"
  47                   <?php if ($input['avatar'] == $key) { echo 'checked=""';} ?>
  48                   />
  49                 <label for="avatar-<?= htmlspecialchars($key) ?>">
  50                   <img src="<?= htmlspecialchars($smallImagePath) ?>"
  51                     alt="Avatar <?= htmlspecialchars($key) ?>"
  52                     width="118" height="118"
  53                   />
  54                 </label>
  55               </div>
  56               <?php endforeach ?>
  57             </div>
  58
  59           </div>
  60
  61           <!-- right: form values -->
  62           <div class="right">
  63             <!-- original message:
  64             <p>
  65               Create your own unique PlayTag and choose a profile image
  66               to personalise your account.
  67             </p>
  68             <p>
  69               Your email address and password will be required to sign
  70               into your account.
  71             </p>
  72             -->
  73             <p class="intro-desktop">
  74               Select your user name and profile image for this GameStick
  75               to personalise your account.
  76             </p>
  77
  78             <?php if ($input['submit'] && count($errors)): ?>
  79             <p class="error">
  80               Errors:
  81             </p>
  82             <ul class="error">
  83               <?php foreach ($errors as $msg): ?>
  84               <li><?= htmlspecialchars($msg) ?></li>
  85               <?php endforeach ?>
  86             </ul>
  87             <?php endif ?>
  88
  89             <div class="profile-row">
  90               <label for="gamerTag">PlayTag*</label>
  91               <input id="gamerTag" name="gamerTag" type="text"
  92                 value="<?= htmlspecialchars($input['gamerTag']) ?>"
  93                 pattern="[a-zA-Z0-9 ]+"
  94                 required=""
  95                 title="Allowed: A-Z, a-z, 0-9, space"
  96               />
  97             </div>
  98
  99             <br/>
 100
 101             <div class="profile-row">
 102               <span></span>
 103               <label>
 104                 <input  id="founderFlag" name="founderFlag" type="checkbox"
 105                   value="1"
 106                 <?php if ($input['founderFlag']) { echo 'checked=""';} ?>
 107                 />
 108                 I am a founder
 109               </label>
 110             </div>
 111
 112             <div class="profile-row">
 113               <label for="founderName">Founder name:</label>
 114               <input id="founderName" name="founderName" type="text"
 115                 value="<?= htmlspecialchars($input['founderName']) ?>"
 116                 pattern="[a-zA-Z0-9 ]*"
 117                 title="Allowed: A-Z, a-z, 0-9, space"
 118               />
 119             </div>
 120
 121             <br/>
 122
 123             <div class="profile-row minage">
 124               <label>Show games suitable for ages:</label>
 125               <div>
 126                 <label>
 127                   <input type="radio" name="minAge" value="3"
 128                   <?php if ($input['minAge'] == 3) { echo 'checked=""';} ?>
 129                   />
 130                   <span class="tag teal">3+</span>
 131                 </label>
 132
 133                 <label>
 134                   <input type="radio" name="minAge" value="7"
 135                   <?php if ($input['minAge'] == 7) { echo 'checked=""';} ?>
 136                   />
 137                   <span class="tag teal">7+</span>
 138                 </label>
 139
 140                 <label>
 141                   <input type="radio" name="minAge" value="12"
 142                   <?php if ($input['minAge'] == 12) { echo 'checked=""';} ?>
 143                   />
 144                   <span class="tag orange">12+</span>
 145                 </label>
 146
 147                 <label>
 148                   <input type="radio" name="minAge" value="17"
 149                   <?php if ($input['minAge'] == 17) { echo 'checked=""';} ?>
 150                   />
 151                   <span class="tag red">17+</span>
 152                 </label>
 153               </div>
 154             </div>
 155
 156             <button name="submit" value="1" type="submit">Submit</button>
 157           </div>
 158         </div>
 159
 160       </form>
 161
 162
 163
 164
 165             </div>
 166           </form>
 167
 168         </div>
 169       </div>
 170     </div>
 171   </body>
 172 </html>