고양이 달 아유무입니다. 잘 부탁드립니다.

대상

해설 동영상을 보고 심호리하고 싶은 사람

해설 동영상은 이쪽 h tps : // 니코 ゔ에서. jp/watch/sm36117230

Chrome 확장 프로그램/JavaScript에 대해 궁금한 점

니코 주

무엇을 만들었는가

제목대로.



여기에서 배포 중.

공식 사이트

htps : // 해. 고양이. 메/니코아 d-에 x/

Chrome 웹 스토어

htps // ch 로메. 오, ぇ. 이 m/우ぇbs 잡아/대체 l/%에3%83%8B%에3%82%B3%에3%83%8B%에5%이면%83%에5%91%8아아 x/ lfmmpoa cjifgjmhgmhngbfhdjlmb

메커니즘

동영상의 내용을 조금 자세히 한 것이 아래 그림


모든 코드는 여기
htps : // 기주 b. 코 m/아유무네코즈키/니코아 d-에 x/bぉb/마s r/sc리 pt. js

script.js

//ID取得
//各PC環境エラー回避(新市場リロード・動画プレイヤー読み込み速度など)のための3.5秒待ち
setTimeout("getID()", 3500);

function getID() {
    //URLからID取得（watch/??xxxxの形統一なので楽）
    var nicoID = location.pathname.slice(7, 18);
    //分岐
    if //省略 
    //ifで上で取得したtypeを sm/nm→動画用スクリプト、lv→生放送用スクリプト に振り分ける
}

//ニコ動
function videoscript() {
    //視聴者・投稿者でclass指定のズレが生じるのでtry catchで動かしてます（もっといいやり方ある気がする）

    try { 
        //視聴者用
        //2 従来 ニコニ広告ボタン にid付与
        //3 従来 ニコニ広告ボタン 削除
        //4 マイリストボタン にid付与
        //5 広告ex.ボタン・生成
    } catch{ 
        //投稿者用
        //2 従来nicoadにid付与
        //3 従来nicoadボタン削除       
        //4 mylistにid付与
        //5 広告ex.ボタン・画像追加      
    }

    //6 ボタンクリック時
    document.getElementById("nicoadex").onclick = function () {
        //div 書き換え
           //class取得→innerhtmlでまるごと書き換え(iframeはsrc="hoge"で入れておく)

        //close処理
        document.getElementById("exclose").onclick = function () {
        //☓ボタンクリック→書き換えた内容をinnerhtmlで空っぽにする
        };

        //iframe url replace
        var iframe = document.getElementById('nicoadex-iframe');
        iframe.contentWindow.location.replace('https://nicoad.nicovideo.jp/video/publish/' + nicoID + '?frontend_id=6&frontend_version=0&video_watch');
    };

}

//ニコ生
function livescript() {

    var s = 0; //←後の分岐を楽にする用

    //初回動作
    loop();

    //error 広告ボタン取得失敗
    function ErrorNotAd() {
        //エラーログ用
        //画面左下（いつもは「追っかけ再生を開始しました」とか出てくるところ）に表示させる
    };

    //error 複数
    function Errormore() {
        //エラーログ用2
    }

    //エラーcloseボタン 
    function errordelbut() {
        //エラーメッセージ☓ボタン処理 
    }


    //基本処理
    function loop() {
        try {
            //新市場divチェック
        } catch{
            エラー = 広告・ギフト未対応（公式番組しか存在しないのでそこまで出ないエラー）
            ErrorNotAd();
        }


        if (label0 == "ギフト") {
            //4 ギフトボタンにid付与
            lvgift();
        } else {
            //4 代用 新市場メニューボタンにid付与
        }

        function lvgift() {
            //上記ギフト版処理
            try {
                //従来 ニコニ広告 ボタンにid付与・削除
            } catch{
                エラー = 広告未対応番組（放送枠取り時点で広告禁止設定で放送をしている）
                ErrorNotAd();
            }
        }

        function lvichiba() {
            //上記新市場版処理
            try {
                //従来 ニコニ広告 ボタンにid付与・削除
            } catch{
                エラー = 広告未対応番組（チャンネル放送枠取り時点で広告禁止設定で放送をしている）
                ErrorNotAd();

            }
        }

        try {
            //5 広告ex.ボタン・画像追加
            //-- aria-lavel変更（hoverで文字が出てくる）

            try {
                //6 ボタンクリック時
                document.getElementById("nicoadex").onclick = function () {
                    if (s == 1) {
                        //ギフトにクリックアクション
                    }
                    if (s == 2) {
                        //新市場ボタン押せるかチェック
                        if (label2 == "この番組ではネタを追加できません") {
                            //新市場ボタン 押せない（新市場禁止枠）
                            //display:none;の切り替えで対応
                        }
                        else if (tmp10[0].hasAttribute("disabled")) {
                            //新市場ボタン 押せない（タイムシフト）
                            //display:none;の切り替えで対応
                        }
                        else {
                            //新市場ボタン 押せる
                            //偽のクリックアクション
                        }
                    }
                    //iframe url replace
                    var iframe = document.getElementById('RICH-IFRAME');
                    iframe.contentWindow.location.replace('https://nicoad.nicovideo.jp/live/publish/' + nicoID + '?frontendId=12');
                }

                //追っかけ対応処理 idチェックなければ基本処理実行 1秒に1回チェック
                var checkadex = function checkad() {
                    if (document.getElementById("nicoadex")) {
                        console.log("ニコニ広告ex.: 動作中です");
                    } else {
                        loop();
                    }
                }
                setInterval(checkadex, 1000);

            } catch{
                //エラー = 予期せぬエラー 他のエラーが複数出てる可能性?
                Errormore();
            }
        }
        catch {
            //エラー = 予期せぬエラー 他のエラーが複数出てる可能性?
        }
    }
    console.info("ニコニ広告ex.: メイン処理完了");
}

상당히 끝을 접었지만, 이것이라도 긴 생각이 들지 않아도 됩니다.
Qiita에서 보니 오랫동안 느끼는 것일까?

살짝 해설.

URL에서 ID를 가져옵니다. 동영상·생방송 공통으로, /watch/ID 그래서 취득이 편합니다.
취득한 ID로부터 동작을 분기.

동영상의 경우.

기존의 니코니 광고 버튼을 삭제, ex 버튼을 생성.
ex 버튼을 클릭하면 내 리스트 버튼에 액션이 가서 내 리스트의 div를 다시 쓰는 형태로 표시됩니다.

생방송의 경우.

분기가 많아 귀찮아.

분기 1: 광고 대응하고 있는가. "아니오"→ "오류 메시지를 발행하고 종료"

분기 2 : 선물에 대응하고 있는지 여부 → 신시장에서 대용 (분기 2-2)

분기 2-2 : 신시장을 사용할 수 있는지 여부 → display:none; 전환으로 대응

기존의 니코니 광고 버튼을 삭제, ex 버튼을 생성.

분기 2 → 대응 : ex 버튼을 클릭하면 선물 버튼에 액션이 가서 선물 iframe의 src 다시 쓰기로 표시됩니다.

분기 2-2 → 대응 : ex 버튼을 클릭하면 신시장 버튼에 액션이 가서 신시장의 iframe src 다시 쓰기로 표시됩니다.

분기 2-2 → 대응 없음 : ex 버튼을 클릭하여 display : none;`의 전환으로 대응. div 재작성, 이후 전환으로 구현.

생방송 추격 재생 대응

1초 간격으로, 해당하는 id(광고 ex. 버튼)를 체크. 없으면 처리 재실행.

반성점

기술 부족이 눈에 띄는

기술을 알면서 만들어 갔기 때문에 처리가 통일되지 않았다 (특히 생방송)

처리가 돌아다니는 곳이 있다(느낌)

코드가 엉망 (이것이라도 공개 전에 어느 정도 깨끗하게 다시 한 녀석)

현재 버그

니코니 광고 티켓을 전환 할 수 없음

한 번 "티켓을 사용하지 않음"을 선택한 후 다시 선택하면 피할 수 있습니다

니코니 광고측의 js가 잘 움직이지 않습니까? 어딘가에 어울렸습니까? (현재 원인 불명)

여담

jQuery 넣고 있지만, 일절 사용하지 않는다 (아마)

자바 스크립트 초보자, jQuery는 더 몰라

'니코니 광고 ex.'의 ex. 는, 어리석은 의미의 ex

확장 기능의 심사에 1 주일 정도 걸릴까라고 생각하면, 설마의 하루 부족으로 끝나 버려 놀랐다

사이고에게

풀릭, 이슈 기다리고 있습니다.

다음은 Vket4를 향해 무엇인가 만들려고 생각합니다.