【Textwell】ReLineのデザインもフラットしてみました

iOS7風を考えたけど、なんか違うかも。


Textwellを段落編集エディタに変える ReLine
台風の影響で外は大雨。時間もたっぷりあるし、大物の移植に取り掛かりました。まだBubblesが登場してないので、段落単位での移動や削除がしづらくなっています。いずれ出るのでしょうけど、それでもオンライ...
行編集アクションのReLine。前のデザインだとゴツゴツとしていたのでペラペラにしてみました。オマケで機能強化してます。相変わらず行儀悪いスクリプトですけど。


Textwell 1.1.6
分類: 仕事効率化,ユーティリティ
価格: \300 (Sociomedia)

ソースを大幅に書き直しました。closeletsの骨法がほのかに見えてきた。

<meta name=viewport content=initial-scale=1,user-scalable=no>
<title>ReLine</title>
<style>
  body{
    background:white;
    word-wrap:break-word;
    margin:0;
  }
  hr{
    border:1px #f4f4f4 solid;
  }
  table{
    width:100%;
    table-layout:fixed;
  }
  td.num{
    width:32px;
    color:white;
    background:#ff0033;
    vertical-align:top;
    text-align:center;
  }
</style>
<body id=wine>
<script>
  last=0;
  view=1;
  list=new Array();
  stack=new Array();
  list=T.text.split("\n");
  Disp();
  len=T.text.length;
  wine.ontouchstart=switchView;

  function Disp(){
    s="<hr>";
    for(i=0;i<list.length;i++){
      content=(view)?list[i]:list[i].replace(/</g,"&lt;");
      s+="<table><td class=num onClick=Minus("+i+")>"+("000"+(i+1)).slice(-4)+"</td><td onClick=Plus("+i+")>"+content+"</td></table><hr>\n";
    }
    wine.innerHTML=s;
    T.title("ReLine: "+stack.length);
  }

  function Minus(x){
    stack.push(list[x]);
    list.splice(x,1);
    Count(x)
  }

  function Plus(x){
    s=(stack.length)? stack.pop():"";
    list.splice(x,0,s);
    Count(x)
  }

  function Count(x){
    last=0;
    for(i=0;i<x;i++)last+=list[i].length+1;
    Disp()
  }

  function switchView(e){
    if(e.touches.length>1){
      view=1-view;
      Disp();
    }
  }

  T.closelets([{
    title:"保存する",
    fn:function(){
      s=list.join("\n");
      T("replaceRange",{
        text:s,
        replacingRange:{len:len},
        selectingRange:{loc:last}
     })}
  }])
</script>
</body>

登録リンクはこちら→ http://tinyurl.com/p4kzdyj



左側の行番号をタップすれば削除。削除された行の数はタイトルバーに表示されます。



本文をタップすると挿入。削除された行が復活する。この操作で行の移動をします。スタックですね。もしスタックが空になっているときは、空行を代わりに挿入します。



画面を閉じると、並べ替えた順に保存します。今回新しい変更点として、最後に触った行にカーソルが移動するようにしました。全体を見て飛べる。長文の編集も楽になります。



プレビューとコード表示を切り替える機能も復活しました。二本指でスワイプしてください。またレイアウトが崩れるケースがあったので、その不具合も修正しました。
Textwellも安定してきたので、そろそろBubblesが出るんじゃないかな。すると、もう一段大きな塊で文章を扱えるようになるかも。「テキスト」はのっぺらぼうな顔をしていても、補助線の引き方次第で新しい発見がある。Textwellはそれを軽くこなすので面白いです。

  • Textwellで段落の順序を入れ替えるアクション Reorder