「彼女とデイトなう」につかえるスクリプトを書きました。 😆

はじめに

こちらのツイートがとても話題になってますね。

そんなこんなで、ブームにのって、「彼女とデイトなう」を実装してみたいと思います。

仕様

まあ、ネーミング先行で中身をなにも考えてなかったので考えます。
Date.now();を実行すると、

コンソールにこの写真が表示されるという仕様で良いでしょう。＾ ＾
でも一応、1970年1月1日からの経過時間もリターンするようにしておきましょう。＾ ＾
Date.now();なんで。＾ ＾

developer.mozilla.org

実装

JavaScript

(function() {
  var now = window.Date.now;

  window.Date.now = function() {
    console.log(now());
    console.log("\n\n\n\n");
    console.log("%c ", "padding: 100px; background:url(https://pbs.twimg.com/media/DBl9HtdVoAAzt1A.jpg:small) center center no-repeat; background-size:contain");
    console.log("\n\n\n\n\n\nhttps://twitter.com/H_KANNA_0203/status/871865582408220672");

    return now();
  };
})();

コンソールに画像を表示される方法を色々考えたんですが、
コンソールにはスタイルを当てることができるので背景画像として指定することにしましょう。

1. 空文字を出力
2. paddingで領域を大きくする
3. 背景画像を当てる
4. 背景画像のサイズを長編合わせのアスペクト非維持にする

という方針でいくことにしました。
また、橋本環奈を大きく表示するためにpaddingを大きく取った結果、複数行にまたがってしまったため、
適当に改行コードを出力しています。

こちらの関数で、window.Date.nowを上書きすればOKです。

DEMO

早速コンソール上で Date.now(); を実行してみましょう。

てってれー。これで彼女とデイトなうにつかえますね。＾ ＾

橋本環奈とDate . now ();

に使っていいよ😆 pic.twitter.com/pXbkqdS6vt

— 君塚史高 (@ki_230) 2017年6月7日

ちなみにいま、PC版のChromeでこのブログを観覧している方は、コンソール上で Date.now(); を実行してもらえれば、もれなく橋本環奈の画像が出力されるはずです。＾ ＾