<?php response_header(); ?>

<!-- TreeMenu depends on detect-user-agent -->
<script type="text/javascript" src="/javascript/detect-user-agent.js"></script>
<script type="text/javascript" src="/javascript/TreeMenu/TreeMenu.js"></script>
<script type="text/javascript">
<!--
    currentHighlight = null;

    function category_click(e, obj, catID)
    {
        if (e === null && currentHighlight !== null) {
            document.getElementById(currentHighlight).className = 'treeMenuOff';
            currentHighlight = null;
            updateForm(null);
            return;
        } else if (e === null) {
            return;
        }

        if (e) {
            e.cancelBubble = true;
        }

        var layerID = obj.parentNode.parentNode.id;

        if (currentHighlight != layerID) {
            if (currentHighlight !== null) {
                document.getElementById(currentHighlight).className = 'treeMenuOff';
            }
            var layerRef = document.getElementById(layerID);
            layerRef.className = (layerRef.className == 'treeMenuOff' ? 'treeMenuOn' : 'treeMenuOff');
            updateForm(catID);
            currentHighlight = layerID;
        }
    }
    
    /**
     * Updates form with correct cateogry parent name/id
     */
    function updateForm(catID)
    {
        var formObj = document.forms['category_form'];
        if (catID !== null) {
            formObj.parent_text.value     = categories[catID][0];
            formObj.cat_parent.value      = catID;
            formObj.delete_text.value     = categories[catID][0];
            formObj.cat_delete.value      = catID;
        } else {
            formObj.parent_text.value     = 'none';
            formObj.cat_parent.value  = '';
            formObj.delete_text.value     = 'none';
            formObj.cat_delete.value      = '';
        }
    }
    
    /**
     * Called when update checkbox is clicked
     */
    function updateCheckToggle(obj)
    {
        var newStatus = obj.checked;
        var formObj = document.forms['category_form'];

        if (newStatus && formObj.parent_text.value != 'none') {
            formObj.catName.value = categories[formObj.cat_parent.value][0];
            formObj.catDesc.value = categories[formObj.cat_parent.value][1] == 'none' ? '' : categories[formObj.cat_parent.value][1];
            formObj.addUpdateSubmit.value = 'Update category';
            formObj.action.value = 'update';
        } else {
            formObj.catName.value = '';
            formObj.catDesc.value = '';
            formObj.addUpdateSubmit.value = 'Add category';
            formObj.action.value = 'add';
        }
    }
    
    categories = new Array();

    <?php foreach($categories as $c):?>
categories[<?php echo $c['id']; ?>] = new Array('<?php echo $c['name']; ?>', '<?php echo $c['description']; ?>');
    <?php endforeach ?>
//-->
</script>
<style type="text/css">
<!--
    .treeMenuContainer {
        height: 400px;
        width: 220px;
        overflow: auto;
        border: 1px #aaaaaa solid;
        background-color: #eeeeee;
        float: left;
        padding: 0.5em;
        margin-right: 1.0em;
    }

    .treeMenuContainer h4 {
        margin-bottom: 0.5em;
    }
    
    .treeMenuOff {
        padding: 1px;
        width: 202x;
        cursor: pointer;
        cursor: hand;
    }

    .treeMenuOn {
        border: 1px solid #000080;
        background-color: #adadd1;
        width: 202px;
        cursor: pointer;
        cursor: hand;
    }

    textarea {
        margin: 0;
    }
// -->
</style>

    <?php if (!empty($message)) { ?>
        <div class="errors"><?php echo $message; ?></div>
    <?php } ?>

    <div class="treeMenuContainer" onclick="category_click(null)">
        <h4>Categories</h4>
        <?php $treeMenuPres->printMenu(); ?>
    </div>        


    <form action="category-manager.php" name="category_form" method="post">
        <input type="hidden" name="action" value="" />
        <input type="hidden" name="cat_parent" value="" />
        <input type="hidden" name="cat_delete" value="" />

        <h2>&raquo; Add New Category</h2>
        <p>Parent Category<br /><input type="text" value="none" size="25" disabled="disabled" name="parent_text" /></p>
        <p>Name<br /><input type="text" name="catName" size="25" /></p>
        <p>Description<br /><textarea name="catDesc"></textarea></p>
            

        <p><input type="checkbox" name="update_checkbox" onclick="updateCheckToggle(this)" id="update_checkbox" /> <label for="update_checkbox">Update instead of addition?</label></p>

        <p><input type="submit" value="Add category" name="addUpdateSubmit" onclick="document.forms['category_form'].action.value = (this.value == 'Add category' ? 'add' : 'update')" /></p>
    


        <h2>&raquo; Delete category</h2>
        <p>Selected <br />
            <input type="text" name="delete_text" value="none" size="25" disabled="disabled" /></p>

        <p><input type="submit" value="Delete category" onclick="document.forms['category_form'].action.value = 'delete'; return confirm('Are you sure you wish to delete this category?')" /></p>
    </form>


<?php response_footer(); ?>
