#import sickbeard
#from sickbeard import subtitles
#from sickbeard.helpers import anon_url
##
#set global $title = 'Config - Subtitles'
#set global $header = 'Subtitles'
#set global $sbPath = '../..'
#set global $topmenu = 'config'
##
#import os.path
#include $os.path.join($sickbeard.PROG_DIR, 'gui/slick/interfaces/default/inc_top.tmpl')

<script type="text/javascript" src="$sbRoot/js/configSubtitles.js?$sbPID"></script>
<script type="text/javascript" src="$sbRoot/js/config.js"></script>
<script type="text/javascript" src="$sbRoot/js/lib/jquery.tokeninput.js"></script>

<script type="text/javascript">
  	\$(document).ready(function() {
		\$("#subtitles_languages").tokenInput(
				[
	                <%=",\r\n".join("{id: \"" + lang[2] + "\", name: \"" + lang[3] + "\"}" for lang in subtitles.subtitleLanguageFilter())%>
	            ],
	            {
					method: "POST",
	            	hintText: "Write to search a language and select it",
					preventDuplicates: true,
	            	prePopulate:

		            		[
		            			<%=
		            					",\r\n".join("{id: \"" + lang + "\", name: \"" + subtitles.getLanguageName(lang) + "\"}" for lang in sickbeard.SUBTITLES_LANGUAGES) if sickbeard.SUBTITLES_LANGUAGES != '' else ''
		            			%>
		            		]
	            }
            );
	});
</script>

#if $varExists('header')
	<h1 class="header">$header</h1>
#else
	<h1 class="title">$title</h1>
#end if

<div id="config">
<div id="config-content">

<form id="configForm" action="saveSubtitles" method="post">

            <div id="config-components">
                <ul>
                	<li><a href="#core-component-group4">Subtitles Search</a></li>
                	<li><a href="#core-component-group2">Subtitles Plugin</a></li>
                </ul>

                <div id="core-component-group4" class="component-group">

                    <div class="component-group-desc">
                        <h3>Subtitles Search</h3>
                        <p>Settings that dictate how SickGear handles subtitles search results.</p>
                    </div>

					<fieldset class="component-group-list">
			            <div class="field-pair">
                            <input type="checkbox" class="enabler" #if $sickbeard.USE_SUBTITLES then " checked=\"checked\"" else ""# id="use_subtitles" name="use_subtitles">
                            <label for="use_subtitles" class="clearfix">
                                <span class="component-title">Search Subtitles</span>
                            </label>
                        </div>
                        <div id="content_use_subtitles">
	                        	<div class="field-pair">
		                            <label class="nocheck">
		                                <span class="component-title">Subtitle Languages</span>
		                                <span class="component-desc"><input type="text" id="subtitles_languages" name="subtitles_languages" /></span>
		                            </label>
		                        </div>
                        		<div class="field-pair">
	                        		<label class="nocheck">
		                                <span class="component-title">Subtitle Directory</span>
		                                <input type="text" value="$sickbeard.SUBTITLES_DIR" id="subtitles_dir" name="subtitles_dir" class="form-control input-sm input350">
		                            </label>
	                            	<label class="nocheck">
	    	                            	<span class="component-title">&nbsp;</span>
			                                <span class="component-desc">The directory where SickGear should store your <i>Subtitles</i> files.</span>
	          	                	</label>
	                            	<label class="nocheck">
	    	                            	<span class="component-title">&nbsp;</span>
			                                <span class="component-desc"><b>NOTE:</b> Leave empty if you want store subtitle in episode path.</span>
	          	                	</label>
                        		</div>
	                            <div class="field-pair">
	                            	<label class="nocheck">
	                                	<span class="component-title">Subtitle Find Frequency</span>
	                                    <input type="number" name="subtitles_finder_frequency" value="$sickbeard.SUBTITLES_FINDER_FREQUENCY" hours="1" class="form-control input-sm input75" />
	                                </label>
	                                <label class="nocheck">
	                                	<span class="component-title">&nbsp;</span>
	                                    <span class="component-desc">Time in hours between scans (hours. 1)</span>
	                                </label>
	                            </div>
		                        <div class="field-pair">
		                            <input type="checkbox" name="subtitles_history" id="subtitles_history" #if $sickbeard.SUBTITLES_HISTORY then " checked=\"checked\"" else ""#/>
		                            <label class="clearfix" for="subtitles_history">
		                                <span class="component-title">Subtitles History</span>
		                                <span class="component-desc">Log downloaded Subtitle on History page?</span>
		                            </label>
		                        </div>
	                    <br/><input type="submit" class="btn config_submitter" value="Save Changes" /><br/>
                        </div>
                    </fieldset>
                </div><!-- /component-group1 //-->

                <div id="core-component-group2" class="component-group">

                    <div class="component-group-desc">
                        <h3>Subtitle Plugins</h3>
                        <p>Check off and drag the plugins into the order you want them to be used.</p>
                        <p class="note">At least one plugin is required.</p>
                        <p class="note"><span style="font-size: 16px;">*</span> Web-scraping plugin</p>
                    </div>

                    <fieldset class="component-group-list" style="margin-left: 50px; margin-top:36px">
                        <ul id="service_order_list">
                        #for $curService in $sickbeard.subtitles.sortedServiceList():
                            #set $curName = $curService.id
                          <li class="ui-state-default" id="$curName">
                            <input type="checkbox" id="enable_$curName" class="service_enabler" #if $curService.enabled then "checked=\"checked\"" else ""#/>
                            #set $provider_url = $curService.url
                            <a href="<%= anon_url(provider_url) %>" class="imgLink" target="_new">
                                <img src="$sbRoot/images/subtitles/$curService.image" alt="$curService.name" title="$curService.name" width="16" height="16" style="vertical-align:middle;"/>
                            </a>
                            <span style="vertical-align:middle;">$curService.name.capitalize()</span>
                            #if not $curService.api_based then "*" else ""#
                            <span class="ui-icon ui-icon-arrowthick-2-n-s pull-right" style="vertical-align:middle;"></span>
                          </li>
                        #end for
                        </ul>
                        <input type="hidden" name="service_order" id="service_order" value="<%=" ".join([x.get('id')+':'+str(int(x.get('enabled'))) for x in sickbeard.subtitles.sortedServiceList()])%>"/>
                        
                        <br/><input type="submit" class="btn config_submitter" value="Save Changes" /><br/>
                    </fieldset>
                </div><!-- /component-group2 //-->

	            <br/><input type="submit" class="btn config_submitter" value="Save Changes" /><br/>

            </div><!-- /config-components //-->

</form>
</div>
</div>

<div class="clearfix"></div>
<script type="text/javascript" charset="utf-8">
<!--
jQuery('#config-components').tabs();
jQuery('#subtitles_dir').fileBrowser({title: 'Select Subtitles Download Directory'});
//-->
</script>

#include $os.path.join($sickbeard.PROG_DIR, 'gui/slick/interfaces/default/inc_bottom.tmpl')