Newer
Older
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:og="http://ogp.me/ns#" xmlns:fb="http://www.facebook.com/2008/fbml">
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<link rel="shortcut icon" type="image/x-icon" href="img/icon.ico" />
<title>Strip Poker Night at the Inventory</title>
<!-- Stylesheets -->
<link rel="stylesheet" type="text/css" href="css/bootstrap.min.css">
<link rel="stylesheet" type="text/css" href="css/bootstrap-theme.min.css">
<link rel="stylesheet" type="text/css" href="css/spni.css">
</head>
<body onload="initialSetup()">
<!-- Warning Screen -->
<div id="warning-screen" class="screen-container" hidden>
<div class="screen">
<!-- Banner Flair -->
<button id="title-settings-button" class="bordered smooth-button smooth-button-red" onclick="showGameSettingsModal()">
<span class="glyphicon glyphicon-cog" aria-hidden="true"></span>
</button>
<button id="title-version-button" class="bordered smooth-button smooth-button-red banner-flair" onclick="showVersionModal()">
<button class="bordered smooth-button smooth-button-red bug-report-button title-bug-report-button" onclick="showBugReportModal()">
<span class="glyphicon glyphicon-warning-sign" aria-hidden="true"></span>
<button id="title-credits-button" class="bordered smooth-button smooth-button-red banner-flair" onclick="showCreditModal()">
Credits
</button>
<a class="bordered reddit-button smooth-button smooth-button-red" href="https://www.reddit.com/r/spnati/">
<img class="reddit-logo" src="img/reddit.png"/>
</a>
<!-- Banner -->
<div class="title-banner-container">
<div class="bordered title-banner-area">
<img class="bordered title-banner" src="img/title.png">
</div>
</div>
<!-- Content -->
<div class="main-title-container">
<div class="warning-text">
<p>This game contains material that is only suitable for adults. <b style="color:#DD3333">If you are under the age of 18, please leave now.</b></p>
<br>
<p><b style="color:#DD3333">Strip Poker Night at the Inventory</b> is a free, open source, and community run project. All characters represented within are 18+ and the property of their original owners.</p>
<p>The latest version of the game can be played at
<br><a href="https://spnati.net" target="_blank"><b>spnati.net</b></a></p>
<br><br><br><br><br><br>
<p>By clicking the button below, you are confirming that you are an adult and such material is legal in your region.</p>
<!-- Start Button -->
<div id='title-start-edge' class='bordered'>
<button id='title-start-button' class='bordered smooth-button smooth-button-red' onclick="enterTitleScreen()">
<img class='title-entrance-image' src='img/enter.png'/>
<!-- Title Screen -->
<div id="title-screen" class="screen-container" hidden>
<div class="screen">

ReformCopyright
committed
<!-- Title Candy -->
<img id="left-title-candy" class="title-candy" src=""/>
<img id="right-title-candy" class="title-candy" src=""/>
<!-- Banner Flair -->
<button id="title-settings-button" class="bordered smooth-button smooth-button-red" onclick="showGameSettingsModal()">
<span class="glyphicon glyphicon-cog" aria-hidden="true"></span>
</button>
<button id="title-version-button" class="bordered smooth-button smooth-button-red banner-flair" onclick="showVersionModal()">
<button class="bordered smooth-button smooth-button-red bug-report-button title-bug-report-button" onclick="showBugReportModal()">
<span class="glyphicon glyphicon-warning-sign" aria-hidden="true"></span>
<button id="title-credits-button" class="bordered smooth-button smooth-button-red banner-flair" onclick="showCreditModal()">
Credits
</button>
<a class="bordered reddit-button smooth-button smooth-button-red" href="https://www.reddit.com/r/spnati/">
<img class="reddit-logo" src="img/reddit.png"/>
</a>
<!-- Banner -->
<div class="title-banner-container">
<div class="bordered title-banner-area">
<img class="bordered title-banner" src="img/title.png">
</div>
</div>
<!-- Player Name -->
<div id="title-name-block">
<div class="title-label">Who are you?</div>
<input type="text" class='bordered' id='player-name-field'/>
</div>
<!-- Player Gender -->
<div id='title-gender-block'>
<input type='image' value='' id='male-gender-button' class='bordered title-content-button' src='img/male.png' onclick='changePlayerGender("male")'>
<input type='image' value='' id='female-gender-button' class='bordered title-content-button' src='img/female.png' onclick='changePlayerGender("female")'>
</div>
<!-- Player Male Size -->
<div id='male-size-container' class='title-size-block medium'>
<input type='image' value='' id="small-junk-button" class='bordered title-small-button title-content-button' src='img/male_small.png' onclick='changePlayerSize("small")'>
<input type='image' value='' id="medium-junk-button" class='bordered title-medium-button title-content-button' src='img/male_medium.png' onclick='changePlayerSize("medium")'>
<input type='image' value='' id="large-junk-button" class='bordered title-large-button title-content-button' src='img/male_large.png' onclick='changePlayerSize("large")'>
</div>
<!-- Player Female Size -->
<div id='female-size-container' class='title-size-block medium'>
<input type='image' value='' id="small-boobs-button" class='bordered title-small-button title-content-button' src='img/female_small.png' onclick='changePlayerSize("small")'>
<input type='image' value='' id="medium-boobs-button" class='bordered title-medium-button title-content-button' src='img/female_medium.png' onclick='changePlayerSize("medium")'>
<input type='image' value='' id="large-boobs-button" class='bordered title-large-button title-content-button' src='img/female_large.png' onclick='changePlayerSize("large")'>
</div>
<!-- Player Wardrobe -->
<div id='title-wardrobe-block'>
<div class='title-label'>What are you wearing?</div>
<div id='title-warning-label'>Select 0 to 8 articles. Wear whatever you want.</div>
<!-- Male Clothing -->
<div id='male-clothing-container' class='title-clothing-container'>
<input type='image' value='' id="male-clothing-option-0" class='bordered title-clothing-button title-content-button titleClothing0' src='player/male/hat.png' onclick='selectClothing(0)'>
Joseph Kantel
committed
<input type='image' value='' id="male-clothing-option-1" class='bordered title-clothing-button title-content-button titleClothing1' src='player/male/headphones.png' onclick='selectClothing(1)'>
<input type='image' value='' id="male-clothing-option-2" class='bordered title-clothing-button title-content-button titleClothing2' src='player/male/jacket.png' onclick='selectClothing(2)'>
<input type='image' value='' id="male-clothing-option-3" class='bordered title-clothing-button title-content-button titleClothing3' src='player/male/shirt.png' onclick='selectClothing(3)'>
<input type='image' value='' id="male-clothing-option-4" class='bordered title-clothing-button title-content-button titleClothing4' src='player/male/tshirt.png' onclick='selectClothing(4)'>
<input type='image' value='' id="male-clothing-option-5" class='bordered title-clothing-button title-content-button titleClothing5' src='player/male/undershirt.png' onclick='selectClothing(5)'>
<input type='image' value='' id="male-clothing-option-6" class='bordered title-clothing-button title-content-button titleClothing6' src='player/male/glasses.png' onclick='selectClothing(6)'>
<input type='image' value='' id="male-clothing-option-7" class='bordered title-clothing-button title-content-button titleClothing7' src='player/male/belt.png' onclick='selectClothing(7)'>
<input type='image' value='' id="male-clothing-option-8" class='bordered title-clothing-button title-content-button titleClothing8' src='player/male/pants.png' onclick='selectClothing(8)'>
<input type='image' value='' id="male-clothing-option-9" class='bordered title-clothing-button title-content-button titleClothing9' src='player/male/shorts.png' onclick='selectClothing(9)'>
<input type='image' value='' id="male-clothing-option-10" class='bordered title-clothing-button title-content-button titleClothing10' src='player/male/kilt.png' onclick='selectClothing(10)'>
<input type='image' value='' id="male-clothing-option-11" class='bordered title-clothing-button title-content-button titleClothing11' src='player/male/boxers.png' onclick='selectClothing(11)'>
<input type='image' value='' id="male-clothing-option-12" class='bordered title-clothing-button title-content-button titleClothing12' src='player/male/necklace.png' onclick='selectClothing(12)'>
<input type='image' value='' id="male-clothing-option-13" class='bordered title-clothing-button title-content-button titleClothing13' src='player/male/tie.png' onclick='selectClothing(13)'>
<input type='image' value='' id="male-clothing-option-14" class='bordered title-clothing-button title-content-button titleClothing14' src='player/male/gloves.png' onclick='selectClothing(14)'>
<input type='image' value='' id="male-clothing-option-15" class='bordered title-clothing-button title-content-button titleClothing15' src='player/male/socks.png' onclick='selectClothing(15)'>
<input type='image' value='' id="male-clothing-option-16" class='bordered title-clothing-button title-content-button titleClothing16' src='player/male/shoes.png' onclick='selectClothing(16)'>
<input type='image' value='' id="male-clothing-option-17" class='bordered title-clothing-button title-content-button titleClothing17' src='player/male/boots.png' onclick='selectClothing(17)'>
</div>
<!-- Female Clothing -->
<div id='female-clothing-container' class='title-clothing-container' hidden>
<input type='image' value='' id="female-clothing-option-0" class='bordered title-clothing-button title-content-button titleClothing0' src='player/female/hat.png' onclick='selectClothing(0)'>
Joseph Kantel
committed
<input type='image' value='' id="female-clothing-option-1" class='bordered title-clothing-button title-content-button titleClothing1' src='player/female/headphones.png' onclick='selectClothing(1)'>
<input type='image' value='' id="female-clothing-option-2" class='bordered title-clothing-button title-content-button titleClothing2' src='player/female/jacket.png' onclick='selectClothing(2)'>
<input type='image' value='' id="female-clothing-option-3" class='bordered title-clothing-button title-content-button titleClothing3' src='player/female/shirt.png' onclick='selectClothing(3)'>
<input type='image' value='' id="female-clothing-option-4" class='bordered title-clothing-button title-content-button titleClothing4' src='player/female/tanktop.png' onclick='selectClothing(4)'>
<input type='image' value='' id="female-clothing-option-5" class='bordered title-clothing-button title-content-button titleClothing5' src='player/female/bra.png' onclick='selectClothing(5)'>
<input type='image' value='' id="female-clothing-option-6" class='bordered title-clothing-button title-content-button titleClothing6' src='player/female/glasses.png' onclick='selectClothing(6)'>
<input type='image' value='' id="female-clothing-option-7" class='bordered title-clothing-button title-content-button titleClothing7' src='player/female/belt.png' onclick='selectClothing(7)'>
<input type='image' value='' id="female-clothing-option-8" class='bordered title-clothing-button title-content-button titleClothing8' src='player/female/pants.png' onclick='selectClothing(8)'>
<input type='image' value='' id="female-clothing-option-9" class='bordered title-clothing-button title-content-button titleClothing9' src='player/female/shorts.png' onclick='selectClothing(9)'>
<input type='image' value='' id="female-clothing-option-10" class='bordered title-clothing-button title-content-button titleClothing10' src='player/female/skirt.png' onclick='selectClothing(10)'>
<input type='image' value='' id="female-clothing-option-11" class='bordered title-clothing-button title-content-button titleClothing11' src='player/female/panties.png' onclick='selectClothing(11)'>
<input type='image' value='' id="female-clothing-option-12" class='bordered title-clothing-button title-content-button titleClothing12' src='player/female/necklace.png' onclick='selectClothing(12)'>
<input type='image' value='' id="female-clothing-option-13" class='bordered title-clothing-button title-content-button titleClothing13' src='player/female/bracelet.png' onclick='selectClothing(13)'>
<input type='image' value='' id="female-clothing-option-14" class='bordered title-clothing-button title-content-button titleClothing14' src='player/female/gloves.png' onclick='selectClothing(14)'>
<input type='image' value='' id="female-clothing-option-15" class='bordered title-clothing-button title-content-button titleClothing15' src='player/female/stockings.png' onclick='selectClothing(15)'>
<input type='image' value='' id="female-clothing-option-16" class='bordered title-clothing-button title-content-button titleClothing16' src='player/female/socks.png' onclick='selectClothing(16)'>
<input type='image' value='' id="female-clothing-option-17" class='bordered title-clothing-button title-content-button titleClothing17' src='player/female/shoes.png' onclick='selectClothing(17)'>
</div>
</div>
<!-- Start Button -->
<div id='title-start-edge' class='bordered'>
<button id='title-start-button' class='bordered smooth-button smooth-button-red' onclick="validateTitleScreen()">
<img class='title-entrance-image' src='img/enter.png'/>
metodLD
committed
</div>
<div id='title-gallery-edge' class='bordered'>
<button id='title-gallery-button' class='bordered smooth-button smooth-button-red' onclick="loadGalleryScreen()">
<img class='title-gallery-image' src='img/gallery.svg'/>
</button>
</div>
<div id='title-tags-edge' class='bordered'>
<button id='title-tags-button' class='bordered smooth-button smooth-button-red' onclick="showPlayerTagsModal()">
<span class="glyphicon glyphicon-tags" aria-hidden="true"></span>
</button>
</div>
metodLD
committed
</div>
</div>
<!-- Main Select Screen -->
<div id="main-select-screen" class="screen-container" hidden>
<div class="screen">
<!-- Opponent Dialogues -->
<div class="dialogue-bubble-row">
<div id="select-bubble-1" class="bordered left dialogue-bubble-area">
<div class="dialogue-bubble arrow-down">
<span id="select-dialogue-1" class="dialogue"></span>
</div>
</div>
<div id="select-bubble-2" class="bordered halfLeft dialogue-bubble-area">
<div class="dialogue-bubble arrow-down">
<span id="select-dialogue-2" class="dialogue"></span>
</div>
</div>
<div id="select-bubble-3" class="bordered center dialogue-bubble-area">
<div class="dialogue-bubble arrow-down">
<span id="select-dialogue-3" class="dialogue"></span>
</div>
</div>
<div id="select-bubble-4" class="bordered farHalfLeft dialogue-bubble-area">
<div class="dialogue-bubble arrow-down">
<span id="select-dialogue-4" class="dialogue"></span>
</div>
</div>
</div>
<!-- Opponent Images -->
<div class="image-row">
<div id="select-image-area-1" class="farLeft selection-image-area">

ReformCopyright
committed
<img id="select-image-1" class="opponent-image" hidden>
<div id="opponent-suggestions-1" class="opponent-suggestion-container" hidden>
<div class="bordered opponent-suggestion-header">Suggested Opponents</div>
<div class="opponent-suggestion-row">
<div id="opponent-suggestion-1-1" class="opponent-suggestion-cell opponent-suggestion-cell-1">
<img class="opponent-suggestion-image" data-toggle="tooltip" data-placement="left">

ReformCopyright
committed
<button class="bordered opponent-suggestion-label smooth-button-green" onclick="suggestionSelected(1, 1)">Name</button>
</div>
<div id="opponent-suggestion-1-2" class="opponent-suggestion-cell opponent-suggestion-cell-2">
<img class="opponent-suggestion-image" data-toggle="tooltip" data-placement="right">

ReformCopyright
committed
<button class="bordered opponent-suggestion-label smooth-button-green" onclick="suggestionSelected(1, 2)">Name</button>
</div>
</div>
<div class="opponent-suggestion-row">
<div id="opponent-suggestion-1-3" class="opponent-suggestion-cell opponent-suggestion-cell-3">
<img class="opponent-suggestion-image" data-toggle="tooltip" data-placement="left">

ReformCopyright
committed
<button class="bordered opponent-suggestion-label smooth-button-green" onclick="suggestionSelected(1, 3)">Name</button>
</div>
<div id="opponent-suggestion-1-4" class="opponent-suggestion-cell opponent-suggestion-cell-4">
<img class="opponent-suggestion-image" data-toggle="tooltip" data-placement="right">

ReformCopyright
committed
<button class="bordered opponent-suggestion-label smooth-button-green" onclick="suggestionSelected(1, 4)">Name</button>
</div>
</div>
</div>
<div id="select-image-area-2" class="almostLeft selection-image-area">

ReformCopyright
committed
<img id="select-image-2" class="opponent-image" hidden>
<div id="opponent-suggestions-2" class="opponent-suggestion-container" hidden>
<div class="bordered opponent-suggestion-header">Suggested Opponents</div>
<div class="opponent-suggestion-row">
<div id="opponent-suggestion-2-1" class="opponent-suggestion-cell opponent-suggestion-cell-1">
<img class="opponent-suggestion-image" data-toggle="tooltip" data-placement="left">

ReformCopyright
committed
<button class="bordered opponent-suggestion-label smooth-button-green" onclick="suggestionSelected(2, 1)">Name</button>
</div>
<div id="opponent-suggestion-2-2" class="opponent-suggestion-cell opponent-suggestion-cell-2">
<img class="opponent-suggestion-image" data-toggle="tooltip" data-placement="right">

ReformCopyright
committed
<button class="bordered opponent-suggestion-label smooth-button-green" onclick="suggestionSelected(2, 2)">Name</button>
</div>
</div>
<div class="opponent-suggestion-row">
<div id="opponent-suggestion-2-3" class="opponent-suggestion-cell opponent-suggestion-cell-3">
<img class="opponent-suggestion-image" data-toggle="tooltip" data-placement="left">

ReformCopyright
committed
<button class="bordered opponent-suggestion-label smooth-button-green" onclick="suggestionSelected(2, 3)">Name</button>
</div>
<div id="opponent-suggestion-2-4" class="opponent-suggestion-cell opponent-suggestion-cell-4">
<img class="opponent-suggestion-image" data-toggle="tooltip" data-placement="right">

ReformCopyright
committed
<button class="bordered opponent-suggestion-label smooth-button-green" onclick="suggestionSelected(2, 4)">Name</button>
</div>
</div>
</div>
<div id="select-image-area-3" class="almostRight selection-image-area">

ReformCopyright
committed
<img id="select-image-3" class="opponent-image" hidden>
<div id="opponent-suggestions-3" class="opponent-suggestion-container" hidden>
<div class="bordered opponent-suggestion-header">Suggested Opponents</div>
<div class="opponent-suggestion-row">
<div id="opponent-suggestion-3-1" class="opponent-suggestion-cell opponent-suggestion-cell-1">
<img class="opponent-suggestion-image" data-toggle="tooltip" data-placement="left">

ReformCopyright
committed
<button class="bordered opponent-suggestion-label smooth-button-green" onclick="suggestionSelected(3, 1)">Name</button>
</div>
<div id="opponent-suggestion-3-2" class="opponent-suggestion-cell opponent-suggestion-cell-2">
<img class="opponent-suggestion-image" data-toggle="tooltip" data-placement="right">

ReformCopyright
committed
<button class="bordered opponent-suggestion-label smooth-button-green" onclick="suggestionSelected(3, 2)">Name</button>
</div>
</div>
<div class="opponent-suggestion-row">
<div id="opponent-suggestion-3-3" class="opponent-suggestion-cell opponent-suggestion-cell-3">
<img class="opponent-suggestion-image" data-toggle="tooltip" data-placement="left">

ReformCopyright
committed
<button class="bordered opponent-suggestion-label smooth-button-green" onclick="suggestionSelected(3, 3)">Name</button>
</div>
<div id="opponent-suggestion-3-4" class="opponent-suggestion-cell opponent-suggestion-cell-4">
<img class="opponent-suggestion-image" data-toggle="tooltip" data-placement="right">

ReformCopyright
committed
<button class="bordered opponent-suggestion-label smooth-button-green" onclick="suggestionSelected(3, 4)">Name</button>
</div>
</div>
</div>
<div id="select-image-area-4" class="farRight selection-image-area">

ReformCopyright
committed
<img id="select-image-4" class="opponent-image" hidden>
<div id="opponent-suggestions-4" class="opponent-suggestion-container" hidden>
<div class="bordered opponent-suggestion-header">Suggested Opponents</div>
<div class="opponent-suggestion-row">
<div id="opponent-suggestion-4-1" class="opponent-suggestion-cell opponent-suggestion-cell-1">
<img class="opponent-suggestion-image" data-toggle="tooltip" data-placement="left">

ReformCopyright
committed
<button class="bordered opponent-suggestion-label smooth-button-green" onclick="suggestionSelected(4, 1)">Name</button>
</div>
<div id="opponent-suggestion-4-2" class="opponent-suggestion-cell opponent-suggestion-cell-2">
<img class="opponent-suggestion-image" data-toggle="tooltip" data-placement="right">

ReformCopyright
committed
<button class="bordered opponent-suggestion-label smooth-button-green" onclick="suggestionSelected(4, 2)">Name</button>
</div>
</div>
<div class="opponent-suggestion-row">
<div id="opponent-suggestion-4-3" class="opponent-suggestion-cell opponent-suggestion-cell-3">
<img class="opponent-suggestion-image" data-toggle="tooltip" data-placement="left">

ReformCopyright
committed
<button class="bordered opponent-suggestion-label smooth-button-green" onclick="suggestionSelected(4, 3)">Name</button>
</div>
<div id="opponent-suggestion-4-4" class="opponent-suggestion-cell opponent-suggestion-cell-4">
<img class="opponent-suggestion-image" data-toggle="tooltip" data-placement="right">

ReformCopyright
committed
<button class="bordered opponent-suggestion-label smooth-button-green" onclick="suggestionSelected(4, 4)">Name</button>
</div>
</div>
</div>
<!-- Hide Button -->
<button class='bordered hide-table-button' onclick="hideSelectionTable()">
<span class="glyphicon glyphicon-eye-close" aria-hidden="true"></span>
</button>
<button class='bordered table-bug-report-button' onclick="showBugReportModal()">
<span class="glyphicon glyphicon-warning-sign" aria-hidden="true"></span>
</button>
<!-- Opponent Selections -->
<div class="bordered left opponent-area">
<div id="select-name-label-1" class="bordered opponent-name-label">Opponent 1</div>
<button id="select-slot-button-1" class="bordered smooth-button smooth-button-green select-slot-button" onclick="selectOpponentSlot(1)">Select Opponent</button>
</div>
<div class="bordered halfLeft opponent-area">
<div id="select-name-label-2" class="bordered opponent-name-label">Opponent 2</div>
<button id="select-slot-button-2" class="bordered smooth-button smooth-button-green select-slot-button" onclick="selectOpponentSlot(2)">Select Opponent</button>
</div>
<div class="bordered center opponent-area">
<div id="select-name-label-3" class="bordered opponent-name-label">Opponent 3</div>
<button id="select-slot-button-3" class="bordered smooth-button smooth-button-green select-slot-button" onclick="selectOpponentSlot(3)">Select Opponent</button>
</div>
<div class="bordered farHalfLeft opponent-area">
<div id="select-name-label-4" class="bordered opponent-name-label">Opponent 4</div>
<button id="select-slot-button-4" class="bordered smooth-button smooth-button-green select-slot-button" onclick="selectOpponentSlot(4)">Select Opponent</button>
</div>
<!-- Dock Area -->
<div id='main-select-area' class='bordered'>
<!-- Select Buttons -->

ReformCopyright
committed
<button id='select-main-back-button' class='bordered main-select-button select-back-button smooth-button smooth-button-red' onclick="backSelectScreen()">

ReformCopyright
committed
<button id='select-group-testing-button' class='bordered main-select-button smooth-button smooth-button-green' onclick="clickedSelectGroupButton(1)">

ReformCopyright
committed
<button id='select-group-button' class='bordered main-select-button smooth-button smooth-button-green' onclick="clickedSelectGroupButton(0)">
</button>
<button id='select-random-group-button' class='bordered main-select-button smooth-button smooth-button-blue' onclick="clickedRandomGroupButton()">
</button>
<!-- Advance Button Casing -->
<div id='select-advance-top' class='bordered'> </div>
<div id='select-advance-bottom' class='bordered'> </div>
<!-- Advance Button -->
<button id='main-select-button' class='bordered smooth-button smooth-button-red' onclick="advanceSelectScreen()" disabled="true">
Start
</button>
<!-- More Select Buttons -->
<button id='select-random-female-button' class='bordered main-select-button smooth-button smooth-button-blue' onclick="clickedRandomFillButton(function chooseFemale(player) {return player.gender.toLowerCase() === 'female';})">
Random Females
</button>
<button id='select-random-male-button' class='bordered main-select-button smooth-button smooth-button-blue' onclick="clickedRandomFillButton(function chooseMale(player) {return player.gender.toLowerCase() === 'male';})">
Random Males
</button>
<button id='select-random-button' class='bordered main-select-button smooth-button smooth-button-blue' onclick="clickedRandomFillButton()">

ReformCopyright
committed
<button id='select-remove-all-button' class='bordered main-select-button smooth-button smooth-button-red' onclick="clickedRemoveAllButton()" disabled="true">
422
423
424
425
426
427
428
429
430
431
432
433
434
435
436
437
438
439
440
441
442
443
444
445
446
447
448
449
450
451
452
453
454
455
456
457
458
459
</button>
</div>
</div>
</div>
</div>
<!-- Individual Select Screen -->
<div id="individual-select-screen" class="screen-container" hidden>
<div class="screen">
<!-- Opponent Info -->
<div class="dialogue-bubble-row">
<div id="individual-stats-page-1-1" class="bordered left dialogue-bubble-area">
<div class="stats-section">
<div class="bordered stats-label">Name</div>
<div id="individual-name-label-1" class="bordered stats-content"></div>
</div>
<div class="input-group stats-section">
<div class="bordered stats-label">Sex</div>
<div id="individual-sex-label-1" class="bordered stats-content"></div>
</div>
<div class="input-group stats-section-large">
<div class="bordered stats-label">Source</div>
<div id="individual-source-label-1" class="bordered stats-content"></div>
</div>
</div>
<div id="individual-stats-page-1-2" class="bordered left dialogue-bubble-area" style="display:none;">
<div class="stats-section">
<div class="bordered stats-label">Writer</div>
<div id="individual-writer-label-1" class="bordered stats-content"></div>
</div>
<div class="input-group stats-section">
<div class="bordered stats-label">Artist</div>
<div id="individual-artist-label-1" class="bordered stats-content"></div>
</div>
<div class="stats-section">
<div class="bordered stats-label">Stats</div>
<div class="bordered stats-content">
<div id="individual-counts-1">
<span id="individual-line-count-label-1"></span> unique lines <br />
<span id="individual-pose-count-label-1"></span> poses
</div>
</div>
<div id="individual-stats-page-1-3" class="bordered left dialogue-bubble-area" style="display:none;">
<div id="individual-description-label-1">
</div>
</div>
<div id="individual-stats-page-2-1" class="bordered halfLeft dialogue-bubble-area">
<div class="stats-section">
<div class="bordered stats-label">Name</div>
<div id="individual-name-label-2" class="bordered stats-content"></div>
</div>
<div class="input-group stats-section">
<div class="bordered stats-label">Sex</div>
<div id="individual-sex-label-2" class="bordered stats-content"></div>
</div>
<div class="input-group stats-section-large">
<div class="bordered stats-label">Source</div>
<div id="individual-source-label-2" class="bordered stats-content"></div>
</div>
</div>
<div id="individual-stats-page-2-2" class="bordered halfLeft dialogue-bubble-area" style="display:none;">
<div class="stats-section">
<div class="bordered stats-label">Writer</div>
<div id="individual-writer-label-2" class="bordered stats-content"></div>
</div>
<div class="input-group stats-section">
<div class="bordered stats-label">Artist</div>
<div id="individual-artist-label-2" class="bordered stats-content"></div>
</div>
<div class="stats-section">
<div class="bordered stats-label">Stats</div>
<div class="bordered stats-content">
<div id="individual-counts-2">
<span id="individual-line-count-label-2"></span> unique lines <br />
<span id="individual-pose-count-label-2"></span> poses
</div>
</div>
<div id="individual-stats-page-2-3" class="bordered halfLeft dialogue-bubble-area" style="display:none;">
<div id="individual-description-label-2">
</div>
</div>
<div id="individual-stats-page-3-1" class="bordered center dialogue-bubble-area">
<div class="stats-section">
<div class="bordered stats-label">Name</div>
<div id="individual-name-label-3" class="bordered stats-content"></div>
</div>
<div class="input-group stats-section">
<div class="bordered stats-label">Sex</div>
<div id="individual-sex-label-3" class="bordered stats-content"></div>
</div>
<div class="input-group stats-section-large">
<div class="bordered stats-label">Source</div>
<div id="individual-source-label-3" class="bordered stats-content"></div>
</div>
</div>
<div id="individual-stats-page-3-2" class="bordered center dialogue-bubble-area" style="display:none;">
<div class="stats-section">
<div class="bordered stats-label">Writer</div>
<div id="individual-writer-label-3" class="bordered stats-content"></div>
</div>
<div class="input-group stats-section">
<div class="bordered stats-label">Artist</div>
<div id="individual-artist-label-3" class="bordered stats-content"></div>
</div>
<div class="stats-section">
<div class="bordered stats-label">Stats</div>
<div class="bordered stats-content">
<div id="individual-counts-3">
<span id="individual-line-count-label-3"></span> unique lines <br />
<span id="individual-pose-count-label-3"></span> poses
</div>
</div>
<div id="individual-stats-page-3-3" class="bordered center dialogue-bubble-area" style="display:none;">
<div id="individual-description-label-3">
</div>
</div>
<div id="individual-stats-page-4-1" class="bordered farHalfLeft dialogue-bubble-area">
<div class="stats-section">
<div class="bordered stats-label">Name</div>
<div id="individual-name-label-4" class="bordered stats-content"></div>
</div>
<div class="input-group stats-section">
<div class="bordered stats-label">Sex</div>
<div id="individual-sex-label-4" class="bordered stats-content"></div>
</div>
<div class="input-group stats-section-large">
<div class="bordered stats-label">Source</div>
<div id="individual-source-label-4" class="bordered stats-content"></div>
</div>
</div>
<div id="individual-stats-page-4-2" class="bordered farHalfLeft dialogue-bubble-area" style="display:none;">
<div class="stats-section">
<div class="bordered stats-label">Writer</div>
<div id="individual-writer-label-4" class="bordered stats-content"></div>
</div>
<div class="input-group stats-section">
<div class="bordered stats-label">Artist</div>
<div id="individual-artist-label-4" class="bordered stats-content"></div>
</div>
<div class="stats-section">
<div class="bordered stats-label">Stats</div>
<div class="bordered stats-content">
<div id="individual-counts-4">
<span id="individual-line-count-label-4"></span> unique lines <br />
<span id="individual-pose-count-label-4"></span> poses
</div>
</div>
<div id="individual-stats-page-4-3" class="bordered farHalfLeft dialogue-bubble-area" style="display:none;">
<div id="individual-description-label-4">
</div>
</div>
</div>
<!-- Opponent Images -->
<div class="image-row">
<div class="farLeft selection-image-area">

ReformCopyright
committed
<img id="individual-image-1" class="opponent-image" hidden>
<img id="individual-badge-1" class="badge-icon" src="img/epilogue_icon.png" hidden/>
<img id="individual-status-1" class="status-icon" src="img/testing-badge.png" hidden/>

ReformCopyright
committed
<img id="individual-layer-1" class="layer-icon" src="img/layers1.png" hidden/>
<select id="individual-costume-select-1" class="alt-costume-dropdown" onchange="altCostumeSelected(1, false)"></select>
<div class="almostLeft selection-image-area">

ReformCopyright
committed
<img id="individual-image-2" class="opponent-image" hidden>
<img id="individual-badge-2" class="badge-icon" src="img/epilogue_icon.png" hidden/>
<img id="individual-status-2" class="status-icon" src="img/testing-badge.png" hidden/>

ReformCopyright
committed
<img id="individual-layer-2" class="layer-icon" src="img/layers1.png" hidden/>
<select id="individual-costume-select-2" class="alt-costume-dropdown" onchange="altCostumeSelected(2, false)"></select>
<div class="almostRight selection-image-area">

ReformCopyright
committed
<img id="individual-image-3" class="opponent-image" hidden>
<img id="individual-badge-3" class="badge-icon" src="img/epilogue_icon.png" hidden/>
<img id="individual-status-3" class="status-icon" src="img/testing-badge.png" hidden/>

ReformCopyright
committed
<img id="individual-layer-3" class="layer-icon" src="img/layers1.png" hidden/>
<select id="individual-costume-select-3" class="alt-costume-dropdown" onchange="altCostumeSelected(3, false)"></select>
<div class="farRight selection-image-area">

ReformCopyright
committed
<img id="individual-image-4" class="opponent-image" hidden>
<img id="individual-badge-4" class="badge-icon" src="img/epilogue_icon.png" hidden/>
<img id="individual-status-4" class="status-icon" src="img/testing-badge.png" hidden/>

ReformCopyright
committed
<img id="individual-layer-4" class="layer-icon" src="img/layers1.png" hidden/>
<select id="individual-costume-select-4" class="alt-costume-dropdown" onchange="altCostumeSelected(4, false)"></select>
<!-- Hide Button -->
<button class='bordered hide-table-button' onclick="hideSingleSelectionTable()">
<span class="glyphicon glyphicon-eye-close" aria-hidden="true"></span>
</button>
<button class='bordered table-bug-report-button' onclick="showBugReportModal()">
<span class="glyphicon glyphicon-warning-sign" aria-hidden="true"></span>
</button>
<!-- Dock Area -->
<div id="individual-select-table">
<!-- Opponent Selections -->
<div class="bordered left small-opponent-area">

ReformCopyright
committed
<button id="individual-button-1" class="bordered smooth-button smooth-button-green full-select-slot-button" onclick="selectIndividualOpponent(1)">Select Opponent</button>
</div>
<div class="bordered halfLeft small-opponent-area">

ReformCopyright
committed
<button id="individual-button-2" class="bordered smooth-button smooth-button-green full-select-slot-button" onclick="selectIndividualOpponent(2)">Select Opponent</button>
</div>
<div class="bordered halfRight small-opponent-area">

ReformCopyright
committed
<button id="individual-button-3" class="bordered smooth-button smooth-button-green full-select-slot-button" onclick="selectIndividualOpponent(3)">Select Opponent</button>
</div>
<div class="bordered right small-opponent-area">

ReformCopyright
committed
<button id="individual-button-4" class="bordered smooth-button smooth-button-green full-select-slot-button" onclick="selectIndividualOpponent(4)">Select Opponent</button>
</div>
<!-- Dock Area -->
<div id='main-select-area' class='bordered'>
<!-- Buttons -->

ReformCopyright
committed
<button id='individual-back-button' class='bordered main-select-button select-back-button smooth-button smooth-button-red' onclick="backToSelect()">

ReformCopyright
committed
<button id='individual-search-button' class='bordered main-select-button smooth-button smooth-button-blue' onclick="openSearchModal()">
<span class="glyphicon glyphicon-search" aria-hidden="true"></span>

ReformCopyright
committed
Filter
</button>
<!-- Advance Button Casing -->
<div class='bordered long-select-advance-top'> </div>
<div class='bordered long-select-advance-bottom'> </div>
<!-- Page Selection -->
<div class="select-page-display">
<div class="bordered page-label">Page</div>
<input id="individual-page-indicator" type="text" class="bordered page-indicator" value="" />
<div id="individual-max-page-indicator" class="bordered of-label">of 1</div>
</div>
<div class="select-page-selection">
<button class="bordered smooth-button first-page-button" onclick="changeIndividualPage(true, -1)">
<span class="glyphicon glyphicon-fast-backward" aria-hidden="true"></span>
</button>
<button class="bordered smooth-button left-page-button" onclick="changeIndividualPage(false, -1)">
<span class="glyphicon glyphicon-triangle-left" aria-hidden="true"></span>
</button>

ReformCopyright
committed
<button class="bordered smooth-button go-page-button" onclick="changeIndividualPage(true, 0)">
<div style="margin-top:2px"><b>Go</b></div>
</button>
<button class="bordered smooth-button right-page-button" onclick="changeIndividualPage(false, 1)">
<span class="glyphicon glyphicon-triangle-right" aria-hidden="true"></span>
</button>
<button class="bordered smooth-button last-page-button" onclick="changeIndividualPage(true, 1)" style="border-right: 2px solid">
<span class="glyphicon glyphicon-fast-forward" aria-hidden="true"></span>
</button>
</div>
<!-- More Buttons -->

ReformCopyright
committed
<button id='individual-basic-info-button' class='bordered main-select-button smooth-button smooth-button-blue' onclick="changeIndividualStats(1)">
Basic Info
</button>
<button id='individual-credits-button' class='bordered main-select-button smooth-button smooth-button-blue' onclick="changeIndividualStats(2)">

ReformCopyright
committed
<button id='individual-more-info-button' class='bordered main-select-button smooth-button smooth-button-blue' onclick="changeIndividualStats(3)">
More Info
</button>
</div>
707
708
709
710
711
712
713
714
715
716
717
718
719
720
721
722
723
724
725
726
727
728
729
730
731
732
733
734
735
736
737
738
739
</div>
</div>
<!-- Group Select Screen -->
<div id="group-select-screen" class="screen-container" hidden>
<div class="screen">
<!-- Opponent Info -->
<div class="dialogue-bubble-row">
<div id="group-stats-page-1-1" class="bordered left dialogue-bubble-area">
<div class="stats-section">
<div class="bordered stats-label">Name</div>
<div id="group-name-label-1" class="bordered stats-content"></div>
</div>
<div class="input-group stats-section">
<div class="bordered stats-label">Sex</div>
<div id="group-sex-label-1" class="bordered stats-content"></div>
</div>
<div class="input-group stats-section-large">
<div class="bordered stats-label">Source</div>
<div id="group-source-label-1" class="bordered stats-content"></div>
</div>
</div>
<div id="group-stats-page-1-2" class="bordered left dialogue-bubble-area" style="display:none;">
<div class="stats-section">
<div class="bordered stats-label">Writer</div>
<div id="group-writer-label-1" class="bordered stats-content"></div>
</div>
<div class="input-group stats-section">
<div class="bordered stats-label">Artist</div>
<div id="group-artist-label-1" class="bordered stats-content"></div>
</div>
<div class="stats-section">
<div class="bordered stats-label">Stats</div>
<div class="bordered stats-content">
<div id="group-counts-1">
<span id="group-line-count-label-1"></span> unique lines <br />
<span id="group-pose-count-label-1"></span> poses
</div>
</div>
</div>
</div>
<div id="group-stats-page-1-3" class="bordered left dialogue-bubble-area" style="display:none;">
<div id="group-description-label-1">
</div>
</div>
<div id="group-stats-page-2-1" class="bordered halfLeft dialogue-bubble-area">
<div class="stats-section">
<div class="bordered stats-label">Name</div>
<div id="group-name-label-2" class="bordered stats-content"></div>
</div>
<div class="input-group stats-section">
<div class="bordered stats-label">Sex</div>
<div id="group-sex-label-2" class="bordered stats-content"></div>
</div>
<div class="input-group stats-section-large">
<div class="bordered stats-label">Source</div>
<div id="group-source-label-2" class="bordered stats-content"></div>
</div>
</div>
<div id="group-stats-page-2-2" class="bordered halfLeft dialogue-bubble-area" style="display:none;">
<div class="stats-section">
<div class="bordered stats-label">Writer</div>
<div id="group-writer-label-2" class="bordered stats-content"></div>
</div>
<div class="input-group stats-section">
<div class="bordered stats-label">Artist</div>
<div id="group-artist-label-2" class="bordered stats-content"></div>
</div>
<div class="stats-section">
<div class="bordered stats-label">Stats</div>
<div class="bordered stats-content">
<div id="group-counts-2">
<span id="group-line-count-label-2"></span> unique lines <br />
<span id="group-pose-count-label-2"></span> poses
</div>
</div>
</div>
</div>
<div id="group-stats-page-2-3" class="bordered halfLeft dialogue-bubble-area" style="display:none;">
<div id="group-description-label-2">
</div>
</div>
<div id="group-stats-page-3-1" class="bordered center dialogue-bubble-area">
<div class="stats-section">
<div class="bordered stats-label">Name</div>
<div id="group-name-label-3" class="bordered stats-content"></div>
</div>
<div class="input-group stats-section">
<div class="bordered stats-label">Sex</div>
<div id="group-sex-label-3" class="bordered stats-content"></div>
</div>
<div class="input-group stats-section-large">
<div class="bordered stats-label">Source</div>
<div id="group-source-label-3" class="bordered stats-content"></div>
</div>
</div>
<div id="group-stats-page-3-2" class="bordered center dialogue-bubble-area" style="display:none;">
<div class="stats-section">
<div class="bordered stats-label">Writer</div>
<div id="group-writer-label-3" class="bordered stats-content"></div>
</div>
<div class="input-group stats-section">
<div class="bordered stats-label">Artist</div>
<div id="group-artist-label-3" class="bordered stats-content"></div>
</div>
<div class="stats-section">
<div class="bordered stats-label">Stats</div>
<div class="bordered stats-content">
<div id="group-counts-3">
<span id="group-line-count-label-3"></span> unique lines <br />
<span id="group-pose-count-label-3"></span> poses
</div>
</div>
</div>
</div>
<div id="group-stats-page-3-3" class="bordered center dialogue-bubble-area" style="display:none;">
<div id="group-description-label-3">
</div>
</div>
<div id="group-stats-page-4-1" class="bordered farHalfLeft dialogue-bubble-area">
<div class="stats-section">
<div class="bordered stats-label">Name</div>
<div id="group-name-label-4" class="bordered stats-content"></div>
</div>
<div class="input-group stats-section">
<div class="bordered stats-label">Sex</div>
<div id="group-sex-label-4" class="bordered stats-content"></div>
</div>
<div class="input-group stats-section-large">
<div class="bordered stats-label">Source</div>
<div id="group-source-label-4" class="bordered stats-content"></div>
</div>
</div>
<div id="group-stats-page-4-2" class="bordered farHalfLeft dialogue-bubble-area" style="display:none;">
<div class="stats-section">
<div class="bordered stats-label">Writer</div>
<div id="group-writer-label-4" class="bordered stats-content"></div>
</div>
<div class="input-group stats-section">
<div class="bordered stats-label">Artist</div>
<div id="group-artist-label-4" class="bordered stats-content"></div>
</div>
<div class="stats-section">
<div class="bordered stats-label">Stats</div>
<div class="bordered stats-content">
<div id="group-counts-4">
<span id="group-line-count-label-4"></span> unique lines <br />
<span id="group-pose-count-label-4"></span> poses
</div>
</div>
</div>
</div>
<div id="group-stats-page-4-3" class="bordered farHalfLeft dialogue-bubble-area" style="display:none;">
<div id="group-description-label-4">
</div>
</div>
</div>
<!-- Opponent Images -->
<div class="image-row">
<div class="farLeft selection-image-area">

ReformCopyright
committed
<img id="group-image-1" class="opponent-image" hidden>
<img id="group-badge-1" class="badge-icon" src="img/epilogue_icon.png" hidden/>
<img id="group-status-1" class="status-icon" src="img/testing-badge.png" hidden/>

ReformCopyright
committed
<img id="group-layer-1" class="layer-icon" src="img/layers1.png" hidden/>
<select id="group-costume-select-1" class="alt-costume-dropdown" onchange="altCostumeSelected(1, true)"></select>
<div class="almostLeft selection-image-area">

ReformCopyright
committed
<img id="group-image-2" class="opponent-image" hidden>
<img id="group-badge-2" class="badge-icon" src="img/epilogue_icon.png" hidden/>
<img id="group-status-2" class="status-icon" src="img/testing-badge.png" hidden/>

ReformCopyright
committed
<img id="group-layer-2" class="layer-icon" src="img/layers1.png" hidden/>
<select id="group-costume-select-2" class="alt-costume-dropdown" onchange="altCostumeSelected(2, true)"></select>
<div class="almostRight selection-image-area">

ReformCopyright
committed
<img id="group-image-3" class="opponent-image" hidden>
<img id="group-badge-3" class="badge-icon" src="img/epilogue_icon.png" hidden/>
<img id="group-status-3" class="status-icon" src="img/testing-badge.png" hidden/>

ReformCopyright
committed
<img id="group-layer-3" class="layer-icon" src="img/layers1.png" hidden/>
<select id="group-costume-select-3" class="alt-costume-dropdown" onchange="altCostumeSelected(3, true)"></select>
<div class="farRight selection-image-area">

ReformCopyright
committed
<img id="group-image-4" class="opponent-image" hidden>
<img id="group-badge-4" class="badge-icon" src="img/epilogue_icon.png" hidden/>
<img id="group-status-4" class="status-icon" src="img/testing-badge.png" hidden/>

ReformCopyright
committed
<img id="group-layer-4" class="layer-icon" src="img/layers1.png" hidden/>
<select id="group-costume-select-4" class="alt-costume-dropdown" onchange="altCostumeSelected(4, true)"></select>
<!-- Hide Button -->
<button id="group-hide-button" class='bordered' onclick="hideGroupSelectionTable()">
<span class="glyphicon glyphicon-eye-close" aria-hidden="true"></span>
</button>
<button class='bordered table-bug-report-button group-bug-report-button' onclick="showBugReportModal()">
<span class="glyphicon glyphicon-warning-sign" aria-hidden="true"></span>
</button>
<!-- Dock Area -->
<div id="group-select-table">
<!-- Opponent Selections -->
<div id="group-select-area" class="bordered opponent-area">
<div id="group-name-label" class="bordered opponent-name-label">Opponent 1</div>
<button id="group-button" class="bordered smooth-button smooth-button-green select-slot-button" onclick="selectGroup()">Select Group</button>
</div>
<!-- Dock Area -->
<div id='main-select-area' class='bordered'>
<!-- Buttons -->

ReformCopyright
committed
<button id='group-back-button' class='bordered main-select-button select-back-button smooth-button smooth-button-red' onclick="backToSelect()">

ReformCopyright
committed
<button id='group-switch-testing-button' class='bordered main-select-button smooth-button smooth-button-green' onclick="switchSelectGroupScreen()">
Preset Tables
</button>
<button id='group-search-button' class='bordered main-select-button smooth-button smooth-button-blue' onclick="openGroupSearchModal()">
<span class="glyphicon glyphicon-search" aria-hidden="true"></span>

ReformCopyright
committed
Filter
</button>
<!-- Advance Button Casing -->
<div class='bordered long-select-advance-top'> </div>
<div class='bordered long-select-advance-bottom'> </div>
<!-- Page Selection -->
<div class="select-page-display">
<div class="bordered page-label">Page</div>
<input id="group-page-indicator" type="text" class="bordered page-indicator" value="" />
<div id="group-max-page-indicator" class="bordered of-label">of 1</div>
</div>
<div class="select-page-selection">
<button class="bordered smooth-button first-page-button" onclick="changeGroupPage(true, -1)">
<span class="glyphicon glyphicon-fast-backward" aria-hidden="true"></span>
</button>
<button class="bordered smooth-button left-page-button" onclick="changeGroupPage(false, -1)">
<span class="glyphicon glyphicon-triangle-left" aria-hidden="true"></span>
</button>
<button class="bordered smooth-button go-page-button" onclick="changeGroupPage(true, 0)">
<div style="margin-top:2px"><b>Go</b></div>
</button>
<button class="bordered smooth-button right-page-button" onclick="changeGroupPage(false, 1)">
<span class="glyphicon glyphicon-triangle-right" aria-hidden="true"></span>
</button>
<button class="bordered smooth-button last-page-button" onclick="changeGroupPage(true, 1)" style="border-right: 2px solid">
<span class="glyphicon glyphicon-fast-forward" aria-hidden="true"></span>
</button>
</div>
<!-- More Buttons -->

ReformCopyright
committed
<button id='group-basic-info-button' class='bordered main-select-button smooth-button smooth-button-blue' onclick="changeGroupStats(1)">
Basic Info
</button>
<button id='group-credits-button' class='bordered main-select-button smooth-button smooth-button-blue' onclick="changeGroupStats(2)">

ReformCopyright
committed
<button id='group-more-info-button' class='bordered main-select-button smooth-button smooth-button-blue' onclick="changeGroupStats(3)">
More Info
</button>
</div>
metodLD
committed
<!-- Gallery Screen -->
<div id="gallery-screen" class="screen-container" hidden>
<div id="collectible-gallery-screen" class="screen">
<div id="gallery-select-block">
<button class="bordered gallery-back-button gallery-select-button smooth-button smooth-button-red" onclick="backGalleryScreen()">Back</button>
<button class="bordered gallery-switch-button gallery-select-button smooth-button smooth-button-blue" onclick="goToEpiloguesScreen()">Epilogues</button>
</div>
<div class="collectibles-pane bordered" id="collectibles-list-pane"></div>
<div class="collectibles-pane bordered" id="collectibles-text-pane">
<h3 class="collectible-content text-center" id="collectible-title"></h3>
<h3 class="collectible-content collectible-subtitle-container text-center"><small id="collectible-subtitle"></small></h3>
<div class="collectible-content text-center collectible-character-container">
Won From: <i id="collectible-character"></i>
</div>