주소 (Address)를 구글맵 (Google Maps) iFrame 으로 변환 jQuery

때로는 텍스트 베이스의 주소만 가지고 주소변환을 통해 구글맵을 표시해 주고 싶을 때가 있습니다. 그런 경우 간단히 사용할 수 있는 코드를 공유합니다.

1. HTML Part

<span class="need_to_convert">
NSW, Australia
</span>

먼저 위와 같이 주소를 wrapping 한 부분이 필요하고요,

2. jQuery Part

jQuery(document).ready(function($) {
	$("span.need_to_convert").each(function(){ 
		var embed_iframe = '<iframe width="400" height="350" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="https://maps.google.com/maps?q=' + encodeURIComponent( $(this).text() ) + '&amp;output=embed"></iframe>';
	});

	$(this).html(embed_iframe);
});

저는 한 페이지에 여러개가 있을 경우를 대비해 jQuery를 이용해 Wrapper 의 클래스(need_to_convert)로 싸그리 찾아서 구글맵(Google Mpas) iFrame 으로 변환해 주었습니다.

실제로 위의 코드를 적용한 페이지입니다. -> 클릭

Cordova + iOS 10: NSCameraUsageDescription missing, NSPhotoLibraryUsageDescription

얼마전까지 PhoneGap 과 Cordova 를 이용해서 iOS App을 만들고 있었는데 몇일전 기능을 수정할 일이 있어서 수정후 다시 앱스토어에 올릴려고 하니 아래와 같은 이메일을 받게 되었다.

Dear developer,

We have discovered one or more issues with your recent delivery for "Meals Delivered". To process your delivery, the following issues must be corrected:
This app attempts to access privacy-sensitive data without a usage description. The app's Info.plist must contain an NSPhotoLibraryUsageDescription key with a string value explaining to the user how the app uses this data.
This app attempts to access privacy-sensitive data without a usage description. The app's Info.plist must contain an NSCameraUsageDescription key with a string value explaining to the user how the app uses this data.

해결 방법을 찾다 찾다 찾아내어서 해결 ^^
아래의 코드를 config.xml 에 넣어주고 PhoneGap 에서 컴파일 후 업로드하면 끝!!

<plugin name="cordova-plugin-media-capture" source="npm" spec="*">
	<variable name="CAMERA_USAGE_DESCRIPTION" value="App would like to access the camera." />
	<variable name="MICROPHONE_USAGE_DESCRIPTION" value="App would like to access the microphone." />
	<variable name="PHOTOLIBRARY_USAGE_DESCRIPTION" value="App would like to access the library." />
</plugin>

NSCameraUsageDescription, NSMicrophoneUsageDescription, NSPhotoLibraryUsageDescription 이 3가지 항목이 프라이버시 관련해서 문제가 발생하는 것으로 확인되었다.

마우스휠 Normalise

브라우져별로 마우스 휠이 스크롤될때의 값이 틀리기 때문에 경우에 따라서는 값을 보정해 주어야 하는 경우가 발생한다.

아래 코드는 브라우져별로 값을 보정해 주는 스크립트.

window.onload = function(){
	var wheelDistance = function(evt){
		if (!evt) evt = event;
		var w=evt.wheelDelta, d=evt.detail;
		if (d){
			if (w) return w/d/40*d>0?1:-1; // Opera
			else return -d/3;              // Firefox;         TODO: do not /3 for OS X
		} else return w/120;             // IE/Safari/Chrome TODO: /3 for Chrome OS X
	};
}