Weather Widget에 날씨 정보가 갱신된 시간을 보여주도록 고치기
아시다시피, Apple의 Weather Widget은 주기적으로 AccuWeather에서 날씨 정보를 가져오고, 경우에 따라서는 정보를 가져오기 전 몇 초 동안은 한 시간 이전의 날씨 정보를 보여주기도 합니다.
문제는, 현재 표시된 날씨가 최신의 정보로 갱신 된 것인지를 확인하려면 몇 초 동안을 기다려야 한다는 것인데, 이런 기다림이 필요없이 단번에 Widget에 표시된 날씨가 가장 최근의 정보로 갱신된 것인지를 확인하기 위해서 정보가 갱신된 시간을 따로 표시하도록 고치는 방법이 John Gruber씨의 blog에 소개되어 있답니다.
이렇게 해서, 갱신된 시간이 현재의 시간과 거이 같다면 현재 표시된 정보가 가장 최근의 것임을 알 수 있으므로 몇 초 동안을 기다릴 필요가 없게 되고, 갱신 시간이 거이 한 시간 이전으로 표시되어 있다면 최신의 정보를 갖고 오도록 몇 초를 기다리면 됩니다.
여기서, 날씨 Widget이 최신 정보를 읽어드리는지는 오른쪽 위 구석에 있는 온도 도수 기호가 깜박거림을 멈추면 정보가 갱신 완료된 것이랍니다.
고치는 방법
우선, Apple의 원래 Weather.wdgt 파일을 복사해서 복사본을 사용자 전용 Widget 폴더인 ~/Library/Widgets/ 폴더로 옮깁니다.
이렇게 하면, 원래의 Weather.wdgt 대신에 사용자 폴더에 있는 것이 실행되며, 나중에 Apple에서 Weather.wdgt을 갱신하더라도 사용자 폴더에 있는 것을 지워주기만 하면 갱신된 것을 계속 사용할 수 있게 됩니다.
이제. 복사본 Weather.wdgt을 패키지 내용 보기로 엽니다.
패키지 내용 속에 있는 “Weather.html”파일을 글자 편집기로 열고,
68 번째 줄에 있는 것을:
<div id='high' class='text info smallinfo'></div>
다음과 같이 바꿉니다:
<div id='high-lo' class='text info smallinfo'>
<span id="high"></span> / <span id="lo"></span></div>
70 번째 줄을:
<div id='lo' class='text info smallinfo'></div>
다음과 같이 바꾸어 주고 저장합니다:
<div id='updatetime' class='text info smallinfo'></div>
이것은 정보가 갱신된 시간을 표시하기 위한 자리를 마련해 줍니다.
다음에, “”Weather.css“”파일을 열고,
77 번째 줄에 있는 것을:
color: rgba(255, 255, 255, .7);
다음과 같이 바꿉니다:
color: rgba(255, 255, 255, .85);
이렇게 하면 표시 글짜 투명도를 높게 해서 약간 더 진하게 보여준답니다.
81 번째 줄을:
다음과 같이 바꿉니다:
마지막으로, 85 번째 줄을:
다음과 같이 바꾸고 저장합니다:
다음에, “”Weather.js“” 파일을 엽니다.
257 번째 줄 다음에, 아래와 같은 코드를 넣습니다:
// Format the time of the last data refresh
var h = object.time.hour;
var ampm = getLocalizedString('am'); // default to am
if (h == 12) { // noon
ampm = getLocalizedString('pm');
} else if (h == 0) { // midnight
h = 12;
} else if (h > 12) {
h -= 12;
ampm = getLocalizedString('pm');
}
var m = object.time.minute;
if (m < 10) {
m = '0' + m;
}
document.getElementById('updatetime').innerText =
h + ':' + m + ' ' + ampm;
이 스크립트는 widget의 handleDataFetched() 함수에 포함되어서 자료를 불러들일 때 마다 시간을 표시해 줍니다.
마지막으로, ko.lproj 속의 localizedStrings.js 파일을 열고 다음과 같은 코드를 추가해 주면 한글화까지 완벽하게 끝납니다.
localizedStrings['am'] = '오전';
localizedStrings['pm'] = '오후';
이제 저장하고 날씨 Widget을 열면 다음과 같이 날씨 정보가 갱신된 시간도 같이 보여줄 겁니다.
일일이 고치는 수고를 덜고 싶으신 분들은 아래에 수정 완료된 파일을 받으시고 날씨 widget 패키지 내용에 있는 것을 대치해서 사용하세요.
:arrow: 수정된 Weather.wdgt 받기