/* All legends, aside from simple text legends
 */

export const attribution = {
  atlas: `<a href='https://atlasicons.vectopus.com/'>Atlas Icons</a>, MIT`,
  capslockDarma: `<a href='https://thenounproject.com/icon/up-key-2712617/'>Dika Darma</a>, CC BY 3.0`,
  escapeHowlett: `<a href='https://thenounproject.com/icon/escape-217258/'>Christopher T. Howlett</a>, CC BY 3.0`,
  icomoon: `<a href='https://icomoon.io/app/#/select'>IcoMoon</a>, CC BY 4.0`,
  material: `<a href='https://developers.google.com/fonts/docs/material_icons'>Material Icons</a>, Apache 2.0`,
  menuOpenClipart: `<a href='https://freesvg.org/menu-key-icon-vector-illustration'>OpenClipart</a>, Public Domain`,
};

export const keyLegends = {
  exposeShowAllWindows: {
    name: "Exposé All Windows",
    // textLegend: "▦",
    imagePath: "/mrladv360/legends/material/dashboard_2_48dp.svg",
    imageAttribution: attribution.material,
  },
  exposeShowAppWindows: {
    name: "Exposé Application Windows",
    // textLegend: "☐",
    imagePath: "/mrladv360/legends/material/select_window_48dp.svg",
    imageAttribution: attribution.material,
  },
  exposeShowDesktop: {
    name: "Exposé Desktop",
    // textLegend: "⌂",
    imagePath: "/mrladv360/legends/material/desktop_windows_48dp.svg",
    imageAttribution: attribution.material,
  },

  escape: {
    name: "escape",
    // textLegend: "⎋",
    // htmlLegend: `<span style="font-size: 2em;">⎋</span>`,
    // The Noun Project icon is really the best one I've found
    imagePath: "/mrladv360/legends/nounproject/Escape_217258_clean.svg",
    imageAttribution: attribution.escapeHowlett,
  },
  tab: {
    name: "tab",
    // textLegend: "⇥",
    htmlLegend: `<span style="font-size: 2em;">⇥</span>`,
    // imagePath: "/mrladv360/legends/icomoon/tab.svg",
    // imageAttribution: attribution.icomoon,
  },
  command: {
    name: "command",
    // textLegend: "⌘",
    htmlLegend: `<span style="font-size: 2em;">⌘</span>`,
  },
  option: {
    name: "option",
    // textLegend: "⌥",
    htmlLegend: `<span style="font-size: 2em;">⌥</span>`,
  },
  control: {
    name: "control",
    // textLegend: "^",
    htmlLegend: `<span style="font-size: 2em;">^</span>`,
  },
  backspace: {
    name: "backspace",
    // textLegend: "⌫",
    // htmlLegend: `<span style="font-size: 2em;">⌫</span>`,
    imagePath: "/mrladv360/legends/material/ic_backspace_48px.svg",
    imageAttribution: attribution.material,
  },
  forwardDelete: {
    name: "delete",
    // textLegend: "⌦",
    // htmlLegend: `<span style="font-size: 2em;">⌦</span>`,
    imagePath:
      "/mrladv360/legends/modified/mrl_material_ic_backspace_48px_REVERSED.svg",
    imageAttribution:
      attribution.material + " (the original work has been modified)",
  },
  shift: {
    name: "shift",
    // textLegend: "⇧",
    // imagePath: "/mrladv360/legends/icomoon/shift.svg",
    htmlLegend: `<span style="font-size: 2em;">⇧</span>`,
  },
  return: {
    name: "return",
    imagePath: "/mrladv360/legends/material/ic_keyboard_return_48px.svg",
    imageAttribution: attribution.material,
  },
  space: {
    name: "spc",
    // textLegend: "␣",
    htmlLegend: `<span style="font-size: 2em;">␣</span>`,
  },

  volumeDown: {
    name: "VOL-",
    imagePath: "/mrladv360/legends/icomoon/volume-decrease.svg",
    imageAttribution: attribution.icomoon,
  },
  volumeUp: {
    name: "VOL+",
    imagePath: "/mrladv360/legends/icomoon/volume-increase.svg",
    imageAttribution: attribution.icomoon,
  },
  volumeMute: {
    name: "MUTE",
    imagePath: "/mrladv360/legends/icomoon/volume-mute2.svg",
    imageAttribution: attribution.icomoon,
  },

  home: {
    name: "Home",
    // textLegend: "⇱",
    htmlLegend: `<span style="font-size: 2em;">⇱</span>`,
  },
  pageUp: {
    name: "Page Up",
    // textLegend: "⇞",
    htmlLegend: `<span style="font-size: 2em;">⇞</span>`,
  },
  pageDown: {
    name: "Page Down",
    // textLegend: "⇟",
    htmlLegend: `<span style="font-size: 2em;">⇟</span>`,
  },
  end: {
    name: "End",
    // textLegend: "⇲",
    htmlLegend: `<span style="font-size: 2em;">⇲</span>`,
  },
  leftArrow: {
    name: "Left Arrow",
    // textLegend: "←",
    htmlLegend: `<span style="font-size: 2em;">←</span>`,
  },
  downArrow: {
    name: "Down Arrow",
    // textLegend: "↓",
    htmlLegend: `<span style="font-size: 2em;">↓</span>`,
  },
  upArrow: {
    name: "Up Arrow",
    // textLegend: "↑",
    htmlLegend: `<span style="font-size: 2em;">↑</span>`,
  },
  rightArrow: {
    name: "Right Arrow",
    // textLegend: "→",
    htmlLegend: `<span style="font-size: 2em;">→</span>`,
  },

  numLock: {
    name: "Num Lock",
    textLegend: "Num",
  },
  scrollLock: {
    name: "Scroll Lock",
    textLegend: "Scr",
  },
  capsLock: {
    name: "Caps Lock",
    // textLegend: "Caps",
    // textLegend: "⇪",
    // htmlLegend: `<span style="font-size: 2em;">⇪</span>`,
    imagePath: "/mrladv360/legends/nounproject/up_key_2712617_clean.svg",
    imageAttribution: attribution.capslockDarma,
  },
  sysrq: {
    name: "SysRq",
    textLegend: "SysRq",
  },
  insert: {
    name: "Insert",
    textLegend: "Ins",
  },
  menu: {
    name: "Menu",
    imagePath: "/mrladv360/legends/misc/menu-key.svg",
    imageAttribution: attribution.menuOpenClipart,
  },
  printScreen: {
    name: "Print Screen",
    // textLegend: "PrSc",
    imagePath: "/mrladv360/legends/material/screenshot_monitor_48dp.svg",
    imageAttribution: attribution.material,
  },

  functionLayer: {
    name: "Function Layer",
    // textLegend: "ƒ1-20",
    textLegend: "ƒ1…",
  },
  navLayer: {
    name: "Navigation Layer",
    // textLegend: "←↓↑→",
    imagePath: "/mrladv360/legends/material/open_with_48dp.svg",
    imageAttribution: attribution.material,
  },
  adv360Layer: {
    name: "Advantage360 Layer",
    // textLegend: "A360",
    imagePath: "/mrladv360/legends/atlas/arrow-360.svg",
    imageAttribution: attribution.atlas,
  },
  keypadLayer: {
    name: "Keypad Layer",
    // textLegend: "Kp",
    imagePath: "/mrladv360/legends/material/dialpad_48dp.svg",
    attribution: attribution.material,
  },
  whisperInvoke: {
    name: "superwhisper",
    // textLegend: "Δ",
    htmlLegend: `<span style="font-size: 2em;">Δ</span>`,
  },
  aerospace: {
    name: "AeroSpace",
    // textLegend: "⍦",
    htmlLegend: `<span style="font-size: 2em;">⍦</span>`,
  },
  gridcraft: {
    name: "GridCraft",
    imagePath: "/mrladv360/legends/material/grid_view_48dp.svg",
    imageAttribution: attribution.material,
  },
};
