スポンサーサイト

上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。

はてなブックマークに追加 はてなブックマーク - スポンサーサイト

jSnowで、メッセージカード作成

javascript「jSnow」を使った文字を雪のように降らせるサイト「2nd jSnow」で、メッセージカードを作成できるようにしました。

≪2nd jSnow≫
http://2ndjsnow.appspot.com/

≪メッセージカード・サンプル≫
http://2ndjsnow.appspot.com/card/agpzfjJuZGpzbm93chILEgtDYXJkU3RvcmFnZRjqBww
スポンサーサイト

はてなブックマークに追加 はてなブックマーク - jSnowで、メッセージカード作成

theme : JavaScript
genre : コンピュータ

Google App Engine:日本語ファイル名

Google App Engine備忘録。

Google App Engineでファイルアップロードのファイル名が日本語の場合の処理。

filename = db.BlobProperty()
とする方法もあるが、

filename = db.StringProperty(multiline=False)
としておいて、unicodeに変換して入れておく方が良いかも。

≪例≫
storefile = self.request.body_file.vars['uploadfile']
storageFile.filename = unicode(storefile.filename,'utf-8')

↓スニペット集
http://memo.ok2nd.biz/?cat=300&query=%E3%83%95%E3%82%A1%E3%82%A4%E3%83%AB%E5%90%8D%E3%81%8C%E6%97%A5%E6%9C%AC%E8%AA%9E

はてなブックマークに追加 はてなブックマーク - Google App Engine:日本語ファイル名

theme : システム開発
genre : コンピュータ

Google App Engine:utf-8の文字列切り出し

Google App Engine備忘録。

Pythonではutf-8とUnicodeは別物らしい。
utf-8のままでは、文字単位で正しく文字列処理をしてくれない。Unicodeにすれば、正しく処理される。

utf-8の日本語文字列から、一部を取り出す場合、結構面倒。

≪例≫
utf8 = str.encode('utf-8')
html = '<td>'+utf8[:5]+'</td>'
では、asciiとしてバイト単位で取り出すため、文字化けする。

utf8 = str.encode('utf-8')
html = '<td>'+unicode(utf8,'utf-8')[:5].encode('utf-8')+'</td>'
みたいにするとうまくいく。まわりくどい。何か勘違いしているだけかも。

関数にして、次のようにして使ってみる。
html = '<td>'+utf8left(str,5)+'</td>'
def utf8left(str,length):
  str = unicode(str.encode('utf-8'),'utf-8')
  if len(str) <= length:
    return str.encode('utf-8')
  else: 
    return (str[:length]+'...').encode('utf-8')

はてなブックマークに追加 はてなブックマーク - Google App Engine:utf-8の文字列切り出し

theme : システム開発
genre : コンピュータ

Google App Engine:セッション管理

Google App Engineで作成したサイト
http://2ndpen.appspot.com/
http://2ndfoto.appspot.com/
のセッション管理を、
≪gaeutilities≫
http://gaeutilities.appspot.com/
から、
≪gae-sessions≫
https://github.com/dound/gae-sessions
に変更。

gaeutilitiesを使って数日間セッションを保持していると、数日後sessions.Session()でエラーになる。cookieが残っていて、memcacheが消えたりしているのかもと思うが、原因不明。この場合、ブラウザのCookieを全て消去しないと復旧できない。gae-sessionsに変更してしばらく様子を見ることにする。

gae-sessionsの使用方法は、以下のサイトが参考になりました。
≪ACC開発ブログ:GAEでセッションを使ってみた by gae-sessions≫
http://d.hatena.ne.jp/iacctech/20110612/1307899228

gaeutilitiesからgae-sessionsへの変更メモ書き。
1. gaesessions/__init__.pyをアプリケーションフォルダへコピー。
2. appengine_config.pyを作成。(cookie_keyを適当に変える)
3. Pythonソースの以下の箇所を変更。
from appengine_utilities import sessions
↓↓↓
from gaesessions import get_current_session

sessions.Session()
↓↓↓
get_current_session()

self.sess.delete()
↓↓↓
self.sess.terminate()

はてなブックマークに追加 はてなブックマーク - Google App Engine:セッション管理

theme : システム開発
genre : コンピュータ

jSnowで、スライダーとRGB値指定

javascript「jSnow」を使った文字を雪のように降らせるサイト「2nd jSnow」で、オプションパラーメーターの設定で、スライダーが使えるようにしました。

また、薄片の色をRGB値で指定できるようにしました。

http://2ndjsnow.appspot.com/

jsnow-1.jpg

はてなブックマークに追加 はてなブックマーク - jSnowで、スライダーとRGB値指定

theme : JavaScript
genre : コンピュータ

Ver.4.00:住所の一部から郵便番号と住所検索

MyHome Portal Ver.4.00をリリースしました。
http://ok2nd.web.fc2.com/download.html

Ver.1.00リリースから約3年経過で4年目に入ったということで、Ver.4.00としました。

INDEXトップページ検索キー入力ボックスのGoogle Suggest APIを使った予測変換(単語補完)を、オフにもできるようにしました。検索キー入力ボックスの左の●をクリックしてください。jquery.autocomplete.jsを一部改造したjquery.autocomplete_my.jsを使っています。

INDEXトップページ検索キー入力ボックスのGoogle Suggest APIを使った予測変換(単語補完)プルダウンを、スクロールバーを出さずに候補10個が全て見えるようにしました。
autocomplete2.jpg

INDEXトップページ右上の日付け表示のフォントサイズを大きくしました。

「住所録」の入力画面に住所検索機能を追加しました。住所の一部から、郵便番号と住所を検索します。
グルーブテクノロジー株式会社の「郵便番号検索API」を利用しています。
http://groovetechnology.co.jp/webservice/zipsearch/index.html

zip-search.jpg

はてなブックマークに追加 はてなブックマーク - Ver.4.00:住所の一部から郵便番号と住所検索

theme : JavaScript
genre : コンピュータ

任意の文字を雪のように降らせるjSnow

Google App Engine上に、javascript「jSnow」を使った文字を雪のように降らせるサイト「2nd jSnow」を作成しました。

http://2ndjsnow.appspot.com/

文字は任意の文字を指定できます。文字の大きさや数も指定できます。

表示したページのURLをそのまま電子メールなどで送れば、メッセージとしても使えます。

ページをリロードすると文字の色が変わります。

http://2ndjsnow.appspot.com/do?ch=&num=50&cl=&fnum=&flake=%E3%82%88%E3%82%8D%E3%81%97%E3%81%8F%2C%E2%99%A5%2C%E2%99%AA%2C%E2%98%85&bg=FFFB80&speed=1&size=80

http://2ndjsnow.appspot.com/do?ch=&num=200&cl=100&fnum=100&flake=%E3%81%82%E3%81%84%2C%E3%82%89%E3%81%B6%2C%E3%82%86%E3%81%86&bg=3F4373&speed=&size=40

降らせる文字は、「まきばフォント」を使っています。
http://hp.vector.co.jp/authors/VA039499/#makiba

はてなブックマークに追加 はてなブックマーク - 任意の文字を雪のように降らせるjSnow

theme : JavaScript
genre : コンピュータ

スマートフォン用 天気予報&雨雲レーダー

Google App Engine上に、スマートフォン用 天気予報&雨雲レーダーサイト「2nd Weather」を作成しました。

http://2ndweather.appspot.com/

Yahoo天気とウェザーニュースのブログパーツをそのまま貼り付けているだけですが。

はてなブックマークに追加 はてなブックマーク - スマートフォン用 天気予報&雨雲レーダー

theme : JavaScript
genre : コンピュータ

Google App Engine上にWebポータル

Google App Engine上に、MyHome PortalINDEXページライクなWebポータルサイト「2nd Index」を作成しました。

http://2ndindex.appspot.com/

MyHome Portalのように、カスタマイズはできません。

2ndindex.jpg

はてなブックマークに追加 はてなブックマーク - Google App Engine上にWebポータル

theme : システム開発
genre : コンピュータ

ブラウザで、ペン画風なお絵かき

Google App Engine (Python) のトライアルシステムとして、ブラウザ上でペン画のような絵が描ける「2nd Pen」を作成してみました。
http://2ndpen.appspot.com/

ペン画の作成には、JavaScriptライブラリ「Ghostwriter」を使用しています。
https://developer.mozilla.org/en-US/demos/detail/ghostwriter-art-studio

作成した画像は保存できます。保存後、修正やコピーが出来ます。

pen1.jpg
pen2.jpg

はてなブックマークに追加 はてなブックマーク - ブラウザで、ペン画風なお絵かき

theme : JavaScript
genre : コンピュータ

Ver.3.37:Google Suggest 予測変換(単語補完)

MyHome Portal Ver.3.37をリリースしました。
http://ok2nd.web.fc2.com/download.html

INDEXトップページの検索に、Google Suggest APIを使った予測変換(単語補完)機能を組み込みました。検索キー入力ボックスでは、jquery.autocomplete.jsを使用しています。
http://bassistance.de/jquery-plugins/jquery-plugin-autocomplete/

autocomplete.jpg

INDEXトップページのTwitter検索ボタンを、Googleリアルタイム検索がサービス停止になっているので、search.twitter.comによる検索に戻しまた。

「ID管理」のtextareaのリサイズを、カレンダー、メモ等と同じく、大小ボタンを押す方式でなく、自動リサイズ方式にしました。

はてなブックマークに追加 はてなブックマーク - Ver.3.37:Google Suggest 予測変換(単語補完)

theme : JavaScript
genre : コンピュータ

Google App Engineでスマートフォン用ポータル

Google App Engineを利用して、スマートフォン用ポータルサイトを作成してみました。
http://2ndsmart.appspot.com/

といっても、単に複数の検索ボタンがあるWeb検索用画面です。HTMLとJavaScriptだけなので、Google App Engineを使う必要は全くありませんが。
通常HTML版、CSS3版、jQuery Mobile利用版と3種類の画面デザインを用意しました。

smart1.jpg
smart2.jpg
smart3.jpg


はてなブックマークに追加 はてなブックマーク - Google App Engineでスマートフォン用ポータル

theme : CSSレイアウト
genre : コンピュータ

Google App Engineで写真共有サイト

Google App Engine (Python) のトライアルシステムとして写真共有サイトらしきもの「2nd Foto」を作成してみました。
http://2ndfoto.appspot.com/

2ndfoto1.jpg
2ndfoto2.jpg

トライアルシステムですので、将来に亘ってサービスが継続される保証はありませんので、ご了承ください。

特定のユーザーの画像一覧にすると、以下のJavaScriptを使ったスライドショーもできます。スライドショーからはEscキーで元の画面に戻れます。

Supersized - Fullscreen Slideshow jQuery Plugin
http://www.buildinternet.com/project/supersized/
Galleria
http://galleria.aino.se/
3D Wall Gallery
http://tympanus.net/codrops/2011/02/02/3d-wall-gallery/

実際にユーザー登録される方は、SSLを使った以下のURLでアクセスしてください。
https://2ndfoto.appspot.com/

はてなブックマークに追加 はてなブックマーク - Google App Engineで写真共有サイト

theme : システム開発
genre : コンピュータ

physicSketch動画サンプル

MyHome Portal Ver.3.36
http://ok2nd.blog87.fc2.com/blog-entry-278.html
で追加したphysicSketchの動画サンプルです。

Addボタンを押すと、作成した図形がセットで追加されて、図形同士がぶつかりあい、結合が切れたり、勝手にくっついたりして複雑な動きをします。


はてなブックマークに追加 はてなブックマーク - physicSketch動画サンプル

theme : JavaScript
genre : コンピュータ

Ver.3.36:物体落下シミュレーションphysicSketch

MyHome Portal Ver.3.36をリリースしました。
http://ok2nd.web.fc2.com/download.html

ツールに、物理エンジンを使った物体落下シミュレーションゲーム(?)「physicSketch」を追加しました。画面上に図形を描くと、その図形が物理法則に従って落下します。
あんどうやすしさん作成のJavaScriptライブラリ「physicsketch.js」「box2d.js」を使っています。Chromeで動作確認しています。
http://physicsketch.appspot.com/
http://physicsketch.appspot.com/app/list
落下スピードを変えることもできるようにしました。
表示画面では、作成した図形をセットで次々に追加して落下させたりもできます。結合した図形がバラバラになったりして、複雑な動きが楽しめます。

physicSketch1.jpg
physicSketch2.jpg
physicSketch33.jpg
physicSketch4.jpg
physicSketch9.jpg

はてなブックマークに追加 はてなブックマーク - Ver.3.36:物体落下シミュレーションphysicSketch

theme : JavaScript
genre : コンピュータ

プロフィール

Author:ok.2nd
HomePage:
http://ok2nd.web.fc2.com/
Email: m.ok.2nd@gmail.com

最新記事
最新コメント
最新トラックバック
月別アーカイブ
FC2ブログランキング

FC2Blog Ranking

検索フォーム
カテゴリ
リンク
RSSリンクの表示
ブロとも申請フォーム

この人とブロともになる

QRコード
QRコード
ユーザータグ

上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。