v1.3.0 후처리 기능 추가

templates/youtube-dl_download.html

@@ -6,7 +6,7 @@
 	{{ macros.setting_input_text('filename', '파일명', value=arg['file_name'], desc='템플릿 규칙은 https://github.com/ytdl-org/youtube-dl/blob/master/README.md#output-template 참고') }}
 	{{ macros.setting_select('preset', '동영상 포맷 프리셋', arg['preset_list'], col='3') }}
 	{{ macros.setting_input_text('format', '동영상 포맷', desc=['포맷 지정은 https://github.com/ytdl-org/youtube-dl/blob/master/README.md#format-selection 참고', '빈칸으로 두면 최고 화질로 다운로드합니다.']) }}
-	<!-- {{ macros.setting_select('merge_output_format', '파일 포맷', [['auto', '자동'], ['mkv', 'mkv'], ['mp4', 'mp4'], ['ogg', 'ogg'], ['webm', 'webm'], ['flv', 'flv']], col='3', value=arg['merge_output_format'], desc='병합이 필요한 경우 지정한 포맷으로 병합을 합니다.') }} -->
+	{{ macros.setting_select('postprocessor', '후처리', arg['postprocessor_list'], col='3', desc='다운로드 후 FFmpeg로 후처리합니다.') }}
 	{{ macros.setting_button([['download_start', '다운로드']]) }}
 </div>
 
@@ -15,9 +15,26 @@
 	var package_name = '{{ arg["package_name"] }}';
 
 	$(function () {
+		// 후처리 목록
+		var optgroup = null;
+		$('#postprocessor > option').map(function () {
+			var i = $(this);
+			if (i.val() === '_optgroup') {
+				if (i.text() !== '') {	// optgroup 태그 열기
+					optgroup = $('<optgroup label="' + i.text() + '"></optgroup>');
+					i.before(optgroup).remove();
+				} else {	// optgroup 태그 닫기
+					optgroup = null;
+					i.remove();
+				}
+			} else if (optgroup !== null) {	// optgroup 태그로 이동
+				optgroup.append(i);
+			}
+		});
+
 		// 프리셋 변경
 		$('#preset').change(function (e) {
-			if ($(this).val() == '_custom') {
+			if ($(this).val() === '_custom') {
 				return;
 			}
 			$('#format').val($(this).val());
@@ -26,9 +43,17 @@
 			$('#preset').val('_custom');
 		});
 
+		// 후처리 변경
+		$('#postprocessor').change(function (e) {
+			if ($(this).find($('option[value="' + $(this).val() + '"]')).parent().attr('label') === '오디오 추출') {
+				$('#preset').val('bestaudio/best').change();
+			}
+		});
+
 		// 다운로드
 		$('#download_start').click(function (e) {
-			if ($('#url').val().startsWith('http') == false) {
+			var url = $('#url').val();
+			if (url.startsWith('http') === false) {
 				$.notify('<strong>URL을 입력하세요.</strong>', {
 					type: 'warning'
 				});
@@ -39,9 +64,10 @@
 				type: 'POST',
 				cache: false,
 				data: {
-					url: $('#url').val(),
+					url: url,
 					filename: $('#filename').val(),
-					format: $('#format').val()
+					format: $('#format').val(),
+					postprocessor: $('#postprocessor').val()
 				},
 				dataType: 'json',
 				success: function (data) {

templates/youtube-dl_list.html

@@ -51,12 +51,13 @@
 			data: { },
 			dataType: 'json',
 			success: function (data) {
-				$('#list').html('');
+			    var list = $('#list');
+				list.html('');
 				var str = '';
 				for (var i in data) {
 					str += make_item(data[i]);
 				}
-				$('#list').html(str);
+				list.html(str);
 			}
 		});
 
@@ -87,19 +88,19 @@
 		str += '<td scope="col">' + data.title + '</td>';
 		str += '<td id="status_' + data.index + '" scope="col">' + data.status_ko + '</td>';
 		var visi = 'hidden';
-		if (parseInt(data.percent) > 0 && data.status_str != 'STOP') {
+		if (parseInt(data.percent) > 0 && data.status_str !== 'STOP') {
 			visi = 'visible';
 		}
 		str += '<td scope="col"><div class="progress"><div id="progress_' + data.index + '" class="progress-bar" style="visibility: ' + visi + '; width:' + data.percent + '%">' + data.percent + '%</div></div></td>';
 		str += '<td id="download_time_' + data.index + '" scope="col">' + data.download_time + '</td>';
 		str += '<td id="button_' + data.index + '" scope="col" class="tableRowHoverOff">';
-		if (data.status_str == 'START' || data.status_str == 'DOWNLOADING' || data.status_str == 'FINISHED') {
+		if (data.status_str === 'START' || data.status_str === 'DOWNLOADING' || data.status_str === 'FINISHED') {
 			str += '<button id="stop" class="align-middle btn btn-outline-danger btn-sm" data-index="' + data.index + '">중지</button>';
 		}
 		str += '</td>';
 		str += '</tr>';
 		str += '<tr class="collapse tableRowHoverOff" style="cursor: pointer;" id="collapse_' + data.index + '">';
-		str += '<td colspan="8">';
+		str += '<td colspan="9">';
 		str += '<div id="detail_' + data.index + '">';
 		str += get_detail(data);
 		str += '</div>';
@@ -114,7 +115,7 @@
 		str += info_html('임시폴더', data.temp_path);
 		str += info_html('저장폴더', data.save_path);
 		str += info_html('종료시간', data.end_time);
-		if (data.status_str == 'DOWNLOADING') {
+		if (data.status_str === 'DOWNLOADING') {
 			str += info_html('', '<b>현재 다운로드 중인 파일에 대한 정보</b>');
 			str += info_html('파일명', data.filename);
 			str += info_html('진행률(current/total)', data.percent + '% (' + data.downloaded_bytes_str + ' / ' + data.total_bytes_str + ')');
@@ -126,17 +127,18 @@
 
 	function info_html(left, right, option) {
 		var str = '<div class="row">';
+		var link = (left === 'URL' || left === '업로더');
 		str += '<div class="col-sm-2">';
 		str += '<b>' + left + '</b>';
 		str += '</div>';
 		str += '<div class="col-sm-10">';
 		str += '<div class="input-group col-sm-9">';
 		str += '<span class="text-left" style="padding-left:10px; padding-top:3px">';
-		if (left == 'URL' || left == '업로더') {
+		if (link) {
 			str += '<a href="' + option + '" target="_blank">';
 		}
 		str += right;
-		if (left == 'URL' || left == '업로더') {
+		if (link) {
 			str += '</a>';
 		}
 		str += '</span></div></div></div>';