hugo/public/js/#editor.js#

   1 /**
   2 * @file      editor.js
   3 * @author    Ken Grimes
   4 * @license   AGPL-3.0
   5 * @copyright 2018 - Ken Grimes
   6 * @summmary  live edit front-end for fediblog
   7 */
   8 'use strict'
   9
  10 const apiURL = document.location.origin + '/api/'
  11 const baseURL = document.location.origin
  12
  13 const articleButtons = []
  14
  15 const addButton = (anchor, name, fn) => {
  16   const button = document.createElement('button')
  17   const buttonText = document.createTextNode(name)
  18   button.appendChild(buttonText)
  19   button.onclick = () => fn(button)
  20   if (anchor.firstChild)
  21     anchor.insertBefore(button,anchor.firstChild)
  22   else
  23     anchor.appendChild(button)
  24   return button
  25 }
  26
  27 const logout = () => {
  28   document.cookie = 'live-edit=; Path=/; Expires=Thu, 01 Jan 1970 00:00:01 GMT;'
  29   window.location.reload(true)
  30 }
  31
  32 const doDelete = (btn) => {
  33   const element = btn.parentElement
  34   const fileName = 'content/' + element.id
  35   if (window.confirm(`Do you really want to delete ${element.id}?`))
  36     fetch(apiURL + fileName, {credentials: 'same-origin', method: 'DELETE'}).then((resp) => {
  37       if (resp.ok)
  38         window.location.href = window.location.href + ".."
  39       else if (resp.status === 401)
  40         logout()
  41       else
  42         console.log(resp)
  43     })
  44 }
  45
  46 const doCancel = (btn) => {
  47   const element = btn.parentElement
  48   element.innerHTML = element.oldHTML
  49 }
  50
  51 const doCommit = (btn) => {
  52   const element = btn.parentElement
  53   const fileName = 'content/' + element.id
  54   const textArea = element.getElementsByTagName('textarea').item(0)
  55   fetch(apiURL + fileName, {credentials: 'same-origin', method: 'POST', body: textArea.value}).then((resp) => {
  56     if (resp.ok)
  57       window.location.reload(true)
  58     else if (resp.status === 401)
  59       logout()
  60     else
  61       console.log(resp)
  62   })
  63 }
  64
  65 const doCommitPost = (btn) => {
  66   const element = btn.parentElement
  67   const nameBox = element.getElementsByTagName('input').item(0)
  68   if (nameBox.value === '') {
  69     window.alert('Filename is required')
  70     return
  71   }
  72   const secMatch = window.location.href.match(new RegExp(baseURL + '(.*/)'))
  73   const section = secMatch ? secMatch[1] : ''
  74   const fileName = 'content/' + section + nameBox.value + '.md'
  75   const textArea = element.getElementsByTagName('textarea').item(0)
  76   fetch(apiURL + fileName, {credentials: 'same-origin', method: 'POST', body: textArea.value}).then((resp) => {
  77     if (resp.ok)
  78       window.location.reload(true)
  79     else if (resp.status === 401)
  80       logout()
  81     else
  82       console.log(resp)
  83   })
  84 }
  85
  86 const doPost = (btn) => {
  87   const element = btn.parentElement
  88   element.oldHTML = element.innerHTML
  89   element.innerHTML =
  90     '<button onclick=doCommitPost(this)>commit</button>' +
  91     '<button onclick=doCancel(this)>cancel</button><br>' +
  92     'Filename: <input type="text" />' +
  93     '<textarea cols=80 rows=60></textarea>'
  94 }
  95
  96 const doEdit = (btn) => {
  97   const element = btn.parentElement
  98   const fileName = 'content/' + element.id
  99   fetch(apiURL + fileName, {credentials: 'same-origin'}).then((resp) => {
 100     if (resp.status === 401)
 101       logout()
 102     else if (resp.ok)
 103       resp.text().then((txt) => {
 104         element.oldHTML = element.innerHTML
 105         element.innerHTML =
 106           '<button onclick=doCommit(this)>commit</button>' +
 107           '<button onclick=doDelete(this)>delete</button>' +
 108           '<button onclick=doCancel(this)>cancel</button><br>' +
 109           '<textarea cols=80 rows=60>' +
 110           txt +
 111           '</textarea>'
 112       })
 113     else
 114       console.log(resp)
 115   })
 116 }
 117
 118 const editTools = () => {
 119   const article = document.body.getElementsByTagName('article').item(0)
 120   articleButtons.push(addButton(article, 'new page', doPost))
 121   articleButtons.push(addButton(article, 'edit', doEdit))
 122 }