Labs

<< 最初 < 前ページ 次ページ > 最後 >>
icon Targetを利用せずに新規ウィンドウを開く（rel,class） (2019/06/14)
クラス名や「rel」アトリビュートを指定して、新規ウィンドウで開く

サンプル

html_samples/popup.html

HTML

    <a href="http://yoo-s.com" rel="popup" window_name="window_name" window_option="width=500,height=500,toolbar=yes,menubar=yes,scrollbars=yes">rel New Window</a>
    <a href="http://yoo-s.com" class="popup_class" window_name="window_name" window_option="width=500,height=500,toolbar=yes,menubar=yes,scrollbars=yes">class New Window</a>
HTML属性にウィンドウ名「window_name」、オプション「window_option」を指定した

rel を指定して開く

rel属性を指定した querySelectorAll() で NodeList を取得して click イベントを登録
（IEだと単にループで回せないので、一工夫必要）
    function loadPopupRelEvent(rel_name) {
        var popupEvent = function(event) {
            var window_name = '_blank';
            var window_option = null;
            if (this.getAttribute('window_name')) window_name = this.getAttribute('window_name');
            if (this.getAttribute('window_option')) window_option = this.getAttribute('window_option');
            window.open(this.href, window_name, window_option).focus()
            event.preventDefault();
            event.stopPropagation();
        }
        var query_string = '[rel = "' + rel_name + '"]';
        let elements = document.querySelectorAll(query_string);
        if (!elements) return;
        [].forEach.call(elements, function (element) {
            element.addEventListener('click', popupEvent, false);
        });
    }
    document.addEventListener('DOMContentLoaded', function () {
      loadPopupRelEvent('popup', params);
    });

クラス指定して開く

getElementsByClassName() で HTMLCollection を取得して click イベントを登録
（IEだと単にループで回せないので、一工夫必要）
    function loadPopupClassEvent(class_name) {
        var popupEvent = function(event) {
            var window_name = '_blank';
            var window_option = null;
            if (this.getAttribute('window_name')) window_name = this.getAttribute('window_name');
            if (this.getAttribute('window_option')) window_option = this.getAttribute('window_option');
            window.open(this.href, window_name, window_option).focus()
            event.preventDefault();
            event.stopPropagation();
        }
        let elements = document.getElementsByClassName(class_name);
        if (!elements) return;
        [].forEach.call(elements, function (element) {
            element.addEventListener('click', popupEvent, false);
        });
    }
    document.addEventListener('DOMContentLoaded', function () {
      loadPopupClassEvent('popup_class', params);
    });
要素にclickイベントを登録し、正規表現でURLパースする
icon $(document).on() をネイティブでコーディング (2019/06/03)
jQuery の $(document).on() をネイティブでコーディング
document.addEventListner() で記述するが、ネイティブの場合はターゲット(Event.target)が何かによって条件分岐が必要

idの場合

    //jQuery
    $(document).on('click', '#id_name', function() {
        //working
    });

    //native
    document.addEventListener('click', function(event) {
        if (event.target.id === 'button') {
            //working
        }
    });

classの場合

    //jQuery
    $(document).on('click', '.class_name', function() {
        //working
    });

    //native
    document.addEventListener('click', function(event) {
        if(event.target.classList.contains('class_name'))
            //working
        }
    });
querySelectorAll() で取得する方法もある。
ただ、addEventListener() を事前登録するため、後にHTMLを発生さした要素では動作しないのでイベント管理が必要

classの場合

        document.querySelectorAll('.class_name').forEach(function(element) {
            element.addEventListener('click', function(event) {
                //working
            });
        });
icon [Git]不要ファイル履歴削除 (2019/05/28)
・git clone が重い
・秘密のファイルを Commit してしまった
など、過去にファイルを Commit & Pull してしまった場合、問題ファイルをなかった事にしたい事がある。
「git filter-branch」を利用して履歴を削除する事で解決できるが、破壊的に履歴を書換える為、作業には注意が必要

PHPサンプルスクリプト

destory_git_history.php

オブジェクト容量の大きいファイルを検出

git_find_big.sh で大きなオブジェクトを抽出
$ du -sh .git/objects
12M .git/objects
$ sh git_find_big.sh
「git_find_big.sh」は、gitコマンドを用いて「.git/objects/pack/pack」内の容量の多いオブジェクト順で抽出している

履歴を抹消

抽出したファイルやディレクトリを削除
（refs/heads/master と refs/remotes/origin/master を書き換える。）
※ディレクトリの場合は「git rm -r」
$ git filter-branch -f --index-filter 'git rm --cached --ignore-unmatch ファイルパス' --prune-empty -- --all
Rewrite b270c665ec3e7152d611f57caa0f2288c1b6d4b2 (71/662) (9 seconds passed, remaining 74 predicted)
...
Ref 'refs/heads/master' was rewritten

ガベージコレクションを利用して不要なオブジェクト、ログを削除
$ git gc --aggressive --prune=now
Counting objects: 29352, done.
Delta compression using up to 8 threads.
Compressing objects: 100% (29137/29137), done.
Writing objects: 100% (29352/29352), done.
Total 29352 (delta 25019), reused 4279 (delta 0)

$ git reflog expire --expire=now --all

gitオブジェクトのリパック
$ git repack -A -d
Counting objects: 28584, done.
Delta compression using up to 8 threads.
Compressing objects: 100% (3888/3888), done.
Writing objects: 100% (28584/28584), done.
Total 28584 (delta 24481), reused 28577 (delta 24478)

$ du -h .git/objects/pack/*
804K .git/objects/pack/pack-d29fd9436341bc9c424baf3089e4acaf7fb4fa06.idx
11M .git/objects/pack/pack-d29fd9436341bc9c424baf3089e4acaf7fb4fa06.pack

強制的にPush

$ git push --force origin master
Fetching remote heads...
refs/
refs/heads/
refs/tags/
updating 'refs/heads/master'
from a24f9d199d061c9edf46ff60f5b6fc83512c5cfc
to 357aa42bd0903a3f6721c74bbedfbaae994662dc
sending 488 objects
done
共同作業している場合は、clone してもらった方が安全か？

<< 最初 < 前ページ 次ページ > 最後 >>