// com.tts.initial.html5.slider
// HTML4 / HTML5: No differences
define([
	"./defaultslider.builder",
	"./imageslider.builder",
	"jquery"
	], function (
		DefaultSliderBuilder,
		ImageSliderBuilder,
		jq
	) {

	"use strict";

	/**
	 * @constructor
	 */
	return function (context, metadata) {
		var shellElement,
			instance = null,
			slider = null,
			trackImage = null,
			thumbImage = null,
			parameters = metadata.parameters,
			rotation = parameters.asNumber("rotation", 0),
			thumbRadius = parameters.asNumber("thumb_radius", "15"),
			trackHeight = parameters.asNumber("track_height", "10"),
			type = parameters.get("type", "default"),
			isStandardPlayer = context.getPlayerName() === "standard",
			isInAuthoringMode = !!context.stage.isInAuthoringMode(),
			isInPreviewMode = !!context.stage.isInPreviewMode(),
			isInLearningMode = !!context.stage.isInLearningMode(),
			hasStageTriggerSupport = !!context.stage.trigger,
			isAssessmentMode = context.stage.isInAssessmentMode(),
			setDifferentAssessmentDesign = (isAssessmentMode && parameters.asBool("different-assessment-design")) ? true : false,
			isQuestionPage = isStandardPlayer ? checkIfIsQuestionPage() : context.page.quiz.hasQuestion();

		function createSlider() {
			if (setDifferentAssessmentDesign) {
				trackImage = loadImage("bg_track_as", parameters.get("bg_track_as", null));
				thumbImage = loadImage("bg_thumb_as", parameters.get("bg_thumb_as", null));
			} else {
				trackImage = loadImage("bg_track", parameters.get("bg_track", null));
				thumbImage = loadImage("bg_thumb", parameters.get("bg_thumb", null));
            }

			if (type === "default") {
				slider = new DefaultSliderBuilder({
					track: {
						color: {
							normal: setDifferentAssessmentDesign ? parameters.get("track_color_as", "#f0f3f5") : parameters.get("track_color", "#f0f3f5"),
							hover: setDifferentAssessmentDesign ? parameters.get("track_hover_color_as", "#e2e8ec") : parameters.get("track_hover_color", "#e2e8ec")
						},
						height: trackHeight,
						transparency: setDifferentAssessmentDesign ? parameters.asNumber("track_transparency_as", "0") : parameters.asNumber("track_transparency", "0")
					},
					thumb: {
						radius: thumbRadius,
						color: {
							normal: setDifferentAssessmentDesign ? parameters.get("thumb_color_as", "#005192") : parameters.get("thumb_color", "#005192"),
							hover: setDifferentAssessmentDesign ? parameters.get("thumb_hover_color_as", "#009ee0") : parameters.get("thumb_hover_color", "#009ee0"),
							correct: setDifferentAssessmentDesign ? parameters.get("thumb_correct_color_as", "#74b65b") : parameters.get("thumb_correct_color", "#74b65b"),
							incorrect: setDifferentAssessmentDesign ? parameters.get("thumb_incorrect_color_as", "#fd7326") : parameters.get("thumb_incorrect_color", "#fd7326")
						}
					},
					rotation: rotation,
					minValue: parameters.asNumber("min_value", 0),
					maxValue: parameters.asNumber("max_value", 100),
					startValue: parameters.asNumber("start_value", 50),
					stepValue: parameters.asNumber("step_value", 10),
					solutionRange: parameters.get("solution_range", "50"),
					sampleSolution: parameters.asNumber("sample_solution", "50"),
					groupId: parameters.asNumber("toggle_group_id", 1),
					instance: instance,
					id: parameters.asNumber("id", 1),
					isQuestionPage: isQuestionPage,
					isStandardPlayer: isStandardPlayer,
					isInAuthoringMode: isInAuthoringMode,
					isInPreviewMode: isInPreviewMode,
					isInLearningMode: isInLearningMode,
					hasStageTriggerSupport: hasStageTriggerSupport
				}, context, metadata).build();
			} else {
				slider = new ImageSliderBuilder({
					trackImage: trackImage,
					thumbImage: thumbImage,
					rotation: rotation,
					minValue: parameters.asNumber("min_value", 0),
					maxValue: parameters.asNumber("max_value", 100),
					startValue: parameters.asNumber("start_value", 50),
					stepValue: parameters.asNumber("step_value", 10),
					solutionRange: parameters.get("solution_range", "50"),
					sampleSolution: parameters.asNumber("sample_solution", "50"),
					groupId: parameters.asNumber("toggle_group_id", 1),
					instance: instance,
					id: parameters.asNumber("id", 1),
					isQuestionPage: isQuestionPage,
					isStandardPlayer: isStandardPlayer,
					isInAuthoringMode: isInAuthoringMode,
					isInPreviewMode: isInPreviewMode,
					isInLearningMode: isInLearningMode,
					hasStageTriggerSupport: hasStageTriggerSupport
				}, context, metadata).build();
            }

			if (type === "default") {
				shellElement.css({
					"width": metadata.getWidth() >= (thumbRadius * 2) ? metadata.getWidth() + "px" : (thumbRadius * 2) + "px",
					"height": trackHeight >= (thumbRadius * 2) ? trackHeight + "px" : (thumbRadius * 2) + "px",
				});
			} else {
				shellElement.css({
					"width": trackImage.width >= thumbImage.width ? trackImage.width + "px" : thumbImage.width + "px",
					"height": thumbImage.height >= thumbImage.height ? thumbImage.height + "px" : thumbImage.height + "px"
				});
            }

			shellElement.append(slider.getElement());
			shellElement.append(slider.getDisabledElement());

			if (isInAuthoringMode) {
				createAuthoringShield();
            }
		}

		function checkIfIsQuestionPage() {
			var allQuestions = context.quiz.getQuestions();

			for (var i = 0; i < allQuestions.length; i++) {
				if (metadata.page.getId() == allQuestions[i].getPageMetadata().getId()) {
					return true;
				}
			}

			return false;
		}

		function loadImage(key, image) {
			var result = {};

			if (image) {
				result.fileNameURL = context.stage.getSharedPath() + image.fileName;
				result.width = image.width;
				result.height = image.height;
			} else {
				switch (key) {
					case "bg_track":
						result.fileNameURL = context.getPath() + "bg_track.png";
						result.width = 340;
						result.height = 50;
						break;
					case "bg_thumb":
						result.fileNameURL = context.getPath() + "bg_thumb.png";
						result.width = 100;
						result.height = 100;
						break;
					case "bg_track_as":
						result.fileNameURL = context.getPath() + "bg_track.png";
						result.width = 340;
						result.height = 50;
						break;
					case "bg_thumb_as":
						result.fileNameURL = context.getPath() + "bg_thumb.png";
						result.width = 100;
						result.height = 100;
						break;
					default:
						return null;
				}
			}

			return result;
		}

		function createAuthoringShield() {
			shellElement.append(jq(document.createElement("div"))
				.css({
					"position": "absolute",
					"left": 0,
					"top": 0,
					"background-color": "#ffffff",
					"opacity": "0.4",
					"width": "100%",
					"height": "100%",
					"z-index": "9999"
				}));
		}

		// revealing public API
		return {
			onLoading: function () {
				instance = this;
				shellElement = jq(context.getElement());

				isInAuthoringMode = !!context.stage.isInAuthoringMode();

				context.page.event.bindOnEnter( this );
				context.page.event.bindOnExit(this);

				createSlider();
			},
			onEnterPage: function () {
				slider.onEnterPage();
				slider.bindEvents();
			},
			onExitPage: function () {
				slider.onExitPage();
				slider.removeEvents();
			},
			onAllComponentsReady: function () {
				slider.onAllComponentsReady();
			},
			onUserSolution: function () {
				slider.removeEvents();
				slider.onUserSolution();
			},
			onBestPracticeSolution: function () {
				slider.removeEvents();
				slider.onBestPracticeSolution()
			}
		};
	};
});
