<div class="page-margin">
	<div class="row">
		<div class="col-md-2 leftcol"><?php echo Wo_LoadPage("sidebar/left-sidebar"); ?></div>
		<div class="col-md-7 middlecol">
			<div class="page-margin wow_content mt-0">
				<div class="wo_page_hdng pag_neg_padd pag_alone">
					<div class="wo_page_hdng_innr">
						<span><svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24"><path fill="currentColor" d="M13 3V11H21V3H13M3 21H11V13H3V21M3 3V11H11V3H3M13 16H16V13H18V16H21V18H18V21H16V18H13V16Z"></path></svg></span> <?php echo $wo['lang']['create_new_group'];?>
					</div>
				</div>
			</div>
			
			<div class="page-margin wow_content wow_sett_content">
				<form class="create-group-form form-horizontal" method="post">
					<div class="wow_form_fields">
						<label for="group_title"><?php echo $wo['lang']['group_name']; ?></label>
						<input id="group_title" name="group_title" type="text">
					</div>
					<div class="wow_form_fields">
						<label for="group_name"><?php echo $wo['lang']['group'];?> URL</label>
						<div class="input-group">
							<span class="input-group-addon"><?php echo $wo['config']['site_url'];?>/</span>
							<input id="group_name" name="group_name" type="text">
						</div>
					</div>
					<div class="wow_form_fields">
						<label for="group_about"><?php echo $wo['lang']['description']; ?></label>
						<textarea name="about" id="group_about" rows="3"></textarea>
					</div>
					<div class="row">
						<div class="col-md-6">
							<div class="wow_form_fields">
								<label for="privacy"><?php echo $wo['lang']['group_type']; ?></label>
								<select id="privacy" name="privacy">
									<option value="1" ><?php echo $wo['lang']['public'];?> </option>
									<option value="2" ><?php echo $wo['lang']['private'];?> </option>
								</select>
							</div>
						</div>
						<div class="col-md-6">
							<div class="wow_form_fields">
								<label for="category"><?php echo $wo['lang']['category']; ?></label>
								<select name="category" id="category" onchange="GetGroupSubCategory(this)">
									<?php foreach ($wo['group_categories'] as $category_id => $category_name) {?>
									<option value="<?php echo $category_id?>"><?php echo $category_name; ?></option>
									<?php } ?>
								</select>
							</div>
						</div>
						<?php if (!empty($wo['group_sub_categories'])) { ?>
						<div class="col-md-6">
							<div class="wow_form_fields">
								<label for="group_sub_category"><?php echo $wo['lang']['sub_category']; ?></label>
								<select name="group_sub_category" id="group_sub_category">
									<?php
									if (!empty($wo['group_sub_categories'][array_keys($wo['group_categories'])[0]])) {
									foreach ($wo['group_sub_categories'][array_keys($wo['group_categories'])[0]] as $id => $sub_category) { ?>
										<option value="<?php echo $sub_category['id']?>"><?php echo $sub_category['lang']; ?></option>
									<?php } } ?>
								</select>
							</div>
						</div>
					    <?php } ?>
						<div class="clear"></div>
						<?php $fields = Wo_GetCustomFields('group'); 
						if (!empty($fields)) {
							foreach ($fields as $key => $wo['field']) {
								echo Wo_LoadPage('group/fields');
							}
						}
						?>
					</div>
					<div class="app-general-alert setting-update-alert"></div>
					<div class="text-center">
						<a class="btn btn-mat" data-ajax="?link1=groups" href="<?php echo Wo_SeoLink('index.php?link1=groups');?>">
							<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24"><path fill="currentColor" d="M20,11V13H8L13.5,18.5L12.08,19.92L4.16,12L12.08,4.08L13.5,5.5L8,11H20Z"></path></svg> <?php echo $wo['lang']['go_back'];?>
						</a>
						<button class="btn btn-main btn-mat btn-mat-raised add_wow_loader" type="submit"><?php echo $wo['lang']['create']; ?></button>
					</div>
					<input type="hidden" name="hash_id" value="<?php echo Wo_CreateSession();?>">
				</form>
			</div>
		</div>
		<!-- .col-md-8 -->
		<?php echo Wo_LoadPage('sidebar/content');?>
	</div>
	<!-- .row -->
</div>
<!-- .page-margin -->
<script type="text/javascript">
	<?php 
$js_array = json_encode($wo['group_sub_categories']);
echo "var sub_categories_array = ". $js_array . ";\n";
?>
	function GetGroupSubCategory(self) {
		id = $(self).val();
		var text = "";
		if (typeof(sub_categories_array[id]) == 'undefined') {
		    $('#group_sub_category').html('');
		}
		else{
		   	sub_categories_array[id].forEach(function(entry) {
				text = text + "<option value='"+entry.id+"'>"+entry.lang+"</option>";
			});
		    $('#group_sub_category').html(text);
		}
	}
   $(function() {
     $('form.create-group-form').ajaxForm({
       url: Wo_Ajax_Requests_File() + '?f=groups&s=create_group',
       beforeSend: function() {
         $('.create-group-form').find('.add_wow_loader').addClass('btn-loading');
       },
       success: function(data) {
         scrollToTop();
         if (data.status == 200) {
           window.location.href = data.location;
         } else {
             var errors = data.errors.join("<br>");
             $('.app-general-alert').html('<div class="alert alert-danger">' + errors + '</div>');
             $('.alert-danger').fadeIn(300);
         }
         $('.create-group-form').find('.add_wow_loader').removeClass('btn-loading');
       }
     });
   });
</script>