'분류 전체보기'에 해당되는 글 22건

  1. 2008.02.21 그리스 몽키 활용하기 - 메일 송신시 확인창 띄우기 1
  2. 2008.02.10 캔음료의 위생

그리스 몽키 활용하기 - 메일 송신시 확인창 띄우기

  웹메일을 사용하다 보면 실수할 때가 종종 있다. 깜빡 잊고 첨부 파일을 첨부하지 않는다거나 사소한 맞춤법을 틀린다거나 하는... 메일을 보내기 전에 꼼꼼히 점검한다고 해도 사람인 이상 실수를 안하기는 어렵다. 그래서 언젠가 '메일 전송 버튼을 클릭할 때 이러한 사항을 확인하도록 하는 경고를 보여주면 어떨까' 하는 생각이 들었다.

  파이어폭스 확장 기능에 그리스 몽키라는 게 있다. 이것은 사용자가 방문하는 웹사이트에 자신만의 자바스크립트를 추가할 수 있는 도구다. 그리스 몽키를 사용하면 내가 원하는 기능을 쉽게 추가할 수 있을 것 같아 시도해 보았다.


1. 그리스 몽키 설치
설치는 매우 간단하다. 파이어폭스 메뉴 -> 도구 -> 부가 기능 -> 유용한 확장 기능으로 이동한 후, 'grease monkey'로 검색하면 쉽게 찾을 수 있다. 설치하기 버튼을 클릭하고 '지금 설치' 버튼을 누르면 설치가 완료된다(파이어폭스를 재시작해야 한다).

그리스 몽키



2. 자바 스크립트 작성하기
다음으로 추가하고 싶은 자바 스크립트를 작성해야 한다. 그리스 몽키와 자바 스크립트에 익숙하지 않기 때문에 'Dive Into Greasemonkey'라는 일종의 튜토리얼을 참고하였다. 튜토리얼을 따라 'Hello World'를 띄워본 후, 내가 원하는 기능을 찾아보던 중 'Intercepting user clicks'라는 예제를 발견하였다.


document.addEventListener('click', function(event) {
    // event.target is the element that was clicked

    // do whatever you want here

    // if you want to prevent the default click action
    // (such as following a link), use these two commands:
    event.stopPropagation();
    event.preventDefault();
}, true);


이 스크립트를 등록하면, 마우스를 클릭할 때마다 위 함수가 호출된다. event.stopPropagation()과 event.preventDefault()는 클릭으로 작동해야 하는 행동을 무시하는 역할을 한다. 지금 이대로라면 페이지 상의 링크나 버튼을 클릭하더라도 아무 반응을 보이지 않는다. 나는 메일 버튼이 클릭되었을 때만 나만의 처리를 하기 원하므로 그 부분을 추가해야 한다.

event.target.id를 사용하면에는 이벤트가 트리거된 엘리먼트의 아이디를 얻을 수 있다. 따라서 이를 메일 전송 버튼의 아이디와 비교하면 될 것이다. 나는 엠파스 메일을 사용하기 때문에 엠파스 메일의 작성 페이지로 이동한 후, 소스 보기를 사용하여 메일 전송 버튼의 아이디가 'btnSend1'과 'btnSend2'라는 것을 알아내었다.

이를 바탕으로 내가 등록할 스크립트를 다음과 같이 작성하였다.

document.addEventListener('click', function(event) {
   
    if (event.target.id == 'btnSend1' || event.target.id == 'btnSend2')
    {
        if (!confirm('== 잠깐! 다음 사항을 모두 확인하였습니까? == \n' +
            '1. 수신자 확인\n2. 맞춤법 검사\n3. 첨부 파일 확인'))
        {
            event.stopPropagation();
            event.preventDefault();
        }
    }
   
}, true);

클릭한 엘리먼트의 아이디가 'btnSend1' 또는  'btnSend2'이면 (확인, 취소 두 개의 버튼이 있는) confirm 창을 띄우고 확인을 눌렀을 때만 클릭한 결과가 작동(메일 전송)되도록 하였다. 이 스크립트를 mailcheck.user.js라는 이름으로 저장하였다(그리스 몽키에서 사용할 스크립트의 확장자는 .user.js여야 한다).


3. 스크립트 등록하기
이제 작성한 스크립트를 원하는 웹페이지(엠파스 메일)에 등록해야 한다. 파이어폭스 메뉴 -> 파일 -> 파일 열기로 mailcheck.user.js 파일을 열면 다음과 같은 창이 뜬다.

사용자 삽입 이미지

설치 버튼을 눌러 설치를 진행한 후, 파이어폭스 메뉴 -> 도구 -> Greasemonkey -> 유저 스크립트 관리로 이동한다. 다음과 같이 mailcheck 스크립트가 설치되어 있음을 확인할 수 있다.

사용자 삽입 이미지

동작할 페이지에서 *를 선택하고 수정을 눌러 이 스크립트가 작동하기를 원하는 페이지로 변경한다. 나는 엠파스 메일 페이지(http://mail.empas.com/*)로 변경하였다.


4. 확인
엠파스 메일 페이지를 띄워 실제로 작동하는지 확인해 보았다. 메일을 작성하고 보내기 버튼을 누르니 다음과 같은 confirm 창이 뜬다. 확인 버튼을 누르면 메일이 전송되고 취소를 누르면 아무 일도 일어나지 않는다. 간단한 기능이지만 메일 작성자에게 메일 내용을 다시 한 번 확인해보도록 환기시킬 수는 있을 것이다.
사용자 삽입 이미지


파이어폭스에서 밖에 사용할 수 없고 메일 사이트마다 스크립트를 등록해줘야 한다는 문제는 있지만 이를 통해 메일을 보낼 때 자주 하는 실수를 조금이나마 줄일 수 있을 것 같다.


※ 참고 사이트
Dive Into Greasemonkey - http://diveintogreasemonkey.org
W3Schools Online Web Tutorials - http://www.w3schools.com/js/default.asp



캔음료의 위생

사용자 삽입 이미지

  캔 음료를 마시다가 종종 그 위생에 관해 생각해 볼 때가 있다. 캔 용기는 음용부가 외부로 노출되어 있고 캔을 딸 때 입구부가 용기 내부로 들어가기 때문에 상당히 비위생적이다. 그런데도 많은 사람들은 그리 의식하지 않고 캔 음료를 마신다. 가끔 캔 뚜껑을 닦고 마시는 사람은 봤지만 그 위생에 대해서는 심각하게 생각하지 않는 듯하다. 이런 생각을 하는 나도 자판기에서 뽑은 캔 음료를 망설임 없이 마시기는 하지만...

  그러나 분명히 나와 같은 생각을 한 사람들이 있을 것이라 여겨 검색을 해 보았다. 예상대로 여러 사람들이 비슷한 생각을 했고 다음과 같이 관련된 특허도 많았다.

관련 특허들...
http://patent.naver.com/patent/specification.php?ApplicationNumber=2020010026251
http://patent.naver.com/patent/specification.php?ApplicationNumber=1020000015969
http://patent.naver.com/patent/specification.php?ApplicationNumber=1020000005346
http://patent.naver.com/patent/specification.php?ApplicationNumber=2020050030495
http://patent.naver.com/patent/specification.php?ApplicationNumber=2019990000209
http://patent.naver.com/patent/specification.php?ApplicationNumber=1020010075135

  위 특허들의 공통점은 위생을 위해 캔 상단에 뭔가(비닐이나 플라스틱 등)를 씌워 오염으로부터 보호한다는 것이다. 그러나 이것은 캔 용기의 장점을 감쇄시키는 방안이라 생각한다. 캔 용기는 원터치로 간단히 개봉할 수 있다는 것과 용기 전체가 하나의 재질로 되어 있어 분리 수거가 용이하다는 장점이 있는데 이 두 가지 장점 모두를 없애버린다는 점에서 별로 좋은 해결책은 아닌 것 같다.

  한편, 별도의 커버를 장착하지 않고 입구부의 오염을 막고자 하는 방안도 있었다.

http://patent.naver.com/patent/specification.php?ApplicationNumber=1019990012571

  이 방안에 따르면 캔을 따는 손잡이가 입구부 위에 장착되기 때문에 캔을 따기 전까지는 입구부가 노출이 되지 않는다. 캔 용기의 장점을 그대로 살리고 있기에 앞의 방법들보다는 확실히 나아 보인다. 그렇지만 음료를 마실 때 입에 닿는 캔 상단부는 보호하지 못한다. 더 기발한 방법이 나올 법도 한데... 하긴 지금처럼 사람들이 크게 의식하지 않는다면 새로운 방법이 개발되더라도 바뀌지 않을 지도 모르겠다.


prev 1 2 3 next