[編集モード] なでしこスクリプトをhtmlに変換

プログラムをカラフルなhtmlにしてブログ記事に貼り付けよう

！インデント構文

//なでしこ3スクリプトをブログとかに貼るhtmlに変換するためのプログラム

//--------------------
モード = 「通常」　//「通常」「Qiita」

//--------------------
●正規表現一致(AがBに)
　AをBで正規表現マッチ
　それがAと等しい

//--------------------
//正規表現の設定

//これの次は助詞かもしれないよリスト
次助詞チェックタイプ={}
次助詞チェックタイプ＠「文字列」=1　　//「あ」の
次助詞チェックタイプ＠「単語」=1　　　//対象の
次助詞チェックタイプ＠「終了記号」=1　//[1,1]の
//助詞→助詞　とか　改行→助詞　とか句読点→助詞　の並びはない

助詞一覧取得して、それを「|」で配列結合
助詞はそれ

//先頭にあればここで区切る
//　[\s\S]* は改行を含む
//　.*は改行を含まない
区切り位置候補は[]
区切り位置候補に["助詞",「/^({助詞})/」]を配列追加　//(ならば|だけ|の|で)に正規表現マッチ//次助詞なし
区切り位置候補に["改行",『/^[\r\n]+/』]を配列追加//次助詞なし
区切り位置候補に["空白",『/^[　\s\t\r\n$]+/』]を配列追加//次助詞なし
区切り位置候補に["コメント",『/^\/\*[\s\S]*?\*\//』]を配列追加　/*　*/　//次助詞なし
区切り位置候補に["コメント",『/^[#＃※].*/』]を配列追加　※ 改行まで　//次助詞なし
区切り位置候補に["コメント",『/^\/\/.*/』]を配列追加　　// 改行まで　//次助詞なし
区切り位置候補に["関数宣言","/^●.*?とは/"]を配列追加　//●関数名とは　//次助詞なし
区切り位置候補に["関数宣言","/^●[^\r\n#＃※/]*/"]を配列追加　//●　改行かコメント？まで　//次助詞なし
区切り位置候補に["関数宣言","/^関数[\s|　][^\r\n#＃※/]*/"]を配列追加　//関数(スペース)関数名　改行かスペースまで　//次助詞なし

区切り位置候補に["予約語","/^(もし|違えばもし|違えば|ここまで|。。。|💧|：|:)\s*/"]を配列追加　//次助詞なし
区切り位置候補に["句読点","/^[、。,]/"]を配列追加　//次助詞なし

区切り位置候補に["文字列",『/^「[\s\S]*?」/』]を配列追加　//「　」　//次助詞かも
区切り位置候補に["文字列",『/^\"[\s\S]*?\"/』]を配列追加　//"　""　//次助詞かも
区切り位置候補に["文字列",「/^『[\s\S]*?』/」]を配列追加　//『　』　//次助詞かも
区切り位置候補に["文字列",「/^\'[\s\S]*?'/」]を配列追加　//'　'　//次助詞かも
区切り位置候補に["終了記号",「/^[\]\}\)]+/」]を配列追加　//()の直後に助詞がくることがある　//装飾時は記号扱い

//コメントより記号を後にチェックする（「//」「/* */」より「/」を後にチェックする）
記号一覧=""
記号一覧=記号一覧に『\=|\+|\/|\-|\*|\%|\^|\@|\<|\>|\&|\||\[|\]|$|$|\:|\{|\}|\!|』を追加
記号一覧=記号一覧に『＝|＋|／|－|＊|％|＾|＠|＜|＞|＆|｜|［|］|（|）|：|｛|｝|！|』を追加
記号一覧=記号一覧に『≠|≦|≧|×|÷』を追加
区切り位置候補に["記号",「/^({記号一覧})/」]を配列追加
//↑(記号一覧)+で大丈夫か？→だめ　例）A=[]//コメント

//おまけ　なでしこ1用　3の文法とバッティングしはじめたら消す
区切り位置候補に["関数宣言","/^[■▲][^\r\n#＃※/]*/"]を配列追加　//なでしこ1用　■グループ宣言・▲ジャンプ先
区切り位置候補に["関数名","/^・[^\r\n#＃※/～]*[～\r\n]?/"]を配列追加　//なでしこ1用　グループメンバ

//区切り位置候補=[ [タイプ名,正規表現] ,[タイプ名,正規表現] ,[タイプ名,正規表現]…]
//マッチ部分=scriptを正規表現で正規表現マッチ

//--------------------
//単語+スペースや記号や助詞があれば単語部分を切り取る
他区切り=「/(.+?)(」　//(.+?)の部分が単語　抽出文字列[0]を使用する
他区切り=他区切りに「\s|　|\t|\r|\n|」を追加//空白
他区切り=他区切りに「、|。|,|$|」を追加//句読点
他区切り=他区切りに「#|＃|※|」を追加//コメント
他区切り=他区切りに「{記号一覧}|」を追加
他区切り=他区切りに「{助詞}」を追加
他区切り=他区切りに「)/」を追加
//他区切りをコンソール表示　//→ /(.+?)(\s|　|\t|\r|\n|、|。|,|$|\=|\+|\/|\-|ならば|だけ|の|で)/

//--------------------
//区切った後、単語に対する処理用
//[タイプ名,正規表現]
単語タイプ=[]

//単位　数値としてあつかう
//https://nadesi.com/v3/doc/index.php?%E6%96%87%E6%B3%95%2F%E6%95%B0%E5%80%A4&show#h80b6aa04
単位指定=「(円|ドル|元|歩|㎡|坪|度|℃|°|個|つ|本|冊|才|歳|匹|枚|皿|セット|羽|人|件|行|列|機|品|m|mm|cm|km|g|kg|t|px|dot|pt|em|b|mb|kb|gb)?」

単語タイプに["数値","/[0-9０-９\.]+[eEn]?[0-9０-９]*{単位指定}/"]を配列追加　//小数　000.000　n?はBigInt eは指数
単語タイプに["数値","/0x[0-9０-９a-fA-F]+n?{単位指定}/"]を配列追加 //十六進数 0xFFFF
単語タイプに["数値","/0[ob][0-9０-９]+n?{単位指定}/"]を配列追加//八進数、二進数

//「それ」は予約語一覧取得に入っていて、「対象」はシステム関数一覧取得に入っている。　対象は予約語にいれちゃう
予約語=[]
予約語=予約語一覧取得して、それを予約語に配列足す
予約語に「対象」を配列追加
予約語に「対象キー」を配列追加
//予約語に「」を配列追加　//足りなければここに追加
予約語を「文字数順」で配列カスタムソート
予約語を「|」で配列結合
単語タイプに["予約語","/({それ})/"]を配列追加　//→ "/(インデント構文|エラー監視|反復|それ|抜|続|戻)/"に正規表現マッチ

関数名一覧=[]
関数名一覧=システム関数一覧取得して、それを関数名一覧に配列足す
//関数名一覧に「」を配列追加　//足りなければここに追加
関数名一覧を「文字数順」で配列カスタムソート
関数名一覧を「|」で配列結合
単語タイプに["関数名","/({それ})/"]を配列追加　//→"/(文字列分割|文字削除|区切|切取|置換)/"に正規表現マッチ

//長い順　配列カスタムソート用
●文字数順(A,B)
　それは(Bの文字数)-(Aの文字数)
//--------------------
//初期テキスト
サンプルは"
/*
　　区切りとカラーリングのテスト
*/
単語=[]//コメント文

1から3の配列連番作成して反復
　　対象の乱数を単語に配列追加
ここまで

3回
　　回数を表示
　　続ける
ここまで

●関数テスト
　100+1を戻す
ここまで

//区切りのテスト
10円と10個を掛けて表示
日数＝１#日
SIN(0)+ＳＩＮ(0)//全角半角
「あいう」がかなか判定してください
もしでがならならはたははい //もし出が奈良なら旗ははい
終わり"

//--------------------↓部品
1回
　DOM部品オプション["自動改行"] = オフ
　「h1」のDOM部品作成
　それに「■　なでしこスクリプトをhtmlに変換　■」をテキスト設定

1回
　DOM部品オプション["自動改行"] = オン
　「① ここになでしこ3のスクリプトを貼る（ダブルクリックで全選択）」のラベル作成
　入力欄=サンプルのテキストエリア作成
　入力欄の「幅」に「80%」をDOMスタイル設定
　入力欄の「dblclick」がDOMイベント発火した時には、
　　　入力欄の「select」を空でJSメソッド実行
　
　「↓② 変換ボタンを押す」のラベル作成
　DOM部品オプション["自動改行"] = オフ
　「　HTMLに変換　」のボタン作成
　それをクリック時には
　　　モード = 「通常」
　　　開始ボタンクリック時
　「　Qiita用に変換　」のボタン作成
　それをクリック時には
　　　モード = 「Qiita」
　　　開始ボタンクリック時
　
　文中ニ貼ル用チェック=「文中に貼る用」のチェックボックス作成
　改行作成
　
　DOM部品オプション["自動改行"] = オン
　「↓③ HTML（コピーしてブログに貼ってね）」のラベル作成
　結果欄=「」のテキストエリア作成
　結果欄の「幅」に「80%」をDOMスタイル設定
　結果欄の「dblclick」がDOMイベント発火した時には、
　　　結果欄の「select」を空でJSメソッド実行
　
　「　HTMLをコピー　」のボタン作成
　それをクリック時には
　　　結果欄からテキスト取得
　　　クリップボード設定
　
　//注意書きをかく
　//「」のラベル作成
　
　DOM部品オプション["自動改行"] = オン

1回
　DOM部品オプション["自動改行"] = オフ
　「h1」のDOM部品作成
　それに「■　プレビュー　■」をテキスト設定
　結果ラベル=「」のラベル作成

1回
　DOM部品オプション["自動改行"] = オフ
　「h1」のDOM部品作成
　それに「■　区切り位置（デバッグ用）　■」をテキスト設定
　区切ボックス=["デバッグ用"]のセレクトボックス作成

//--------------------↑部品
//--------------------↓本体動作
//
結果=[]
scriptは空
定数　配列型=TYPEOF(空配列) //たぶん"object"
変換中フラグはオフ

●開始ボタンクリック時
　「分割後出力」の実行時間計測
　「変換にかかった時間：{それの整数部分}ミリ秒」をコンソール表示

●分割後出力
　もし変換中フラグがオンならば、戻る
　変換中フラグはオン
　結果=[]
　script=入力欄からテキスト取得
　もしscriptが空ならば戻る
　構文分割(script)
　結果出力(結果)
　「★分割結果★」をコンソール表示
　結果をコンソール表示
　変換中フラグはオフ

/*
　文頭が助詞かどうかをチェックするフラグがある（初期値はオフ）
　
　scriptが空になるまでループ
　　　タイプ名とマッチ部分は空
　　　
　　　scriptの先頭をチェック
　　　　　（助詞をチェックするフラグがオフの場合場合、助詞の判定は飛ばす）
　　　　　空白・改行・助詞・文字列・記号・関数宣言とかで始まっていたら
　　　　　　　[タイプ名,マッチ部分]にその値を入れる
　　　
　　　上記がマッチしなければ単語+助詞とか、単語+記号だろう
　　　　　次の助詞・記号まで取り出して、単語部分がマッチ部分とみなす
　　　　　※ 単語部分がｘｘする間や、ｘｘ回の場合、その手前が単語としてマッチしたことにする
　　　
　　　ここまででマッチ部分があれば
　　　　　マッチ部分が単語や文字列だったら
　　　　　　　次回は助詞かもしれない→助詞をチェックするフラグをオン
　　　　　マッチ部分が空白や助詞だったら
　　　　　　　次は助詞じゃなさそう→助詞をチェックするフラグをオフ
　　　マッチ部分がなかったら
　　　　　文末に単語が残った状態なので単語として結果に送る
　　　
　　　マッチ部分のタイプを「単語」としていた場合
　　　　　数値・予約語・関数名だったらタイプを変更する
　　　
　　　結果に[タイプ名,マッチ部分]を送る
　　　scriptからマッチ部分を削除する
　　　
　　　続ける
*/
//分割して結果に入れる
●構文分割(script)
　変数　無限ループ検知用=空
　変数　文頭助詞チェック=オフ
　永遠の間
　　　もしscriptが空ならば、抜ける
　　　//ループチェック
　　　もし無限ループ検知用がscriptならば
　　　　　「無限ループの可能性があります」と言う
　　　　　
　　　　　抜ける
　　　違えば
　　　　　無限ループ検知用=script
　　　
　　　//ループごと[タイプ名,マッチ部分]を確定していく
　　　変数　タイプ名は空
　　　変数　マッチ部分は空
　　　
　　　//文頭がマッチするかみる
　　　//空白、コメント、
　　　区切り位置候補を反復
　　　　　変数　[type,正規表現]=対象
　　　　　
　　　　　もしtypeが「助詞」ならば
　　　　　　　もし文頭助詞チェックでなければ
　　　　　　　　　続ける
　　　　　
　　　　　マッチ部分=scriptを正規表現で正規表現マッチ
　　　　　
　　　　　//ｘもしマッチ部分が空ならば、続ける　//nullが返ってくるとしぬ
　　　　　もしマッチ部分===NULLならば、続ける
　　　　　もしTYPEOF(マッチ部分)=配列型ならば//"object"ならば
　　　　　　　「正規表現マッチで配列が返っています({正規表現})」をコンソール表示
　　　　　　　マッチ部分=マッチ部分[0]
　　　　　
　　　　　もし!!マッチ部分ならば
　　　　　　　タイプ名はtype
　　　　　　　//script=scriptのマッチ部分を空に単置換　//マッチ部分を消す
　　　　　　　//[タイプ名,マッチ部分,正規表現]をコンソール表示
　　　　　　　
　　　　　　　抜ける
　　　
　　　
　　　//文頭がマッチしなければ、単語+なにかだと思う。
　　　//（なにか……助詞とか空白とか記号とか）
　　　もしタイプ名が空ならば
　　　　　正規表現=他区切り
　　　　　マッチ部分=scriptを正規表現で正規表現マッチ
　　　　　
　　　　　もし!!マッチ部分ならば
　　　　　　　タイプ名は「単語」
　　　　　　　マッチ部分=抽出文字列[0]　//なにかの手前（句読点、空白、助詞の手前部分）
　　　　　　　
　　　　　　　//例外処理
　　　　　　　//「一致する間」を「一致する」「間」に分ける
　　　　　　　もし（マッチ部分を「/(.*?[ぁ-ん])(間)$/」で正規表現マッチ）ならば
　　　　　　　　　マッチ部分=抽出文字列[0]
　　　　　　　　　
　　　　　　　違えば　　//「10回」を「10」と「回」に分ける
　　　　　　　　　もし（マッチ部分を「/(.+)(以上|以下|未満|超|回)$/」で正規表現マッチ）ならば
　　　　　　　　　　　マッチ部分=抽出文字列[0]
　　　　　　　　　　　
　　　
　　　//タイプ名とマッチ部分が確定
　　　もしマッチ部分が空でなければ
　　　　　//文字列・単語・終了記号)]} の後ろには助詞がくるかも。　文頭・助詞などの次には助詞はこない
　　　　　もし次助詞チェックタイプにタイプ名が辞書キー存在するならば
　　　　　　　文頭助詞チェックはオン
　　　　　違えば
　　　　　　　文頭助詞チェックはオフ
　　　違えば
　　　　　//もうない（文末の単語のみ）
　　　　　タイプ名=「単語」
　　　　　マッチ部分=script
　　　
　　　
　　　//単語が数値・予約語・関数名などならタイプを変更する
　　　もしタイプ名が「単語」ならば
　　　　　タイプ名=マッチ部分をタイプ名判定
　　　結果に[タイプ名,マッチ部分]を配列追加　　　　　　　　　　//↓結果　ここでつくる
　　　script=scriptのマッチ部分を空に単置換　//単語部分を消す

//数値、予約語、関数名とマッチするか見る
//その判定時に送り仮名を削除して判定する
●タイプ名判定(txtを)
　もしtxtが空ならば、「なし」を戻す
　
　//「クリックした時」「等しく無い」　→　「クリック時」「等無」
　//「それ」「かなか判定」「べき乗」　→　「それ」「かなか判定」「べき乗」
　変数　送り仮名無しtxt = 英数半角変換((txtを「/^([ぁ-ん]*)/」で正規表現マッチ) & (txtの『[ぁ-ん]』を空に正規表現置換))
　
　//数値、予約語、関数名とマッチしていたらそのタイプを設定
　単語タイプを反復
　　　変数　[タイプ名,正規表現] = 対象
　　　
　　　もし送り仮名無しtxtが正規表現に正規表現一致するならば
　　　　　タイプ名を戻す
　
　//該当なし
　「なし」を戻す

//-------------区切ったものをhtmlに変換する
●結果出力(結果)
　
　修飾ルール=修飾ルール取得
　
　//分割結果を確認
　区切ボックスに結果をセレクトボックスアイテム設定
　//結果をコンソール表示
　
　//解析結果の加工
　変数　html=""
　結果を反復　　　　　　　　　　　　　　　　　　　　　　　　　　　　//↑結果　ここでうけとる
　　　変数　[タイプ名,txt] = 対象
　　　
　　　もしタイプ名が「終了記号」ならば
　　　　　タイプ名は「記号」
　　　
　　　txt=txtをHTML変換　//　< > & の変換
　　　txt=txtの改行を「 」に置換
　　　txt=txtの「 」を「&nbsp;」に置換
　　　txt=txtのタブを「&nbsp;&nbsp;&nbsp;&nbsp;」に置換
　　　もし修飾ルールにタイプ名が辞書キー存在するならば
　　　　　変数　[前タグ,後タグ]=修飾ルール＠タイプ名
　　　　　html=htmlに「{前タグ}{txt}{後タグ}」を追加
　　　違えば
　　　　　html=htmlにtxtを追加
　
　
　//出力モードのフラグの確認
　文中ニ貼ル用チェックの「checked」をDOM属性取得
　もしそれがオフならば
　　　変数　[前タグ,後タグ]=修飾ルール＠「長文用」//pre+codeタグやBLOCKQUOTEタグ
　　　html=「{前タグ}{html}{後タグ}」
　違えば
　　　変数　[前タグ,後タグ]=修飾ルール＠「文中用」//codeのみ
　　　html=「{前タグ}{html}{後タグ}」
　
　結果欄にhtmlをテキスト設定
　結果ラベルにhtmlをHTML設定

#-----------------------------------------------------------------------
//サンプルの出力
開始ボタンクリック時

#-----------------------------------------------------------------------
//カラーリング設定　ここをいじる
//修飾ルール＠タイプ名 = [タグ,閉じタグ]
//<タグ>テキスト</閉じタグ>
//<pre><code>html</code></pre>
●修飾ルール取得
　修飾ルール={}
　
　もしモードが「Qiita」ならば
　　　修飾ルール＠「長文用」=[『<blockquote>』,『</blockquote>』]//ブロック
　　　修飾ルール＠「文中用」=[『<code>』,『</code>』]//codeのみ
　　　
　　　修飾ルール＠「句読点」=[『』,『』]
　　　修飾ルール＠「空白」=[『』,『』]
　　　修飾ルール＠「改行」=[『』,『』]
　　　修飾ルール＠「予約語」=[『』,『』]　//条件分岐、反復、続ける　など
　　　修飾ルール＠「関数宣言」=[『』,『』]　//●関数宣言
　　　修飾ルール＠「文字列」=[『』,『』]
　　　修飾ルール＠「コメント」=[『』,『』]
　　　修飾ルール＠「記号」=[『』,『』]
　　　修飾ルール＠「助詞」 =[『』,『』]
　　　
　　　修飾ルール＠「数値」=[『』,『』]
　　　修飾ルール＠「関数名」=[『』,『』]　//システム関数・変数
　　　修飾ルール＠「なし」=[『』,『』]　//ユーザー変数
　　　修飾ルールを戻す
　違えばもしモードが「Qiitaダーク」ならば
　　　//未実装
　違えばもしモードが「通常ダーク」ならば
　　　//未実装
　違えば
　　　//通常
　　　修飾ルール＠「長文用」=[『<pre style="background-color:#FFEEFF"><code>』,『</code></pre>』]//ブロック
　　　修飾ルール＠「文中用」=[『<code>』,『</code>』]//codeのみ
　　　
　　　修飾ルール＠「句読点」=[『』,『』]
　　　修飾ルール＠「空白」=[『』,『』]
　　　修飾ルール＠「改行」=[『』,『』]
　　　修飾ルール＠「予約語」=[『』,『』]　//条件分岐、反復、続ける　など
　　　修飾ルール＠「関数宣言」=[『』,『』]　//●関数宣言
　　　修飾ルール＠「文字列」=[『』,『』]
　　　修飾ルール＠「コメント」=[『』,『』]
　　　修飾ルール＠「記号」=[『』,『』]
　　　修飾ルール＠「助詞」 =[『』,『』]
　　　
　　　修飾ルール＠「数値」=[『』,『』]
　　　修飾ルール＠「関数名」=[『』,『』]　//システム関数・変数
　　　修飾ルール＠「なし」=[『』,『』]　//ユーザー変数
　　　修飾ルールを戻す

デバッグキャンバス: 幅 × 高

🍯 なでしこ3貯蔵庫

[編集モード] なでしこスクリプトをhtmlに変換

素材のアップロード