move codec parsing to separate file, fix concat assignment

hls-player.js

@@ -1,5 +1,3 @@
-var player = document.getElementById('vid1');
-
 class PlaylistLoader {
 	constructor() {
 		this.playlist_src = '/list/' + window.location.pathname.slice(6);
@@ -34,32 +32,30 @@ class PlaylistLoader {
 				}
 			}
 		}
-		this.new_segments.concat(segments);
+		this.new_segments = this.new_segments.concat(segments);
+		if (segments.length != 0) {
 			this.last_segment = segments.at(-1);
 		}
 	}
+}
 
 class VideoLoader {
-	constructor() {
+	constructor(vid_tag_id) {
 		this.stream_key = window.location.pathname.slice(6);
 		this.playlist_loader = new PlaylistLoader();
-		this.player = document.getElementById('vid1');
+		this.player = document.getElementById(vid_tag_id);
 		this.media_source = new MediaSource();
 		this.prepare_buffer();
 	}
 	
 	async prepare_buffer() {
 		let init_frag = await this.fetch_video('/vid/' + this.stream_key + '/init.mp4');
-		fetch_mime(init_frag);
+		let mime = (new MP4Tree(init_frag)).get_mime();
 	}
 
 	async fetch_video(uri) {
 		const response = await fetch(uri);
-		fetch_mime(new Uin8Array(response.arrayBuffer()));
+		return response.arrayBuffer();
 	}
 }
 
-function fetch_mime(mp4_byte_buffer) {
-}
-
-let test = new VideoLoader();

mp4-tree.js

@@ -0,0 +1,49 @@
+DataView.prototype.getString = function(offset, length) {
+	text = '';
+	let end = offset + length;
+	for (let i = offset; i < end; i++) {
+		text += String.fromCharCode(this.getUint8(i));
+	}
+	return text;
+}
+
+
+class MP4Tree {
+	constructor(data) {
+		this.data = new DataView(data);
+		this.codecs = [];
+		this.idx = 0;
+		this.parse_codecs();
+	}
+
+	parse_codecs() {
+		this.parse_until('moov');
+		console.log(this.idx);
+	}
+
+	get_mime() {
+		return 'video/mp4; codecs="' + this.get_codec_string() + '"';
+	}
+
+	get_codec_string() {
+		return this.codecs.join(', ');
+	}
+
+	parse_until(name) {
+		let curr_head = null;
+		while (this.idx < this.data.byteLength) {
+			curr_head = this.read_next_head();
+			console.log(curr_head);
+			if (curr_head.name == name) {
+				break;
+			} else {
+				this.idx += curr_head.len;
+			}
+		}
+	}
+	
+	read_next_head() {
+		return {"len": this.data.getUint32(this.idx), "name": this.data.getString(this.idx + 4, 4)};
+	}
+}
+