Skip to content
TUWLAB.com
XE

XE 1.7.x에서 Alert 함수 재정의(Override) 해제하기

Posted 2013. 03. 14 Updated 2017. 06. 02 Views 11053 Replies 0
Atachment
첨부

XE가 1.5에서 1.7로 넘어오면서 정말 많은 부분이 바뀌었습니다.

PHP 하위 버전이나 제로보드 지원 관련 코드들이 전격 삭제되면서 반응 속도가 눈에 띄게 향상되었습니다.

특히, 관리자 페이지 레이아웃이 전격 수정되었는데, 예전의 칙칙한 디자인에서 깔끔하고 정돈된 디자인으로 바뀌었습니다.

xe_1_7_x_admin.png
▲ 깔쌈하게 바뀐 XE 1.7.x 관리자 페이지


이러한 깔끔하게 바뀐 디자인에 부응하여 자바스크립트 기본 함수도 많이 재정의(Override) 되었습니다. 특히, 기본 알림 함수인 Alert 함수가 Modal Layer 방식으로 바뀌었습니다.

alert() 함수를 호출하면 브라우저의 지원하는 기본 Alert 창이 아닌, 다음과 같은 모달창이 뜹니다.

alert_override.png
▲ 재정의된 Alert 함수


이게 디자인적으로 기존 Alert창보다 나은지는 잘 모르겠지만, XE 개발자 입장에서는 별로 좋은 개선사항이 아닌것 같습니다.

아무리 FireBug 등 자바스크립트 디버깅 툴을 활용한다고 하더라도, Alert창으로 값을 띄워보면서 디버깅 하는 것이 유용할 때가 있습니다.

사실, 저도 한때 자바스크립트의 기본 사용자 Interaction 함수인 Alert, Confirm, Prompt등의 함수를 재정의하여 사용했던 적이 있었습다. (2000년도 경이었던가.)

당시 밀레니엄 알러트(-_-)라고, 지금 생각해 보면 참 쓰잘떼기 없는 걸 개발하갖고는 Happy CGI 같은 코드 공유 사이트에 업로드 한 적이 있었습니다.

기본 개념은 alert를 실행하면 기존 칙칙한 Alert창(IE의 Alert창은 얼마나 칙칙하던가!) 대신 무려 새 창을 띄워서 지정된 소리와 함께 이걸 화면에서 슬라이딩해서 보여준다거나 하는, 말 그대로 헛짓거리 하는 스크립트였다. 게다가 동작 속도도 느려 터졌고, 여러 개의 alert를 연달아 실행하면 오류가 발생하곤 하였습니다.

confirm이나 prompt등의 함수도 재정의를 시도했으나, 함수에서 값을 리턴해줄때까지 호출 쓰레드를 잡아 놓을 방법이 없어서 그냥 포기했었습니다.


XE에서 재정의된 Alert 함수의 가장 큰 문제점은 텍스트가 아닌, 객체나 오류를 표시하도록 전달했을 때 그 내용이 제대로 표시가 되지 않는다는 점입니다.

자바스크립트 디버깅을 할 때 alert의 인수로 객체를 전달했을 때 'undefind'나 'null', '[Object]'등의 메시지가 표시되면, 이를 통해 코드 중간점검을 할 수 있는 원리입니다.

그런데 alert 함수가 오버라이드 되면서 이런 기능이 먹통이 되어 버린 것입니다.

null 객체를 alert로 전달하면 아무 화면도 표시되지 않고, HTML코드를 전달하면 마크업을 그대로 보여주는 것이 아니라 화면에 표시를 해 버립니다. (<select>가 포함된 마크업을 alert로 표시했을 때 Alert창에 콤보박스가 나타났을 때의 당황스러움이란...-_-)


재정의된 Alert는 관리자 페이지에서만 적용되며, 일반 화면에서는 재정의되지 않고 원래 Alert창이 표시됩니다.

이 재정의를 해제하기 위해 역시 관리자 페이지 소스를 뒤져서 로드된 스크립트를 모두 역추척 하였고, 그중에 범인(!)이 숨어 있던 스크립트 파일을 찾을 수 있었습니다.


다음과 같은 조치를 취하면 XE 1.7.x에 적용된 Alert 재정의를 해제할 수 있습니다.

$msgBox = $('.x_modal._common');
	$msgBox.on('change', '.site_selector', function(ev){
		var sSiteSrl = $(this).val();
		$.xeShowMenuSelector($container, sSiteSrl);
	});

	$.fn.xeMenuSearch = function(){
		$(this).each(function(nIdx, el){
			$(el).on('click', xeMenuSearch);
		});
	};

	$('.module_search').xeMenuSearchHtml();

	$('.moduleTrigger').xeMenuSearch();

});

//----------------menu selector end
/* [20130314|TUW] Alert 재정의 해제
jQuery(function($){
	//_alert = alert;
	try {
		window.alert = function(){
			return $.xeMsgBox.alert.apply($.xeMsgBox, arguments);
		}
		setTimeout(function(){$('div.message.info').fadeOut(1000);}, 2500);
	}catch(e){}
});
*/
jQuery(function($){
	$('#site,.x_modal._common').on('keydown', 'input', function(ev){
		var $container, $btn;
		if(ev.keyCode === 13){
			$container = $(ev.target).parent();
			while($container && !$container.hasClass('col')){
				$btn = $container.find('button.x_btn-primary,button.x_btn-inverse');
				if($btn.length>0){
					// multi-lang field won't set the value until the input element is blured
					if($(ev.target).hasClass('lang_code')) $(ev.target).blur();

					ev.preventDefault();
					$btn.click();
					break;
				}
				$container = $container.parent();
			}
		}
	});
});


function(){var b=a(this).val();a.xeShowMenuSelector(g,b)});a.fn.xeMenuSearch=function(){a(this).each(function(b,d){a(d).on("click",e)})};a(".module_search").xeMenuSearchHtml();a(".moduleTrigger").xeMenuSearch()});/*[20130314|TUW] Alert 재정의 해제 jQuery(function(a){try{window.alert=function(){return a.xeMsgBox.alert.apply(a.xeMsgBox,arguments)},setTimeout(function(){a("div.message.info").fadeOut(1E3)},2500)}catch(d){}});*/


※ admin.js와 admin.min.js의 차이점은 단지 압축의 유무에 있으며, 관리자 설정에 따라 서로 다른 파일이 로드되므로 반드시 둘 다 수정해 주어야 합니다.


TAG •
서비스 선택
이용중인 SNS 버튼을 클릭하여 로그인 해주세요.
SNS 계정을 통해 로그인하면 회원가입 없이 댓글을 남길 수 있습니다.
댓글
?
Powered by SocialXE

List of Articles
번호 분류 제목 글쓴이 최근 수정일 조회 수
113 Linux Ubuntu에서 GIT Client 설치 및 사용하기 TUW 2014.04.24 11994
112 Linux SCP명령어 - 초간단 파일/디렉토리 전송 TUW 2014.04.23 38500
111 Linux Ubuntu에서 저장소(Repository) 위치 변경하기 TUW 2014.04.23 21471
110 Linux 디렉토리를 다른 경로에 마운트하기 (mount --bind) TUW 2018.11.16 22884
109 일반 [Windows 7] 흔들어 전체 창 최소화(Aero Gesture) 기능 끄기 10 file TUW 2017.06.02 20980
108 일반 영어로 나타낸 수학 용어 모음 2 file TUW 2018.01.08 23290
107 일반 [사설 클라우드 구축] 자동 동기화 설정 (FreeFileSync) 2 file TUW 2017.06.02 34209
106 Linux [사설 클라우드 구축] 네트워크 드라이브 연결 (NetDrive) file TUW 2017.06.02 15932
105 Linux [사설 클라우드 구축] 삼바(SAMBA) 서버 구축, 우분투-윈도 공유폴더 구현 file TUW 2017.06.02 23516
104 Linux [사설 클라우드 구축] 기본 조건 및 아이디어 TUW 2014.04.20 12806
103 일반 File Object (<input type='file' />)에 대하여 2 file TUW 2017.06.02 45989
102 Linux [Ubuntu] SSH 초기 접속 속도 향상시키기 TUW 2014.04.23 12804
101 일반 Guided Text Input 구현 1 file TUW 2017.06.02 10580
100 일반 페이스북 글 입력 필드 분석 file TUW 2017.06.02 10190
» XE XE 1.7.x에서 Alert 함수 재정의(Override) 해제하기 file TUW 2017.06.02 11053
98 XE XE 요소 개발을 쉽고 빠르게 - XE Wizard 2 file TUW 2017.06.02 13646
목록
Board Pagination Prev 1 ... 3 4 5 6 7 8 9 ... 13 Next
/ 13

Powered by Xpress Engine / Designed by Sketchbook

sketchbook5, 스케치북5

sketchbook5, 스케치북5