BookStack Code Mirror - bookstack/blob - resources/js/components/attachments.js

   1 /**
   2  * Attachments
   3  * @extends {Component}
   4  */
   5 import {showLoading} from "../services/dom";
   6
   7 class Attachments {
   8
   9     setup() {
  10         this.container = this.$el;
  11         this.pageId = this.$opts.pageId;
  12         this.editContainer = this.$refs.editContainer;
  13         this.listContainer = this.$refs.listContainer;
  14         this.mainTabs = this.$refs.mainTabs;
  15         this.list = this.$refs.list;
  16
  17         this.setupListeners();
  18     }
  19
  20     setupListeners() {
  21         const reloadListBound = this.reloadList.bind(this);
  22         this.container.addEventListener('dropzone-success', reloadListBound);
  23         this.container.addEventListener('ajax-form-success', reloadListBound);
  24
  25         this.container.addEventListener('sortable-list-sort', event => {
  26             this.updateOrder(event.detail.ids);
  27         });
  28
  29         this.container.addEventListener('event-emit-select-edit', event => {
  30             this.startEdit(event.detail.id);
  31         });
  32
  33         this.container.addEventListener('event-emit-select-edit-back', event => {
  34             this.stopEdit();
  35         });
  36
  37         this.container.addEventListener('event-emit-select-insert', event => {
  38             const insertContent = event.target.closest('[data-drag-content]').getAttribute('data-drag-content');
  39             const contentTypes = JSON.parse(insertContent);
  40             window.$events.emit('editor::insert', {
  41                 html: contentTypes['text/html'],
  42                 markdown: contentTypes['text/plain'],
  43             });
  44         });
  45     }
  46
  47     reloadList() {
  48         this.stopEdit();
  49         this.mainTabs.components.tabs.show('items');
  50         window.$http.get(`/attachments/get/page/${this.pageId}`).then(resp => {
  51             this.list.innerHTML = resp.data;
  52             window.components.init(this.list);
  53         });
  54     }
  55
  56     updateOrder(idOrder) {
  57         window.$http.put(`/attachments/sort/page/${this.pageId}`, {order: idOrder}).then(resp => {
  58             window.$events.emit('success', resp.data.message);
  59         });
  60     }
  61
  62     async startEdit(id) {
  63         this.editContainer.classList.remove('hidden');
  64         this.listContainer.classList.add('hidden');
  65
  66         showLoading(this.editContainer);
  67         const resp = await window.$http.get(`/attachments/edit/${id}`);
  68         this.editContainer.innerHTML = resp.data;
  69         window.components.init(this.editContainer);
  70     }
  71
  72     stopEdit() {
  73         this.editContainer.classList.add('hidden');
  74         this.listContainer.classList.remove('hidden');
  75     }
  76
  77 }
  78
  79 export default Attachments;