すなばいじり

はてなブログを使って、トンピーを揃えるまで止めないブログ。ふっくらかわいい。

はてなブログで、とりあえずJSONをカラフルにしたいと願うエントリー

最初に一番伝えておきたい事を出しましょう

見たままモード中でも使えると捗るやつです。
現在、はてなダイアリーに専用の下書きを用意して、プレビューをコピー→貼り付けを行っています。
一部のはてな記法が文中でも使える事は知っているのですが、はてな記法モードタグ的な何かがあると良いかな と思います。*1

シンタックスハイライト内のやつはキーワードリンク、URL自動リンクが抑制されていると両手を挙げて喜びます。*2
シンタックスハイライト内で横スクロールが発生する」という件もありますが、こちらは好き嫌いが有るので「嫌ならCSSに各自書き込めば良い」という部分で落ち着く感があります。パラメータの羅列になりがちなJSON辺りは、スクロールしない表示の方が相性が良いのではないかな。と思うやつです。

JSONとかJSON-LD

※以下は、サンプルとして「分かれば良い」というやつなので、不正確なサンプルです。

{
  "@context": "http://schema.org",
  "@type": "Thing",
  "itemListElement": [
    {
      "@id": "1",
      "@type": "Listitem",
      "count": 1,
      "json-ld": "JSON-LDのやつ など。"
    }
  ]
}

JSON扱えれば良い という気がするやつです。
わりと利用されているやつです。わがままを言えば、階層ごとに色分けしたり、数値は色分けしたりすれば良い感じになるのではないかと思います。

scriptタグで囲んでJavaScriptかHTMLとして扱え?
ええ、そうなのですが、

//javascript
{
  "@context": "http://schema.org",
  "@type": "Thing",
  "itemListElement": [
    {
      "@id": "1",
      "@type": "Listitem",
      "count": 1,
      "json-ld": "JSON-LDのやつ など。"
    }
  ]
}

はい。

<script>
//html
{
  "@context": "http://schema.org",
  "@type": "Thing",
  "itemListElement": [
    {
      "@id": "1",
      "@type": "Listitem",
      "count": 1,
      "json-ld": "JSON-LDのやつ など。"
    }
  ]
}
<script>

このような感じです。

TypeScript

リストには無いですが、対応していますね。

module Htnpsne.APISample {
    var version: string = "1.0.2";
    export var htmlTagData: any = document.getElementsByTagName("html")[0].dataset;

    //カテゴリー有無のチェック
    export function test(categoryName: string = '') {
        //はてなブログでは カテゴリ名に空白(全半角)がある場合はハイフンに変わります。
        // "foo bar"→"foo-bar" "foo bar"→"foo-bar"
        return 1;
    }
}

良かったですね。


コピペしてくる行為が面倒になったら拡張機能作って自力で何とかしなさい。と諭されるエントリー。*3

お題「シンタックス・ハイライト機能で対応してほしい言語」



くまったやつ。

*1:抑制記法の逆

*2:正しいモードで書けば、実現できているのですが、持ち込むと駄目だったりするのですよ。

*3:リポジトリ公開して皆でわいわい突っ込んでいく、という流れでどう?というエントリーをみて、「あ、はてならしいですねそれ」と思ったやつ。 tex記法のように「後からライブラリでレンダリングする」という方法でも良いのですが、サーバー側で終わっていると閲覧者側に優しいコンテンツになります。RSS配信時の表現などもありますし。はい。