Oleg Atamanenko

thoughts about programming

Создание страницы настроек для расширений Google Chrome

В продолжение предыдущей заметки

Логично предположить, что у расширений могут быть настройки. В Google Chrome/Chromium для этого есть специальный API.

Для того, чтобы создать собственную страницу настроек необходимо сделать следующее:

  1. Объявить в манифесте страницу настроек
{
  "name": "Delicious plugin", 
  "version": "0.2", 
  "background_page": "background.html", 
  "options_page": "options.html"
}

  1. Реализовать страницу с настройками.

    Страница с настройками - это обычная HTML-страничка. Для доступа к настройкам Google Chrome предоставляет объект localStorage, который умеет сохранять и возвращать значения.

    С объектом localStorage работа идёт как с обычным hash.

<html>
<head>
<title>Delicious Bookmarks Options</title>
</head>
<script type="text/javascript">
    // Saves options to localStorage.
    function saveOptions() {
        var share = document.getElementById("share");
        localStorage["markPrivate"] = share.checked;

        // Update status to let user know options were saved.
        var status = document.getElementById("status");
        status.innerHTML = "Options Saved.";
        setTimeout(function() {
            status.innerHTML = "";
        }, 1500);
    }

    // Restores select box state to saved value from localStorage.
    function restoreOptions() {
        var share = localStorage["markPrivate"];

        if (!share) {
            return;
        }
        var shareCheckbox = document.getElementById("share");

        shareCheckbox.checked = share;
        
    }
</script>

<body onload="restoreOptions()">

<label for="share">Mark as Private</label>
<input type="checkbox" class="checkbox" name="share" id="share" />


<br>
<button onclick="saveOptions();">Save</button>
<div id="status">&nbsp;</div>
</body>
</html>

Чтение настроек

При инициализации страницы настроек необходимо проставить актуальные значения. Для этого на событе onload навешивается функция restoreOptions(), которая проставляет в пользовательском интерфейсе текущие настройки.

Запись настроек

Для сохранения настроек навешивается обработчик onclick для кнопки save - метод saveOptions.

Вот таким простым способом можно сохранять настройки расширения.

Документация

Comments

karri
Мне вот тут понадобилось поставить Flash player для Chromium'a, перерыла кучу ссылок в инете и наткнулась на классный блог http://www.ubuntugeek.com/
Он, судя по всему, для таких чайников как я(все было понятно даже на английском), поставила player без проблем и терь сижу довольная до невозможности :) Оч рекомендую начинающим линуксоидам, может кому пригодится :)