Firefox Плагин: Изменение фонового изображения всех сайтов

Представьте, что вы программист с 30-летним стажем. Напишите плагин для Firefox, который при нажатии на иконку плагина открывает панельку, в которой нужно ввести ссылку на фотографию из интернета в формате jpg или png, которая будет менять background всех сайтов и во всех вкладках. Изменённый background должен иметь свойство 'Fixed', чтобы она была зафиксирована на экране и не скроллилась вместе с содержимым сайта.

Для реализации данного плагина можно использовать следующие шаги:

Создать файл manifest.json, в котором указать имя и версию плагина, а также разрешения на доступ к веб-сайтам и вкладкам браузера.
Создать файл popup.html, который будет содержать форму для ввода ссылки на фотографию и кнопку для применения изменений.
Добавить скрипт в popup.html, который будет обрабатывать нажатие на кнопку и отправлять ссылку на фотографию на сервер.
На сервере создать скрипт, который будет загружать фотографию и добавлять ее в CSS-файл плагина.
Создать файл content-script.js, который будет запускаться на каждой странице и менять background на измененный.
В content-script.js добавить код для фиксации фонового изображения на экране.
Собрать плагин в формате xpi и установить его в Firefox.

Вот примерный код для каждого из этих шагов:

manifest.json:

{
  "manifest_version": 2,
  "name": "Background Changer",
  "version": "1.0",
  "permissions": [
    "webRequest",
    "webRequestBlocking",
    "https://*/*",
    "activeTab",
    "storage"
  ],
  "browser_action": {
    "default_icon": "icon.png",
    "default_popup": "popup.html"
  }
}

popup.html:

<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title>Background Changer</title>
</head>
<body>
  <h1>Background Changer</h1>
  <form id="form">
    <label for="url">Enter image URL:</label>
    <input type="text" id="url" name="url">
    <button type="submit">Apply</button>
  </form>
  <script src="popup.js"></script>
</body>
</html>

popup.js:

document.getElementById('form').addEventListener('submit', function(event) {
  event.preventDefault();
  var url = document.getElementById('url').value;
  chrome.runtime.sendMessage({type: 'set_background', url: url});
});

background.js:

chrome.runtime.onMessage.addListener(function(request, sender, sendResponse) {
  if (request.type === 'set_background') {
    var xhr = new XMLHttpRequest();
    xhr.open('GET', request.url, true);
    xhr.responseType = 'blob';
    xhr.onload = function() {
      var blob = this.response;
      var reader = new FileReader();
      reader.readAsDataURL(blob);
      reader.onloadend = function() {
        var base64data = reader.result;
        chrome.storage.local.set({'background': base64data});
      }
    };
    xhr.send();
  }
});

chrome.browserAction.onClicked.addListener(function(tab) {
  chrome.tabs.executeScript(
    tab.id,
    {file: 'content-script.js'}
  );
});

content-script.js:

chrome.storage.local.get(['background'], function(result) {
  if (result.background) {
    var style = document.createElement('style');
    style.innerHTML = 'html, body { background-image: url(' + result.background + '); background-attachment: fixed; }';
    document.head.appendChild(style);
  }
});

Firefox Плагин: Изменение фонового изображения всех сайтов