{header}
<div class="wrapper-wide">
<div class="userinfo-c-wide">
<div class="userinfo">

    <div class="groups">

        {groups_header}

        <table class="tb_groups">
            <tr>
                <!-- td_main -->
                <td class="td_main">

                    {groups_group_show}

<script Language="JavaScript" type="text/javascript">

$(document).ready(function(){
    $("#group_edit_form").validate({
        rules: {
            group_title: "required",
            group_description: "required",
            category_id: "required",
            group_private: "required"
        },
        messages: {
            group_title: "",
            group_description: "",
            category_id: "",
            group_private: ""
        }
    })
});

function on_form_submit()
{
    for(var i = 1; i <= 1; i++)
    {
        var ext = $('input[name="image_'+i+'"]').val();
        if(ext != "")
        {
            ext = ext.substring(ext.length-4,ext.length);
            ext = ext.toLowerCase();
            if(ext != '.jpg' && ext != '.gif' && ext != '.png' && ext != 'jpeg') {
                alert('{l_wrong_photo_types}');
                return false;
            }
        }
    }

    if($('input[name="group_title"]').val() == "{l_groups_default_title}")
        $('input[name="group_title"]').val('');
    if($('textarea[name="group_description"]').val() == "{l_groups_default_description}")
        $('textarea[name="group_description"]').val('');

    if($("#group_edit_form").valid())
        $('#load_animation_submit').css('visibility', 'visible');
    else
        alert('{l_please_fill_in_all_the_fields}');

    return true;
}

</script>

                    <div class="groups_shadow"><img src="{url_tmpl_main}images/groups/shadow.png" width="446" height="51" alt=""/></div>

                    <form id="group_edit_form" method="POST" action="{url_main}groups_group_edit.php?cmd=save&group_id={group_id}" enctype="multipart/form-data" onsubmit="return on_form_submit()">

                    <div class="groups_p pl_top_m">
                        <!-- begin_create_title --><h1>{l_groups_please_enter_the_groups_details}</h1><!-- end_create_title -->
                        <!-- begin_edit_title --><h1>{l_groups_edit_group}</h1><!-- end_edit_title -->

                        <table class="groups_tb_sub">
                            <col width="7px"/>
                            <col width="431px"/>
                            <tr>
                                <th class="th_t_l nb first">&nbsp;</th>
                                <th class="th_t_c nb">&nbsp;</th>
                                <th class="th_t_r nb first">&nbsp;</th>
                            </tr>

                            <tr>
                                <td colspan="3" class="nb nobg_img">
                                <div class="bl_groups_frm_color">
                                    <!-- frm -->
                                    <table class="tb_groups_frm">
                                        <col width="100%"/>
                                        <tr>
                                            <td ><input class="inp_lviolet no_abk" type="text" name="group_title" value="{group_title}" onblur="javascript:if(this.value=='')this.value='{l_groups_default_title}'" onFocus="if(this.value=='{l_groups_default_title}') this.value='';"/></td>
                                        </tr>
                                        <tr>
                                            <td >

												<div class="textarea_violet_textarea">

											<textarea class="textarea_violet no_abk" name="group_description"  onblur="javascript:if(this.value=='')this.value='{l_groups_default_description}'" onFocus="if(this.value=='{l_groups_default_description}') this.value='';">{group_description}</textarea>
											</div>

											</td>
                                        </tr>
                                        <tr>
                                            <td class="group_select">
                                                <select name="group_private">{private_options}</select>
                                            </td>
                                        </tr>
                                        <tr>
                                            <td class="group_select">
                                                <select name="category_id">{category_options}</select>
                                            </td>
                                        </tr>

                                        <tr>
                                            <td class="group_inp_file">
                                                <label>{l_group_image}</label>
                                                <input class="inp_file" name="image_1" type="file"/>
                                                <div class="cl groups_empty"></div>
                                            </td>
                                        </tr>

                                    </table>
                                    <!-- /frm -->

                                    <!-- begin_edit_images -->
<script type="text/javascript">

$(document).ready(function() {
    create_gallery()
});

function create_gallery()
{
    initLightboxOldTemplateNewAge($('.edit_image_gallery'));
}

function edit_delete_image(image_id)
{
    if(confirm('{l_are_you_sure}'))
    {
        $('#edit_image_' + image_id).fadeOut(400, function() {
            $('#edit_image_' + image_id).remove();
            create_gallery();
            $.ajax({
                    type: 'POST',
                    url: '{url_main}groups_group_image_delete_ajax.php',
                    data: {
                        image_id: image_id
                        }
                  });
            });
    }
}

</script>

<link rel="stylesheet" type="text/css" href="{url_tmpl_main}lightbox/jquery.lightbox-0.5.css{cache_version_param}" media="screen" />
<script type="text/javascript" src="{url_tmpl_main}lightbox/jquery.lightbox-0.5.min.js{cache_version_param}"></script>

                                    <div class="line_dashed"></div>

                                    <div>

	                                    <!-- begin_image -->
	                                    <div id="edit_image_{image_id}" class="groups_img">
	                                        <a class="edit_image_gallery" href="{image_file}"><img src="{image_thumbnail}" width="85" height="64" alt=""/></a>
	                                        <div class="groups_delete"><a title="{l_groups_delete_image}" href="javascript:edit_delete_image({image_id})"><img class="png" src="{url_tmpl_main}images/music/ico_delete.png" width="15" height="17" alt=""/></a></div>
	                                    </div>
	                                    <!-- end_image -->

                                    <div class="justify"></div>
                                    </div>
                                    <!-- end_edit_images -->

                                    <div class="line_dashed"></div>

                                    <div class="fl_right" style="width: 100%;">
                                        <!-- begin_edit_button -->
                                        <a style="margin-left:0px;" onclick="return confirm('{l_delete_confirm}')" href="{url_main}groups_group_delete.php?group_id={group_id}">{l_groups_delete}</a>
                                        <input class="btn_yellow fl_right" type="submit" value="{l_groups_save}"/>
                                        <img style="visibility:hidden; float:right;" id="load_animation_submit" src="{url_tmpl_main}images/load_animation.gif">
                                        <!-- end_edit_button -->
                                        <!-- begin_create_button -->
                                        <img style="visibility:hidden;" id="load_animation_submit" src="{url_tmpl_main}images/load_animation.gif">
                                        <input class="btn_yellow" type="submit" value="{l_groups_create}"/>
                                        <!-- end_create_button -->
                                    </div>

                                    <div class="groups_empty" style="margin-bottom:0px;">&nbsp;</div>
                                </div>
                                </td>

                            </tr>


                            <tr>
                                <th class="th_b_l nb">&nbsp;</th>
                                <th class="th_b_c nb">&nbsp;</th>
                                <th class="th_b_r nb">&nbsp;</th>
                            </tr>

                        </table>

                    </div>
                    </form>
                    <div class="groups_empty"></div>
                </td>
                <!-- /td_main -->

                <td class="td_narrow">

				{groups_group_member_list}


            </tr>

        </table>

        <div class="groups_foot">

            <table>
                <tr>
                    <td class="td_l">&nbsp;</td>
                    <td class="td_c">&nbsp;</td>
                    <td class="td_r">&nbsp;</td>
                </tr>
            </table>

        </div>


    <div class="decor_top"></div>
    </div>



</div>
<br>
<div class="userinfo-links-wide"></div>
</div>
</div>
{footer}