<div class="container-fluid">
    <div class="block-header">
        <h2>Settings > Site Settings</h2>
    </div>
    <!-- Vertical Layout -->
    <div class="row">
        <div class="col-lg-6 col-md-6">
            <div class="card">
                <div class="header">
                    <h2>Website Settings</h2>
                </div>
                <div class="body">
                    <div class="alert alert-success site-settings-alert"></div>
                    <form class="site-settings" method="POST">
                        <div class="form-group form-float">
                            <div class="form-line">
                                <input type="text" id="title" name="title" class="form-control" value="{{CONFIG title}}">
                                <label class="form-label">Site Title</label>
                            </div>
                        </div>
                        <div class="form-group form-float">
                            <div class="form-line">
                                <input type="text" id="name" name="name" class="form-control" value="{{CONFIG name}}">
                                <label class="form-label">Site Name</label>
                            </div>
                        </div>
                        <div class="form-group form-float">
                            <div class="form-line">
                                <input type="text" id="email" name="email" class="form-control" value="{{CONFIG email}}">
                                <label class="form-label">Site E-mail</label>
                            </div>
                        </div>
                        <div class="form-group form-float">
                            <div class="form-line">
                                <input type="text" id="keyword" name="keyword" class="form-control" value="{{CONFIG keyword}}">
                                <label class="form-label">Site Keywords</label>
                            </div>
                        </div>
                        <div class="form-group form-float">
                            <div class="form-line">
                                <textarea name="description" id="description" class="form-control" cols="30" rows="5">{{CONFIG description}}</textarea>
                                <label class="form-label">Site Description</label>
                            </div>
                        </div>
                        <div class="form-group form-float">
                            <div class="form-line">
                                <input type="text" id="server_key" name="server_key" class="form-control" value="{{CONFIG apps_api_key}}">
                                <label class="form-label">Site Server Key</label>
                            </div>
                        </div>
                        <div class="form-group form-float">
                            <div class="form-line">
                                <input type="text" id="facebook_url" name="facebook_url" class="form-control" value="{{CONFIG facebook_url}}">
                                <label class="form-label">Facebook url</label>
                            </div>
                        </div>
                        <div class="form-group form-float">
                            <div class="form-line">
                                <input type="text" id="twitter_url" name="twitter_url" class="form-control" value="{{CONFIG twitter_url}}">
                                <label class="form-label">Twitter url</label>
                            </div>
                        </div>
                        <div class="form-group form-float">
                            <div class="form-line">
                                <input type="text" id="google_url" name="google_url" class="form-control" value="{{CONFIG google_url}}">
                                <label class="form-label">Google url</label>
                            </div>
                        </div>
                        <input type="hidden" name="hash_id" value="<?php echo createMainSession();?>">
                        <button type="submit" class="btn btn-primary m-t-15 waves-effect">Save</button>
                    </form>
                </div>
            </div>
        </div>


        <div class="col-lg-6 col-md-6">
            <div class="card">
                <div class="header">
                    <h2>Sound Cloud Settings</h2>
                </div>
                <div class="body">
                    <div class="alert alert-success soundcloud-settings-alert"></div>
                    <form class="soundcloud-settings" method="POST">
                        <label for="soundcloud_import">SoundCloud Import</label>
                        <div class="form-group">
                            <input type="radio" name="soundcloud_import" id="soundcloud_import-enabled" value="on" <?php echo ($music->config->soundcloud_import == 'on') ? 'checked': '';?>>
                            <label for="soundcloud_import-enabled">Enabled</label>
                            <input type="radio" name="soundcloud_import" id="soundcloud_import-disabled" value="off" <?php echo ($music->config->soundcloud_import == 'off') ? 'checked': '';?>>
                            <label for="soundcloud_import-disabled" class="m-l-20">Disabled</label>
                        </div>
                        <div class="clearfix"></div>

                        <div class="form-group form-float">
                            <div class="form-line">
                                <input type="text" id="sound_cloud_client_id" name="sound_cloud_client_id" class="form-control" value="{{CONFIG sound_cloud_client_id}}">
                                <label class="form-label">Sound cloud clientID</label>
                            </div>
                        </div>
                        <label for="soundcloud_go">Import SoundCloud GO+ tracks</label>&nbsp;&nbsp;<a href="https://help.soundcloud.com/hc/en-us/articles/115003453667-SoundCloud-Go-tracks" target="_blank">More info</a>
                        <div class="form-group">
                            <input type="radio" name="soundcloud_go" id="soundcloud_go-enabled" value="on" <?php echo ($music->config->soundcloud_go == 'on') ? 'checked': '';?>>
                            <label for="soundcloud_go-enabled">Enabled</label>
                            <input type="radio" name="soundcloud_go" id="soundcloud_go-disabled" value="off" <?php echo ($music->config->soundcloud_go == 'off') ? 'checked': '';?>>
                            <label for="soundcloud_go-disabled" class="m-l-20">Disabled</label>
                        </div>
                        <input type="hidden" name="hash_id" value="<?php echo createMainSession();?>">
                        <button type="submit" class="btn btn-primary m-t-15 waves-effect">Save</button>
                    </form>
                </div>
            </div>
        </div>

        <div class="col-lg-6 col-md-6">
            <div class="card">
                <div class="header">
                    <h2>Radio Stations Settings</h2>
                </div>
                <div class="body">
                    <div class="alert alert-success radiostation-settings-alert"></div>
                    <form class="radiostation-settings" method="POST">
                        <label for="radio_station_import">Radio Stations</label>
                        <div class="form-group">
                            <input type="radio" name="radio_station_import" id="radio_station_import-enabled" value="on" <?php echo ($music->config->radio_station_import == 'on') ? 'checked': '';?>>
                            <label for="radio_station_import-enabled">Enabled</label>
                            <input type="radio" name="radio_station_import" id="radio_station_import-disabled" value="off" <?php echo ($music->config->radio_station_import == 'off') ? 'checked': '';?>>
                            <label for="radio_station_import-disabled" class="m-l-20">Disabled</label>
                        </div>
                        <div class="clearfix"></div>
                        <div class="form-group form-float">
                            <div class="form-line">
                                <label for="rapidapi_key">Rapid API - Radio Stations</label>
                                <div>You can register api to get more than 30,000 radio stations.<br> To get started, <a href="https://rapidapi.com/auth?referral=/developer" target="_blank">Register Here</a>.</div>
                                <br>
                                <input type="text" id="rapidapi_key" name="rapidapi_key" class="form-control" value="{{CONFIG rapidapi_key}}">

                            </div>
                        </div>
                        <input type="hidden" name="hash_id" value="<?php echo createMainSession();?>">
                        <button type="submit" class="btn btn-primary m-t-15 waves-effect">Save</button>
                    </form>
                </div>
            </div>
        </div>

        <div class="col-lg-6 col-md-6">
            <div class="card">
                <div class="header">
                    <h2>Other Settings</h2>
                </div>
                <div class="body">
                    <div class="alert alert-success other-settings-alert"></div>
                    <form class="other-settings" method="POST">

                        <div class="form-group form-float">
                            <label for="max_upload">Wave Color</label>
                            <!--#f98f1d-->
                            <input type="color" class="form-control" name="waves_color" value="<?php echo $music->config->waves_color;?>" style="height: 60px;">
                        </div>

                        <div class="form-group form-float">
                            <label for="max_upload">Max Upload Size</label>
                            <select class="form-control show-tick" id="max_upload" name="max_upload" tabindex="-98">
                                <option value="2000000" <?php if($music->config->max_upload == '2000000'){ echo "selected";} ?>>2MB</option>
                                <option value="6000000" <?php if($music->config->max_upload == '6000000'){ echo "selected";} ?>>6MB</option>
                                <option value="12000000" <?php if($music->config->max_upload == '12000000'){ echo "selected";} ?>>12MB</option>
                                <option value="24000000" <?php if($music->config->max_upload == '24000000'){ echo "selected";} ?>>24MB</option>
                                <option value="48000000" <?php if($music->config->max_upload == '48000000'){ echo "selected";} ?>>48MB</option>
                                <option value="96000000" <?php if($music->config->max_upload == '96000000'){ echo "selected";} ?>>96MB</option>
                                <option value="256000000" <?php if($music->config->max_upload == '256000000'){ echo "selected";} ?>>256MB</option>
                                <option value="512000000" <?php if($music->config->max_upload == '512000000'){ echo "selected";} ?>>512MB</option>
                                <option value="1000000000" <?php if($music->config->max_upload == '1000000000'){ echo "selected";} ?>>1GB</option>
                                <option value="10000000000" <?php if($music->config->max_upload == '10000000000'){ echo "selected";} ?>>10GB</option>
                            </select>
                        </div>

                        <div class="form-group form-float">
                            <label for="user_max_upload">Max User Upload Size</label>
                            <select class="form-control show-tick" id="user_max_upload" name="user_max_upload" tabindex="-98">
                                <option value="2000000" <?php if($music->config->user_max_upload == '2000000'){ echo "selected";} ?>>2MB</option>
                                <option value="6000000" <?php if($music->config->user_max_upload == '6000000'){ echo "selected";} ?>>6MB</option>
                                <option value="12000000" <?php if($music->config->user_max_upload == '12000000'){ echo "selected";} ?>>12MB</option>
                                <option value="24000000" <?php if($music->config->user_max_upload == '24000000'){ echo "selected";} ?>>24MB</option>
                                <option value="48000000" <?php if($music->config->user_max_upload == '48000000'){ echo "selected";} ?>>48MB</option>
                                <option value="96000000" <?php if($music->config->user_max_upload == '96000000'){ echo "selected";} ?>>96MB</option>
                                <option value="256000000" <?php if($music->config->user_max_upload == '256000000'){ echo "selected";} ?>>256MB</option>
                                <option value="512000000" <?php if($music->config->user_max_upload == '512000000'){ echo "selected";} ?>>512MB</option>
                                <option value="1000000000" <?php if($music->config->user_max_upload == '1000000000'){ echo "selected";} ?>>1GB</option>
                                <option value="10000000000" <?php if($music->config->user_max_upload == '10000000000'){ echo "selected";} ?>>10GB</option>
                            </select>
                        </div>

                        <div class="form-group form-float">
                            <div class="form-line">
                                <input type="text" id="censored_words" name="censored_words" class="form-control" value="{{CONFIG censored_words}}">
                                <label class="form-label">Censored Words</label>
                            </div>
                        </div><br>
                        <label for="language">Default Language</label>
                        <select class="form-control show-tick" id="language" name="language">
                        	<option value="">-- Please select --</option>
                            <?php 
                            $langs__footer = $music->langs;
						    $langs_html    = '';
						    foreach ($langs__footer as $key => $language) {
						        $lang_explode = explode('.', $language);
						        $language     = $lang_explode[0];
						        $language_    = ucfirst($language);
						        $selected = ($music->config->language == $language) ? 'selected': '';
						        $langs_html .= '<option value="' . $language . '" ' . $selected . '>' . $language_ . '</option>';
						    }
						    echo $langs_html;
                            ?>
                        </select>
                        <div class="clearfix"></div>
                        <br>
                        <!-- <label for="verification_badge-enabled">Verification badge</label>
                        <div class="form-group">
                            <input type="radio" name="verification_badge" id="verification_badge-enabled" value="on" <?php echo ($music->config->verification_badge == 'on') ? 'checked': '';?>>
                            <label for="verification_badge-enabled">Enabled</label>
                            <input type="radio" name="verification_badge" id="verification_badge-disabled" value="off" <?php echo ($music->config->verification_badge == 'off') ? 'checked': '';?>>
                            <label for="verification_badge-disabled" class="m-l-20">Disabled</label>
                        </div> -->

                        <div class="clearfix"></div>
                        <br>
                        <label for="multiple_upload">Multiple song upload</label>
                        <div class="form-group">
                            <input type="radio" name="multiple_upload" id="multiple_upload-enabled" value="on" <?php echo ($music->config->multiple_upload == 'on') ? 'checked': '';?>>
                            <label for="multiple_upload-enabled">Enabled</label>
                            <input type="radio" name="multiple_upload" id="multiple_upload-disabled" value="off" <?php echo ($music->config->multiple_upload == 'off') ? 'checked': '';?>>
                            <label for="multiple_upload-disabled" class="m-l-20">Disabled</label>
                        </div>

                        <div class="clearfix"></div>
                        <br>
                        <label for="recaptcha">Recaptcha</label>
                        <div class="form-group">
                            <input type="radio" name="recaptcha" id="recaptcha-enabled" value="on" <?php echo ($music->config->recaptcha == 'on') ? 'checked': '';?>>
                            <label for="recaptcha-enabled">Enabled</label>
                            <input type="radio" name="recaptcha" id="recaptcha-disabled" value="off" <?php echo ($music->config->recaptcha == 'off') ? 'checked': '';?>>
                            <label for="recaptcha-disabled" class="m-l-20">Disabled</label>
                        </div>
                        <div class="form-group form-float">
                            <div class="form-line">
                                <input type="text" id="recaptcha_key" name="recaptcha_key" class="form-control" value="{{CONFIG recaptcha_key}}">
                                <label class="form-label">Recaptcha Key</label>
                            </div>
                        </div>
                        <div class="form-group form-float">
                            <div class="form-line">
                                <input type="text" id="google" name="google" class="form-control" value="{{CONFIG google}}">
                                <label class="form-label">Google Analytics ID</label>
                            </div>
                        </div>
                        <input type="hidden" name="hash_id" value="<?php echo createMainSession();?>">
                        <button type="submit" class="btn btn-primary m-t-15 waves-effect">Save</button>
                    </form>
                </div>
            </div>
        </div>
        <div class="clearfix"></div>
    </div>
    <!-- #END# Vertical Layout -->
<script>
$(function() {
    var form_site_settings = $('form.site-settings');
    var form_other_settings = $('form.other-settings');
    var form_soundcloud_settings = $('form.soundcloud-settings');
    var form_radiostation_settings = $('form.radiostation-settings');

    form_site_settings.ajaxForm({
        url: '{{CONFIG ajax_url}}/ap/save-settings',
        beforeSend: function() {
            form_site_settings.find('button').text("Please wait");
        },
        success: function(data) {
            if (data.status == 200) {
            	form_site_settings.find('button').text('Save');
            	$('.site-settings-alert').html('<i class="fa fa-check"></i> Settings updated successfully');
            	setTimeout(function () {
            		$('.site-settings-alert').empty();
            	}, 2000);
            }
        }
    });

    form_other_settings.ajaxForm({
        url: '{{CONFIG ajax_url}}/ap/save-settings',
        beforeSend: function() {
            form_other_settings.find('.waves-effect').text("Please wait");
        },
        success: function(data) {
            if (data.status == 200) {
                form_other_settings.find('.waves-effect').text('Save');
                $('.other-settings-alert').html('<i class="fa fa-check"></i> Settings updated successfully');
                setTimeout(function () {
                    $('.other-settings-alert').empty();
                }, 2000);
            }
        }
    });

    form_soundcloud_settings.ajaxForm({
        url: '{{CONFIG ajax_url}}/ap/save-settings',
        beforeSend: function() {
            form_soundcloud_settings.find('.waves-effect').text("Please wait");
        },
        success: function(data) {
            if (data.status == 200) {
                form_soundcloud_settings.find('.waves-effect').text('Save');
                $('.soundcloud-settings-alert').html('<i class="fa fa-check"></i> Settings updated successfully');
                setTimeout(function () {
                    $('.soundcloud-settings-alert').empty();
                }, 2000);
            }
        }
    });

    form_radiostation_settings.ajaxForm({
        url: '{{CONFIG ajax_url}}/ap/save-settings',
        beforeSend: function() {
            form_radiostation_settings.find('.waves-effect').text("Please wait");
        },
        success: function(data) {
            if (data.status == 200) {
                form_radiostation_settings.find('.waves-effect').text('Save');
                $('.radiostation-settings-alert').html('<i class="fa fa-check"></i> Settings updated successfully');
                setTimeout(function () {
                    $('.radiostation-settings-alert').empty();
                }, 2000);
            }
        }
    });


});
</script>