2013年3月22日金曜日

Macでフォルダの名前を変更する

Windowsで言うところの『フォルダ左クリックしてF2』でフォルダ名変更状態に入るあれです。
今までは
フォルダ右クリック➡プロパティ的なの➡フォルダ名の部分を編集
でいちいちやってた。

で、さすがにめんどくなったのでgoogle先生で
『mac フォルダ名 変更 ショートカット』
とか検索してみると、
『フォルダを右クリックした状態(アイコン反転した状態)でEnter押せばいいよ』
って出てきた。

ハハハ こやつめ
さすがにそんな簡単なはずあるまい

………
……

できちゃったよ…
以下のカンジ。


右クリックとかで選択状態にしてEnterを押すと

編集状態に


編集してフォーカスを外したりすると

編集終了

早くググっておけばよかったーーー

2013年3月3日日曜日

Twitterのbootstrapを使ってみるその2 ~使ってみる~

というわけで前回の続きをやっていきます。

今回やるのは
  1. 挙動制御はデータの属性ではなくJavaScript制御にしたい
  2. モーダル起動のフォームがリンクになっているのでボタンにしたい。
  3. モーダルの中身を修正したい
  4. ボタンのテキストを変えたい
というできる人なら速攻でできそうなヤツです。
でもワタクシはできる人ではないので少しずつ見ていきます。

JavaScriptで動かす場合は、



コントローラフォーム(『押したときにモーダルを立ち上げようとするボタンとかリンク』のこと)のclickイベントをハンドリングして、modal('show');
を呼び出すとモーダルが立ち上がる、という感じなので以下のコードになりました。

htmlのほう
    
    
  
  
  


クリックイベントでモーダルを立ち上げるJavaScriptは以下のカンジ
#ムロンreadyイベント中にハンドリングしている


    // イベント詳細ボタンが押されたらモーダル立ち上げ
    $("#button-showmodal").click(function(){
        // HTMLで定義したtestModalをセレクトしてモーダルメソッドを呼び出し
        $("#testModal").modal('show');
    });


ソースコメントにも記載したけど、モーダルを表示させる際のポイントは以下のカンジ

  • アンカー(a)からボタン(button)に変える際にはボタンのclickイベントハンドリング用にidを加えておく(とやりやすい)
  • 不要属性(data-attributeでmodalを制御する用)のhrefとdata-toggleは消す
  • ボタンのクリックイベントでmodal('show'); をモーダルのdivに対して呼び出す
で、モーダルの中身を記述する際のポイントは下記

  • モーダルの中身はヘッダー/ボディ/フッターというおなじみの3パーツで構成されている
  • class属性にmodal-headerとか指定することでモーダルのheaderとして表示される(bootstrapのJavaScriptとCSSに『これはmodalのヘッダーだよ』と伝えることができる)
  • モーダルを閉じるコントローラにはdata-dismiss="modal"を指定することでモーダルを閉じる機能を追加できる(と思われる)

モーダルが3部構成することだけわかっていれば、あとはその各パーツに好きなHTML書けば好きなように表示できるはずだ。

というわけで今回は一旦以上。
次回はajaxのmodalだ。