function new_spotgame_settings_page()
{
$semantic = WP_PLUGIN_URL . '/vocabulary-plugin/css/semantic.css';
$decks = get_decks('flashcard');
$deck_words = get_deck_words('');
$domains = get_domains();
$categories = get_word_categories();
$words = get_words();
?>
<link rel="stylesheet" type="text/css" href="<?php
echo $semantic;
?>
"/>
<h2>Create New Game!</h2>
<hr>
<form id="form" method="post" enctype="multipart/form-data" action="<?php
echo get_admin_url() . 'admin-post.php';
?>
">
<input type="hidden" name="action" value="create_new_spotgame" />
<div class="ui form segment new_word_form">
<div class="ui form">
<div class="field">
<label>Choose a deck:</label>
<select name="decks" id="deck_id">
<option value="NA">Select a Deck</option>
<?php
foreach ($decks as $deck) {
?>
<option value="<?php
echo $deck->id;
?>
"><?php
echo $deck->name;
?>
</option>
<?php
}
?>
</select>
</div>
</div>
<div class="ui form">
<div class="field">
<div class="ui left labeled icon input">
<label for="game_name">Create a question to display in the game: </label>
<input name="game_name" id="name" required />
</div>
</div>
</div>
<p class="error" id="not_enough_words">* Select just one word</p>
<div class="ui form">
<div class="field">
<label>Word to be guessed:</label>
<label for="filter">Filter by</label>
<select name="domain_id" id="domain_id">
<option value="NA">Select a Domain</option>
<?php
foreach ($domains as $domain) {
?>
<option value="<?php
echo $domain->id;
?>
"><?php
echo $domain->name;
?>
</option>
<?php
}
?>
</select>
<select name="category_id" id="category_id">
<option value="NA">Select a Category</option>
<?php
foreach ($categories as $category) {
?>
<option value="<?php
echo $category->id;
?>
"><?php
echo $category->name;
?>
</option>
<?php
}
?>
</select>
</div>
</div>
<div class="ui form">
<div class="field">
<ul>
<?php
foreach ($words as $word) {
?>
<li class="games_form">
<input type="checkbox" id="<?php
echo $word->id;
?>
" class="dom<?php
echo $word->domain_id;
?>
cat<?php
echo $word->word_category_id;
?>
" name="words[]" value="<?php
echo $word->id;
?>
">
<label for="<?php
echo $word->id;
?>
" class="dom_option cat_option dom<?php
echo $word->domain_id;
?>
cat<?php
echo $word->word_category_id;
?>
" ><?php
echo $word->word;
?>
</label>
</li>
<?php
}
?>
</ul>
</div>
</div>
<?php
submit_button();
?>
</div>
</form>
</div>
<script>
jQuery(document).ready(function(){
jQuery("#pano_id").change(function(){
var quest_id = jQuery("option:selected", this).attr("data-quest-id");
jQuery("#quest_id").val(quest_id);
});
});
function addForm() {
document.getElementById("buttonDomain").style.display = "none";
document.getElementById("domain_form").style.display = "block";
}
jQuery('#form').submit(function(e){
user_selected_enough_words(e);
});
jQuery('#game_number_of_words').change(function(){
document.getElementById("words_error").style.display = "none";
document.getElementById("not_enough_words").style.display = "none";
});
jQuery("input:checkbox").change(function(){
document.getElementById("words_error").style.display = "none";
document.getElementById("not_enough_words").style.display = "none";
});
function user_selected_enough_words(e){
var n = jQuery("input:checkbox:checked").length;
var game_number_of_words = jQuery('#game_number_of_words').prop('value');
if(n > 1 || n < 1){
e.preventDefault();
document.getElementById("not_enough_words").style.display = "block";
document.getElementById("words_error").style.display = "none";
}
else if(n < Number(game_number_of_words)){
e.preventDefault();
document.getElementById("words_error").style.display = "block";
document.getElementById("not_enough_words").style.display = "none";
}else{
document.getElementById("words_error").style.display = "none";
document.getElementById("not_enough_words").style.display = "none";
}
}
jQuery("#category_id").change(function(){
filter_words();
});
jQuery("#domain_id").change(function(){
filter_words();
});
function filter_words()
{
var cat_selected = jQuery( "#category_id option:selected" ).val();
var dom_selected = jQuery( "#domain_id option:selected" ).val();
var checkboxes = jQuery("input:checkbox");
jQuery(".cat_option").hide();
//jQuery("input:checkbox").hide();
if(cat_selected == "NA" && dom_selected == "NA")
{
jQuery(".cat_option").show();
}
else if(cat_selected != "NA" && dom_selected == "NA")
{
jQuery(".cat_option").hide();
jQuery(".cat" + cat_selected).show();
var category = "cat" + cat_selected;
for(var k = 0; k < checkboxes.length; k++){
if(!checkboxes[k].classList.contains(category)){
checkboxes[k].checked = false;
}
}
}
else if(cat_selected == "NA" && dom_selected != "NA")
{
jQuery(".cat_option").hide();
jQuery(".dom" + dom_selected).show();
var domain = "dom" + dom_selected;
for(var k = 0; k < checkboxes.length; k++){
if(!checkboxes[k].classList.contains(domain)){
checkboxes[k].checked = false;
}
}
}
else
{
jQuery(".cat_option").hide();
jQuery(".dom" + dom_selected + ".cat" + cat_selected).show();
var category = "cat" + cat_selected;
for(var k = 0; k < checkboxes.length; k++){
if(!checkboxes[k].classList.contains(category)){
checkboxes[k].checked = false;
}
}
var domain = "dom" + dom_selected;
for(var k = 0; k < checkboxes.length; k++){
if(!checkboxes[k].classList.contains(domain)){
checkboxes[k].checked = false;
}
}
}
jQuery("input:checkbox").hide();
}
// function filter_words(){
//
// var selected = jQuery( "#category_id option:selected" ).val();
// var checkboxes = jQuery("input:checkbox");
//
// if(!(selected == "NA")){
// jQuery("label").hide();
// var category = ".cat" + selected;
//
// jQuery(category).show();
// jQuery("input:checkbox").hide();
//
// var category_selected = "";
//
// for(var k = 0; k < checkboxes.length; k++){
// category_selected = "." + checkboxes[k].className;
// if(category_selected != category){
// checkboxes[k].checked = false;
// }
// }
// }else{
// jQuery("label").show();
// jQuery("input:checkbox").hide();
// }
//
// }
</script>
<?php
}
function spotgame_settings_page()
{
$games = get_decks("spotgame");
$semantic = WP_PLUGIN_URL . '/vocabulary-plugin/css/semantic.css';
$new_game_url = admin_url() . "admin.php?page=new_spotgame_settings";
$edit_game_url = admin_url() . "admin.php?page=edit_spotgame_settings&action=edit";
$copy_game_url = admin_url() . "admin.php?page=edit_spotgame_settings&action=copy";
$view_game_url = admin_url() . "admin.php?page=view_spotgame_settings";
//$pano_editor = WP_PLUGIN_URL . '../sample-page-edit';
$pano_editor = admin_url() . "admin.php?page=view_panos_settings";
?>
<!-- style sheet so our admin page looks nice -->
<link rel="stylesheet" type="text/css" href="<?php
echo $semantic;
?>
"/>
<link rel="stylesheet" type="text/css" href="../flashcard/js/featherlight/featherlight.min.css"/>
<script type="text/javascript" src="../flashcard/js/featherlight/featherlight.min.js"></script>
<script type="text/javascript" src="../flashcard/js/featherlight/featherlight-functions.js"></script>
<hr>
<?php
if (isset($_GET['settings-saved'])) {
?>
<div class="updated"><p>Settings updated successfully.</p></div>
<?php
}
?>
<h2>Games</h2>
<table id="gameTable" class="ui table segment tablesorter">
<thead>
<tr>
<th>Question</th>
<th>Choosed Word</th>
<th>Edit</th>
<th>Copy</th>
<th>Delete</th>
<th>View</th>
<th>Add HotSpot</th>
</tr>
</thead>
<tbody>
<?php
foreach ($games as $game) {
?>
<?php
$current_game = build_deck($game->id);
?>
<tr>
<td><?php
echo $current_game->get_name();
?>
</td>
<td><?php
echo $current_game->get_name();
?>
</td>
<td><a class="ui blue icon button" href="<?php
echo $edit_game_url;
?>
&id=<?php
echo $current_game->get_id();
?>
" style="padding: 7px">Edit</a></td>
<td><a class="ui blue icon button" href="<?php
echo $copy_game_url;
?>
&id=<?php
echo $current_game->get_id();
?>
" style="padding: 7px">Copy</a></td>
<td>
<form method="post" action="admin-post.php" id="delete_word_form<?php
echo $current_game->get_id();
?>
">
<!-- word processing hook -->
<input type="hidden" name="action" value="delete_deck" />
<input type="hidden" name="game_type" value="spotgame">
<input type="hidden" name="game_id" value="<?php
echo $current_game->get_id();
?>
" />
<input type="hidden" name="deck_id" value="<?php
echo $game->id;
?>
" />
<input type="submit" class="ui blue icon button" value="Delete" style="padding: 7px" >
</form>
</td>
<td>
<form method="POST" action="<?php
echo $view_game_url;
?>
&">
<!-- word processing hook -->
<input type="hidden" name="deck_id" value="<?php
echo $game->id;
?>
" />
<input type="submit" class="ui blue icon button" value="View" style="padding: 7px" >
</form>
</td>
<td>
<form method="POST" action="<?php
echo $pano_editor;
?>
&">
<!-- word processing hook -->
<input type="hidden" name="game_id" value="<?php
echo $game->id;
?>
" />
<input type="submit" class="ui blue icon button" value="Create_Hotspot" style="padding: 7px" >
</form>
</td>
</tr>
<?php
}
?>
</tbody>
</table>
<a class="ui blue icon button" href="<?php
echo $new_game_url;
?>
" style="padding: 7px">New Game</a>
<script>
jQuery(document).ready(function(){
jQuery("#gameTable").tablesorter();
})
</script>
<?php
}
function edit_spotgame_settings_page()
{
$semantic = WP_PLUGIN_URL . '/vocabulary-plugin/css/semantic.css';
$game_id = filter_input(INPUT_POST, 'id');
$game = get_deck($game_id);
$domains = get_domains();
$categories = get_word_categories();
$words = get_words();
$decks = get_decks('flashcard');
//Will be empty if it's a copy or
//Will have the id if it's an update
$game_id_to_form = "";
if (isset($_GET['id']) && is_numeric($_GET['id'])) {
$game = build_deck($_GET['id']);
$deck_words = get_number_of_words_for_game($_GET['id']);
}
$selected_words_ids = array($deck_words->number_of_words);
//echo var_dump($selected_words_ids);
// for($j = 0; $j < sizeof($deck_words); $j++){
// $selected_words_ids[$j] = $deck_words[$j]->id;
// }
?>
<link rel="stylesheet" type="text/css" href="<?php
echo $semantic;
?>
"/>
<h2>Edit a Game!</h2>
<hr>
<?php
if (isset($_GET['settings-saved'])) {
?>
<div class="updated"><p>Game updated successfully.</p></div>
<?php
} elseif (isset($_GET['error'])) {
?>
<div class="error"><p>Error updating game.</p></div>
<?php
}
?>
<form id="form" method="post" enctype="multipart/form-data" action="<?php
echo get_admin_url() . 'admin-post.php';
?>
">
<!-- pano processing hook -->
<input type="hidden" name="action" value="edit_spotgame" />
<?php
if (isset($_GET['action']) && $_GET['action'] == "edit") {
$game_id_to_form = $game->get_id();
} elseif (isset($_GET['action']) && $_GET['action'] == "copy") {
$game_id_to_form = "copy";
}
?>
<input type="hidden" name="game_id" value="<?php
echo $game_id_to_form;
?>
"/>
<div class="ui form segment edit_word_form">
<div class="ui form">
<div class="field">
<label>Choose a deck:</label>
<select name="decks" id="deck_id">
<option value="NA">Select a Deck</option>
<?php
foreach ($decks as $deck) {
?>
<option value="<?php
echo $deck->id;
?>
"><?php
echo $deck->name;
?>
</option>
<?php
}
?>
</select>
</div>
</div>
<div class="ui form">
<div class="field">
<div class="ui left labeled icon input">
<label for="game_name">Question that will display in the game: </label>
<input name="game_name" id="name" value="<?php
echo $game->get_name();
?>
" required />
</div>
</div>
</div>
<p class="error" id="not_enough_words">* Select just one word</p>
<div class="ui form">
<div class="field">
<label for="category_id">Filter by</label>
<select name="domain_id" id="domain_id">
<option value="NA">Select a Domain</option>
<?php
foreach ($domains as $domain) {
?>
<option value="<?php
echo $domain->id;
?>
"><?php
echo $domain->name;
?>
</option>
<?php
}
?>
</select>
<select name="category_id" id="category_id">
<option value="NA">Select a Category</option>
<?php
foreach ($categories as $category) {
?>
<option value="<?php
echo $category->id;
?>
"><?php
echo $category->name;
?>
</option>
<?php
}
?>
</select>
</div>
</div>
<div class="ui form">
<div class="field">
<ul>
<?php
foreach ($words as $word) {
?>
<?php
if (in_array($word->id, $selected_words_ids)) {
?>
<li class="games_form">
<input type="checkbox" id="<?php
echo $word->id;
?>
" class="dom<?php
echo $word->domain_id;
?>
cat<?php
echo $word->word_category_id;
?>
" name="words[]" value="<?php
echo $word->id;
?>
" checked>
<label for="<?php
echo $word->id;
?>
" class="dom_option cat_option dom<?php
echo $word->domain_id;
?>
cat<?php
echo $word->word_category_id;
?>
" ><?php
echo $word->word;
?>
</label>
</li>
<?php
} else {
?>
<li class="games_form">
<input type="checkbox" id="<?php
echo $word->id;
?>
" class="dom<?php
echo $word->domain_id;
?>
cat<?php
echo $word->word_category_id;
?>
" name="words[]" value="<?php
echo $word->id;
?>
">
<label for="<?php
echo $word->id;
?>
" class="dom_option cat_option dom<?php
echo $word->domain_id;
?>
cat<?php
echo $word->word_category_id;
?>
" ><?php
echo $word->word;
?>
</label>
</li>
<?php
}
?>
<?php
}
?>
</ul>
</div>
</div>
<?php
submit_button();
?>
</div>
</form>
</div>
<script>
jQuery('#form').submit(function(e){
user_selected_enough_words(e);
});
jQuery('#game_number_of_words').change(function(){
document.getElementById("words_error").style.display = "none";
});
jQuery("input:checkbox").change(function(){
document.getElementById("words_error").style.display = "none";
document.getElementById("not_enough_words").style.display = "none";
});
jQuery("#category_id").change(function(){
filter_words();
});
jQuery("#domain_id").change(function(){
filter_words();
});
function user_selected_enough_words(e){
var n = jQuery("input:checkbox:checked").length;
var game_number_of_words = jQuery('#game_number_of_words').prop('value');
if(n > 1 || n < 1){
e.preventDefault();
document.getElementById("not_enough_words").style.display = "block";
document.getElementById("words_error").style.display = "none";
}
else if(n < Number(game_number_of_words)){
e.preventDefault();
document.getElementById("words_error").style.display = "block";
document.getElementById("not_enough_words").style.display = "none";
}else{
document.getElementById("words_error").style.display = "none";
document.getElementById("not_enough_words").style.display = "none";
}
}
function filter_words()
{
var cat_selected = jQuery( "#category_id option:selected" ).val();
var dom_selected = jQuery( "#domain_id option:selected" ).val();
var checkboxes = jQuery("input:checkbox");
jQuery(".cat_option").hide();
//jQuery("input:checkbox").hide();
if(cat_selected == "NA" && dom_selected == "NA")
{
jQuery(".cat_option").show();
}
else if(cat_selected != "NA" && dom_selected == "NA")
{
jQuery(".cat_option").hide();
jQuery(".cat" + cat_selected).show();
var category = "cat" + cat_selected;
for(var k = 0; k < checkboxes.length; k++){
if(!checkboxes[k].classList.contains(category)){
checkboxes[k].checked = false;
}
}
}
else if(cat_selected == "NA" && dom_selected != "NA")
{
jQuery(".cat_option").hide();
jQuery(".dom" + dom_selected).show();
var domain = "dom" + dom_selected;
for(var k = 0; k < checkboxes.length; k++){
if(!checkboxes[k].classList.contains(domain)){
checkboxes[k].checked = false;
}
}
}
else
{
jQuery(".cat_option").hide();
jQuery(".dom" + dom_selected + ".cat" + cat_selected).show();
var category = "cat" + cat_selected;
for(var k = 0; k < checkboxes.length; k++){
if(!checkboxes[k].classList.contains(category)){
checkboxes[k].checked = false;
}
}
var domain = "dom" + dom_selected;
for(var k = 0; k < checkboxes.length; k++){
if(!checkboxes[k].classList.contains(domain)){
checkboxes[k].checked = false;
}
}
}
jQuery("input:checkbox").hide();
}
</script>
<?php
}
function get_spotgame_deck()
{
return get_decks("spotgame");
}
