use ltk::{ column, img_widget, text, Color, Element, Length };

use crate::message::Msg;
use crate::state::State;

/// Idle lock view: clock + date + swipe-up hint and arrow. Rendered onto its
/// own subsurface; a swipe-up slides the whole panel away to reveal the input,
/// so this view itself carries no drag state.
pub fn view( state: &State ) -> Element<Msg>
{
	let palette   = ltk::theme_palette();
	let secondary = palette.text_secondary;
	let hint      = Color { a: palette.text_secondary.a * 0.55, ..palette.text_secondary };

	let time = state.now.format( "%H:%M" ).to_string();
	let date = state.now.format( "%A, %-d %B" ).to_string();

	let mut content = column::<Msg>()
		.padding( Length::vmin( 6.0 ).clamp( 48.0, 64.0 ) )
		.spacing( 4.0 )
		.push( ltk::spacer().weight( 3 ) )
		.push(
			text( date )
				.size( Length::vmin( 5.5 ).clamp( 16.0, 32.0 ) )
				.color( secondary )
				.align_center()
		)
		.push( ltk::spacer().height( Length::vmin( 9.0 ).at_least( 12.0 ) ) )
		.push(
			text( time )
				.size( Length::vmin( 14.0 ).clamp( 44.0, 104.0 ) )
				.color( secondary )
				.align_center()
		)
		.push( ltk::spacer().weight( 25 ) )
		.push(
			text( rust_i18n::t!( "unlock_hint" ).to_string() )
				.size( Length::vmin( 3.0 ).clamp( 12.0, 18.0 ) )
				.color( hint )
				.align_center()
		)
		.push( ltk::spacer().weight( 1 ) );

	if let Some( ( rgba, w, h ) ) = &state.swipe_up
	{
		content = content.push(
			ltk::column::<Msg>()
				.max_width( 32.0 )
				.padding( 0.0 )
				.spacing( 0.0 )
				.push( img_widget( rgba.clone(), *w, *h ).opacity( 0.7 ) )
		);
	}

	content.into()
}
