var controls = document.querySelector('.rtc-controls');
var localVideo = document.querySelector('.rtc-videos video.local');
localVideo.srcObject = new MediaStream();

export var addLocalTracks = function(con) {
	localVideo.srcObject.getTracks().forEach(track => {
		con.addTrack(track, localVideo.srcObject);
	});
};

export var init = function(updateConnections) {
	var updateStreams = async function(event) {
		var tracks = localVideo.srcObject.getTracks();
		var kind = event.target.name === 'audio' ? 'audio' : 'video';

		if (!event.target.checked) {
			tracks.forEach(track => {
				if (track.kind === kind) {
					track.enabled = false;
				}
			});
		} else if (
			tracks.filter(t => t.kind === kind).length &&
			!(controls.video.checked && controls.screen.checked)
		) {
			tracks.forEach(track => {
				if (track.kind === kind) {
					track.enabled = true;
				}
			});
		} else {
			var newStream = new MediaStream();
			var stream;
			try {
				if (event.target.name === 'screen') {
					stream = await navigator.mediaDevices.getDisplayMedia();
				} else {
					stream = await navigator.mediaDevices.getUserMedia({[kind]: true});
				}
			} catch (err) {
				event.target.checked = false;
				return;
			}

			if (event.target.name === 'video') {
				controls.screen.checked = false;
				localVideo.classList.add('mirrored');
			} else if (event.target.name === 'screen') {
				controls.video.checked = false;
				localVideo.classList.remove('mirrored');
			}

			tracks.forEach(track => {
				if (track.kind === kind) {
					track.stop();
				} else {
					newStream.addTrack(track);
				}
			});
			stream.getTracks().forEach(track => {
				newStream.addTrack(track);
			});

			localVideo.srcObject = newStream;
			updateConnections();
		}
	};

	controls.addEventListener('change', updateStreams);

	navigator.mediaDevices.enumerateDevices().then(devices => {
		devices.forEach(device => {
			if (device.kind === 'audioinput') {
				controls.audio.disabled = false;
			} else if (device.kind === 'videoinput') {
				controls.video.disabled = false;
			}
		});
	});
};