/**
 * Tools for doing things with a message
 * Let us be creative here.  Allow all sorts of things to
 * be done to a message - linking to new or old objects in an open way
 *
 * Ideas: Bookmark, Like, star, pin at top of chat, reply as new thread,
 * If you made it originally: edit, delete, attach
 * @packageDocumentation
 */
import * as debug from '../debug'
import { icons } from '../iconBase'
// import { media } from '../media/index'
import ns from '../ns'
// import * as pad from '../pad'
import * as rdf from 'rdflib' // pull in first avoid cross-refs
// import { style } from '../style'
import * as utils from '../utils'
import * as widgets from '../widgets'
import { renderBookmarksButton } from './bookmarks'
import { authn, store } from 'solid-logic-jss'

import { allVersions, mostRecentVersion, isDeleted } from './chatLogic'
import { switchToEditor } from './message'

const dom = window.document

// THE UNUSED ICONS are here as reminders for possible future functionality
// const BOOKMARK_ICON = 'noun_45961.svg'
// const HEART_ICON = 'noun_130259.svg' -> Add this to my (private) favorites
// const MENU_ICON = 'noun_897914.svg'
// const PAPERCLIP_ICON = 'noun_25830.svg' -> add attachments to this message
// const PIN_ICON = 'noun_562340.svg'  -> pin this message permanently in the chat UI
const PENCIL_ICON = 'noun_253504.svg' // edit a message
// const SPANNER_ICON = 'noun_344563.svg' -> settings
const THUMBS_UP_ICON = 'noun_1384132.svg'
const THUMBS_DOWN_ICON = 'noun_1384135.svg'
const REPLY_ICON = 'noun-reply-5506924.svg'
/**
 * Emoji in Unicode
 */
const emojiMap = {}
emojiMap[ns.schema('AgreeAction')] = '👍'
emojiMap[ns.schema('DisagreeAction')] = '👎'
emojiMap[ns.schema('EndorseAction')] = '⭐️'
emojiMap[ns.schema('LikeAction')] = '❤️'

export function emojiFromActionClass (action) {
  return emojiMap[action] || null
}

export function ActionClassFromEmoji (emoji) {
  for (const a in emojiMap) {
    if (emojiMap[a] === emoji) {
      return rdf.sym(a.slice(1, -1)) // remove < >
    }
  }
  return null
}

// Allow the action to give its own emoji as content,
// or get the emoji from the class of action.
export function emojiFromAction (action) {
  const content = store.any(action, ns.sioc('content'), null, action.doc())
  if (content) return content
  const klass = store.any(action, ns.rdf('type'), null, action.doc())
  if (klass) {
    const em = emojiFromActionClass(klass)
    if (em) return em
  }
  return '⬜️'
}

/**
 * Create strip of sentiments expressed
 */
export async function sentimentStrip (target, doc) { // alain: seems not used
  const versions = await allVersions(target)
  // debug.log('sentimentStrip Versions for ' + target, versions)
  const actions = versions.map(version => store.each(null, ns.schema('target'), version, doc)).flat()
  // debug.log('sentimentStrip: Actions for ' + target, actions)
  const strings = actions.map(action => emojiFromAction(action) || '')
  return dom.createTextNode(strings.join(' '))
}
/**
 * Create strip of sentiments expressed, with hyperlinks
 *
 * @param target {NamedNode} - The thing about which they are expressed
 * @param doc {NamedNode} - The document in which they are expressed
 */
export async function sentimentStripLinked (target, doc) {
  const strip = dom.createElement('span')
  async function refresh () {
    strip.innerHTML = ''
    if (isDeleted(target)) return strip
    const versions = await allVersions(target)
    // debug.log('sentimentStripLinked: Versions for ' + target, versions)
    const actions = versions.map(version => store.each(null, ns.schema('target'), version, doc)).flat()
    // debug.log('sentimentStripLinked: Actions for ' + target, actions)
    if (actions.length === 0) return strip
    const sentiments = actions.map(a => [
      store.any(a, ns.rdf('type'), null, doc),
      store.any(a, ns.sioc('content'), null, doc),
      store.any(a, ns.schema('agent'), null, doc)
    ])
    // debug.log('  Actions sentiments ', sentiments)
    sentiments.sort()
    sentiments.forEach(ss => {
      const [theClass, content, agent] = ss
      let res
      if (agent) {
        res = dom.createElement('a')
        res.setAttribute('href', agent.uri)
      } else {
        res = dom.createTextNode('')
      }
      res.textContent = content || emojiMap[theClass] || '⬜️'
      strip.appendChild(res)
    })
    // debug.log('  Actions strip ', strip)
  }
  refresh().then(debug.log('sentimentStripLinked: sentimentStripLinked async refreshed'))
  strip.refresh = refresh
  return strip
}
/**
 * Creates a message toolbar component
 */
export async function messageToolbar (message, messageRow, userContext, channelObject) {
  async function deleteMessage () {
    const author = store.any(message, ns.foaf('maker'))
    if (!me) {
      alert('You can\'t delete the message, you are not logged in.')
    } else if (me.sameTerm(author)) {
      try {
        await channelObject.deleteMessage(message)
      } catch (err) {
        const msg = 'Error deleting messaage ' + err
        debug.warn(msg)
        alert(msg)
        const area = userContext.statusArea || messageRow.parentNode
        area.appendChild(widgets.errorMessageBlock(dom, msg))
      }
      messageRow.parentNode.removeChild(messageRow)
    } else {
      alert('You can\'t delete the message, you are not logged in as the author, ' + author)
    }
    closeToolbar()
  }

  async function editMessage (messageRow) {
    if (me.value === store.any(message, ns.foaf('maker')).value) {
      closeToolbar() // edit is a one-off action
      await switchToEditor(messageRow, message, channelObject, userContext)
    }
  }

  async function replyInThread () {
    const thread = await channelObject.createThread(message)
    const options = userContext.chatOptions
    if (!options) throw new Error('replyInThread: missing options')
    options.showThread(thread, options)
    closeToolbar() // a one-off action
  }

  // alain: TODO allow chat owner to fully delete message + sentiments and replacing messages

  const div = dom.createElement('div')
  // is message deleted ?
  if (await mostRecentVersion(message).value === ns.schema('dateDeleted').value) return div
  function closeToolbar () {
    div.parentElement.parentElement.removeChild(div.parentElement) // remive the TR
  }

  async function deleteThingThen (x) {
    await store.updater.update(store.connectedStatements(x), [])
  }

  // Things only the original author can do
  let me = authn.currentUser() // If already logged on
  if (me && store.holds(message, ns.foaf('maker'), me)) {
    // button to delete the message
    div.appendChild(widgets.deleteButtonWithCheck(dom, div, 'message', deleteMessage))
    // button to edit the message
    div.appendChild(widgets.button(dom, icons.iconBase + PENCIL_ICON, 'edit', () => editMessage(messageRow)))
  } // if mine
  // Things anyone can do if they have a bookmark list async
  /*
 var bookmarkButton = await bookmarks.renderBookmarksButton(userContext)
 if (bookmarkButton) {
   div.appendChild(bookmarkButton)
 }
 */
  // Things anyone can do if they have a bookmark list

  renderBookmarksButton(userContext).then(bookmarkButton => {
    if (bookmarkButton) div.appendChild(bookmarkButton)
  })

  /**   Button to allow user to express a sentiment (like, endorse, etc) about a target
   *
   * @param context {Object} - Provide dom and me
   * @param target {NamedNode} - The thing the user expresses an opnion about
   * @param icon {uristring} - The icon to be used for the button
   * @param actionClass {NamedNode} - The RDF class  - typically a subclass of schema:Action
   * @param doc - {NamedNode} - the Solid document iunto which the data should be written
   * @param mutuallyExclusive {Array<NamedNode>} - Any RDF classes of sentimentswhich are mutiually exclusive
   */
  function sentimentButton (
    context,
    target,
    icon,
    actionClass,
    doc,
    mutuallyExclusive
  ) {
    function setColor () {
      button.style.backgroundColor = action ? 'yellow' : 'white'
    }
    const button = widgets.button(
      dom,
      icon,
      utils.label(actionClass),
      async function (_event) {
        if (action) {
          await deleteThingThen(action)
          action = null
          setColor()
        } else {
          // no action
          action = widgets.newThing(doc)
          const insertMe = [
            rdf.st(action, ns.schema('agent'), context.me, doc),
            rdf.st(action, ns.rdf('type'), actionClass, doc),
            rdf.st(action, ns.schema('target'), target, doc)
          ]
          await store.updater.update([], insertMe)
          setColor()

          if (mutuallyExclusive) {
            // Delete incompative sentiments
            let dirty = false
            for (let i = 0; i < mutuallyExclusive.length; i++) {
              const a = existingAction(mutuallyExclusive[i])
              if (a) {
                await deleteThingThen(a) // but how refresh? refreshTree the parent?
                dirty = true
              }
            }
            if (dirty) {
              // widgets.refreshTree(button.parentNode) // requires them all to be immediate siblings
              widgets.refreshTree(messageRow) // requires them all to be immediate siblings
            }
          }
        }
      }
    )
    function existingAction (actionClass) {
      const actions = store
        .each(null, ns.schema('agent'), context.me, doc)
        .filter(x => store.holds(x, ns.rdf('type'), actionClass, doc))
        .filter(x => store.holds(x, ns.schema('target'), target, doc))
      return actions.length ? actions[0] : null
    }
    function refresh () {
      action = existingAction(actionClass)
      setColor()
    }
    let action
    button.refresh = refresh // If the file changes, refresh live
    refresh()
    return button
  }

  // THUMBS_UP_ICON
  // https://schema.org/AgreeAction
  me = authn.currentUser() // If already logged on

  if (me && (await mostRecentVersion(message).value !== ns.schema('dateDeleted').value)) {
    const context1 = { me, dom, div }
    div.appendChild(
      sentimentButton(
        context1,
        message, // @@ TODO use widgets.sentimentButton
        icons.iconBase + THUMBS_UP_ICON,
        ns.schema('AgreeAction'),
        message.doc(),
        [ns.schema('DisagreeAction')]
      )
    )
    // Thumbs down
    div.appendChild(
      sentimentButton(
        context1,
        message,
        icons.iconBase + THUMBS_DOWN_ICON,
        ns.schema('DisagreeAction'),
        message.doc(),
        [ns.schema('AgreeAction')]
      )
    )
  }
  // Reply buttton

  if (store.any(message, ns.dct('created'))) { // Looks like a messsage? Bar can be used for other things
    div.appendChild(widgets.button(dom, icons.iconBase + REPLY_ICON, 'Reply in thread', async () => {
      await replyInThread()
    }))
  }
  // X button to remove the tool UI itself
  const cancelButton = div.appendChild(widgets.cancelButton(dom))
  cancelButton.style.float = 'right'
  cancelButton.firstChild.style.opacity = '0.3'
  cancelButton.addEventListener('click', closeToolbar)
  return div
}