Monthly Archives: 11月 2014

2014-11-19 JavaScript, WebDev

window.orientationプロパティ

window.orientationというプロパティがあるみたいですね？

Safari: DOMWindow Additions
IE: orientation property (Internet Explorer)

公式の資料として見つかったのはこれくらいでした。MDNには書いてませんでしたし。

IEはどうか分かりませんが、iOSやAndroidでは対応しているようです。対応しているのはモバイル版のみで、デスクトップ版では対応していないとか何とか。実際AndroidのChromeでは数値が返ってきますが、デスクトップ版のChromeではundefinedになります。

以前DeviceOrientationの使い方について書きましたが、その際にscreen.orientation.angleを使って画面の向き(回転角)を取得する方法についても言及しました。

DeviceOrientationイベントは画面の向きを考慮しない値を提供するだけなので、画面の向き(角度)を別途取得するか、画面の向きをロックするかしないと全く使い物にならないんですよね。

このwindow.orientationが使えれば、screen.orientation.angleが使えない場合でも画面の向きを角度で取得することが可能です。

なので、js_deviceorientationとjs_skigameを修正してみました。これで加速度センサーで操作できるかな。

2014-11-18 WebDev

HTML+CSSで縦書き

そういえば結局縦書きってどうなったんだっけ？　と思ったのでテスト。

隴西（ろうさい）の李徴（りちょう）は博学才穎（さいえい）、天宝の末年、若くして名を虎榜（こぼう）に連ね、ついで江南尉（こうなんい）に補せられたが、性、狷介（けんかい）、自（みずか）ら恃（たの）むところ頗（すこぶ）る厚く、賤吏（せんり）に甘んずるを潔（いさぎよ）しとしなかった。いくばくもなく官を退いた後は、故山（こざん）、※(「埒のつくり＋虎」、第3水準1-91-48)略（かくりゃく）に帰臥（きが）し、人と交（まじわり）を絶って、ひたすら詩作に耽（ふけ）った。下吏となって長く膝（ひざ）を俗悪な大官の前に屈するよりは、詩家としての名を死後百年に遺（のこ）そうとしたのである。しかし、文名は容易に揚らず、生活は日を逐（お）うて苦しくなる。李徴は漸（ようや）く焦躁（しょうそう）に駆られて来た。この頃（ころ）からその容貌（ようぼう）も峭刻（しょうこく）となり、肉落ち骨秀（ひい）で、眼光のみ徒（いたず）らに炯々（けいけい）として、曾（かつ）て進士に登第（とうだい）した頃の豊頬（ほうきょう）の美少年の俤（おもかげ）は、何処（どこ）に求めようもない。数年の後、貧窮に堪（た）えず、妻子の衣食のために遂（つい）に節を屈して、再び東へ赴き、一地方官吏の職を奉ずることになった。一方、これは、己（おのれ）の詩業に半ば絶望したためでもある。曾ての同輩は既に遥（はる）か高位に進み、彼が昔、鈍物として歯牙（しが）にもかけなかったその連中の下命を拝さねばならぬことが、往年の儁才（しゅんさい）李徴の自尊心を如何（いか）に傷（きずつ）けたかは、想像に難（かた）くない。彼は怏々（おうおう）として楽しまず、狂悖（きょうはい）の性は愈々（いよいよ）抑え難（がた）くなった。一年の後、公用で旅に出、汝水（じょすい）のほとりに宿った時、遂に発狂した。或（ある）夜半、急に顔色を変えて寝床から起上ると、何か訳の分らぬことを叫びつつそのまま下にとび下りて、闇（やみ）の中へ駈出（かけだ）した。彼は二度と戻（もど）って来なかった。附近の山野を捜索しても、何の手掛りもない。その後李徴がどうなったかを知る者は、誰（だれ）もなかった。

<div style="width:100%; height:30em; overflow:scroll; padding: 1em; font-family: '@ＭＳ 明朝'; writing-mode: tb-rl; writing-mode: vertical-rl; -moz-writing-mode: vertical-rl; -webkit-writing-mode: vertical-rl; ">
本文
</div>

(本文は中島敦山月記より)

WebKit系とIEはいけるみたいですね。

あと、フォントは縦書き用じゃないと色々と不都合が出る気が。

JavaScriptライブラリも色々あるみたいですね。

2014-11-18 Emacs, org-mode

org-mode文書をHTMLでエクスポートするときにLaTeX部分をMathMLへ変換する

先日の修正をdefadviceの形に直した。HTMLエクスポート時にMathjaxを使わずに直接MathMLでエクスポートする。

;; org-html-mathml-export.el

;; 次の二つの関数はhtmlエクスポート時にlatex部分をhtmlへ変換する。
;; - org-html-latex-environment
;; - org-html-latex-fragment
;; この関数において、processing-typeがmathmlのときはmathjaxのときと同じように
;; org-html-format-latexを呼び出すようにする。
;; org-html-format-latexはorg-format-latexを呼び出す。
;; org-format-latexはprocessing-typeがmathmlのときorg-format-latex-as-mathmlを呼び出す。

(defadvice org-html-latex-environment
  (around org-html-latex-environment--html-mathml
          (latex-environment contents info)
          activate)
  (setq ad-return-value
        (let ((processing-type (plist-get info :with-latex)))
          (case processing-type
            ((mathml)
             (let ((org-format-latex-as-mathml-format 'mathml))
               (org-html-format-latex
                (org-remove-indentation
                 (org-element-property :value latex-environment)) ;;latex-frag
                'mathml
                info)))
            ((t)
             ad-do-it)))))

(defadvice org-html-latex-fragment
  (around org-html-latex-fragment--html-mathml
          (latex-fragment contents info)
          activate)

  (setq ad-return-value
        (let ((processing-type (plist-get info :with-latex)))
          (case processing-type
            ((mathml)
             (let ((org-format-latex-as-mathml-format 'mathml))
               (org-html-format-latex
                (org-element-property :value latex-fragment) ;;latex-frag
                'mathml
                info)))
            ((t)
             ad-do-it)))))


(defvar org-format-latex-as-mathml-format 'link
  "org-format-latex-as-mathml関数がどのような形式の文字列を返すかどうかを指定する変数。'linkのときMathMLファイルへのリンクを返す。'mathmlのときMathMLの文字列自体を返す(XMLヘッダー無し)。")

;;
;; org-format-latex-as-mathmlはLaTeX表記をMathMLへ変換する。
;; OpenDocumentエクスポートの時はファイルへのリンクへ変換する。
;; HTMLエクスポートの時はMathMLそのものへ変換する。
;;

(defadvice org-format-latex-as-mathml
  (around org-format-latex-as-mathml--html-mathml
          (latex-frag latex-frag-type prefix &optional dir)
          activate)

  (setq ad-return-value
        (if (eq org-format-latex-as-mathml-format 'mathml)
            (org-format-latex-as-mathml-not-file latex-frag latex-frag-type prefix dir)
          ad-do-it)))

(defun org-format-latex-as-mathml-not-file (latex-frag latex-frag-type
                                                       prefix &optional dir)
  "Use `org-create-math-formula' but check local cache first."
  (let* ((print-length nil) (print-level nil) ;;必要?
         (mathml (org-create-math-formula latex-frag)))

    ;; Successful conversion.  Return the MathML.
    (if mathml
        (progn
          ;; Erase XML header
          (if (eql (string-match "^<\\?xml [^>]+>" mathml) 0)
              (setq mathml (replace-match "" t t mathml)))
          ;; Erase all line breaks
          (setq mathml (replace-regexp-in-string "[\n\r]" "" mathml))

          ;; Add props
          (org-add-props
              mathml

              (list 'org-latex-src (replace-regexp-in-string "\"" "" latex-frag)
                    'org-latex-src-embed-type (if latex-frag-type
                                                  'paragraph 'character))))
      ;; Failed conversion.  Return the LaTeX fragment verbatim
      latex-frag)))

使い方:

これを適当な場所でloadする。
mathtoweb.jarをダウンロードして適当な所に置く。
変数をカスタマイズする。
- org-latex-to-mathml-convert-command を "java -jar %j -unicode -force -df %o %I"
- org-latex-to-mathml-jar-file を "(ファイルを置いた場所)/mathtoweb.jar"
org文書の #+OPTIONS: に tex:mathml を書き加える。

Org2Blogでこれを使うなら:

org2blog/wp-use-wp-latex を nil にする。