typistaのブックマーク - はてなブックマーク

絵文字をサジェストで快適に入力する - Qiita

やりたいこと自分の作るWebアプリでもGithubのように絵文字を入力できるようにしたいさらにコロン( : )スタートで快適にサジェストしたい完成イメージ ※このテキストはWebチャットアプリ「DevHub」に絵文字対応を行った手順を元になるべく最短ルートで実現できる方法を記述しています。不明点や詳細については各プラグインのドキュメントを参照ください。使うもの emojify.js http://hassankhan.github.io/emojify.js/ チートシート(入力時の参考に) http://www.emoji-cheat-sheet.com/ jquery-textcomplete http://yuku-t.com/jquery-textcomplete/ 絵文字を表示できるようにする emojify.js を html ヘッダで読み込んでおく。 emoji 用の

typista 2015/03/05

pocket2twitter

リンク

クリップボードの画像ファイルをアップロードする - Qiita

QiitaやGithub のようにWebアプリ上でクリップボードにコピーした画像をペーストコマンドでサーバに直接アップロードする方法。実装例 DevHubというチャットツールのチャット欄・メモ欄に実装した。 Web上の画像をコピー、または画面キャプチャから直接ペースト機能を使ってファイルアップロードからの表示ができるようになったのでとても便利になった。以下、動作イメージ。 * クリップボードに画像をコピーした状態でメモ欄に Ctrl-v すると画像ファイルがアップロードされ、パスが返ってくる。編集を終了すると独自のマークダウン処理で画像が表示される。実装手順貼り付け対象のDOMに 'paste' イベントをバインド pasteイベント処理内でeventから画像を取り出す Ajaxで画像情報をサーバに送信サーバ側でファイルを保存し保存後のパスをクライアントに送信クライアントで保

typista 2015/03/03

pocket2twitter

リンク

ファイルアップロードボタンを設置したい - Qiita

モバイルサイトなどのファイルアップロード機能で、通常のファイルセレクタのフォームではなく、ファイルアップロード用のボタンを設置してファイル選んだ瞬時にアップロードを開始したい場合がある。こんなイメージ。(DevHubというチャットツールのモバイルサイト実装したアップロードボタン。右端の黒いボタン) メリットとしては、ファイル選択直後にアップロードが開始するのでアップロードまでの手順を削減できる。 html html は input の type="file" タグを非表示で設置し、その代わりボタンを表示する。(以下の例は Twitter Bootstrap を使っている前提) <input type="file" id="upload_chat" name="file" style="display:none"></input> <button id="upload_chat_button