package view;

import com.adobe.cairngorm.control.CairngormEventDispatcher;
import components.RidersListRendererAccessory;
import components.RoundAvatar;
import control.RiderSelectEvent;
import feathers.controls.ListView;
import feathers.controls.dataRenderers.ItemRenderer;
import feathers.data.ListViewItemState;
import feathers.events.FeathersEvent;
import feathers.events.ListViewEvent;
import feathers.skins.RectangleSkin;
import feathers.text.TextFormat;
import feathers.utils.DisplayObjectRecycler;
import model.AppModelLocator;
import model.Constants;
import openfl.Assets;
import openfl.events.Event;
import t9.util.ColorTraces.*;
import vo.RiderVO;

class RidersList extends ListView {
	private var model = AppModelLocator.getInstance();
	private var rowHeight:Int;

	public function new() {
		super();
		addEventListener(FeathersEvent.CREATION_COMPLETE, onCreationComplete);
		//addEventListener(Event.CHANGE, onRiderSelect);
		addEventListener(ListViewEvent.ITEM_TRIGGER, onRiderSelect);
	}

	override private function initialize():Void {
		super.initialize();

		// set common properties for all renderers in the same container here
		var recycler = DisplayObjectRecycler.withFunction(() -> {
			
			rowHeight = Std.int(height / Constants.RIDERS_LIST_ROWS_COUNT);

			var itemRenderer = new ItemRenderer();
			itemRenderer.height = rowHeight;
			itemRenderer.textFormat = new TextFormat(Assets.getFont(Constants.MONTSERRAT_BOLD_700).fontName, Constants.FONT_SIZE_16, Constants.MAIN_COLOR1);
			itemRenderer.secondaryTextFormat = new TextFormat(Assets.getFont(Constants.MONTSERRAT_MEDIUM_500).fontName, Constants.FONT_SIZE_12, Constants.MAIN_COLOR2);

			var rs1 = new RectangleSkin(SolidColor(Constants.MAIN_COLOR3, 1), SolidColor(1, Constants.LIST_SEPARATOR_COLOR));
			var rs2 = new RectangleSkin(SolidColor(Constants.LIST_SEPARATOR_COLOR, 1), SolidColor(1, Constants.LIST_SEPARATOR_COLOR));
			itemRenderer.backgroundSkin = rs1;
			itemRenderer.selectedBackgroundSkin = rs2;
			itemRenderer.setSkinForState(ToggleButtonState.UP(false), rs1);
			itemRenderer.setSkinForState(ToggleButtonState.HOVER(false), rs2);
			itemRenderer.setSkinForState(ToggleButtonState.DOWN(false), rs2);
			
			return itemRenderer;

		});

		itemRendererRecycler = recycler;

		recycler.update = (itemRenderer:ItemRenderer, state:ListViewItemState) -> {
			var rider:RiderVO = cast(state.data, RiderVO);
			itemRenderer.text = rider.firstName;
			itemRenderer.secondaryText = rider.name;
			
			itemRenderer.icon = new RoundAvatar(Std.int(rowHeight * 0.9), rider.uid);

			itemRenderer.accessoryView = new RidersListRendererAccessory(rider.credit);
		};

		recycler.reset = (itemRenderer:ItemRenderer, state:ListViewItemState) -> {
			// TODO
			/*var label = cast(itemRenderer.getChildByName("label"), Label);
				var loader = cast(itemRenderer.getChildByName("loader"), AssetLoader);
				label.text = "";
				loader.source = null; */
		};

		model.addEventListener(AppModelLocator.RIDERS_LIST_DP_CHANGE, onRiderListDpChange);
	}

	private function onCreationComplete(event:FeathersEvent):Void {
		traceBlue(this + " --> onCreationComplete() - w: " + width + " h: " + height);
	}

	private function onRiderListDpChange(e:Event):Void {
		dataProvider = model.ridersListDP;

		/*itemToText = function(item:Dynamic):String {
			return item.firstName;
		};*/
		traceGreen(this + " --> onRideListDpChange()");
	}

	function onRiderSelect(e:ListViewEvent):Void {

		// broadcast a cairngorm event that contains the selectedItem from the List
		var riderVO:RiderVO = cast(e.state.data, RiderVO);
		var rse:RiderSelectEvent = new RiderSelectEvent(riderVO);
		CairngormEventDispatcher.getInstance().dispatchEvent(rse);
		clearSelectedRider();
	}

	// de-select any selected List items
	private function clearSelectedRider():Void {
		selectedIndex = -1;
	}
}
