function word_settings_page() { $words = get_words(); $categories = get_word_categories(); $domains = get_domains(); $semantic = WP_PLUGIN_URL . '/vocabulary-plugin/css/semantic.css'; $new_word_url = admin_url() . "admin.php?page=new_word_settings"; $edit_word_url = admin_url() . "admin.php?page=edit_word_settings"; ?> <!-- style sheet so our admin page looks nice --> <link rel="stylesheet" type="text/css" href="<?php echo $semantic; ?> "/> <p>Manage your words!</p> <hr> <?php if (isset($_GET['settings-saved'])) { ?> <div class="updated"><p>Settings updated successfully.</p></div> <?php } ?> <h2>Vocabulary</h2> <div class="ui form"> <div class="field"> <label for="filter">Filter the words 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> <table id="wordTable" class="ui table segment tablesorter"> <thead> <tr> <th>Name</th> <th>Description</th> <th>Points</th> <th>Image</th> <th>Audio</th> <th>Edit</th> <th>Delete</th> </tr> </thead> <tbody> <?php foreach ($words as $word) { ?> <?php $current_word = build_words($word->id); ?> <tr> <td class="dom_option cat_option dom<?php echo $word->domain_id; ?> cat<?php echo $word->word_category_id; ?> "><?php echo $current_word->get_word(); ?> </td> <td class="dom_option cat_option dom<?php echo $word->domain_id; ?> cat<?php echo $word->word_category_id; ?> "><?php echo $current_word->get_description(); ?> </td> <td class="dom_option cat_option dom<?php echo $word->domain_id; ?> cat<?php echo $word->word_category_id; ?> "><?php echo $current_word->get_points(); ?> </td> <td class="dom_option cat_option dom<?php echo $word->domain_id; ?> cat<?php echo $word->word_category_id; ?> "><?php echo $current_word->get_image(); ?> </td> <td class="dom_option cat_option dom<?php echo $word->domain_id; ?> cat<?php echo $word->word_category_id; ?> "><?php echo $current_word->get_audio(); ?> </td> <td class="dom_option cat_option dom<?php echo $word->domain_id; ?> cat<?php echo $word->word_category_id; ?> "><a class="ui blue icon button" href="<?php echo $edit_word_url; ?> &id=<?php echo $current_word->get_id(); ?> " style="padding: 7px">Edit</a></td> <td class="dom_option cat_option dom<?php echo $word->domain_id; ?> cat<?php echo $word->word_category_id; ?> "> <form method="post" action="admin-post.php" id="delete_word_form<?php echo $current_word->get_id(); ?> "> <!-- word processing hook --> <input type="hidden" name="action" value="delete_word" /> <input type="hidden" name="word_id" value="<?php echo $current_word->get_id(); ?> " /> <input type="submit" class="ui blue icon button" value="Delete" style="padding: 7px" > </form> </td> </tr> <?php } ?> </tbody> </table> <a class="ui blue icon button" href="<?php echo $new_word_url; ?> " style="padding: 7px">New Word</a> <script> jQuery(document).ready(function(){ jQuery("#wordTable").tablesorter(); }) jQuery("#category_id").change(function(){ filter_words(); }); jQuery("#domain_id").change(function(){ filter_words(); }); function validation() { } function filter_words() { var cat_selected = jQuery( "#category_id option:selected" ).val(); var dom_selected = jQuery( "#domain_id option:selected" ).val(); 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(); } else if(cat_selected == "NA" && dom_selected != "NA") { jQuery(".cat_option").hide(); jQuery(".dom" + dom_selected).show(); } else { jQuery(".cat_option").hide(); jQuery(".dom" + dom_selected + ".cat" + cat_selected).show(); } jQuery("input:checkbox").hide(); } </script> <?php }
function edit_word_settings_page() { $semantic = WP_PLUGIN_URL . '/vocabulary-plugin/css/semantic.css'; $word_id = filter_input(INPUT_POST, 'id'); $words = get_word($word_id); $domains = get_domains(); $categories = get_word_categories(); if (isset($_GET['id']) && is_numeric($_GET['id'])) { $words = build_words($_GET['id']); } ?> <link rel="stylesheet" type="text/css" href="<?php echo $semantic; ?> "/> <h2>Edit a word!</h2> <hr> <?php if (isset($_GET['settings-saved'])) { ?> <div class="updated"><p>Dictionary updated successfully.</p></div> <?php } elseif (isset($_GET['error'])) { ?> <div class="error"><p>Error updating dictionary.</p></div> <?php } ?> <form id="myform" 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_word" /> <input type="hidden" name="word_id" value="<?php echo $words->get_id(); ?> "/> <div class="ui form segment edit_word_form"> <div class="ui form"> <div class="field"> <label for="domain_id">Select a Domain</label> <select name="domain_id"> <option value="NA"> ... </option> <?php foreach ($domains as $domain) { ?> <option value="<?php echo $domain->id; ?> "><?php echo $domain->name; ?> </option> <?php } ?> </select> </div> </div> <div class="ui form"> <div class="field"> <label for="category_id">Select a Category</label> <select name="category_id"> <option value="NA">...</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"> <div class="ui left labeled icon input"> <label for="word_name">Word Name</label> <input name="word_name" id="name" value="<?php echo $words->get_word(); ?> " required /> </div> </div> </div> <div class="ui form"> <div class="field"> <label for="word_description">Description</label> <textarea name="word_description" id="word_description" required ><?php echo $words->get_description(); ?> </textarea> <p class="error" id="description_too_big">* Description must be smaller than 255 char</p> </div> </div> <div class="ui form"> <div class="field"> <label for="word_points">Points</label> <select name="word_points"> <option value="30">30</option> <option value="20">20</option> <option value="10">10</option> </select> </div> </div> <div class="ui form"> <div class="field"> <div class="ui left labeled icon input"> <label for="word_image">Choose an image: <b>(Preferably 120x120)</b> </label> <img class="word_image" src="<?php echo content_url() . '/' . $words->get_image(); ?> " alt="Image"/> <input type="file" name="word_image" id="word_image" /> </div> </div> </div> <div class="ui form"> <div class="field"> <div class="ui left labeled icon input"> <label for="word_audio">Choose an audio: </label> <input type="file" name="word_audio" id="word_audio" /> </div> </div> </div> <?php submit_button(); ?> </div> </form> </div> <script> jQuery('#myform').submit(function(e){ max_description_size(e); }); function max_description_size(e){ var size = jQuery("#word_description").val().length; if(size > 255){ document.getElementById("description_too_big").style.display = "block"; e.preventDefault(); }else{ document.getElementById("description_too_big").style.display = "none"; } } jQuery(document).ready(function(){ jQuery("#wordTable").tablesorter(); }) </script> <?php }