import type { Request, Response } from 'express';
import { getTargetQuotes, getTargetUrls } from 'web-annotation-utils';
import { escapeHtml } from '../util.js';

export function renderAnnotation(
  req: Request,
  res: Response,
  { annotation, ...params },
) {
  res.render('annotation', {
    title: `Annotation`,
    ...annotationHbsParams(annotation, true),
    ...params,
  });
}

export function annotationHbsParams(annotation, verbose?: boolean) {
  const targetUrls = getTargetUrls(annotation.target);
  return {
    verbose,
    annotation,
    json: JSON.stringify(annotation, null, 2),
    created: annotation.created
      ? new Date(annotation.created).toDateString()
      : '<i>?</i>',
    modified:
      annotation.modified && new Date(annotation.modified).toDateString(),
    bodyHtml: annotation.bodyValue ?? annotationBodyToHtml(annotation.body),
    targetUrl: targetUrls.length === 1 ? targetUrls[0] : undefined,
    targetUrls: targetUrls.length > 1 ? targetUrls : undefined,
    targetQuotes: getTargetQuotes(annotation.target),
  };
}

function annotationBodyToHtml(body) {
  const iframe = (bodyUrl: string) =>
    `<iframe sandbox="" src=${bodyUrl}></iframe>`;
  try {
    if (body === undefined || body === null) {
      return '';
    }
    if (Array.isArray(body)) {
      return body.map(annotationBodyToHtml).join('\n<br/>\n');
    }
    if (typeof body === 'string') {
      return iframe(body);
    }
    if (body.type === 'Choice') {
      return annotationBodyToHtml(body.items[0]);
    }
    if (body.type === 'TextualBody') {
      if (body.format === 'text/html')
        return `<iframe sandbox="" csp="default-src: data: unsafe-inline;" srcdoc="${body.value}"></iframe>`;
      else return `<p>${escapeHtml(body.value)}</p>`;
    }
  } catch (err: any) {
    return '<i>Error while rendering annotation body.</i>';
  }
}