From 9a0409093eac59e589e27430b2fd9a5a3dab8009 Mon Sep 17 00:00:00 2001
From: Jules Laplace <julescarbon@gmail.com>
Date: Fri, 28 Aug 2020 16:54:37 +0200
Subject: speaker icon on paragraphs

---
 .../app/views/viewer/player/components.inline/inline.text.js         | 5 ++++-
 1 file changed, 4 insertions(+), 1 deletion(-)

(limited to 'animism-align/frontend/app/views/viewer/player/components.inline/inline.text.js')

diff --git a/animism-align/frontend/app/views/viewer/player/components.inline/inline.text.js b/animism-align/frontend/app/views/viewer/player/components.inline/inline.text.js
index 5d7135b..91ea506 100644
--- a/animism-align/frontend/app/views/viewer/player/components.inline/inline.text.js
+++ b/animism-align/frontend/app/views/viewer/player/components.inline/inline.text.js
@@ -1,21 +1,24 @@
 import React, { Component } from 'react'
 
 import { ROMAN_NUMERALS } from 'app/constants'
+import { SpeakerIcon } from '../../nav/viewer.icons'
 
 export const Paragraph = ({ paragraph, currentParagraph, currentAnnotation, onAnnotationClick }) => {
   if (paragraph.hidden) return null
   let className = paragraph.type
   if (className !== 'paragraph') className += ' paragraph'
   if (currentParagraph) className += ' current'
+  const firstAnnotation = paragraph.annotations[0]
   return (
     <div
       className={className}
     >
+      <div className="speaker-icon" onClick={e => onAnnotationClick(e, paragraph, firstAnnotation)}>{SpeakerIcon}</div>
       {paragraph.annotations.map(annotation => (
         <span
           key={annotation.id}
           className={annotation.id === currentAnnotation ? 'current' : ''}
-          onClick={e => onAnnotationClick(e, paragraph, annotation)}
+          onClick={e => onAnnotationClick(e, paragraph, firstAnnotation)}
           dangerouslySetInnerHTML={{ __html: ' ' + annotation.text + ' ' }}
         />
       ))}
-- 
cgit v1.2.3-70-g09d2