npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

jquery.autokana

v1.0.0

Published

Library for automatically rendering Furigana for inputed Japanese Text.

Downloads

594

Readme

autokana

Library for automatically rendering Furigana for inputed Japanese Text.

日本語入力に対するフリガナを自動的に別フィールドに記入するJQueryプラグイン。

Requires

  • Jquery

Description

Attaches a keydown listener to the first defined element, and transfers the inputted kana characters to the second element. This allows Japanese users to automatically input the furigana for their name without needing to input data twice. Because the furigana box is filled out in real time, corrections can be made by the user afterwards.

Based on Rubricks' autoRuby.js prototype project: http://d.hatena.ne.jp/rubricks/20080702/1215003705

第1変数のJqueryセレクターにキーダウンリスナーをバインドして、入力された文字をフリガナとして第2変数のJqueryセレクターに自動的に入力する。

RubricksのautoRuby.jsをベースにしました。Prototype版が必要でしたら、こちらを参照してください: http://d.hatena.ne.jp/rubricks/20080702/1215003705

Usage

  • Pass the NAME element and the FURIGANA input elements to the Plugin

  • $.fn.autoKana('#UserName', '#UserFurigana');

  • Optionally, pass the katakana:true option to automatically convert the furigana to full-width katakana

  • $.fn.autoKana('#UserName', '#UserFurigana', {katakana:true});

  • 名前とフリガナのフィールドエレメントをプラグインに定義:

  • $.fn.autoKana('#UserName', '#UserFurigana');

  • katakana:trueのオプションを定義した場合、フリガナがカタカナに変換されます。

  • $.fn.autoKana('#UserName', '#UserFurigana', {katakana:true});

Issues

  • Kana will be removed from the furigana field if deleted from the original input field, but kanji that are deleted from the input field will not be reflected in the furigana field

  • For obvious reasons, getting the Furigana of copy/pasted text is not supported

  • English characters are not currently supported

  • 入力欄から文字を削除した場合、カナはフリガナのフィールドからも削除されますが、入力された文字が漢字だった場合は、文字を削除しても、この通りに反映されない

  • keydownを利用しているので、コピペされたテキストは非対応

  • ローマ字は非対応

Example Site

Made for Kurokabe Square's online reservation system: http://kurokabe.jp/

長浜黒壁スクエアのクラス吹き体験教室システム http://kurokabe.jp/