colorboxのjavascriptによる分岐操作について

Question

サイト訪問時に動画が自動再生するポップアップに対して、以下の＜A＞＜B＞の分岐を組み込みたいのですが、どのようにすればよいでしょうか？

＜A＞
動画終了時、ポップアップが自動で閉じる

＜B＞
動画終了前にポップアップを手動で閉じた時、自動で閉じる処理がキャンセルされる

以下、scriptのコードになります。

$(document).ready(function(){
	$(".hogehoge").colorbox({
		inline: true,
		open:true,
		width:"98%",
		rel:'group',
		closeButton:'true',
		onComplete: function(){
			var video = $("#video").get(0);
			video.play();
			video.addEventListener('ended',function() {
				$("#video").remove();
				$("#cboxOverlay").remove();
				parent.$.colorbox.close();
			});
		},
		onClosed: function(){
			video.currentTime = 0;
		}
	});
});

ご教示いただけますと幸いです。
宜しくお願い致します。

Comments

[Lhankor_Mhy]

ご不明の点は「自動で閉じる処理をキャンセル」する方法と理解してよろしいですか？

[k-katapashi]

拙い文章で申し訳ありません。
はい、仰る通りです。
宜しくお願い致します。

Answer 1

＜A＞は実装済みのようですね。
＜B＞はremoveEventListenerを使ってvideo.addEventListener('ended'で設定したイベントを削除すればいいかと思います。
EventTarget.removeEventListener - Web API | MDN

Comments

[k-katapashi]

ご回答ありがとうございます。
removeEventListenerを使ってみたら、希望通りの形に再現することができました！
ありがとうございました！