<div class="crumb">
    <ul>
        <li><a href="theme/list">themes</a></li>
        <li><a href="theme">current</a></li>
    </ul>
</div>

<div class="save">
    <a href="theme/save">Save</a>
</div>

<div class="header clear">
    <p>Header - <a href="theme/add-header">Add</a></p>
    <?php foreach ($header as $h) : ?>
        <div class="icon<?php if ($h == $current_header) : echo ' featured'; endif; ?>" id="header_<?php echo htmlspecialchars($h); ?>">
            <div class="content">
                <a href="javascript:set_header('<?php echo htmlspecialchars($h); ?>');">
                    <img src="<?php echo htmlspecialchars(header::DIRECTORY . $h); ?>.jpg?<?php echo time(); ?>" /><br /><?php echo htmlspecialchars(ucfirst($h)); ?>
                </a>
            </div>
            <div class="action">
                <a href="theme/edit-header/<?php echo htmlspecialchars($h); ?>" id="header_edit_<?php echo htmlspecialchars($h); ?>">Edit</a>
                <a href="javascript:delete_header('<?php echo htmlspecialchars($h); ?>');">Delete</a>
            </div>
        </div>
    <?php endforeach; ?>
</div>

<div class="background clear">
    <p>Background - <a href="theme/add-background">Add</a></p>
    <?php foreach ($background as $b) : ?>
        <div class="icon<?php if ($b == $current_background) : echo ' featured'; endif; ?>" id="background_<?php echo htmlspecialchars($b); ?>">
            <div class="content">
                <a href="javascript:set_background('<?php echo htmlspecialchars($b); ?>');">
                    <img src="<?php echo htmlspecialchars(background::DIRECTORY . $b); ?>.jpg?<?php echo time(); ?>" /><br /><?php echo htmlspecialchars(ucfirst($b)); ?>
                </a>
            </div>
            <div class="action">
                <a href="theme/edit-background/<?php echo htmlspecialchars($b); ?>" id="background_edit_<?php echo htmlspecialchars($b); ?>">Edit</a>
                <a href="javascript:delete_background('<?php echo htmlspecialchars($b); ?>');">Delete</a>
            </div>
        </div>
    <?php endforeach; ?>
</div>

<div class="theme clear">
    <p>Skin</p>
    <?php foreach ($setting as $s) : ?>
        <?php if (!($s['name'] === 'header' || $s['name'] === 'background' || $s['name'] === 'favicon')) : ?>
            <div class="icon">
                <div class="content" style="background:<?php echo $s['value']; ?>">
                    <a href="setting/edit/<?php echo htmlspecialchars($s['name']); ?>/<?php echo htmlspecialchars($s['type']); ?>">
                        <!--<img src="admin/skin/icon/file3.png" />  --><br /><?php echo htmlspecialchars(str_replace('-', ' ', $s['name'])); ?>
                    </a>
                </div>
                <div class="action">
                    <a href="setting/edit/<?php echo htmlspecialchars($s['name']); ?>/<?php echo htmlspecialchars($s['type']); ?>">Edit</a>
                </div>
            </div>
        <?php endif; ?>
    <?php endforeach; ?>
</div>

<div class="favicon clear">
    <p>Favicon - <a href="theme/add-favicon">Add</a></p>
    <?php foreach ($favicon as $f) : ?>
        <div class="icon<?php if ($f == $current_favicon) : echo ' featured'; endif; ?>" id="favicon_<?php echo htmlspecialchars($f); ?>">
            <div class="content">
                <a href="javascript:set_favicon('<?php echo htmlspecialchars($f); ?>');">
                    <img src="<?php echo htmlspecialchars(favicon::DIRECTORY . $f); ?>.ico?<?php echo time(); ?>" /><br /><?php echo htmlspecialchars(ucfirst($f)); ?>
                </a>
            </div>
            <div class="action">
                <a href="theme/edit-favicon/<?php echo htmlspecialchars($f); ?>" id="favicon_edit_<?php echo htmlspecialchars($f); ?>">Edit</a>
                <a href="javascript:delete_favicon('<?php echo htmlspecialchars($f); ?>');">Delete</a>
            </div>
        </div>
    <?php endforeach; ?>
</div>

<script type="text/javascript">
    function set_header(name)
    {
        $.post('theme/set-header', { name:name },
            function(data, status) {
                if (data.error != '')
                {
                    alert(data.error);
                }
                else
                {
                    $('.header div.icon').each(function(i) {
                        $(this).removeClass('featured');
                    });
                    $('#header_' + name).addClass('featured');
                }
            }, 'json');
    }
    
    function delete_header(name)
    {
        if (confirm('Are you sure?'))
        {
            $.post('theme/delete-header', { name:name },
                function(data, status) {
                    if (data.error != '')
                    {
                        alert(data.error);
                    }
                    else
                    {
                        $('#header_' + name).remove();
                    }
                }, 'json');
        }
    }
    
    function set_background(name)
    {
        $.post('theme/set-background', { name:name },
            function(data, status) {
                if (data.error != '')
                {
                    alert(data.error);
                }
                else
                {
                    $('.background div.icon').each(function(i) {
                        $(this).removeClass('featured');
                    });
                    $('#background_' + name).addClass('featured');
                }
            }, 'json');
    }
    
    function delete_background(name)
    {
        if (confirm('Are you sure?'))
        {
            $.post('theme/delete-background', { name:name },
                function(data, status) {
                    if (data.error != '')
                    {
                        alert(data.error);
                    }
                    else
                    {
                        $('#background_' + name).remove();
                    }
                }, 'json');
        }
    }
    
    function set_favicon(name)
    {
        $.post('theme/set-favicon', { name:name },
            function(data, status) {
                if (data.error != '')
                {
                    alert(data.error);
                }
                else
                {
                    $('.favicon div.icon').each(function(i) {
                        $(this).removeClass('featured');
                    });
                    $('#favicon_' + name).addClass('featured');
                }
            }, 'json');
    }
    
    function delete_favicon(name)
    {
        if (confirm('Are you sure?'))
        {
            $.post('theme/delete-favicon', { name:name },
                function(data, status) {
                    if (data.error != '')
                    {
                        alert(data.error);
                    }
                    else
                    {
                        $('#favicon_' + name).remove();
                    }
                }, 'json');
        }
    }
</script>
