자바스크립트로 구현한 한글 입력기(IME)
points
한글 윈도우를 쓰는 경우에는 대부분 필요가 없겠지만,
외국에서 공용 PC를 사용해 한글 웹 사이트에 접속하는 경우 PC에 한글 IME가 설치되어 있지
않아서 한글을 볼 수는 있지만 입력할 수 없는 경우가 종종 있습니다. 아래는 OS 자체의 한글
입력기와는 별도로 자바스크립트를 이용해 자체적으로 한글 입력기를 구현한 것입니다.
http://aim.anj.kr
http://aim.anj.kr/aim.js
[Shift+Space] 또는 [Alt+Space]로 영문 입력과 두벌식 한글 입력 상태를 전환할 수 있고,
[Ctrl+Space]로 영문 입력과 세벌식 한글 입력 상태를 전환할 수 있습니다.
자바스크립트로 구현된 다른 한글 IME와 달리 OnTheSpot 방식으로 작동하기 때문에 언뜻 보면
OS의 입력기로 입력하는 것과 잘 구분이 안 되지만, 위의 예제 사이트에서 한글을 입력 할 때에는
OS의 IME가 사용되는 것이 아니라 사이트에서 자체적으로 구현한 IME가 사용됩니다.
한글 IME가 설치되어 있지 않은 PC에서 한글을 입력해야 하는 경우 외에,
세벌식을 사용하는 경우 외부에서 공용PC를 사용해 자신의 홈페이지 등에 접속해 글을 남기려면
매번 PC 설정을 바꿔야 하기 때문에 불편한데, 자신의 홈페이지에 만약 위의 자바스크립트 IME를
적용해 두었다면 OS의 IME와는 별도로 한글을 입력할 수 있기 때문에 일일이 PC 설정을 바꾸지
않아도 [Ctrl+Space]를 사용해 세벌식을 사용할 수 있습니다.
장난삼아 이 페이지에도 스크립트를 집어넣어 보았습니다. 아래에 댓글을 다실 때 윈도우의 경우
[Shift+Space] 또는 [Ctrl+Space], X 환경이라면 [Alt+Space] 또는 [Ctrl+Space]으로 한/영
전환을 하시면 OS의 IME와는 독립적으로 한글을 입력할 수 있습니다.
- alee의 블로그
- 인쇄에 적합한 버전
- Login or register to post comments
points
오페라에서는
오페라에서는 한영전한이 안되네요 ^^ 제 키보드가 한영 전환키가 없어서 shift-space 로 한영 전환을 하고 있느데, 키가 겹쳐서 그런지도 모르겠습니다만~
points
오페라에서도 되도록
오페라에서도 되도록 조금 고쳤습니다.
입력기와 키가 겹치는 분은 입력기를 끄거나
LANG=C firefox
LANG=C opera
와 같이 ko_KR 외의 다른 로케일로 브라우저를 실행하고 테스트해주세요.
im-hangul 등의 입력 모듈을 쓰는 분은
GTK_IM_MODULE="" firefox
QT_IM_MODULE="" opera
와 같이 실행하시면 되겠습니다.
points
오토마타...그걸 JS로...
대단하시군염....입이 다무러지지 않음...
points
코드를 좀 정리하니
코드를 좀 정리하니 8.6kB에 200줄 이하로 줄어들었습니다.
두벌식과 세벌식 최종을 지원하는 한글 오토마타 소스 중에서는 아마 최대로 압축된 소스일 것 같습니다.
오픈소스 게시판이나 모니위키 같은 위키 등에 위 스크립트를 적용한다면 어떨까요?
특히나 노스모크나 프리필 같은 위키의 경우 외국에서 접속하는 분도 많이 계시니 어쩌면 꽤 도움이 될
수도 있을 것 같습니다.
points
이렇게 하면 한글 입력이 깨지는 경우가 있습니다. 뭐가 문제일까요?
이벟게 하켠 한글 입력이 깨든 경우가 있습니마. 뭐가 문제까
중간에 아예 비는 글자는 물음표로 나온 겁니다. 오토마타 과정에서 값이 꼬이는 걸까요? 파폭 기반 에피파니에서 두벌식으로 했습니다.
points
소스 수정중에
소스 수정중에 접속하신 것 같습니다. 아마 지금은 문제가 없을 것입니다. :)
points
IME와도 충돌 문제가
IME와도 충돌 문제가 없군요. 새나루에서는 한자키도 먹히고요. :>
역상으로 나타나는 글자는 선택된 상태에 있는 것이겠군요.
points
역상은 선택된
역상은 선택된 상태 맞습니다.
그래서 별도로 preedit 상태를 표시해주기 위한 처리를 할 필요가 없습니다. :)
X 환경에서는 nabi나 imhangul의 한/영 전환키인 [Shift+Space]와 겹치기 때문에 테스트 하기가
곤란해서 원래 [Ctrl+1,2,3]으로도 전환이 가능하도록 만들었었는데, 사용해보니 영 불편해서
두벌식 전환 키를 [Shift+Space] 및 [Alt+Space]로 바꿨습니다.
points
이야 대단한데요.
이야 대단한데요. 자연스럽게 잘 입력되는군요.
--
마잇
points
오호...
멋있습니다!
제 홈페이지에다가도 설치해야겠네요 ^^;;
points
Wordpress plugin을
Wordpress plugin을 만들었습니다.
http://kldp.org/node/74826
Enjoy~
points
오오... 이럴수가...
오오... 이럴수가 너무 너무 잘 되네요...
이것, 정말 실용성 있는 것 같습니다. 여러 곳에 적용이 가능하겠는데요. 매우 좋네요.
대단하세요.
안녕하세요?
[Shift+Space] 또는 [Alt+Space]를 사용하는 것이 MS-DOS나 Linux같아서 재미있고 멋있어요.
저도 자바스크립트 한글 입력기를 만든 적이 있어요.
2벌식
http://ha1.seikyou.ne.jp/home/akairingosaita/typing/test2-6.htm
아래아한글(HWP)식 로마자 입력(Colspan님이 만드신 자바스크립트 한글 입력기를 거쳐서 만든 것)
http://ha1.seikyou.ne.jp/home/akairingosaita/typing/hangularea.html
다음에는 Bookmarklet로 만드시면 어떨까요? 편리할 텐데요.
bookmarklet란 이런 것입니다. (제가 만든 것은 아니에요. )
http://is-that-english.blogspot.com/2006/06/introducing-yet-another-hang...
http://colspan.net/blog/archives/2006/10/hangul_ime_book.html
JavaScript Hangul IME는 보통 일본어 입력기와 같이 쓰면 너무 편리해요.
아마 중국어나 독일어등 다른 언어와 같이 사용할 때는
JavaScript IME는 아주 편리한 것 같습니다.
points
bookmarklet이 궁금해서
bookmarklet이 궁금해서 들어가봤는데... 이런 걸 말하는 거였군요.
그냥 textarea가 있는 다른 페이지에 링크만 넣으면 되는군요...
bbcode를 써서 태그를 올리려고 했더니만 자꾸 javascript 부분이 사라져 버려서 그냥 이대로 씁니다.
네, 그렀습니다. 와...
네, 그렀습니다.
와... 이런 script로 실현할 수 있구나...
감동...
근데, 사용법이 좀 잘 못 쓰신 것 같습니다.
"여기를 누르면 이 페이지에 JS IME가 적용됩니다." 가 아니라
"이 링크를 bookmark로 추가한 다음에 어떤 페이지에서 그 bookmark를 실행하면 그 페이지에 JS IME가 적용됩니다."
가 적당하지 않을까 봅니다.
근데 이 script는 프레임이 없는 페이지에서는 잘 작동하지만
frame이 있는 페이지에서는 잘 작동하지 않을 것 같습니다.
frame 있는 페이지 예:
http://www.arirang.co.kr/
# 단, Firefox 경우는 "이 프레임만을 표시"하면 잘 작동하겠지요.
제가 netisinfinite님의
제가 netisinfinite님의 의도를 잘못 받았었습니다.
죄송합니다.
netisinfinite님이 쓰신 것은 아주 정확한 표현이라고 잘 알았습니다.
그러니까 bookmarklet를 사용하려는 분은
그냥 그 링크를 bookmark로 추가해 놓으면 준비완료입니다.
bookmark 이름 그대로
"여기를 누르면 이 페이지에 JS IME가 적용됩니다." 이니까요.
netisinfinite님 정말 죄송합니다.제가 좀 짧았습니다.
points
생각해 보니 링크에
생각해 보니 링크에 있는 내용을 그냥 북마크에 넣어두고 사용해도 되겠는데요?
그래서 bookmarklet이라고 부르는 것이군요. 소개해주신 chiyu@JAPAN님께 감사드립니다. :)
아래 내용으로 북마크를 만들어 넣고 몇몇 사이트를 돌아다녀 봤습니다. 대부분의 사이트에서 북마크를 클릭하면 바로 한글 입력이 되네요.
javascript:(function(){var s=document.createElement('script');s.src='http://alee.qubit.name/misc/ahim.js';document.body.appendChild(s);})();
points
<a href="javascript:var docs=new Array(d
AHIM ON!
언급하신 사이트는 물론 iframe까지 지원하도록 고쳤습니다.
points
정말 신기해요.
정말 신기해요. 자바스크립트를 무시하면 안되겠는걸..,
--
내게로~ 와줘~ 와줘!!
points
GreaseMonkey용
GreaseMonkey용 스크립트로 한번 만들어봤습니다. (그래 봐야 한 7줄 추가한 것...)
일단 GreaseMonkey 확장을 설치한 다음 첨부파일의 확장자를 .js로 바꿔 설치하시면 됩니다.
portable firefox와 함께 메모리에 넣고 다녀도 괜찮을 것 같습니다.
daum 같은 주요 사이트들 돌아다녀 봤는데 별 문제없이 잘 되네요.
points
고맙습니다. 안그래도
고맙습니다.
안그래도 FF 확장 기능으로 한글 입력기를 만들면 좋겠다는 분이 계셔서 GreaseMonkey를 사용하면
어떻게 해결 가능하지 않을까 생각하고 있었는데, 덕분에 수고를 덜었습니다.
그런데 GreaseMonkey 사용 방법을 잘 모르겠네요. 파일을 다운받은 다음에 어떻게 적용을 시켜야
하는지 자세한 설명을 좀 부탁드려도 될까요?
points
별 말씀을... 한 것도
별 말씀을... 한 것도 없는데 민망하네요 -_-; 사용법은 그냥 ahim.user.js로 파일명을 변경한 후 불여우의 파일 열기 기능을 이용해 읽어들인 뒤 설치 승인을 해 주시면 됩니다.
(GreaseMonkey가 설치된 불여우에서 *.user.js는 *.xpi와 유사하게 동작을 합니다. 그냥 웹에 http://alee.qubit.name/misc/ahim.user.js 이런 식으로 올리셔서 클릭만 하셔도 되구요. GreaseMonkey 메뉴에서 New User Script를 실행해도 될 것 같은데 제 불여우가 정상이 아니라서 확인이 안 되고 있습니다...)
설치하면 자동으로 활성화 되어 ahim.user.js의 메타데이터에 적힌 범위(*)에 해당하는 사이트들에서 동작을 합니다. 필요하다면 GreaseMonkey의 Manage User Scripts 메뉴에서 적용 범위를 수정할 수 있고, 그냥 원숭이 아이콘을 누르는 것 만으로도 껐다 켤 수 있습니다.
추가로... 화면 오른쪽 아래에 한/영 표시하는 버전을 올립니다.
댓글이라 위는 수정이 안 되는군요...
points
감사합니다. 잘
감사합니다. 잘 되네요.
저도 메뉴에 있는 GreaseMonkey의 New user script를 이용해서 추가하려니 안 돼서 여쭤본겁니다.
그런데 그냥 불러오면 되는거였군요. ㅡㅡ;
points
좀... 이상한것이..
GreaseMonkey 용으로 설치해서 테스트 해봤는데..
한글모드에서 한글이외의 문자들이 입력이 안되는것 같은데요...
원래 그렇게 입력이 안되도록 되어있는 것인가요?
WindowsXP sp2, Firefox2.0 입니다.
여기 댓글창에서 테스트해봤습니다.
points
테스트 해 보니
테스트 해 보니 되는 경우도 있고 안 되는 경우도 있네요.
또, 자소 단위 삭제도 안 되네요.
소스 수정이 좀 필요할 것 같습니다.
points
특수문자 입력이 안
특수문자 입력이 안 되는 문제와 자소단위 삭제 문제를 해결한 버전입니다.
http://alee.qubit.name/misc/ahim.user.js
points
원본 ahim.js에서 없던
참고하시라고 문서 하나 링크합니다. 글 쓰고 나니 벌써 수정이 되어 있어서 원래 썼던 내용은 지웁니다.
points
감사합니다.Greasemonkey
감사합니다.
Greasemonkey용이라면 어차피 FF에서의 사용이 전제되어 있으므로 IE 지원을 위한 코드를 빼서
크기를 좀 줄였습니다. 아, 그런데 html이 아니라 txt 파일을 열면 상태창이 <SPAN>En 과 같이
보기싫게 표시되는데, 이걸 없앨 수 있는 방법이 없을까요?
points
175 :
175 : if(document.getElementsByTagName('textarea')[0] || document.getElementsByTagName('input')[0]){ 176 : document.getElementsByTagName('body')[0].appendChild(imStatus); 177 : document.addEventListener('keypress', imKeypressHandler, true); 178 : }이거면 비 html 및 im이 불필요한 상황에서의 문제는 모두 해결될 것 같습니다.
모든 형태의 컨텐츠에서 스크립트가 로드되는 걸 방지하려면
이런 식으로(혹은, 반대로 include에) 하나씩 추가해주는 방법도 있습니다.
points
아, 감사합니다. 바로
아, 감사합니다. 바로 답을 주시네요. :)
입력 상태 표시에 대한 의견
스크립트 정말 잘 쓰고 있습니다. 한글 locale이 설치안된 solaris에서 사용중이라
한글입력기가 사용 불가능한 상황이었습니다.
위에 올리신 greasemonkey최신 스크립트는 작동하지 않고 그 전에 여기 kldp에 업로드하신
(상태창 없고, 특수기호 입력 안되는)
버젼은 작동하더군요. 왜 그런지 모르겠습니다.
한/영 상황 표시하는 부분이 에러라면 아래와 같이 하면 어떨까요.
상태 창을 글 제목에다 표시할 수 있습니다.
if (document.title){
if (document.title.substr(0,4)=='[H2]' ||
document.title.substr(0,4)=='[En]')
document.title='['+imLang+']'+document.title.substring(4);
else
document.title='['+imLang+']'+document.title;
}
이런 식으로 했더니 브라우저 위의 제목 앞에 [H2]라든지 [En]이라든지가 표시가
되는군요. H3는 전 해당사항 없어서 안했지만 얼마든지 가능하리라 봅니다.
points
제가 greasemonkey를
제가 greasemonkey를 별로 안 쓰기 때문에 코드를 고치면서 테스트를 안 한 모양입니다.
다시 제대로 작동하도록 수정했습니다. 한/영 상황 표시 문제는 아니었구요, 단순한 코딩 실수입니다.
타이틀바에 넣는 방법도 꽤 괜찮은 방법 같습니다. 다음번에 소스를 고칠 때 한번 고려해
보도록 하겠습니다.
http://alee.qubit.name/misc/ahim.user.js
감사합니다
새 버젼이 훨씬 낫군요. 한글모드에서 특수기호 입력도 잘 되고. greasemonkey에서 잘 돌아가는군요.
상태창도 잘 보입니다. 대단히 감사드립니다.
단, 여기에 글 쓸때는 greasemonkey를 끄지 않으면 한글 입력이 불가능하군요.. . :)
points
사실 그 문제를
사실 그 문제를 해결하기 위해 집어넣은 코드가 말썽이었습니다.
즉, ahim.js가 이미 적용되어 있는 페이지에서는 ahim.user.js가 작동하지 않도록 하려고
집어넣은 코드 때문에 ahim.user.js가 아예 작동하지 않은 것이죠.
해결할 수 있는 방법을 알고 계신 분 계시면 도움을 부탁드립니다.
points
이미 ahim.js가
이미 ahim.js가 적용되어 있는 페이지에서는 greasemonkey용 입력기가 작동하지 않도록
한 버전을 다시 올립니다. 또, Ko/En 상태창이 자판 전환시에만 나타났다가 글을 입력하면
사라지도록 고쳤습니다.
http://alee.qubit.name/misc/ahim.html
points
정말 내공이
정말 내공이 뛰어나십니다.
전 7살때 자바스크립트를 시작해서 여태까지 몇걸음 못나갔어요. 벌써 6년이 됐는데... -_-
points
ㅂㅌ..
사람이 아냐..-_-
(돼지였던가..)
==
아 씨끄러 씨끄러~ 조용해!!
레드햇 9 이하 사용금지!
points
Thanx very much
정말 고맙습니다.
IME 설치를 막아놓은 컴퓨터가 많은데 덕분에 유용하게 사용하고 있습니다.
한국은 아직도 외국인들에게 많이 생소한 나라라는 것을 뼈저리게 느끼고 있네요.
points
지금 일본에 와
지금 일본에 와 있는데요, 잘 돼서 정말 좋습니다. ^^ 근데 일본어 자판에서 세벌식을 쓸 때 초성 "ㅌ"이 없는 것 같아요.
points
일본어 키보드는
일본어 키보드는 특수문자 위치가 다른 것으로 알고 있습니다.
세벌식에서는 작은따옴표(')를 누르면 ㅌ이 입력되도록 되어 있으니 '을 찾아서 한번 눌러 보세요.
points
오~ 멋지군요~ :-)
올린글이 좀 된것 같은데요.
저는 이제야 보는군요.
멋지네요~
필요할때 사용할 수 있도록 기억해 놓겠습니다. :-)
고맙습니다~
---
Jabber: lum0320@jabber.org
points
저는 이미 유용하게 썼어용.
외국에서 한글입력기 없는 인터넷 PC를 쓰게 되면 이게 꼭 필요하더라고요...
하지만 팝업이 막혀있고, 창 매니저를 쓸 수 없게 되어 있는 곳도 있어서,
한글입력기를 못 쓸 수도 있을 때가 많더라구요.
프레임을 별도로 두어서 URL 창에 별도의 주소를 쓰면 다른 프레임에 사이트가 뜨도록
만들어 주실수는 없으실까용? +_+
(아니면 직접 만들어 볼까나...)
====
( - -)a 이제는 학생으로 가장한 백수가 아닌 진짜 백수가 되어야겠다.
points
만들어 주세요.
만들어 주세요. ㅡㅡ;
최후의 수단으로 Copy & Paste를 사용하는 방법도 있습니다.
points
Safari3에서는 안되는 군요
혹시나 아직 한글입력이 안되고 있는 윈도용 Safari3에서 실행해보니 안되는 군요.
윈도용 Safari3에서 javascript로 한글 입력이 되면 요즘 뜨거운감자인 iPhone에서도 될 것 같아 시험해 봤습니다. :)
----------------------------------------
http://moim.at
http://mkhq.co.kr
points
아이폰용 한글
아이폰용 한글 입력기가 개발중입니다.
http://www.appleforum.com/ipod/52146-iphoneim-iphone-%ED%95%9C%EA%B8%80-...
points
궁금해서 한번
궁금해서 한번 들어가 봤는데, 애플 포럼의 issuefreaks님께서 제 소스를 가져다가 만든
것이네요. 근데 아무리 GPL이지만 소스를 갖다가 쓰셨으면 코멘트라도 좀 남겨 주시지 아무
언급도 없으니 좀 서운하군요. 댓글이라도 하나 달까 하다가 가입하기 귀찮아서 관뒀습니다.
points
안녕하세요..
안녕하세요 그 issuefreaks입니다..
alee님의 노력과 많은 분들의 의견과 관심이 담겨있는 소스코드를 이용하기만 했지,
여기 코멘트를 달거나 출처를 언급하는것을 미처 생각하지 못했었네요..
늦었지만.. alee님의 훌륭한 작업과, 이 스래드의 AIM for Hangul에 도움을 주신 분들께 감사드립니다.
points
:)
:)
대단하십니다.
요즘에도 여기 들어오시나요?
제가 궁금한것이 있는데요..
전 웹으로만 돌아가는 키오스크를 제작중인데요..
한글 입력을 외부프로그램이 아닌 웹으로 해결해야할 문제가 있었는데 이런 멋진걸 만드셔서 놀라울따름입니다.
보통 사람들이 한글 입력을 하기위해 이것을 쓰는데..
처음부터 영어로 입력이 되잖아요..
한/영 전환을 하면 한글이 쳐지고요..
처음부터 한글을 칠 수 있다면 더욱 편할것같은데요..^^
키오스크엔 키보드가 없기때문에 화상영문키보드에 이것을 적용시키면 너무나도 쉽게 한글을 구현할수가 있네요
아무튼 대단합니다~!!
points
소스(ahim.js)의 29번째 줄,
소스(ahim.js)의 28번째 줄,
부분의 'En'을 'H2'로 바꿔서
와 같이 고쳐 주시면 처음 시작할 때 한글 두벌식이 적용됩니다.
points
네 감사합니다.
알려주시기전에 소스를 보다보니 그부분이 있더군요.. 좀더 알아보고 글을 남겼어야하는데
죄송합니다~^^
근데요 문제가 하나 생겼는데요.
화상키보드를 적용시켰을경우 한글인데도 그냥 영문으로 표기가 되던데요..
혹시 가능하시다면 저좀 도와주세요 ㅡㅜ
자바스크립트는 완전 초짜나 다름없어서 이만저만 어려움이 있는게 아니네요...
'강' 이라는 글자를 화상키보드로 "ㄱㅏㅇ"순차적으로 누르면
똑같이 "ㄱㅏㅇ"으로 표기가 되는데.. 어케해야할까요?
//[input type="button" name="key" value=" ㅁ " onClick ="Key('ㅁ')" ]
대충 이런식의 소스입니다.
도와주세요~
points
Key('ㅁ')이 아니라
Key('ㅁ')이 아니라 Key('a')로 해야되지 않을까요?
points
설명만으로는 정확히
설명만으로는 정확히 만들고 계신 것이 어떤 것인지 알 수가 없어서 도움을 드릴
수가 없네요. 이곳에 자주 오시는 분 중에는 저보다 훨씬 잘 하는 분이 많이 계시니
전체 소스를 볼 수 있도록 하신 다음에, 글타래를 하나 새로 열어서 질문을 하시는
것이 더 좋을 것 같습니다.
대단하세요~!!
요즘에도 여기 들어오시나요?
제가 궁금한것이 있는데요..
전 웹으로만 돌아가는 키오스크를 제작중인데요..
한글 입력을 외부프로그램이 아닌 웹으로 해결해야할 문제가 있었는데 이런 멋진걸 만드셔서 놀라울따름입니다.
보통 사람들이 한글 입력을 하기위해 이것을 쓰는데..
처음부터 영어로 입력이 되잖아요..
한/영 전환을 하면 한글이 쳐지고요..
처음부터 한글을 칠 수 있다면 더욱 편할것같은데요..^^
키오스크엔 키보드가 없기때문에 화상영문키보드에 이것을 적용시키면 너무나도 쉽게 한글을 구현할수가 있네요
아무튼 대단합니다~!!
대단하십니다~!
요즘에도 여기 들어오시나요?
제가 궁금한것이 있는데요..
전 웹으로만 돌아가는 키오스크를 제작중인데요..
한글 입력을 외부프로그램이 아닌 웹으로 해결해야할 문제가 있었는데 이런 멋진걸 만드셔서 놀라울따름입니다.
보통 사람들이 한글 입력을 하기위해 이것을 쓰는데..
처음부터 영어로 입력이 되잖아요..
한/영 전환을 하면 한글이 쳐지고요..
처음부터 한글을 칠 수 있다면 더욱 편할것같은데요..^^
키오스크엔 키보드가 없기때문에 화상영문키보드에 이것을 적용시키면 너무나도 쉽게 한글을 구현할수가 있네요
아무튼 대단합니다~!!
points
입력기 이름을 AIM for
입력기 이름을 AIM for Hangul로 바꿉니다.
사용하고 계신 분은 스크립트 주소를
http://alee.anj.kr/misc/ahim.js에서 http://aim.anj.kr/aim.js로 변경해 주세요.
points
이런것도
이런것도 가능하군요.. 정말 놀랍습니다. alee 님의 능력도 놀랍고, 자바스크립트의 능력도 -_-;;; 오늘 보다 넓은 세상을 보고 갑니다 :)
-----------------------------------------------------------------------
GPL 오픈소스 윈도우용 이미지 뷰어 ZViewer - http://kldp.net/projects/zviewer/
http://www.wimy.com