投稿

BracketsをKubuntu16.04にインストール

最近OSをKubuntu16.04に変更したので、環境のセットアップ☆ そこで、 Adobeのテキストエディタ Brackets をインストールしようと、公式ページよりダウンロードし、ダブルクリック!! ん?? エラーが発生し、インストールできませんでした。。。 (Ubuntu16.04でも同じかも・・・) エラーメッセージが漠然としているので、こういう時はターミナルからインストールですな★ ターミナルからBracketsをインストール(エラー) # dpkg -i Brackets.Release.1.6.64-bit.deb Brackets.Release.1.6.64-bit.deb を展開する準備をしています ... brackets (1.6.0-16680) を展開しています... dpkg: 依存関係の問題により brackets の設定ができません: brackets は以下に依存 (depends) します: libgcrypt11 (>= 1.4.5) ...しかし: パッケージ libgcrypt11 はまだインストールされていません。 dpkg: パッケージ brackets の処理中にエラーが発生しました (--install): 依存関係の問題 - 設定を見送ります hicolor-icon-theme (0.15-0ubuntu1) のトリガを処理しています ... 処理中にエラーが発生しました: brackets で、エラーを確認すると・・・・ libgcrypt11がインストールせれてないようです。 じゃあ、インストタイトルールしましょう! libgcrypt11をインストール(エラー) # apt-get install libgcrypt11 パッケージリストを読み込んでいます... 完了 依存関係ツリーを作成しています 状態情報を読み取っています... 完了 パッケージ libgcrypt11 は使用できませんが、別のパッケージから参照されます。 これは、パッケージが欠落しているか、廃止されたか、または別のソース からのみ利用可能であることを意味します。 E: パッケージ 'libgcrypt11' はインストール候補ではありません...

FirefoxでCSSのzoomは使えない・・・

最近作成しているWEBアプリケーションで、ページの拡大機能をつけようとCSSの zoom を使ってみた・・・ うん、うまくいったと思って、Firefoxで確認してみると、拡大しないぞ!! なんと!zoomって元々IEの独自実装だったんだね。 Chromeでは動作したので、標準実装かと思ってた・・・・適当に覚えてたよ。 というわけで、いろいろ調べてみると、 transform プロパティの scale() を使えば解決しそうだ。 .css body{ transform: scale(2.0); /* 2倍に拡大 */ } ん??? なんと、拡大すると左上が隠れてしまうよ・・・ そうか、じゃあ translate() で移動しようという考えがチラホラ。。。 でも、どのくらい移動していいかわからないし、やり方が野暮ったいよねぇ。 で、さらに調べ見ると MDNにtransform-origin というそれっぽいプロパティを発見!! .css body{ transform-origin: 0 0; transform: scale(2.0); /* 2倍に拡大 */ } はい、これで無事に拡大できました。 めでたし、めでたし。。。 ふんどしの持ち主 MDN

UbuntuのLESSCで自動コンパイル

前回 、lesscをUbuntuに導入したけれど、やっぱり、いちいちコンパイルするのが面倒なので、自動コンパイルする方法を探すことに。。。 すると、 Dead Simple LESS CSS Watch Compiler なる素敵なソフトを発見!! これを使えば、フォルダ内のファイルを更新すると自動的にコンパイルしてくれるぞ。 # npm install -g less-watch-compiler 使い方は # less-watch-compiler [less監視フォルダ] [css出力フォルダ] で、OK! これで、快適になりましたとさ。めでたしめでたし。 と、思ったら・・・ なんと、cssが圧縮(minify)形式だった・・・ 今回はCSS修正前提の納品物なので、圧縮形式はまずいね。 なので、ソースを修正する。 調べた結果「/usr/local/lib/node_modules/less-watch-compiler/lib/lessWatchCompilerUtils.js」を修正すればいいみたい! --- /usr/local/lib/node_modules/less-watch-compiler/lib/lessWatchCompilerUtils.js.org 2016-02-17 22:22:47.930907153 +0900 +++ /usr/local/lib/node_modules/less-watch-compiler/lib/lessWatchCompilerUtils.js 2016-02-17 22:23:05.275173726 +0900 @@ -116,7 +116,7 @@ compileCSS: function(file){ var dirname = path.dirname(file).replace(lessWatchCompilerUtilsModule.config.watchFolder, "") + "/"; var filename = dirname +path.basename(file, path.extname(file)); - ...

UbuntuにLESSCを導入する

最近、久しぶりにWEBページを作る仕事があった。 CSSがCSS3になっていろいろ出来るようになったので、うれしい今日このごろ。 マイクロソフトがIEの古いバージョンのサポートやめてくれたおかげで、いいことずくめですな。 で、前から気になってたLESSを導入しようと思って、Ubuntuで使えるコンパイラを探したとさ。 Windowsなら WinLess とかがあって、すぐに導入できるみたい。 Ubuntuでは、 node.js で書かれたのコンパイラlesscを使えば出来ると Onur Güzel さんが教えてくれています。 node.jsのパッケージ管理ソフトnpmを先ずは導入するみたい。この時ついでにnode.jsもインストールされます。 そんでもって、npmでlessをインストールすればOK!ってことらしいです。 # apt-get install npm # npm install -g less ただし、 Ubuntuでは node コマンドの代わりに nodejs コマンドになっている らしいので、ちょっと手を加える必要があるみたい。 Onur Güzelさんはlesscコマンドに手を加えているようですが、私はlesscコマンドに手は加えずnodeコマンドを使えるように。。。。。 # which nodejs /usr/bin/nodejs # cd /usr/bin # ln nodejs node nodeのハードリンクを作成しました。シンボリックリンクにするかは好みの問題で・・・ これで、無事、lesscコマンドが使えるようになるよ。めでたしめでたし。 次は: 自動コンパイル ふんどしの持ち主 Onur Güzel

ベンダープレフィックスなしで、フルスクリーン表示

Javascriptのフルスクリーン標準APIを実装しちゃうお話の完結編。 ※久しぶりに、このブログ見てたら、 前回 、 前々回 とコードが間違っていたので、修正しておいた。 f ullscreenElementの頭文字が大文字になってた・・・おそまつ。 で、ついでに修正版全コードと動作サンプルを載せておこうと思う。 ちなみにこのコードは将来、標準化されるであろうAPIを追加しちゃうものなのです。 独自関数は使わず、 Javascriptの潜在的パワー を活かして、 ベンダープレフィックスなし で、動作するよ ★ 次のfullscreen.jsを使うことによって、 requestFullscreen() 、 exitFullscreen() 、 fullscreenElement が利用できるようになるのだ!! fullscreen.js Element.prototype.requestFullscreen = Element.prototype[( Element.prototype.requestFullscreen || Element.prototype.msRequestFullscreen || Element.prototype.webkitRequestFullScreen || Element.prototype.mozRequestFullScreen || {name:null}).name] || function(){}; document.exitFullscreen = document.exitFullscreen || document.msExitFullscreen || document.webkitExitFullscreen || document.mozCancelFullScreen || function(){}; if(!document.fullscreenElement) Object.defineProperty(document, "fullscreenElement",{ get : function(){ return( ...

AVR開発環境設定 for Ubuntu 15.04 (Part2)

前回の設定だけではrootユーザでないと、AVRに書き込めないので makeで自動処理できなくて困る。 なので、Kenichiro MATOHARAさんの スライド に書いてあったように、udevの設定を行う。 しかし、うごかない。なんで??よーく見たら、 == と = をきちんと見てなかったみたい。で、直してみてもう一度・・・・ やっぱり、認識せんぞ?? ん??何か変だなこの設定ファイル・・・ お、間違いを発見!!  先頭のATTRが抜け落ち てますぜ。 で、修正したのがこれです↓ /etc/udev/rules.d/50-avr.rules ATTR{idVendor}=="03eb",ATTR{idProduct}=="2104",MODE="0660",GROUP="plugdev",SYMLINK+="avrisp_mk2" この設定で、AVRISPmkIIを接続したら、上手く認識したみたい。。。 デバイスファイルを見てみる $ ls /dev/avr* /dev/avrisp_mk2 ちなみに、lsusbコマンドで、idVendorとidProductは確認できるよ。 あとの細かいことは、 SUSE Linuxのページ に詳しく書いてある。 適当に、Makefileを作ってみる。 Makefile PROGRAM = hello F_CPU = 1000000UL CC = avr-gcc CFLAGS = -g -O2 -mmcu=attiny2313 -std=c99 OBJCP = avr-objcopy OFLAGS = -j .text -j .data -O ihex AVRDUDE = avrdude AFLAGS = -e -c avrisp2 -p t2313 .SUFFIXES: .c .elf .PHONY: clean install $(PROGRAM).hex: $(PROGRAM).elf $(OBJCP) $(OFLAGS) $< $@ .c.elf: $(CC) $(CFLAGS) -o $@ -DF_CPU=$(F_CPU) $< install: $(PR...

AVR開発環境設定 for Ubuntu 15.04

久々にAVRで電子工作をしたくなった・・・・ 前はAVR Studioを使ってたけど、最近はWindowsよりUbuntuばっかり使ってるのでLinuxで環境設定するのだ。 で、世の中の人に聞いてみると・・・ Kenichiro MATOHARAさんが、 スライドで紹介 してくれていました。感謝! 必要な環境として コンパイル環境 AVR書き込み環境 の2つを整える必要がある。 コンパイル環境 コンパイルするにはコンパイラとして gcc-avr、プログラミングツールに binutils-avr、ライブラリに avr-libcが必要なようだ。 コンパイル環境のインストール # apt-get install gcc-avr binutils-avr avr-libc AVR書き込み環境 AVRに実際に書き込むためのプログラムには avrdudeを使いましょうって事ですね。 ここでは、書込み器には AVRISPmkII を使うよ。 AVR書き込み環境のインストール # apt-get install avrdude サンプル作成 ひとまず、そこらにあったATtiny2313で作ることにする。 hello.c /* LED点滅プログラム */ #include <util/delay.h> #include <avr/io.h> int main(void) { DDRB = _BV(DDB0); for(;;){ PINB = _BV(PINB0); _delay_ms(500); } return 0; } コンパイル & リンク ATtiny2312用にコンパイル & リンク $ avr-gcc -g -O2 -mmcu=attiny2313 -DF_CPU=1000000UL hello.c 今回は ATtiny2313を使ったので、 オプションの -mmcu に attiny2313 を指定する。 後は、delay.hを利用するので、 -D オプションで、 F_CPU を 1MHz に設定し、 最適化 は程々の -O2 にする。ちなみに-...