honjarake blog

自分用にテキトーにまとめる

JavaScript ページ読込切替しないページ　(URLは変わっている・履歴も残る)

Firefox javascript

一部のサイトでページ移動したように見えるのに
loadイベントが走らないページがあるのは、なぜなのか？
調べて行き着いたのが、このサイト

で、ページの一部だけ読み込み、変更して
URLは読み込んだページに変え、履歴に突っ込むみたいな感じなのかな
（追記：多分、これ→【JavaScript】pushStateとAjaxを使って非同期通信 | Web活）

と思って試したんだけど、Firefoxだからなのか、pushState された瞬間を検知しない
いや、pushState イベントの検知タイミングが違うのか？
以前、どこかのサイトで、「～イベントは、Firefoxではキャッシュを読みに行くパターンがあり、そのときは発生しない」と見たような気がする
はてブ登録しとけばよかった…

関係ありそうなサイト（あとで読む、あとで試す）

popStateとpushStateについて

XUL


戻るボタンを押したとき検知しない？（Firefoxじゃないけど）

移動する前に何かできないか（検知できないと思うが）

今回は移動前のクリックイベントを監視してみようと思う。

Stylish で Firefox の ツールバーのスタイルをいじる

Stylish CSS

Stylishってこんなこともできるんだな
とりあえず、FirefoxのUIであるXUL(ズールって読むらしい)がどうなってるのか見てみる
アドレスバーに

chrome://browser/content/browser.xul

を入力すると見れた

んでもって、Stylish側のコードを書くときのnamespaceは

@namespace url(http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul);

編集したい場合はスタイルの管理から開いて修正する

追記

Stylishのエディタの挿入ボタンからXULを選べば楽
データURIとかも使えたのかあ…

水道管の結露　他

身の回り メモ

水道管の結露を解決

家の洗濯機周りの床に薄っすら水がにじんでいた
水漏れかと思って知り合いの詳しい人に見てもらったら
水道管が結露を起こしているのが原因らしい

と、いうことで、ホームセンターで対策グッズを買いにいったのだが
結露を防ぐテープ？とやらがあるらしいと聞いたのに、どこにもなかった

結局、水道管に巻く筒状のスポンジ？
（ライトカバー、ラバーチューブというらしい）を買った
直径13cm*2m～16cm*2mで300～500円くらいだった。2mは思ったより長くていらないなあ
とりあえず、切り取って取り付けて様子を見てみる

一応、テープタイプというのも気になるのでもう一度探してみようかな

スクリプト作成

moon child の escape を聞きながらスクリプト作成中
ひとまず完成と言えるが、対応サイトのデザインが変わるらしい？
完全に移行したら、新サイト用も作らなきゃ意味ないな…
デザインが変わっても、もっと柔軟にID引っ張ってこられるように作っておくべきだったな

JavaScript 要素の絶対座標

javascript 
function getElemAbsolutePosition(ctrl){
  try {
    var rect = (function (elem) {
      var html = document.documentElement;
      var rect = elem.getBoundingClientRect();
      var left = rect.left - html.clientLeft;
      var top = rect.top - html.clientTop;
      return {
        left: left,
        top: top
      };
    }) (ctrl);
    _CONTROLS.top = rect.top;
    _CONTROLS.left = rect.left;
  } catch (e) {
  }
}

保存ボタンを押したときの結果tooltip表示位置に使用
スクリプトが形になってきた！

視力減退　視力回復トレーニング

まとめ

視力が異様に落ちた。スマホが原因だろうか
メガネをかけてディスプレイをみるのは始めてで目が疲れる

とりあえず、目のトレーニングをやってみる

立体視も試してみた
交差法と平行法があるけど、交差法しかうまくいかない

アプリや画像も試す
スマホでトレーニングというのもなんとなく変な感じだけど

他にも何かグッズとかあれば使っていきたいと思う

JavaScript HTMLエスケープとHTMLデコード

javascript プログラミング

JavaScript 文字列のエスケープについて - honjarake blog
前回の件の続き
結局、デコードは凝ったことをやめ、replaceした
特殊記号エスケープはCSSのセレクタ用にピンポイントで使う

/* escape */
// HTMLエスケープ
function NNSH_escapeHTML(str) {
  return str.replace(/[&"<>,']/g, function (c) {
    console.log('esc:' + c);
    return {
      '&': '&amp;',
      '"': '&quot;',
      '<': '&lt;',
      '>': '&gt;',
      ',': '&#044;',
      '\'': '&#039;'
    }[c];
  });
}
// 特殊記号エスケープ
function NNSH_escapeEx(str) {
  return str.replace('\\', '\\\\')
  .replace('\'', '\\\'')
  .replace('"', '\\"');
}
/* decode */
function NNSH_decodeHTML(str) {
  return str .replace(/&lt;/g, '<') .replace(/&gt;/g, '>') .replace(/&quot;/g, '"') .replace(/&#039;/g, '\'') .replace(/&#044;/g, ',') .replace(/&amp;/g, '&');
}

GM_getValueが動かない？

greasemonkey エラー

@grant GM_getValue 宣言したのにis not defined エラーが出る

公式からのコピペだし、表記は間違っていない
途中、何回もデバッグを繰り返していたら
デバッガの調子がおかしくなったのかログがでなくなった
その後も、期待通りの動きをしていない

window.load前のhtmlタグみたいに、GM関数のロードのタイミングの問題とか？
とりあえず、try catch してデバッグ用の値で動かしている。（エラー、正常の両方でconsole.log 出してあるが表示されない）

今日は、もう疲れた。ソースもう少しまとめよう･･･

追記

後日、開いてみると、@grant noneに戻っていた
他の部分は修正後の状態だった
宣言だけ修正したら、今後はちゃんと動いたので、ひとまず解決
firefoxの再起動を行って、駄目ならOS再起動したほうが吉

再追記

またエラー出た…もういやだ
自分で作ったsetValue,getValue関数で代用した
greasemonkey データの保存 - honjarake blog

最初からこうすれば良かった