||define||one_pix||data:image/gif;base64,R0lGODlhAQABAJAAAP///wAAACH5BAUQAAAALAAAAAABAAEAAAICBAEAOw==||

function alt_ui_prep()
{
	class_add(dge('page_width'),'semi_hidden');
	dge('folders').id = 'foldersX';
	dge('messages_list').id = 'messages_listX';
	dge('message_preview').id = 'message_previewX';
	var el = dge('compose_panel');
	if(el) el.id = 'compose_panelX';
	var el = dge('message_panel');
	if(el) el.id = 'message_panelX';
	var el = dge('list_extra');
	if(el) el.id = 'list_extraX';
	var el = dge('app_mnu');
	if(el) el.id = 'app_mnuX';

	var el = dge('alt_ui');
	class_remove(el,'hidden');
	return el;
}
function alt_ui_undo()
{
	if(!sw.altui) return;

	class_remove(dge('page_width'),'semi_hidden');
	dge('foldersX').id = 'folders';
	dge('messages_listX').id = 'messages_list';
	dge('message_previewX').id = 'message_preview';
	var el = dge('compose_panelX');
	if(el) el.id = 'compose_panel';
	var el = dge('message_panelX');
	if(el) el.id = 'message_panel';
	var el = dge('list_extraX');
	if(el) el.id = 'list_extra';
	var el = dge('app_mnuX');
	if(el) el.id = 'app_mnu';

	var el = dge('alt_ui');
	el.innerHTML = '';
	class_add(el,'hidden');

	sw.altui = U;

	assign_dynamic_css('newlook_altui_css','');

	return el;
}

function std_ui()
{
	do_toggle_theme();
	//newlook_layout_pick('standard');
}
var nclick=0;
var old_mode=0;
function mobile_click(mode)
{
	nclick++;
	var v1=dge('v1');
	var v2=dge('v2');
	var v3=dge('v3');

	var el = dge('messages_list');
	if(el==U){
		v1.innerHTML='||html_begin()||\
			<div class="back_button" onclick="mobile_click(1);" ><img src="||www_base||shared/img/xx/altui_close.png?||vz||" style="width:36px;height:36px;margin-top:12px;margin-left:9px;"></div>
#			<div class="back_button" onclick="mobile_click(1);">L1 DEEPER</div>
			<a href="#" onclick="std_ui()">Switch UI</a>
			<div id="folders" style="background-color:white;">
			END one
			||html_end()||';
		v2.innerHTML='||html_begin()||\
			<div style="background-color:#A0BFE8;"><div class="back_button" onclick="mobile_click(1);" ><img src="||www_base||shared/img/xx/altui_burger.png?||vz||" style="width:36px;height:36px;margin-top:12px;margin-left:9px;"></div>
#			<div class="back_button" onclick="mobile_click(3);">L2 DEEPER</div>
			 <div class="swish_edit_outer">
			  <input class="swish_edit_inner no_round" type=text id="search_input" value="" style="font-size:24px;width:220px;height:20px;" onfocus="if(!this.valid)search_field_set(\'\')" onblur="if(this.value.length==0) search_init(undefined,pref.search_type)" onkeydown="allow_scroll_arrow(event)" onkeyup="search_keyup(event);stopBubble(event)" >
			 </div></div>
			<div id="list_extra" class="hidden"></div>
			<div id="messages_list" style="background-color:white; ||iftrue(alt_scroll)||overflow-y:scroll;||endif||"
				onmousedown="return msg_list_mousedown(event);" onmouseup="return msg_list_mouseup(event);" onclick="return msg_list_click(event);" ondblclick="msg_list_dblclick(event)" oncontextmenu="return false;"
		  		ontouchstart="touchStart(event);" ontouchmove="touchMove(event);" ontouchend="touchEnd(event);" ontouchcancel="touchCancel(event);" >
			END two
			||html_end()||';
		v3.innerHTML='||html_begin()||\
			<div style="background-color:#A0BFE8;"><div class="back_button" onclick="mobile_click(2);"><img src="||www_base||shared/img/xx/altui_back.png?||vz||" style="width:36px;height:36px;margin-top:12px;margin-left:9px;"></div>
		 	<div style="float:right">
			<div class="back_button" onclick="alert(\'reply\');"><img src="||www_base||shared/img/altui_reply.png?||vz||" style="width:36px;height:36px;margin-top:12px;margin-left:0px;margin-right:0px;"></div>
			<div class="back_button" onclick="alert(\'fwd\');"><img src="||www_base||shared/img/altui_forward.png?||vz||" style="width:36px;height:36px;margin-top:12px;margin-left:0px;margin-right:0px;"></div>
			<div class="back_button" onclick="alert(\'search by sender, search by sub, edit subject, other??\');"><img src="||www_base||shared/img/altui_more.png?||vz||" style="width:36px;height:36px;margin-top:12px;margin-left:0px;margin-right:0px;"></div>
			</div></div>
			<div id="message_preview" style="background-color:white;"></div>
			||html_end()||';
	}

	var au = dge('alt_ui');

	if (mode==1 && old_mode==1) mode=2;
	if (mode==1){

		v2.style.cssText='transform: translate3d(80%, 0px, 0px); transition: transform 400ms;';
#		dge('messages_list').style.height='100px';
#		dge('messages_list').style.overflow='none';

	}else if (mode==2){


		v2.style.cssText='transform: translate3d(0px, 0px, 0px); transition: transform 400ms;';
		class_remove(v1,'hidden')
		class_remove(v2,'hidden')
		class_add(v3,'hidden')
		class_remove(v3,'msg_animate_in');
||iftrue(alt_scroll)||
		dge('messages_list').style.height='400px';
||endif||
	}else if (mode==3){
		class_add(v1,'hidden')
		class_add(v2,'hidden')
		class_remove(v3,'hidden')
		class_add(v3,'msg_animate_in');
	}
	old_mode = mode;
}

#colour manipulation in JS

var count=0;
var subtle_colours_text=['seascape','landscape','red','green','blue'];
var subtle_colours=['#6699c2','#93876c','#9f6060','#609f60','#60609f'];
var cur_col_hsl;
var animation_timer;
var animation_type=-1;
var animation_delta;
var animation_t=0;

function squote(txt)
{
	return "'"+txt+"'";
}
function dp(val,dp)
{
	return val.toFixed(dp);
/*
	var multiplier = Math.pow(10,dp);
	val = val*multiplier;
	val = Math.round(val);
	val = val/multiplier;
	return val;
*/
}
var colorsave_timer;
function record_col(col)
{
	cur_col_hsl=col;
	if(pref.newlook_coloring=='anycolor'){
		newlook_modules.anycolor.record_col(cur_col_hsl);
	}else if(pref.newlook_coloring=='dynamic'){
		newlook_modules.dynamic.record_col(cur_col_hsl);
	}
	clearTimeout(colorsave_timer);
	colorsave_timer = setTimeout( function(){
		ajax_pref_save('pref_newlook_anycolor='+hsl_out(cur_col_hsl));
	}, 500);
}
function pick_col(txt)
{
	var col = rgb2hsl(txt2col(txt));
	record_col(col);
	newlook_apply_coloring(col);
}
function pick_hue(val)
{
	stop_animate_ifmatch(hsl_h);
	var col = cur_col_hsl;
	col[hsl_h] = val;
	record_col(col);
	newlook_apply_coloring(col);
}
function pick_sat(pct)
{
	stop_animate_ifmatch(hsl_s);
	var col = cur_col_hsl;
	col[hsl_s] = pct/100;
	record_col(col);
	newlook_apply_coloring(col);
}
function pick_bri(pct)
{
	stop_animate_ifmatch(hsl_b);
	var col = cur_col_hsl;
	col[hsl_b] = pct/100;
	record_col(col);
	newlook_apply_coloring(col);
}

function rotate_colors()
{
	var col=cur_col_hsl;
	switch(animation_type){
	  case hsl_h:{
	    var val = col[hsl_h] + animation_delta;
		if (val > 1) val=0;
		col[hsl_h] = val;
	  } break;
	  case hsl_s:{
	    var val = col[hsl_s];
		if (val+animation_delta>1 || val+animation_delta<0) animation_delta = -animation_delta;
		val += animation_delta;
		col[hsl_s] = val;
	  } break;
	  case hsl_b:{
	    var val = col[hsl_b];
		if (val+animation_delta>1 || val+animation_delta<0) animation_delta = -animation_delta;
		val += animation_delta;
		col[hsl_b] = val;
	  } break;
	  case hsl_a:{
		var val = animation_t;
		if (val+animation_delta>1 || val+animation_delta<0) animation_delta = -animation_delta;
	  	val+=animation_delta;
	  	col = hsl_lerp(anim_c1, val, anim_c2);
	  	animation_t=val;
	  }break;
	}
	record_col(col);
	newlook_apply_coloring(col);
}

function animation_timer_reset()
{
	clearTimeout(animation_timer);
	animation_timer = U;
}

function pick_animate(type)
{
	if(animation_timer!=U){
		animation_timer_reset()
#		clearTimeout(animation_timer);
#		animation_timer = U;
		if(type==animation_type){
			animation_type=-1;
			newlook_apply_coloring(cur_col_hsl);
#			return;
		}
	}

	animation_type=type;
	animation_delta = 0.005;
	update_ani_timer();
}
function update_ani_timer()
{
	if(animation_timer) {
		clearInterval(animation_timer);
		animation_timer = U;
	}
	animation_timer = setInterval(rotate_colors, 200/animation_speed);
}
function stop_animate_ifmatch(type)
{
	if(animation_timer==U) return;
	if(animation_type!=type) return;
	pick_animate(animation_type);
}

var anim_c1;
var anim_c2;
var animation_speed = 4;
function pick_scheme(type)
{
	if (type==1){
		anim_c1 = rgb2hsl(txt2col('#6699c2'));
		anim_c2 = rgb2hsl(txt2col('#93876c'));
	} else if (type==2){
		anim_c1 = rgb2hsl(rgb_init(255,0,0));
		anim_c2 = rgb2hsl(rgb_init(0,255,0));
	}

#	anim_c1 = rgb2hsl(txt2col('#d64f0a'));
#	anim_c2 = rgb2hsl(txt2col('#f0a70c'));
#	anim_c3 = rgb2hsl(txt2col('#6c7fc3'));
#	anim_c4 = rgb2hsl(txt2col('#64acde'));
	pick_animate(hsl_a);
}

function pick_scheme_speed(type)
{
	if (type==1){
		animation_speed=1;
	}else if (type==2){
		animation_speed=4;
	}else if (type==3){
		animation_speed=20;
	}else if (type==4){
		animation_speed=50;
	}
	update_ani_timer();
}


function pick_std_sb()
{
	newlook_apply_coloring(hsl_init(cur_col_hsl[hsl_h],0.2,0.5));
}

var old_colours = [
	{desc:"-- GENERAL LOOK"},
	{desc:"top_blue_gradient", col:[192,216,255,1]},
	{desc:"top_blue_bg", col:[160,191,232,1]},
	{desc:"menu_gradient", col:[212,236,250,1]},
	{desc:"- to", col:[157,202,234,1]},
	{desc:"footer", col:[188,216,253,1]},
	{desc:"borders", col:[90,130,184,1]},
	{desc:"bg_gradient", col:[191,216,255,1]},
	{desc:"- to", col:[89,126,178,1]},
	{desc:"app_menu_blue_grad", col:[202,229,248]},
	{desc:"- to", col:[147,196,231,1]},
	{desc:"-- MESSAGES"},
	{desc:"read_msg_header", col:[227,239,255,1]},
	{desc:"compose_msg_header", col:[189,222,244,1]},
	{desc:"contact_picker_top", col:[218,240,253,1]},
	{desc:"contact_picker_surround", col:[188,216,253]},
	{desc:"autocomplete_bg", col:[218,240,253,1]},
	{desc:"autocomplete_select", col:[163,206,236,1]},
	{desc:"-- GRAYSCALE"},
	{desc:"accounts_gray", col:[230,230,230,1]},
	{desc:"accounts_offwhite", col:[247,247,247,1]},
	{desc:"select_message_hover", col:[247,247,247,1]},
	{desc:"list_grouping", col:[187,187,187,1]},
	{desc:"-- SELECTION"},
	{desc:"select_folder", col:[214,238,233,1]},
	{desc:"select_message", col:[255,248,206,1]},
	{desc:"main_menu_orange_grad", col:[255,233,216,1]},
	{desc:"- to", col:[250,199,152,1]},
	{desc:"-- SPECIAL HIGHLIGHTS"},
	{desc:"status_ok", col:[144,238,144,1]},
	{desc:"status_info", col:[237,237,145,1]},
	{desc:"status_warn", col:[237,178,188,1]},
	{desc:"msg_spam_info", col:[218,245,218,1]},
	{desc:"msg_image_warn", col:[255,192,203,1]},
	{desc:"select_all", col:[255,255,128,1]},
	{desc:"msg_deferred_info", col:[240,219,20,1]},
];

function show_rgb(col)
{
	return 'r='+dp(col[rgb_r],0) + ' g='+dp(col[rgb_g],0) + ' b='+dp(col[rgb_b],0);
}
function show_hsl(col)
{
	return 'h='+dp(col[hsl_h],3) + ' s='+dp(col[hsl_s],3) + ' l='+dp(col[hsl_b],3);
}
function show_table_rgb(col)
{
	return '<td>' + dp(col[rgb_r],0) + '</td><td>' + dp(col[rgb_g],0) + '</td><td>' + dp(col[rgb_b],0) + '</td>';
}
function show_table_hsl(col)
{
	return '<td>' + dp(col[hsl_h],3) + '</td><td>' + dp(col[hsl_s],3) + '</td><td>' + dp(col[hsl_b],3) + '</td>';
}
function theme_colours_old_tab()
{
	var base_hsl=rgb2hsl(old_colours[1].col);
	var html='';
	html+=show_colour_header();
	for(var i=0; i<old_colours.length; i++){
		var o=old_colours[i];
		html+=show_colour_row(o, base_hsl);
	}
	return html;
}
function show_colour_header()
{
	var html='';
	html+='<table class="dbg_table">';
	html+='<td></td>';
	html+='<td>r</td><td>g</td><td>b</td>';
	html+='<td></td>';
	html+='<td>h</td><td>s</td><td>l</td>';
	html+='<td></td>';
	html+='<td>dh</td><td>ds</td></td><td>db</td>';
	return html;
}
function show_colour_row(o, base_hsl)
{
	var desc = o.desc;
	var col = o.col;
	var html = '<tr>';
	if(desc.indexOf('--')==0){
		html+='<td>'+desc+'</td>';
	}else{
		var c1=col;
		var c2=rgb2hsl(c1);
		var c3=[];
		var hsl_meaningless = false;
		if((c1[rgb_r]==c1[rgb_g]) && (c1[rgb_g]==c1[rgb_b])){
			hsl_meaningless = true;
		}
		if(hsl_meaningless){
			c3=rgb_init(255,255,255);
		}else{
			c3=hsl2rgb(hsl_init(c2[hsl_h], 1, 0.5));
		}
		var gradient_end = desc=='- to';
		html+='<td>'+(gradient_end ? '&nbsp;&nbsp;&nbsp;&nbsp;' : '')+desc+'</td>'
		html+=show_table_rgb(c1);
		html+='<td><div style="width:40px;height:20px;background:'+col2txt(c1)+';'+(gradient_end ? 'margin-left:20px;' : '')+'"></div></td>';
		html+=show_table_hsl(c2);
		html+='<td><div style="width:30px;height:10px;background:'+col2txt(c3)+';"></div></td>';
		if(hsl_meaningless){
			html+='<td>&nbsp;</td><td>&nbsp;</td>';
		}else{
			html+='<td>'+dp(c2[hsl_h]-base_hsl[hsl_h],2)+'</td><td>'+dp(c2[hsl_s]-base_hsl[hsl_s],2)+'</td>';
		}
		html+='<td>'+dp(c2[hsl_b]-base_hsl[hsl_b],2)+'</td>';
	}
	html+='</tr>';
	return html;
}


function theme_colours_new_tab()
{
	var html='';

	html+='<p>Colour:';
	for(var i=0;i<subtle_colours.length;i++){
		if(i!=0) html+=' | ';
		html+=' <a href="#" onclick="pick_col('+squote(subtle_colours[i])+')">'+subtle_colours_text[i]+'</a>';
	}
	html+='<p>---';

	html+='<p>Hue = <span id="custom_hsl_h"></span> [<span id="custom_hsv_h"></span>]';
	html+=' <a href="#" onclick="pick_animate(hsl_h)">animate</a> [';
	var steps=16, calc=0;
	for(var i=0;i<=steps;i++){
		calc = Math.round(i*100/steps);
		html+=' <a href="#" onclick="pick_hue('+(calc/100)+')">'+calc+'</a>';
	}
	html+=']';
	html+=' | <a href="#" onclick="specific_hue()">set</a>';

	html+='<p>Saturation = <span id="custom_hsl_s"></span> [<span id="custom_hsv_s"></span>]';
	html+=' <a href="#" onclick="pick_animate(hsl_s)">animate</a> [';
	for(var i=0;i<=steps;i++){
		calc = Math.round(i*100/steps);
		html+=' <a href="#" onclick="pick_sat('+calc+')">'+calc+'</a>';
	}
	html+=']';
	html+=' | <a href="#" onclick="specific_saturation()">set</a>';

	html+='<p>Lightness = <span id="custom_hsl_b"></span> [<span id="custom_hsv_v"></span>]';
	html+=' <a href="#" onclick="pick_animate(hsl_b)">animate</a> [';
	for(var i=0;i<=steps;i++){
		calc = Math.round(i*100/steps);
		html+=' <a href="#" onclick="pick_bri('+calc+')">'+calc+'</a>';
	}
	html+=']';
	html+=' | <a href="#" onclick="specific_brightness()">set</a>';

	html+='<p>RGB = <span id="custom_rgb"></span> | saturation/lightness: <a href="#" onclick="pick_std_sb()">standard</a> | <a href="#" onclick="specific_color()">set</a>';

	html+='<p>Scheme = <a href="#" onclick="pick_scheme(1)">scheme1</a>';


	html+='<p><canvas id="palette_pane1" class="color-palette" width="584" height="100"></canvas>';
	html+='<p><canvas id="palette_pane2" class="color-palette" width="584" height="26"></canvas>';

	html+='<table id="modern_colours"></table>'
	return html;
}

function modern_colours_populate(cs)
{
	var html='';
	html+=show_colour_header();
	html+=show_colour_row({desc:"-- GENERAL LOOK"}, cur_col_hsl);
	html+=show_colour_row({desc:'radial_bg', col:hsl2rgb(cs.bg_center)}, cur_col_hsl);
	html+=show_colour_row({desc:'- to ', col:hsl2rgb(cs.bg_outer)}, cur_col_hsl);
	html+=show_colour_row({desc:'border', col:hsl2rgb(cs.border)}, cur_col_hsl);
	html+=show_colour_row({desc:'appmenu_btn', col:hsl2rgb(cs.appmenu_dark)}, cur_col_hsl);
	html+=show_colour_row({desc:"-- MESSAGES"}, cur_col_hsl);
	html+=show_colour_row({desc:'read_msg_header', col:hsl2rgb(cs.msghdr_reading)}, cur_col_hsl);
	html+=show_colour_row({desc:'compose_msg_header', col:hsl2rgb(cs.msghdr_compose)}, cur_col_hsl);
	html+=show_colour_row({desc:"-- SELECTION"}, cur_col_hsl);

/*
	cs.ac_sel = hsl_out(hsl_modulate(col,0,+0.1,+0.7));
	cs.ac_bg = hsl_out(hsl_modulate(col,0,+0.1,+0.9));
	cs.ac_panel = hsl_out(hsl_modulate(col,0,+0.1,+0.7));
*/
	return html;
}


function switch_dbgtable(scheme)
{
	var el=dge('theme_panel');
	remove_node(el);
	newlook_picker_show(scheme);
	newlook_apply_coloring(cur_col_hsl);
}


function select_this_element(el)
{
	if(!el) return;
	var parent = el.parentNode;
	for(i=0;i<parent.childNodes.length;i++){
		class_remove(parent.childNodes[i],'sel');
	}
	class_add(el,'sel');
}



function density_pick(size,el)
{
	select_this_element(el);
	ajax_pref_save('pref_newlook_density='+size);
	pref.newlook_density = size;
	density_apply_styling(size);
}

function density_apply_styling(size)
{
||if_not(density_styling)||
	return;
||endif||

	var cs={};
	cs.extra_half_height = (is_blank(size) || size==0) ? ||json_validate_int(newlook_default_density)|| : parseInt(size);
	cs.extra_height = cs.extra_half_height*2;

	assign_dynamic_css('density_styling', '||css_begin()||\
# 20 -> 30
	.full_cursor {
		height:'+px(20+cs.extra_height)+' !important;
	}
# 0 -> 5
	.tree_icons {
		margin-top:'+px(cs.extra_half_height)+' !important;
	}
# 2/18 -> 7/28
	ul.ftree .folder, .ltree .label{
	    padding-top:'+px(2+cs.extra_half_height)+';
	    height: '+px(16+cs.extra_height)+';
	}
# 16 -> 26
	.full_cursor{
	    height: '+px(16+cs.extra_height)+' !important;
	}
# 0/16 -> 6/21 ??
	.part_cursor{
	    padding-top:'+px(1+cs.extra_half_height)+' !important;
	    height: '+px(11+cs.extra_height)+' !important;
	}
# altsel
#	    height: '+px(11+cs.extra_half_height+4)+' !important;
#	}
#
#	.full_cursor, .part_cursor{
#		margin-top: -2px;
#		border-bottom: 1px solid transparent;
#		border-bottom: 1px solid transparent;
#	}
#	.full_cursor.selected{
#		top: -2px;
#		border-top: 1px solid red;
#		border-bottom: 1px solid red;
#	}
#	#folders .full_cursor.selected .part_cursor{
#		border-bottom: 1px solid red !important;
#	}

	#ac{
	    line-height: '+(1.3+cs.extra_height/10)+' !important;
	}
# 0-??
	.tallscreen_list .msgs_line td{
		padding-top:'+px(-1+cs.extra_half_height*0.7)+' !important;
		padding-bottom:'+px(-1+cs.extra_half_height*0.7)+' !important;
	}
	||css_end()||');
}



function update_hint(field, hint)
{
	if(field.value.length>0){
		class_add(hint,'hidden');
	}else{
		class_remove(hint,'hidden');
	}
}
function alt_resize_menu(wanted)
{
	var m1=dge("alt_ui_settings");
	var m2=dge("alt_ui_search_box");
	var m3=dge("alt_ui_actions");

	if(!m1.init_complete){
		m1.total_width = dge("search_etc").offsetWidth;
		m1.current_sel = 2;
		m1.init_complete = true;
	}

	if(wanted==m1.current_sel) return;
	m1.current_sel = wanted;

	class_add(m1,'animated_resize');
	class_add(m2,'animated_resize');
	class_add(m3,'animated_resize');

	var step = 65;
#	// step = 44+1; 	// Smaller icons in alt plain menu?
	if(wanted==1){
		m2.style.left=px(m1.total_width-step*2);
		m3.style.left=px(m1.total_width-step*1);
	} else if(wanted==2){
		m2.style.left=px(step*1);
		m3.style.left=px(m1.total_width-step*1);
	} else if(wanted==3){
		m2.style.left=px(step*1);
		m3.style.left=px(step*2);
	}

	clearTimeout(m1.timer);
	m1.timer = setTimeout(function(){
		class_remove(m1,"animated_resize");
		class_remove(m2,"animated_resize");
		class_remove(m3,"animated_resize");
	}, 320);
}

function set_h(el, h)
{
	if(el==undefined) return;
	el.style.height = px(h);
}
function set_w(el, w, compensate)
{
	if(el==undefined) return;
	el.style.width = px(compensate?w-17:w);
}
function set_t(el, t)
{
	if(el==undefined) return;
	el.style.top = px(t);
}
function set_b(el, b)
{
	if(el==undefined) return;
	el.style.bottom = px(b);
}
function set_l(el, l)
{
	if(el==undefined) return;
	el.style.left = px(l);
}
function set_hw(el, h,w, compensate)
{
	if(el==undefined) return;
	el.style.height = px(h);
	el.style.width = px(compensate?w-17:w);
}
function set_hw_both(el, h,w, compensate)
{
	if(el==undefined) return;
	set_hw(el, h,w, compensate);
	set_hw(el.parentNode, h,w, false);
}

function set_th(el, t, h)
{
	if(el==undefined) return;
	el.style.top = px(t);
	el.style.height = px(h);
}
function set_lw(el, l, w, compensate)
{
	if(el==undefined) return;
	el.style.left = px(l);
	el.style.width = px(compensate?w-17:w);
}
function set_hlw(el, h, l, r)
{
	if(el==undefined) return;
	el.style.height = px(h);
	el.style.left = px(l);
	el.style.width = px(r-l);
}
function set_hlr(el, h, l, r)
{
	if(el==undefined) return;
	el.style.height = px(h);
	el.style.left = px(l);
	el.style.right = px(r-l);
}


function find_div(nodes)
{
	var frag = U;
	for(var i=0;i<nodes.length;i++){
		if (nodes[i].tagName=="div" || nodes[i].tagName=="DIV"){
			frag=nodes[i];
		}
	}
	return frag
}
function newlook_call(fn_name)
{
	var module = newlook_modules[pref.newlook_layout];
	if(module==U) return;
	var fn = module[fn_name];
	if(fn==U) return;
	fn();
}

function new_populate_edit(cmd, fn, ch)
{
	var nodeid='utility';

	newlook_call('populate_message');

	var dummy=document.getElementById("dummy");
	dummy.innerHTML = '||html_begin()||\
#Move to html templated in js, rather tham separate html fragment across http
||define||js_encoding||true||
||include||_msg_pane.htm||
	||html_end()||';

# for now reuse the old constructs
	panel_show_old2("compose");
	var nodes=dummy.childNodes;
	frag=find_div(nodes);
	if (!frag) return;
	if(sw.altui){
		sw.util2.appendChild(frag);
		sw.util2 = U;
	}else{
		sw.util.appendChild(frag);
	}
	fn(frag);
}

function selection_apply_styling()
{
||if_set(selection_blue)||
	assign_dynamic_css('selection_styling', '||css_begin()||\
		#messages_list .selected a{
			color:white;
		}
		#messages_list .selected span{
			color:white;
		}
		#messages_list .msgs_line.selected td{
			background:#2b91e3 !important;
		}
	||css_end()||');
||endif||
}

# easing functions: http://easings.net/
var easeIn = 'cubic-bezier(0.55, 0.055, 0.675, 0.19)';
var easeOut = 'cubic-bezier(0.215, 0.61, 0.355, 1)';
function slide_in_upwards(el, size, duration, cb)
{
	duration*=1.5;
	if(el.slide_timer){
		clearTimeout(el.slide_timer);
	}else{
		el.style.cssText='||css_begin()||\
			transform: translate3d(0px, '+(size*0+100)+'px, 0px);
			opacity:0.7;filter:alpha(opacity=70);
		||css_end()||';
	}
	el.slide_timer = setTimeout(function(){
		el.style.cssText='||css_begin()||\
			transform: translate3d(0px, 0px, 0px);
			opacity:1.0; filter:alpha(opacity=100);
			transition: transform '+duration+'ms '+easeOut+', opacity '+(duration*0.8)+'ms;
			||css_end()||';
		el.slide_timer = setTimeout(function(){
			if(cb) cb(el);
			el.slide_timer = U;
		}, duration);
	},0);
}
function slide_cancel(el)
{

	if(el.slide_timer){
		clearTimeout(el.slide_timer);
	}
#	el.style.cssText='transition: transform 0ms;';
	el.style.cssText='transform: translate3d(0px, 0px, 0px);';
}
function slide_out_downwards(el, size, duration, cb)
{
//	duration*=5;
	slide_cancel(el);
	el.slide_timer = setTimeout(function(){
		el.style.cssText = 'transform: translate3d(0px, '+size+'px, 0px); transition: transform '+duration+'ms '+easeIn+';';
		el.slide_timer = setTimeout(function(){
			if(cb) cb(el);
			el.slide_timer = U;
		}, duration);
	},0);
}
function slide_out_upwards(el, cb)
{
	var duration=500;	// This needs to match the css!!!
	if(el.slide_timer){
		clearTimeout(el.slide_timer);
	}
	el.slide_timer = setTimeout(function(){
		class_add(el,'alt_slideup_now');
		el.slide_timer = setTimeout(function(){
			if(cb) cb(el);
			el.slide_timer = U;
		}, duration);
	},0);
}



function specific_color()
{
	x_prompt2("Specify RGB color:", hsl_out(cur_col_hsl) + '   ' + hsl_out_int(cur_col_hsl), function(val){
		if (val==U) return;
		var col = rgb2hsl(multi_txt2col(val));
		record_col(col);
		newlook_apply_coloring(col);
	},{'title':'Surgeweb',noselect:true});
}
function parse01(txt)
{
	var val = parseFloat(txt)
	var n=txt.indexOf('*');
	if(n<0) return val;

	var mult = parseFloat(txt.substring(n+1));
	if(mult<0) return val;

	if(txt.indexOf('-')!=-1){
		val = lerp(val,mult,0);
	}else if(txt.indexOf('+')!=-1){
		val = lerp(val,mult,1);
	}else{
		val *=mult;
	}
	return val;
}
function specific_apply(part, txt)
{
	var col = cur_col_hsl;
	col[part]=parse01(txt);
	record_col(col);
	newlook_apply_coloring(col);
}

function specific_hue()
{
	x_prompt2("Specify hue:", cur_col_hsl[hsl_h], function(val){
		if (val==U) return;
		specific_apply(hsl_h, val)
	},{'title':'Surgeweb',noselect:true});
}
function specific_saturation()
{
	x_prompt2("Specify saturation:", cur_col_hsl[hsl_s], function(val){
		if (val==U) return;
		specific_apply(hsl_s, val)
	},{'title':'Surgeweb',noselect:true});
}
function specific_brightness()
{
	x_prompt2("Specify brightness:", cur_col_hsl[hsl_b], function(val){
		if (val==U) return;
		specific_apply(hsl_b, val)
	},{'title':'Surgeweb',noselect:true});
}



# // Yuck!! grand collection of border styles!
function newlook_border_styles(hsl_col)
{
	var txt ='';
	txt += '.xxl, .border_top3, .border_plain, .border_plain_bot, .border_plain_b4footer, #search_limit, .attach_container, .rcol_border,';
	txt += ' .contact_lister, .swish_edit_outer, .cm_present.selected, .cm_present:hover ';
	txt += '	{ border:1px solid '+hsl_col+';}';
	txt += '.widescreen_msg, .view_extra, .compose_extra, .rnd1, .nornd{ border-left:1px solid '+hsl_col+';}';
	txt += '.a2h_list, .rnd1, .nornd{border-right:1px solid '+hsl_col+';}';
	txt += '.a2v_msg{border-top:1px solid '+hsl_col+';}';
	txt += '#list_extra.hint, .rnd2{border-bottom:1px solid '+hsl_col+';}';
	txt += '.border_plain_notop{ border-top:none; } .border_plain_nobot{ border-bottom:none; } \
			.border_plain_noside{ border-left:none; border-right:none;} .border_plain_topright{ border-left:none; border-bottom:none;}';
	return txt;
}

function newlook_clear_styling()
{
	var sheet = dge('newlook_color_css');
	if(sheet) sheet.innerHTML='';
}

function newlook_apply_altui(newlook)
{
#	if(newlook==U) return;
	sw.altui = newlook;
	newlook.alt_ui_interface();
}


var newlook_coloring = 'default';
function newlook_apply_coloring(col, opt)
{
	if (!opt) opt={};

	var sheet = dge('newlook_color_css');
	if(sheet==U){
		sheet = document.createElement('style')
		sheet.id = 'newlook_color_css';
		document.body.appendChild(sheet);
	}
	count++;
	var cs={}
	var txt='';

	// UI for configuring the theme configuration interface
	var el = dge('theme_options_scheme2');
	if(el){
		if(newlook_coloring=='anycolor'){
			class_remove(el,'hidden');
		}else{
			class_add(el,'hidden');
		}
	}
// Allow old theme to remove dynamic styling
// Allow new theme to add dynamic styling

#	// retro styling using new styling toolchain (may need smarter handling / addition of old styling possibilities)
# 	// Any colour based styling
	txt += newlook_modules[pref.newlook_coloring].style_css(cs, opt);

#	// Common styling with current setup
	if(cs.page_background_css){
		txt += '#page_width { '+cs.page_background_css+' }';
	}
	if(cs.border_color_css){
		txt += newlook_border_styles(cs.border_color_css);
	}

# // banner filler
#  	txt += '#top_banner.new {background: url(||www_base||background/landscape1.jpg?||vz||) no-repeat;';

	sheet.innerHTML = txt;

#	if(pref.newlook_coloring){
#		newlook_coloring = pref.newlook_coloring;
#	}

	if(newlook_coloring=='anycolor' || newlook_coloring=='dynamic'){
		newlook_modules.anycolor.dom_styling(cs, opt);
	} else if(newlook_coloring=='dark'){
		newlook_modules.dark.dom_styling(cs, opt);
	}

}

function density_to_picker(val)
{
	if(val<6){
		return 'compact';
	}else if (val>6){
		return 'spacious';
	}else{
		return 'comfy';
	}
}
function new_to_old_layout(val)
{
	if(val=='tallscreen'){ 	return 'vert';
	}else if (val=='list'){ return 'none';
	}else{					return 'horiz';
	}
}
function old_to_new_layout(val)
{
	if(val=='vert'){ 		return 'tallscreen';
	}else if (val=='none'){ return 'list';
	}else{					return 'widescreen';
	}
}
function validate_structure(layout)
{
	if(layout=='tallscreen' || layout=='list') return layout;
	return 'widescreen';
}
function validate_layout(layout)
{
#	if(layout==U || layout.length==0) return '||newlook_default_layout||';
	if(layout=='standard' || layout=='modern1' || layout=='modern2' || layout=='touch' ) return layout;
	return '||newlook_default_layout||';
}
function validate_coloring(type)
{
	if(type==U || type.length==0) return '||newlook_default_colors||';
	return type;
}

function create_picker_palette()
{
	var palette = palette_create('palette');
#	var palette = unipalette_create('palette');
	if(!defined(palette)) return;
	palette.on_change = function(col){
		record_col(col);
		newlook_apply_coloring(col, {bypass:true});
	}
	sw.palette = palette;
	sw.palette.set_color(newlook_modules.anycolor.cur_col_hsl);
	palette.render();
}

# // newlook_picker code

function newlook_picker_show_configs()
{
	var layout = validate_layout(pref.newlook_layout);
	var layout_config='';
	if(layout=='standard'){
		layout_config='\
		<div class="theme_config_inner">\
		  <div class="spacing_table2 structure_pick" style="width:460px;">\
			<div id="structure_pick_widescreen" onclick="newlook_structure_pick(`widescreen`,this)" class="table_cell"><img class="pick_wide" src="||one_pix||"><br>Widescreen </div>\
			<div id="structure_pick_tallscreen" onclick="newlook_structure_pick(`tallscreen`,this)" class="table_cell"><img class="pick_tall" src="||one_pix||"><br>Tallscreen </div>\
			<div id="structure_pick_list" onclick="newlook_structure_pick(`list`,this)" class="table_cell"><img class="pick_list" src="||one_pix||"><br>List </div>\
		  </div>\
		</div>';
	} else if(newlook_modules[layout] && newlook_modules[layout].config){
		layout_config = '<div class="theme_config_inner">'+newlook_modules[layout].config()+'</div>';
	}
	html_safe_set('newlook_layout_config', layout_config);

	// QQPALETTE
	var coloring = validate_coloring(pref.newlook_coloring);
	var coloring_config='';
	if(newlook_modules[coloring] && newlook_modules[coloring].config){\
#		// Get colour config structure from plugin
		coloring_config = '<div class="theme_config_inner">'+newlook_modules[coloring].config()+'</div>';
	}
	html_safe_set('newlook_color_config', coloring_config);
}

function newlook_picker_update()
{
	newlook_picker_show_configs();

	select_this_element(dge('layout_pick_'+validate_layout(pref.newlook_layout)));
	select_this_element(dge('structure_pick_'+validate_structure(pref.newlook_structure)));
	select_this_element(dge('color_pick_'+validate_coloring(pref.newlook_coloring)));
	// add the palette??
	// class_add(dge('newlook_pick_layout'),'hidden');
	select_this_element(dge('density_pick_'+density_to_picker(pref.newlook_density)));

	create_picker_palette();
}

function alt_ui_dom_nodes()
{
	var el = dge('utility_alt');
	if(el) sw.util = el;
#	var el = dge('utility_alt2');
#	if(el) sw.util2 = el;

	var el = dge('alt_ui_search');
	if(el) sw.search_input= el;
}


function newlook_search_reset()
{
	msglist_unsearch(); 
	search_field_set();
	search_init(U,"quick");
}

function newlook_layout_pick(type, el)
{
	//app_menu_mail();
	// Stash messgaes
	// populate messages
	newlook_search_reset();
	//do_resize();
	//return

//	app_menu('mail',dge('app_mail'),true);

	select_this_element(el);
	ajax_pref_save('pref_newlook_layout='+type);
	pref.newlook_layout = type;

	newlook_propagate_step1();

	search_init(U,"quick");
}
function newlook_structure_pick(type, el)	// cf theme_pick
{
	select_this_element(el);
	ajax_pref_save('pref_newlook_structure='+type);
	newlook_structure_live_switch(type);
#	// Can only get applied "within" standard layout, for now anyway,
#      so no need to worry about altui or coloring switching
	newlook_propagate_step3();
}
function newlook_coloring_pick(type, el)
{
	animation_timer_reset();

	// App menu mail??
	select_this_element(el);
	ajax_pref_save('pref_newlook_coloring='+type);
	pref.newlook_coloring = type;
	//newlook_select_color(type);
	newlook_propagate_step1();
}

sw.theme_showing=false;
function do_toggle_theme()
{
	var el=dge('theme_panel');
	if(el){
		sw.theme_showing = false;
		slide_out_downwards(el,800,300,function(el){
			remove_node(el);
		});
		altui_hide_utility();
	}else{
		sw.theme_showing = true;
		newlook_picker_show('theme');
	}
	
/*
	if(!sw.theme_showing ){
		app_menu_standard('mail',o,true);
	}
	if(sw.theme_showing){
			if(sw.cur_app_menu){
				class_remove(sw.cur_app_menu,"sel");
			}
			var el=document.getElementById("app_"+type);
			if (el){
				class_add(el,"sel");
				sw.cur_app_menu=el;
			}
		}		
	}else{
		if(sw.theme_showing){
			do_toggle_theme();
		}else{
		}
	}
*/	
}
function hide_theming()
{
	var el=dge('theme_panel');
	if(!el) return;
	slide_out_downwards(el,800,300,function(el){
		remove_node(el);
	});
}

function newlook_picker_show(config_tab)
{
	if(config_tab==U) config_tab='theme';

	var el = dge('theme_panel');
	if (el) return;
	el = create_element('div', 'theme_panel');

	var html='';
	html+='<div class="theme_close" onclick="do_toggle_theme();app_menu_standard(`mail`,U,true);"></div>';

	if(config_tab=='theme'){
		html+= newlook_theme_picker();
	}else if(config_tab=='modern'){
		html+= theme_colours_new_tab();
	}else{
		html+= theme_colours_old_tab();
	}
#||iftrue(pref_devt_mode)||
#	html+='<br><hr><br><p>DEBUGGING TOOLS: ';
#	html+='<a href="#" onclick="switch_dbgtable(\'theme\')">theme tab</a>';
#	html+=' | ';
#	html+='<a href="#" onclick="switch_dbgtable(\'modern\')">modern variable colours</a>';
#	html+=' | ';
#	html+='<a href="#" onclick="switch_dbgtable(\'old\')">old fixed colours</a>'
#	html+=' ';
#||endif||

	el.innerHTML=html;

	newlook_picker_update();

	slide_in_upwards(el,800,300);
}

function newlook_theme_picker()
{
	var html='';

#	html +=	'||html_begin()||\
#<div id="newlook_pick_spacing">
#  <div><span style="float:left;">Manage: </span>
#	<div class="spacing_table" style="margin-left:130px; _background:red; width:460px; _margin:auto;">
#		<a href="#" onclick="manage_folders();hide_theming();">Folders</a> &nbsp;|&nbsp;
#		<a href="#" onclick="manage_labels();hide_theming();">Labels</a> &nbsp;|&nbsp;
#		<a href="#" onclick="do_options();hide_theming();">Preferences</a> &nbsp;|&nbsp;
#		<a href="#" onclick="do_identity();hide_theming();">Additional Accounts</a>
#	</div>
#  </div>
#</div>
#			 ||html_end()||';


	html +=	'||html_begin()||\
<div id="newlook_pick_layout">
#<br><hr>
	<br>
	<div><span style="float:left;">Layout: </span>
		<div class="theme_table layout_pick" style="margin-left:130px;_background:red; _width:460px; _margin:auto;">
			<div id="layout_pick_standard" onclick="newlook_layout_pick(`standard`,this)" class="table_cell"><img class="pick_standard" src="||one_pix||"><br>$$st_interface_retro$$</div>
			<div id="layout_pick_modern1" onclick="newlook_layout_pick(`modern1`,this)" class="table_cell"><img class="pick_plain" src="||one_pix||"><br>$$st_interface_modern$$</div>
#			<div id="layout_pick_modern2" onclick="newlook_layout_pick(`modern2`,this)" class="table_cell"><img class="pick_plain" src="||one_pix||"><br>Proto</div>
#			<div id="layout_pick_touch" onclick="newlook_layout_pick(`touch`,this)" class="table_cell"><img class="pick_touch" src="||one_pix||"><br>Mobile</div>
#			<div id="layout_pick_touch" onclick="newlook_layout_pick(`touch`,this)" class="table_cell"><img src="||www_base||shared/img/altui_small.jpg" style="width:88px;height:47px;border:1px solid #ddd;"><br>other</div>
		</div>
	</div>
	<div id="newlook_layout_config" class="theme_config"> </div>
</div>
			 ||html_end()||';

	html +=	'||html_begin()||\
<div id="newlook_pick_color" class="hidden" style="clear:both;">
<br><hr><br>
	<div><span style="float:left;">Coloring: </span>
		<div class="theme_table color_pick" style="margin-left:130px;">
			<div id="color_pick_default" onclick="newlook_coloring_pick(`default`,this)" class="table_cell"><img class="pick_default" src="||one_pix||"><br>Default</div>
			<div id="color_pick_anycolor" onclick="newlook_coloring_pick(`anycolor`,this)" class="table_cell"><img class="pick_anycolor" src="||one_pix||"><br>Adjust</div>
			<div id="color_pick_dynamic" onclick="newlook_coloring_pick(`dynamic`,this)" class="table_cell"><img class="pick_dynamic" src="||one_pix||"><br>Dynamic</div>
			<div id="color_pick_dark" onclick="newlook_coloring_pick(`dark`,this)" class="table_cell"><img class="pick_dark" src="||one_pix||"><br>Dark</div>
		</div>
	</div>
	<div id="newlook_color_config" class="theme_config"> Extra theme config </div>
</div>
			 ||html_end()||';

	html +=	'||html_begin()||\
<div id="newlook_pick_spacing">
<br><hr><br>
<div><span style="float:left;">Spacing: </span>
	<div class="spacing_table density_pick" style="margin-left:130px; width:460px;">
		<div id="density_pick_compact" onclick="density_pick(3,this)" class="table_cell"><img class="pick_compact" src="||one_pix||"><br>Compact </div>
		<div id="density_pick_comfy" onclick="density_pick(8,this)" class="table_cell"><img class="pick_comfy" src="||one_pix||"><br>Comfortable </div>
		<div id="density_pick_spacious" onclick="density_pick(12,this)" class="table_cell"><img  class="pick_spacious" src="||one_pix||"><br>Spacious </div>
	</div>
</div>
</div>
			 ||html_end()||';


	return html;
}


function newlook_structure_live_switch(type)
{
	pref.newlook_structure = type;
	pref.preview = new_to_old_layout(type);
	dge('messages_list').innerHTML='';
	dge('message_preview').innerHTML='';
	dge('msg_navigator').innerHTML='';
	menubar_init('menu_bar_main');
}
function clientside_layout()
{
	var layout=old_to_new_layout(pref.preview);
	if(pref.newlook_ui){
#		// use clever tempalte based decisions
		if(not_blank(pref.newlook_structure)) layout = pref.newlook_structure;
		if(sw.altui) layout='widescreen';
	}
	return '&clientside_layout='+layout;
}


// Newlook styling system core

var newlook_modules={};
function newlook_register(id, txt, obj, param)
{
	if(!pref.newlook_ui) return;

	obj.is_altui = param.alt;
	newlook_modules[id]=obj;
	if(id=='anycolor') {
		//record_col( rgb2hsl(txt2col('#0091fb')) );
		cur_col_hsl = obj.cur_col_hsl;
	}
#	pref.alt_ui = true /*pref.ios_alt_dev*/ && (pref.ios_pretend || isIOS);
}

function newlook_init()
{
	if(!pref.newlook_ui) return;

	more_items_init();

	pref.newlook_layout = validate_layout(pref.newlook_layout);
	pref.newlook_coloring = validate_coloring(pref.newlook_coloring);

	sw.global_newlook_collapsed = false;


	newlook_propagate_step1( {is_init:true, need_layout:true} );

	if(pref.newlook_coloring=='dynamic' && animation_timer==U){
		pick_scheme(1);
		pick_scheme_speed(2);
	}

	var el = dge('top_banner');
	class_remove(el,"new");
	class_add(el,"modern");

	density_apply_styling(pref.newlook_density);
	selection_apply_styling();
}


function newlook_verify_color(theme, is_init)	// UNUSED??
{
	alert('NEWLOOK BAD');

	if(!string_empty(pref.newlook_anycolor)){
		newlook_modules.anycolor.record_col(rgb2hsl(txt2col(pref.newlook_anycolor)));
	}
	newlook_clear_styling();
	newlook_propagate_step2(is_init, false, false)
}

# <- init(o), Pick theme(), pick coloring()
function newlook_propagate_step1(o)
{
	if(!o){ o={}; }
	alt_ui_undo();
	newlook_clear_styling();

#	newlook_propagate_step2(o);
#}
# <- step1(o), newlook_verify_color(XXX)
#function newlook_propagate_step2(o)
#{
#	if(!o){ o={} };

	newlook_picker_show_configs();
	newlook_picker_update();	// I think this is safe here :-)

	create_picker_palette();

	var old_layout = layout;
	var layout = newlook_modules[pref.newlook_layout];
	if( layout!=U && layout.is_altui){
		newlook_apply_altui(layout);			// 'newlook_altui_css' dynamic css
		o.altui_switched = o.need_layout = o.need_data = true;
	} else if(old_layout!=layout && !layout.is_altui){	// TODO: maybe make this more generic??
		o.altui_switched = o.need_layout = o.need_data = true;
	}
	
#	// Maybe remove this special case and make it part of generic initialisation
	if(pref.newlook_layout=='standard'){
		show_element('lpanel_mail');
		show_element('switcher');
	}
	
	newlook_apply_coloring(cur_col_hsl);	// 'newlook_color_css' dynamic css - pallette changes call this direct

	newlook_propagate_step3(o)
}
# <- step2(o), newlook_structure_pick(o)
function newlook_propagate_step3(o)
{
	if(!o){ o={}; o.need_layout=o.need_data=true; }
	if(o.altui_switched || o.need_layout){
		list_fns_init();
		cache_dom_nodes();
		alt_ui_dom_nodes();
		lm_init();
	}
	if(o.altui_switched){
	}
	if(o.need_layout){
		do_layout();
		do_resize();
	}
	if(o.need_data){
		do_init_data(true);
	}
}


// oher stuff prescroll etc

function extra_msg_padding()
{
||if_set(newlook_extra_padding_disable)||
	return '';
||else||
	return '.msg_body{padding:5px 25px 23px 26px;}'+
		   '#msg_headers, .msg_headers{padding:23px 25px 23px 26px;}'+
		   '.msg_line div { margin-left: 26px; margin-right: 26px;}';
#		   '#message_preview{padding-top:44px;}';
||endif||
}

function safe_class_add(node_id,class_txt)
{
	var el = dge(node_id);
	if(!defined(el)) return;
	class_add(el,class_txt);
}
function safe_class_remove(node_id,class_txt)
{
	var el = dge(node_id);
	if(!defined(el)) return;
	class_remove(el,class_txt);
}

function altui_hide_utility()
{
	safe_class_add('lpanel_hdr_alt','hidden')
	safe_class_add('lpanel_contacts_alt','hidden')
	safe_class_add('lpanel_calendar_alt','hidden')
	safe_class_add('utility_menubar','hidden')
	safe_class_add('utility_alt','hidden')
	sw.alt_utility=false;
return;


	var el=dge('alt_slideup');		// QQSLIDE
	if(!el) return;
#	slide_out_downwards(el,800,300,function(el){
		class_add(el,'hidden');
		el.style.cssText = '';
#	});
}
function altui_show_utility(type)
{
	if(type=='contacts' || type=='calendar'){
		safe_class_remove('lpanel_hdr_alt','hidden');
		safe_class_remove('lpanel_'+type+'_alt','hidden');
	}
	safe_class_remove('utility_menubar','hidden');
	safe_class_remove('utility_alt','hidden');
	var el = dge('utility_alt');
	if(el!=U) el.innerHTML='';
	sw.alt_utility=true;
	return;

	var el=dge('alt_slideup');
	if(!el) return;
	class_remove(el,'hidden');
}


# Layout schemes
||include||newlook_standard.js||
||include||newlook_modern1.js||
||include||newlook_modern2.js||
||include||newlook_touch.js||

# Color schemes
||include||newlook_default.js||
||include||newlook_anycolor.js||
||include||newlook_dynamic.js||
||include||newlook_dark.js||

# Finally give in and add some helper code implemented by others!! :-) jQuery in particular as a starting point and 
# jquery based nanoscroller toolbars:  https://jamesflorentino.github.io/nanoScrollerJS/
function fancy_scroll_init()
{
||if_not(newlook_ui)||
	return;
||endif||	
	if(pref.scrollbar_type!='modern') return;
  	var items = $jQ(".mano");
  	items.each( function (i,el){
  		class_remove(el,'mano');
  		class_add(el,'nano');
  		var tmp = el.firstChild;
  		var sub = document.createElement('div');
  		class_add(sub,'nano-content');  		
  		$jQ(el.childNodes).each(function(i2,el2){
	  		sub.appendChild(el2);
  		})  		
  		el.appendChild(sub);
  	})

#  jQuery('.nano').nanoScroller({
#    	preventPageScrolling: true
#  });
	fancy_scroll_update();
}
function fancy_scroll_update()
{
||if_not(newlook_ui)||
	return;
||endif||	
	if(pref.scrollbar_type!='modern') return;
	if(window.$jQ==undefined) return;
	var items = $jQ(".nano");
	items.nanoScroller();
	sw.using_fancy_scroller = true;
}