[% PROCESS settings/header.html %]

[% prefixes = [
	'plugin_musicinfo_centerA'
	'plugin_musicinfo_lineA'
	'plugin_musicinfo_overlayA'
	'plugin_musicinfo_centerB'
	'plugin_musicinfo_lineB'
	'plugin_musicinfo_overlayB'
	'plugin_musicinfo_center_dbl'
	'plugin_musicinfo_line_dbl'
	'plugin_musicinfo_overlay_dbl'	
];

postfixes = [ '' '_P' '_X' '_2X' '_PX' ];

updateIFrames = '';
%]


<script language="JavaScript" type="text/javascript">
<!--
	settings = new Array([% FOREACH prefix = prefixes;
								FOREACH postfix = postfixes;
									'"' _ prefix _ postfix _ '", ';
								END; 
							END; 
							'""' %]);
	
	function toggleSetting(whichSetting) {
		for(i=0; i<settings.length; i++) {
			if (settings[i] && document.getElementById('div_' + settings[i])) {
				document.getElementById('div_' + settings[i]).style.display = whichSetting == settings[i] ? "block" : "none";
			}
		}
	}
	
// -->
</script>


[% BLOCK screenElements %]
	<div class="prefDesc">
		<iframe id="frame[% postfix _ lines %]" width="425" height="55" scrolling="no" style="width: 425px; height: 55px; border: 2px solid gray; "></iframe>
	</div>

	[% script = "url = '" _ webroot _ "plugins/MusicInfoSCR/settings/preview.html?playerid=" _ playerid _ "&postfix=" _ postfix _ "&lines=" _ lines _ "&live=' + (document.getElementById('livepreview').checked ? '1' : '0') + '&';\n";
	FOREACH prefix = prefixes;
		item = prefix _ postfix;
		NEXT IF lines==1 && NOT prefix.match('_dbl');
		NEXT IF lines==2 && prefix.match('_dbl');
		%]
		<div id="div_[% item %]" style="display: none" class="prefDesc">
			<div>
				<label for="[% item %]" class="stdlabel">
					<span style="font-weight: bold;">[% "SETUP_PLUGIN_MUSICINFO_FORMAT_ELEMENT" | string%]</span> [% "SETUP_" _ prefix _ "_CHOOSE" | string %]
				</label>
			</div>
			<div>
				<select class="stdedit" name="[% item %]" id="[% item %]" onChange="updateFrame[% postfix _ lines %]();">
					[%- FOREACH formatString = formatStrings.keys.sort;
						NEXT IF prefix.match('(?s)_center') && formatString.match('(?s)PROGRESS'); %]
						<option [% IF prefs.$item == formatStrings.$formatString %]selected[% END %] value="[% formatStrings.$formatString %]">[% formatString %]</option>
					[%- END %]
				</select>
				[% IF fixedSize %]
					<input type="hidden" name="[% item %]_size" id="[% item %]_size" value="[% item2 = item _ "_size"; prefs.$item2; %]">
				[% ELSE %]
					<select class="stdedit" name="[% item %]_size" id="[% item %]_size" onChange="updateFrame[% postfix _ lines %]();">
						[%- FOREACH font = fontList.keys;
							NEXT IF prefix.match('_dbl') && NOT (font.match('(?s)(full|large|huge|threeline)'));
							NEXT IF (NOT prefix.match('_dbl')) && NOT (font.match('(?s)(standard|medium|light|small|threeline)'));
							item2 = item _ "_size" %]
							<option [% IF prefs.$item2 == font %]selected[% END %] value="[% font %]">[% font | getstring %]</option>
						[%- END %]
					</select>
				[% END %]
			</div>
			<input name="ok" type="button" class="stdclick" value="[% "PLUGIN_MUSICINFO_OK" | string %]" onClick="updateFrame[% postfix _ lines %](true);">
		</div>
		[%
			script = script _ "url += '" _ prefix _ "=' + document.getElementById('" _ item _ "').value + '&';\n";
			script = script _ "url += '" _ prefix _ "_size=' + document.getElementById('" _ item _ "_size').value + '&';\n";
		%]
	[% END %]
	<script language="JavaScript" type="text/javascript">
	<!--
		function updateFrame[% postfix _ lines %](hideLists) {
			[% script %]
			document.getElementById('frame[% postfix _ lines %]').src = url;
			if (hideLists) {
				toggleSetting('');
			}
		}
		
		updateFrame[% postfix _ lines %](true);
	// -->
	</script>
	[% updateIFrames = updateIFrames _ "updateFrame" _ postfix _ lines _ "(false);\n" %]
[% END %]


[% BLOCK addHiddenFields %]
	[% FOREACH prefix = prefixes %]
		[% item = prefix _ postfix %]
		<input type="hidden" id="[% item %]" name="[% item %]" value="[% prefs.$item %]">
	[% END %]
	[% item = 'plugin_musicinfo_size' _ postfix %]
	<input type="hidden" id="[% item %]" name="[% item %]" value="[% prefs.$item %]">
[% END %]


[% BLOCK toggleOption %]
	<div class="prefDesc">
		<label for="[% option %]" class="stdlabel">[% label | string %]</label>
		<select class="stdedit" name="[% option %]" id="[% option %]">
			<option [% IF prefs.$option %]selected[% END %] value="1">[% "ON" | string %]</option>
			<option [% IF NOT prefs.$option %]selected[% END %] value="0">[% "OFF" | string %]</option>
		</select>
	</div>
[% END %]


[% BLOCK toggleScreenElement %]
	<div class="prefDesc">
		<label for="[% item %]" class="stdlabel">[% "SETUP_" _ item | string %]</label>
		<select class="stdedit" name="[% item %]" id="[% item %]">
			[% FOREACH mode = {
								'0' => 'SETUP_PLUGIN_MUSICINFO_STD',
								'1' => 'SETUP_PLUGIN_MUSICINFO_LIKE_SCR',
								'2' => 'SETUP_PLUGIN_MUSICINFO_CUSTOM',
								} %]
				<option [% IF prefs.$item == mode.key %]selected[% END %] value="[% mode.key %]">[% mode.value | string %]</option>
			[% END %]
		</select>
	</div>
[% END %]


[%  # don't display font selector for non-graphical displays (SliMP3 & SB1)
	BLOCK toggleSizeSetting;
		sizeOption = "plugin_musicinfo_size" _ postfix;
		IF isaSqueezebox2;
			PROCESS toggleOption option=sizeOption label="SETUP_PLUGIN_MUSICINFO_SIZE";

			IF prefs.$sizeOption;
				lines=2;
				'<div class="prefDesc">';
					"SETUP_PLUGIN_MUSICINFO_SIZE1" | string;
				'</div>';
			END;
		ELSE;
			prefs.$sizeOption = 1;
			lines=2;
		END;
	END;			
%]


[% WRAPPER settingSection;
	IF isaSqueezebox2;
		options = [ 'plugin_musicinfo_stream_fallback', 'plugin_musicinfo_disable_visualizer', 'plugin_musicinfo_jump_back' ];
	ELSE;
		options = [ 'plugin_musicinfo_stream_fallback', 'plugin_musicinfo_jump_back' ];
	END;

	IF canAlternativeVolume;
		options.unshift('plugin_musicinfo_alt_volume');
	END;

	FOREACH option = options;
		title = "SETUP_" _ option | string;
		desc = "SETUP_" _ option _ "_DESC" | string;
		WRAPPER settingGroup;
			PROCESS toggleOption label = "SETUP_" _ option;
		END;
	END;
END %]

[% WRAPPER settingSection;
	WRAPPER settingGroup title="SETUP_PLUGIN_MUSICINFO_DISPLAY1" desc="" %]
		<div class="prefDesc">[% "SETUP_PLUGIN_MUSICINFO_DISPLAY1_DESC" | string %]</div>
	[% END;
	
	WRAPPER settingGroup title="" desc="SETUP_PLUGIN_MUSICINFO_PREVIEW_DESC" %]
		<div class="prefDesc"><input type="checkbox" [% livepreview ? 'checked' : '' %] name="livepreview" id="livepreview" value="1" onChange="updateIFrames()">[% "SETUP_PLUGIN_MUSICINFO_PREVIEW" | string %]</input></div>
	
		[% PROCESS toggleSizeSetting postfix=''; fixedSize=prefs.plugin_musicinfo_size; %]
		[% PROCESS screenElements postfix='' %]

		[% IF prefs.plugin_musicinfo_size %]
			<div class="prefDesc">[% "SETUP_PLUGIN_MUSICINFO_SIZE2" | string %]</div>
			[% PROCESS screenElements postfix='' lines=1; lines=2; %] 
		[% END %]
	[% END %]

	[% WRAPPER settingGroup title="SETUP_PLUGIN_MUSICINFO_SHOW_ICONS_CHOOSE" desc="" %]
		<select class="stdedit" name="plugin_musicinfo_show_icons" id="plugin_musicinfo_show_icons">
			<option value="">[% "PLUGIN_MUSICINFO_DONT_SHOW" | string %]</option>
			<option value="TOPLEFT" [% IF prefs.plugin_musicinfo_show_icons == "TOPLEFT" %]selected[% END %]>[% "SETUP_PLUGIN_MUSICINFO_LINEA_CHOOSE" | string %]</option>
			<option value="TOPLEFT2" [% IF prefs.plugin_musicinfo_show_icons == "TOPLEFT2" %]selected[% END %]>[% "SETUP_PLUGIN_MUSICINFO_LINEA_CHOOSE" | string %] [% "PLUGIN_MUSICINFO_ICON_ALWAYS" | string %]</option>
			<option value="TOPRIGHT" [% IF prefs.plugin_musicinfo_show_icons == "TOPRIGHT" %]selected[% END %]>[% "SETUP_PLUGIN_MUSICINFO_OVERLAYA_CHOOSE" | string %]</option>
			<option value="TOPRIGHT2" [% IF prefs.plugin_musicinfo_show_icons == "TOPRIGHT2" %]selected[% END %]>[% "SETUP_PLUGIN_MUSICINFO_OVERLAYA_CHOOSE" | string %] [% "PLUGIN_MUSICINFO_ICON_ALWAYS" | string %]</option>
		</select>
	[% END %]

	[% WRAPPER settingGroup title="SETUP_PLUGIN_MUSICINFO_SHOW_SLEEP_CHOOSE" desc="" %]
		<div>
			<select class="stdedit" name="plugin_musicinfo_show_sleep" id="plugin_musicinfo_show_sleep">
				<option value="">[% "PLUGIN_MUSICINFO_DONT_SHOW" | string %]</option>
				<option value="TOPLEFT" [% IF prefs.plugin_musicinfo_show_sleep == "TOPLEFT" %]selected[% END %]>[% "SETUP_PLUGIN_MUSICINFO_LINEA_CHOOSE" | string %]</option>
				<option value="TOPLEFT2" [% IF prefs.plugin_musicinfo_show_sleep == "TOPLEFT2" %]selected[% END %]>[% "SETUP_PLUGIN_MUSICINFO_LINEA_CHOOSE" | string %] [% "PLUGIN_MUSICINFO_ICON_SLEEP_ANIMATED" | string %]</option>
				<option value="TOPRIGHT" [% IF prefs.plugin_musicinfo_show_sleep == "TOPRIGHT" %]selected[% END %]>[% "SETUP_PLUGIN_MUSICINFO_OVERLAYA_CHOOSE" | string %]</option>
				<option value="TOPRIGHT2" [% IF prefs.plugin_musicinfo_show_sleep == "TOPRIGHT2" %]selected[% END %]>[% "SETUP_PLUGIN_MUSICINFO_OVERLAYA_CHOOSE" | string %] [% "PLUGIN_MUSICINFO_ICON_SLEEP_ANIMATED" | string %]</option>
			</select>
		</div>
	[% END %]	
	
	[% IF hasDualscreen;
		WRAPPER settingGroup title="SETUP_PLUGIN_MUSICINFO_DISPLAY2" desc="SETUP_PLUGIN_MUSICINFO_DISPLAY2_DESC";
			PROCESS screenElements postfix='_X'; 

			IF prefs.plugin_musicinfo_size;
				PROCESS screenElements postfix='_X' lines=1; lines=2;
			END;
		END;
	END;
END %]

[% WRAPPER setting title="SETUP_PLUGIN_MUSICINFO_PLAYLIST" desc="SETUP_PLUGIN_MUSICINFO_PLAYLIST_DESC";
	PROCESS toggleScreenElement item='plugin_musicinfo_playlist';
	IF prefs.plugin_musicinfo_playlist == '2';
		PROCESS toggleSizeSetting postfix='_P'; fixedSize=prefs.plugin_musicinfo_size_P;
		PROCESS screenElements postfix='_P';

		IF prefs.plugin_musicinfo_size_P;
			PROCESS screenElements postfix='_P' lines=1; lines=2;
		END;
	ELSE;
		PROCESS addHiddenFields postfix='_P';
	END;

	IF hasDualscreen;
		IF prefs.plugin_musicinfo_playlist == '2' %]
			<div class="groupHead">[% "SETUP_PLUGIN_MUSICINFO_PLAYLIST2" | string | upper %]</div>
			[% PROCESS screenElements postfix='_PX';

			IF prefs.plugin_musicinfo_size_P;
				PROCESS screenElements postfix='_PX' lines=1; lines=2;
			END;
		ELSE;
			PROCESS addHiddenFields postfix='_PX';
		END;
	END;
END %]


[% IF hasDualscreen;
	WRAPPER setting title="SETUP_PLUGIN_MUSICINFO_EXTENDED" desc="SETUP_PLUGIN_MUSICINFO_EXTENDED_DESC";
		PROCESS toggleScreenElement item='plugin_musicinfo_extended';
		IF prefs.plugin_musicinfo_extended == '2';
			PROCESS toggleSizeSetting postfix='_2X'; 
			fixedSize=prefs.plugin_musicinfo_size_2X;
			PROCESS screenElements postfix='_2X';
	
			IF prefs.plugin_musicinfo_size_2X;
				PROCESS screenElements postfix='_2X' lines=1; lines=2;
			END;
		ELSE;
			PROCESS addHiddenFields postfix='_2X';
		END;
	END;
END %]


<script language="JavaScript" type="text/javascript">
<!--
	function updateIFrames() {
		[% updateIFrames %]
	}

	document.getElementById('jsWarning').style.display = 'none';
// -->
</script>

[% WRAPPER setting title="SETUP_PLUGIN_MUSICINFO_RESET" desc="SETUP_PLUGIN_MUSICINFO_RESET_DESC" %]
	<div class="prefDesc"><input name="resetSettings" type="checkbox" value="1">[% "SETUP_PLUGIN_MUSICINFO_RESET" | string %]</input></div>
[% END %]

[% PROCESS settings/footer.html %]