Line data    Source code

       1             : // @ts-check
       2             : 
       3             : import Vue from "vue";
       4             : import { mapState } from "vuex";
       5             : import { BaseCard, BaseKeyboardEventMixin as kbMixin } from "@cern/base-vue";
       6             : import InfoAlert from "./InfoAlert.vue";
       7             : 
       8           1 : const component = /** @type {V.Constructor<any, any>} */(Vue).extend({
       9             :   name: "Card",
      10             :   components: { InfoAlert },
      11             :   extends: BaseCard,
      12             :   mixins: [ kbMixin({ local: true }) ],
      13             :   /** @return {{ isSelected: boolean, isFocused: boolean, showInfo: boolean }} */
      14          14 :   data() { return { isSelected: false, isFocused: false, showInfo: false }; },
      15             :   computed: {
      16             :     .../** @type {{ showKeyHints(): boolean }} */(mapState("ui", [ "showKeyHints" ]))
      17             :   },
      18             :   mounted() {
      19          14 :     this.onKey("ctrl-enter", () => {
      20           0 :       if (this.isFocused) { this.isSelected = true; }
      21             :     });
      22          14 :     this.onKey("esc", () => {
      23           0 :       if (this.isFocused) { this.isSelected = false; }
      24             :     });
      25          14 :     this.onKey("ctrl-h-keydown", (/** @type {KeyboardEvent} */ e) => {
      26           0 :       if (this.isFocused) {
      27           0 :         e.preventDefault();
      28           0 :         this.showInfo = !this.showInfo;
      29             :       }
      30             :     });
      31             :   },
      32             :   methods: {
      33             :     toggleSelected() {
      34           0 :       this.isSelected = !this.isSelected;
      35             :     }
      36             :   }
      37             : });
      38             : export default component;