Hatena::ブログ(Diary)

AmidaikeBlog このページをアンテナに追加 RSSフィード

2014-06-30

moshをCentOS6.5にインストールしてMacで使用する方法


今までサーバへ接続するにはSSHを使用していましたが、

今更ながらmoshというのをインストールしてみました。

moshの説明は以下のURLを参考にしてください。

Mosh: the mobile shell


moshを使うにはサーバクライアント両方インストールする必要があります。

という事でインストール方法となります。


yumインストール可能ですが、

epelリポジトリにしかないのでepelからインストールします。

yum --enablerepo=epel install mosh

これでインストールは終了です。もしエラーが発生した場合、

必要なライブラリ等をインストールしてください。

なお、moshインストール後はサービス等を特に起動する必要ありません。

moshインストールするのみです。


Macmoshインストールするにはbrewから可能です。

brew install mobile-shell

ちなみに

brew install mosh

でも同じものが入ります。


  • 使い方

moshを使うには通常のsshと同じく

mosh root@ipアドレス

とすれば接続できます。sshを使うときと同じですね。


iptablesを設定していた場合、

-A INPUT -m state --state NEW -m udp -p udp --dport 60000:61000 -j ACCEPT

udpポートを通信可能にしておいてください。


以上でmoshが使えるようになります。

2013-04-24

IE9以降でのevent.pageX、event.pageYの取得方法


こんばんみ。という懐かしいフレーズで今日はIE9以降で困った事を書いてみましょう。

早速ですがこんな感じのコードでツールチップとやらを作ってみました。

var tooltip = '<div class="tooltip">てへぺろ</div>';
$('body').append(tooltip);

$('hoge').mouseover(function(e) {
  $('.tooltip').fadeIn('500');
  $('.tooltip').fadeTo('10', 1.9);
}).mousemove(function(e) {
  $('.tooltip').css('left', e.pageX + 5);
  $('.tooltip').css('top', e.pageY - 20);
});

この方法だとスクロールしない画面であれば問題なく動作するんだけど、

縦長や横長にスクロールされる画面の場合、

IE9以降だとツールチップのX、Y作業がずれてしまい正常に動作してくれません。

こんな感じですね。

Edit fiddle - JSFiddle

他のブラウザIE8までならきちんと動きます。

これは困った、どうしようかと悩んでいたのですが下記の方法で対処しました。

var tooltip = '<div class="tooltip">てへぺろ</div>';
$('body').append(tooltip);

$('hoge').mouseover(function(e) {
  $('.tooltip').fadeIn('500');
  $('.tooltip').fadeTo('10', 1.9);
}).mousemove(function(e) {
  pageX = e.clientX + (document.body.scrollLeft || document.documentElement.scrollLeft);
  pageY = e.clientY + (document.body.scrollTop || document.documentElement.scrollTop);
  $('.tooltip').css('left', pageX + 5);
  $('.tooltip').css('top', pageY - 20);
});

  pageX = e.clientX + (document.body.scrollLeft || document.documentElement.scrollLeft);
  pageY = e.clientY + (document.body.scrollTop || document.documentElement.scrollTop);

とe.pageX、e.pageYではなく、こうする事でIE9以降でも無事にツールチップマウスの軌跡についてくれるようになりましたよっとノシ

これで多分、問題ないと思いますけど。。。

いい加減IEは無くなってほしい物です。

2013-04-22

GoogleMapの画面サイズを動的にブラウザ一杯に表示したい時の対処法


ねむたーい。ねむたーーい。

というわけで引き続きGoogleMapネタです。

GoogleMapの画面サイズを幅一杯に広げる時に困ったのでメモしときます。

どういう事かというと、

<div id="map-canvas" style="width: 400px; height: 400px;"></div>

とGoogleMapを横幅400px以内に表示してて、

jQueryを使ってあるボタンが押され時にGoogleMapをブラウザサイズ一杯に広げて表示したかったわけです。

こんな風に。

$(function () {
  $('hoge-btn').click(function() {
    $('#map-canvas').css({'width': '100%', 'height': '100%'});
  });
})

すると、こんな感じになってなぜか画面一杯に広がらない。。。

f:id:amidaike:20130606055112p:image:w360


これは困った。。と悩んでいて検索すると、

google.maps.event.trigger(map, 'resize');

というeventをハケーン。

mapというのはnew google.maps.Map(document.getElementById("map-canvas"))の事ね。

というわけで、早速

$(function () {
  $('hoge-btn').click(function() {
    $('#map-canvas').css({'width': '100%', 'height': '100%'});
    google.maps.event.trigger(map, 'resize');
  });
})

としてみると、、、

f:id:amidaike:20130606055833p:image:w360

無事に表示されるようになりました。


いやぁ一時はどうなるものかと思いましたよ。良かった良かった。

2013-04-20

bootstrapでgooglemapのZoomControlStyleを使う時の注意点

今日はガラッと変わってgooglemapの事を書いてみます。

bootstrapを使った時に以下の点ではまりました。

bootstrapで良くある書き方でmap-canvasにgooglemapを表示したい時に、

    <div class="container-fluid">
      <div class="row-fluid">
        <div class="span3">
        </div>
        <div class="span9">
           <div id="map-canvas"></div>
        </div>
      </div>
    </div>

と書いたらデフォルトのZoomControlStyleの表示がおかしくなります。

こんな感じね。

f:id:amidaike:20130515163809p:image:w360

これは困ったという事で調べてみると以下のようにすれば解決するようです。

スタイルシートに、

#map-canvas img {
 max-width: none;
 min-width: 0px;
}

と書くだけでデフォルトのZoomControlStyleが表示されるようになりますたノシ


こんなしょうもない事で時間をつぶしてしまったorz

2013-04-18

Symfony2のCommandでproductionモードで実行する方法

前にCommandを使ってバッチからメール送信する時の事を書きました。

これね id:amidaike:20130414

で、無事にメール送信できたのでいざ本番で試そうと思ったところ、

困った事にdebugモードで実行されてしまう。。なぜだ。。

という事でまたまた調べましょう。まんどくせぇ。。

たとえばCommandのconfigureを以下のように書いた場合、

protected function configure()
{
    $this->setName('app:mail:sendmail')->setDescription('メール送信だよ〜ん');
}

と書いた場合、これをいざ実行しようとする時は、

app/console app:mail:sendmail

と書けば実行されるんですが、このままだとdebugモードで実行されてしまいます。

何なんだよ一体ということで、consoleのヘルプを眺めたらこんな風に書いていました。

$ app/console --help
Usage:
 help [--xml] [command_name]

Arguments:
 command               The command to execute
 command_name          The command name (default: "help")

Options:
 --xml                 To output help as XML
 --help (-h)           Display this help message.
 --quiet (-q)          Do not output any message.
 --verbose (-v)        Increase verbosity of messages.
 --version (-V)        Display this application version.
 --ansi                Force ANSI output.
 --no-ansi             Disable ANSI output.
 --no-interaction (-n) Do not ask any interactive question.
 --shell (-s)          Launch the shell.
 --process-isolation   Launch commands from shell as a separate processes.
 --env (-e)            The Environment name. (default: "dev")
 --no-debug            Switches off debug mode.

Help:
 The help command displays help for a given command:
 
   php app/console help list
 
 You can also output the help as XML by using the --xml option:
 
   php app/console help --xml list

どうやら--envと--no-debugを使うようです。

というわけで早速先ほどのコマンドを修正して実行してみましょう。

app/console --env=prod --no-debug app:mail:sendmail

と書いて実行すると、、、何という事でしょう。

無事にproductionモードで実行する事が出来ました。


う〜ん、またハマってしまった。。。

公式サイトのどこに書いているんだろうか。。おいらの探し方が悪いのか。。。。

Connection: close