webextensions/src/scripts/options.js

import ext from "./utils/ext";
import storage from "./utils/storage";

var urlInput = document.querySelector("[name=url]");
var tokenInput = document.querySelector("[name=token]");
var extractInput = document.querySelector("[name=extract]");
var message = document.getElementById("msg");

storage.get("url", function(resp) {
  urlInput.value = resp.url || "https://app.readlater.shikiryu.com";
});

storage.get("token", function(resp) {
  tokenInput.value = resp.token;
});

storage.get("extract", function(resp) {
  extractInput.value = resp.extract;
});

urlInput.addEventListener("blur", function(e) {
  if (this.value.endsWith("/")) {
    this.value = this.value.substring(0, this.value.length - 1);
  }
  var value = this.value;
  storage.set({ url: value }, function() {
    message.textContent = ext.i18n.getMessage("URLChanged");
  });
});

tokenInput.addEventListener("blur", function(e) {
  var value = this.value;
  storage.set({ token: value }, function() {
    message.textContent = ext.i18n.getMessage("tokenSaved");
  });
});

extractInput.addEventListener("change", function(e) {
  var value = this.value;
  storage.set({ extract: value }, function() {
    message.textContent = ext.i18n.getMessage("optionSaved");
  });
});

document.querySelectorAll("[data-message]").forEach(function(elt) {
  elt.textContent = ext.i18n.getMessage(elt.dataset.message);
});