Chrome Extension Sample page 소스분석
https://developer.chrome.com/extensions/samples
CLD
Displays the language of a tab
SOURCE FILES:
1. 프로그램 설명
현재 active 상태입 탭의 language를 읽어들어 browser action 아이콘에 반영하여 보여준다.
탭 이동 이벤트를 인식한 후 language 를 읽어들이는 코드가 핵심이다.
2. 소스코드 설명
manifest.json
탭 페이지에 직접적으로 관여하지 않는 프로그램 이기 때문에 별도의 권한은 필요하지 않다.
{
"name": "CLD",
"description": "Displays the language of a tab",
"version": "0.3",
"background": {
"scripts": ["background.js"]
},
"browser_action": {
"default_name": "Page Language"
},
"manifest_version": 2
}background.js
탭 이동이 발생할 수 있는 3가지 이벤트( onUpdated, onSelectionChanged, query({active: true, currentWindow: true} ) 에 각각 refreshLanguage를 등록했다.
chrome.tabs.detectLanguage(integer tabId, function callback)
함수를 사용하여 현재 탭의 primary language 값을 없어온다.
callback 함수 매개변수로 아래 코드를 등록하여 language 를 얻어온 후 실행될 동작을 정의했다.
{
console.log(language);
if (language == " invalid_language_code")
language = "???";
chrome.browserAction.setBadgeText({"text": language, tabId: selectedId});
} chrome.browserAction.setBadgeText 함수를 사용하면 browser action 아이콘을 별도로 생성하지 않고 text를 입력할 수 있다.
// Copyright (c) 2009 The Chromium Authors. All rights reserved.
// Use of this source code is governed by a BSD-style license that can be
// found in the LICENSE file.
var selectedId = -1;
function refreshLanguage() {
chrome.tabs.detectLanguage(null, function(language) {
console.log(language);
if (language == " invalid_language_code")
language = "???";
chrome.browserAction.setBadgeText({"text": language, tabId: selectedId});
});
}
chrome.tabs.onUpdated.addListener(function(tabId, props) {
if (props.status == "complete" && tabId == selectedId)
refreshLanguage();
});
chrome.tabs.onSelectionChanged.addListener(function(tabId, props) {
selectedId = tabId;
refreshLanguage();
});
chrome.tabs.query({active: true, currentWindow: true}, function(tabs) {
selectedId = tabs[0].id;
refreshLanguage();
});
