javascript

node.jsでproxyサーバ

node.jsのインストール https://github.com/ry/node/wiki/Installation 0.5.0-preになってる! % node -v v0.5.0-pre httpサーバを立てる リクエストは、GETの当て決め サーバから受け取ったレスポンスをそのままブラウザに返す。 var sys = require('sys'),…

JavaScriptでN進数変換しようとしたら、不思議な振る舞いに出会った

追記 [0-9]\.[0-9]*だと、少数点として扱われて [0-9]\s+\.だと、ドット演算子として扱われるからか SyntaxErrorのところは、数字もしくは空白文字が来るべき箇所に、その他の文字が来たからエラー吐いてるのね。 あと 7['toString'](2) これもあったな。 な…

範囲選択内のリンクを開く

プログラムのリハビリ中。 一瞬、for文の書き方忘れて焦った。。 document.addEventListener('DOMContentLoaded', function() { document.body.addEventListener('mouseup', function() { var selection = window.getSelection(); if (selection.rangeCount …

トランプ配り

10分でコーディングに挑戦した。 無駄ばかりのプログラムで25分かかってしまった。 ちょっとマシなのを考えてみた。 Cards = { deal: function(numPlayers, deck) { var players = []; if (numPlayers > deck.length) { for (var i = 0; i < numPlayers; i…

フォームの値からURLルーティング用のURLを作成するjQueryプラグイン

元々は、symfonyのキャッシュがGET, POSTリクエストだと作成できないので、フォームの値をURLに埋め込もうとして作りました。 URLルーティングとは /user?name=TakiTake&age=24のようなURLを /user/name/TakiTake/age/24と表現すること。 使い方 genUrlを呼…

ニコニコ動画のメニューに毎時ランキングへのリンク追加するグリモン

欲しかったので、ちょちょいと書きました。 嘘。文字化けでつまづいた。 モノは、ここ ソース // ==UserScript== // @name addHourly // @namespace http://d.hatena.ne.jp/TakiTake/ // @include http://www.nicovideo.jp/* // @require http://jqueryjs.go…

みんなの就職活動日記でAutoPagerizeを有効に

2009/09/01 21:50くらいに追記 早くも添削されてた。(?:bbs|\?action=bbs) -> (?:\?action=)?bbs bbsが重複してるから、?action= があってもなくても良しにすればスッキリ。なるほど id:os0x さんに助言をいただいたので早速修正。string-length(@class)=0 -…

jQuery UIを使ってiframeをリサイズできるようにする

jQueryとjQuery UIがあれば大抵のことはできるのですが、意外なことにiframeのリサイズができなかったので、できるようにしてみました。 といっても、jQuery UIのResizableにiframe用の処理追加しただけです。 デモ iframeをdivで囲む Resizableは、リサイズ…

弾さんのページにある、○○usersのリンク先を期待通りにするグリモン

id:j_okiさんの ここ見てていつも思うのだけどなぜ「○○users」画像をクリックするとはてブに飛ばずにもう一度同じエントリが_blankで開くのだろう? http://b.hatena.ne.jp/j_oki/20090629#bookmark-14263531 に共感したので、作ってみた。 // ==UserScript=…

JavaScriptで文字列を反転させる

要firebugです。コンソールに以下のコードをペーストして実行すると、右から左へ読む時代に戻れます。 $x('//text()').forEach(function(t) { var str = []; var l = t.length; for (var i = 0; i < l; i++) str.unshift(t.substringData(i, 1)); t.replaceD…

HTMLのインデント、連続する半角スペース、改行を取り除くJavaScript

改行がスペースになったり、連続したスペースは1文字扱いだったりとややこしいレンダリング周り。さらに、ブラウザ間で差があるから発狂物。どのブラウザで見ても同じにしたい。スペース1つが命取りな場合もある。なんとかしたい! そんなことは、サーバ側…

全ユーザに、はてなブックマークプラスアイコンを付ける JavaScript と Greasemonkey

逆に考えるんだ!皆に付いていればいいんじゃね? var img = Ten.Element('img', { width: '25', height: '11', title: 'はてなブックマークプラス', src: '/images/plus.gif' }); var plus_icon = Ten.Element('a', { href: '/guid/plus' }, img); Ten.DOM.…

はてなブックマークプラスアイコンを消し去る JavaScript と CSS

そんなに見たくないなら、見えなくすればいいじゃない。根本的解決じゃなくて、ネタですけどね。 js Ten.Selector.getElementsBySelector('a.plus_icon').forEach(function(a){ Ten.Style.applyStyle(a, { display: 'none'}) }); css a.plus_icon { display:…

あえて画面遷移したい人のためのForm関数

Ajaxでデータ投げたら、エラーページのHTMLが丸々返ってきた経験ありませんか? その度に、Formを作成するのもめんどくさいので、関数化してみました。 $.form = function(s) { var def = { type: 'get', url: location.href, data: {} }; s = jQuery.extend…

はてブで表示されるページタイトルを省略しない形で表示する方法

アイドルマスター 『iM@S Collaboration Festival 2 - B』‐ニコニ... のように省略されているのを アイドルマスター 『iM@S Collaboration Festival 2 - B』‐ニコニコ動画(ββ) にしたいときどうするかってことです。 A要素のtitle属性が全文を持ってるので…

DOM Rangeを簡単に扱うexRangeのサンプル

テスト用のbookmarklet書きました。 IE8, Firefox3.0, Safari3.2, Google Chrom1.0で動作確認。 Opera orz javascript:(function(d){s=d.createElement('script');s.type='text/javascript';s.src='http://github.com/TakiTake/js/raw/d1197b42fa16b5d7d7e42…

IE用にTreeWalker.js書いた

まずは、ぺたり。http://github.com/TakiTake/js/tree/master 使うと、何が嬉しいの? IEでDOM Traversal関数が使えるので、DOMツリーの探索が容易になります。 XPathとどう違う? XPathは、条件に合うノードをガッと一気に取ってきます。 TreeWalkerは、DOM…

exRangeちょこちょこ更新中

exRange(Selection).pos()で[0, 0]になるバグ修正 wrap後にendContainerが無くなるバグの解決法見つからない IE用のTreeWalker関数未実装 詰んだ。 寝たらいい案浮かぶかな?

githubに登録してみた

ちょこちょこ作ってた、DOM Rangeラッパーライブラリをgithubに上げときました。 ちなみに、さっきアカウント作ったばかりでGit自体初体験。 Firefox3で動作確認。 DOM RangeとTreeWalker使ってるんで、早くIE対応せねば。 ぺたり、exRange 使い方 ソースの…

IEでDOM Range扱えるライブラリあった

ierangeこれはすごい! あとで、試してみる

クロスブラウザでRangeオブジェクト扱う3

はてなスターの引用はどんな実装かな? とHatenaStar.js眺めてたら、引用した文字列と同じ文字列全部がハイライトされる仕様なのね。そうそう重複しないだろうから、こういう割り切ったのもありだと思う。 テキストノードだけ収集するのに、よさげなコード発…

クロスブラウザでRangeオブジェクト扱う2

選択範囲を任意の要素で囲う関数がネック。 Operaは、要素またいだsurroundContentsエラーになる。 テキストノードだけ抜き出して、それぞれ囲む必要がある。 もう少し汎用的になったら、どっかに上げる予定。 /** * exRange JavaScript Library v0.3 * どの…

Rangeオブジェクトメモ

リファレンスは、こことかここ DOM Range setStartやsetEndは、第一引数要素の第二引数位置へ始点(終点)を移動する。 下記の例だと、2から4までつまり、"cd"を選択している。 <span>abcde</span> var range = document.createRange(); var node = document.getElement…

クロスブラウザでDOM Rangeを扱えるようにした・・・い

IE対応しようとすると、途端にめんどくさくなる。 早さとかいいから、JSのエンジン変え(ry IE8の開発者ツールは、時代に追いついた感じで素晴らしい。 みんな、せめてIE8にしてくれ。 まだ、途中ですが経過報告。 メソッド毎にDOM Rangeのサポート有無で振り…

__proto__使ってprototypeを汚染せずに拡張する

(function() { var R = window.R = function(selection) { return R.init(selection); }; R = { init: function(selection) { this.__proto__ = selection ? selection.getRangeAt(0) : document.createRange(); return this; }, start: function(node, inde…

Rangeをメソッドチェーンで操作する(簡易版)

メソッドチェーンって直観的で分かりやすいと思うので、Rangeオブジェクトをメソッドチェーンで扱えるようにしてみました。 とりあえず版ですので、もっと充実させていく予定。 今のところ、ただのラッパーなんでIEでも動くと少しは実用性が出てくるかも。 F…

数値形式の比較

数値形式の文字列を比較する場合、それは整数として比較されます。by PHP Manual PHPのsort関数は相当おかしいを見てjavascriptだとどうなんだろうと試してみた。 String型 bookmarklet javascript: (function(){var s=["100", "0x64", "1e2", ".1E3"];for(v…

文字列中の数字をインクリメントする小技

comment(4) みたいな文字列があったとして、数字部分をインクリメントするのに使えます。 var inc = function(str) { return str.replace(/\d+/, function(n){ return ++n; }); } inc('comment(4)'); // comment(5)

任意のJSやCSSをキャッシュさせる方法

ファイル名の後ろに、そのファイルの最終更新日を付加する。 <script charset="UTF-8" type="text/javascript" src="js/hoge.js?20090203"></script> 開発版なら、time付加 "></script> これで、javascript変更したのにブラウザのキャッシュから呼び出してて、変更が反映されないなんて事態は避けられる。

Fedoraでjavascript

1/25 編集中のファイルを実行する設定を修正唐突にコマンドラインでjavascriptを使ってみたくて、 yum search jsしたら、まんまなものが見つかったので yum install js$ js js> a = 1 1おお、動いた。 vimで、jsファイル編集中に ,l 押したら、編集中のファ…

読み込み失敗した画像を再度取りに行くグリモン

AutoPagerizeなどを利用して、Ajaxでノードを追加したときに追加したノード中の画像読み込みに失敗することがあります。 まぁ、何が言いたいかというとニコニコのサムネが表示されなくてしょんぼりと さて、どうしよう。 画像の読み込みイベント監視?とは言…

iframe内の要素をxpath4jquery使って取得

xpathでドキュメントをまたいだ検索ができないということで、contextのドキュメントでcreateExpression切り替えられないか?と考えました。 で、できたのが // xpath4jqueryの57行目辺り context = context || document; doc = (context.nodeName == '#docum…

iframe内の要素をXPath使って取得

前提条件として、ドメインは一緒。 昨日の失敗は、iframeのdocumentをcontextに指定したところで、document.createExpressionで評価するからdocument違いが起こっていたためです。そこで、importNodeメソッドですよ。 外部ドキュメントからノードのコピーを…

iGoogleの表示領域をちょっとだけ広げるグリモン

// ==UserScript== // @name bowdlerize-igoogle // @namespace http://d.hatena.ne.jp/TakiTake // @include http://www.google.co.jp/ig* // ==/UserScript== document.getElementById('nhdrwrapsizer').style.height = '100px'; テーマの部分が46px縮んで…

Firefox3で「はてブ」のページ自動ロードを無効にしたい人向けJavascript

これをアドレスバーに貼り付けて、エンター押せば無効にできます。 javascript: (function(){Hatena.Bookmark.AutoPagerize.instance.inactive()})()

JSで論理演算

1, 0 ver function and(i, j) { return i & j; } function or(i, j) { return i | j; } function nand(i, j) { return !and(i, j) ? 1 : 0; } function nor(i, j) { return !or(i, j) ? 1: 0; } function xor(i, j) { return i^j; } function not(i) { retur…

JSで画像に落書きする

画像が一つ飛ばしになるの修正 canvas要素で遊ぼうってことで、画像に落書きできるスクリプト書いてみました。 使い方 windowのロードイベント後に以下のコード読み込んで下さい。 firebug入っているなら、コンソールに貼り付けて、実行でおk。 pixiv辺りが…

画像の読み込み制御

メモ DOMContentLoadedイベント時に、styleのdisplayをnoneにしても、画像は読み込まれてしまう。 DOMContentLoadedイベント時に、img要素をremoveChildしても、画像は読み込まれてしまう。 DOMContentLoadedイベント時に、src属性の値を無しにすると、画像…

ダブルクリックでtrac編集するJS

tracのwiki編集権限持っている場合、編集したいページでダブルクリックすると編集画面に遷移します。ブックマークレット版 javascript:(function(){document.body.addEventListener("dblclick",function(){var f=document.forms;if((f.length>1)&&(f[1].getE…

javascriptによる攻撃の被害者・加害者にならないために注意すべきこと

はじめに 自分用のメモがてら書いてきます。 僕もまだまだ素人なんで、つっこみ大歓迎です。 目に見えることが真実とは限らない リンクを使った引っ掛けの例です。 初級:リンク先と表示されている文字が違う <a href="http://bbb.com">aaa</a> エロサイトでよく見かけますねw これは、ス…

CharacterDataってあるんだね

TextとCommentノードの共通機能らしい。 こっち使えば、nodeValue取ってきてStringとして操作せずに、ノードとして操作できるね。 appendData, deleteData, insertData, replaceData, substringDataと一通りのメソッドが存在するみたい。 今まで // firebug…

jQuery UIのresizableで、文字が範囲選択できなくなる?続き

まだ、完全な原因は不明ですが、 マウスダウンイベント時にイベント伝播を停止すると、同様の現象が起こるので、これが関係しているかも。 余談ですが、ドラッグ&ドロップや要素のリサイズするときに、マウスダウンイベントの伝播停止しないと 無関係な文字…

jQuery UIのresizableで、文字が範囲選択できなくなる?

Webページをjavascript面で使いやすくしてくれるjQuery UIですが、 デモページで不思議な状況に陥りました。 resizableのデモページで、4つのブロックの内 左から3つで、文字の範囲選択ができなくなっていることです。 一番右のブロックでは、できるのに。…

appendCirno関数作った

ブックマークレット版 javascript:(function(){var d=document.createElement('div');var s=d.style;s.position='absolute';s.top=(Math.random()*100)+'%';s.left=(Math.random()*100)+'%';s.zIndex='9999';s.color='#07F';s.fontSize='14em';d.innerHTML=u…

のサイズを動的に変える時の注意事項

真っ白になります ちょっとでも、canvasのサイズを変えると真っ白になってしまうので、 画像を再読み込みしましょう。 windowのリサイズイベントでcanvasのサイズを変える例 <html> <head> <meta http-equiv='Content-type' content='text/html; charset=utf-8'> <title>canvas</title> <script type='text/javascript' language='javascript' charset='utf-8'> // イベントハンドラを追加 // 引用元 IT戦記:http://…</meta></head></html>

でお絵かき->DBに保存->PHPで表示->(゚Д゚)ウマー

きっかけ canvasタグ上に描いた絵を保存しようとしたら、 意外に情報が見つからず苦労したんで、載せときます。 canvas? まず、canvasやHTML5についての仕様は、以下のサイトを見てください http://www.html5.jp/ 流れ 今回は、フリーハンドで描いた絵を保存…

onclickで盛り上がってるみたい

javascriptのイベントをどう書くか? onclickは推奨?非推奨? タグにonclickを埋め込む方法自体なら、アリだと思う。 初心者向けなら、ナシだと思う。 前者は、作業効率面から 直感的だし、コード短くなるしね。 つまり、意味を知ってて使うならアリ 後者は…

Firecookieにdecodeしたcookieも見られる機能追加してみた

Firecookieを入れるまでは console.log(document.cookie)で、いちいちcookieを表示していたけれど、 これはFirebugを拡張してcookieタブを追加してくれるから、 簡単に確認できてとても便利。 その上、ドメイン、パス、有効期限など詳しい情報を見やすく出し…

全てのチェックボックスをチェックするJS

firebug無いとだめですが、consoleに var elements = $x('//input[@type="checkbox"]'); for(var key in elements) {elements[key].checked = true;} と入れると、爽快です。 trueの代わりにfalseだと全解除。 ふぅ論文書くか

jQuery UI 1.5が素敵

jQuery UI 1.5のデモ見たら、あまりに素敵過ぎてprototypeから浮気しそうw ユーザインターフェース強化中なんで、こういうのは有り難い。 もうちっとキレイなコード書きたいなぁって事で、PHPのフレームワークである symfonyにも手出してます。 ドキュメント…