autoEdit 2 Documentation
1.0.13
1.0.13
  • Introduction
  • Overview
    • Intro
      • Development approach
      • from 1.0.5 to 1.0.6
    • Architecture Overview
      • Lo fi Design Sketches
      • High fidelity sketches in HTML
    • Support the project
    • documentation section template
    • Build / Deployment
      • Deployment/build for Mac OS X
      • Deployment / Build for Linux
      • Deployment / Build for Windows
      • Travis CI continuous build
        • previous travis setup
  • R&D Doc
    • About R&D doc section
    • Transcription & Media Processing
      • Transcription json
      • Transcriber
        • audio to video
        • STT sdks
          • IBM Watson STT
          • Gentle STT
          • Pocketsphinx
      • Video preview conversion
      • Read metadata
    • Hypertranscript
    • Selections, Annotations, Papercuts
      • Selections
      • Annotations
      • Tags
    • Paper-edit
      • Paper-edit json
      • search-filter
      • drag-and-drop
      • Preview Paper-edit video
    • Export
      • EDL export
      • XML export
      • mp4 export
  • Appendix
    • Dev configuration
    • Current db setup
    • EDL Format
    • Reusable components
    • Prerequisites
    • Testing
    • Updating automated documentation
    • ffmpeg and ffprobe in electron
    • Adding STT services
  • Appendix - Data structures
    • IBM Watson json specs
    • Gentle Json transcription specs
    • Pocketsphinx results
    • autoEdit transcription Json
  • QA List
    • QA Intro
  • Adobe Panel
    • autoEdit Adobe CEP Panel dev setup
      • Adobe Extensions HostList codes
    • autoEdit Adobe CEP Panel integration overview
    • Jsx functions for Adobe CEP autoEdit adobe Panel
    • Packaging and distributing Adobe CEP Extensions
      • Packaging signing Adobe CEP Panel in details
      • Submit to Adobe
  • Project Page
    • Build project page
    • Build/update demo front end page
  • Roadmap
    • Improvements
    • Roadmap
      • Paper-editing Roadmap
      • Extra Features Roadmap
      • Future Roadmap
        • Live video editing
        • Social Media Export
        • Translate transcriptions
        • Web app
          • Multi-user collaboration
        • Searchable Editable Archive
        • NLP insights
        • Slack/Chat bot integration
        • Interactive dev tool
        • Phone mms integration with twillio
        • B-roll computational photography
Powered by GitBook
On this page
  • Component/part description
  • Related projects
  • What is an hypertranscript?
  • Implementations Options considered
  • Current implementation
  • What needs refactoring
  1. R&D Doc

Hypertranscript

PreviousRead metadataNextSelections, Annotations, Papercuts

Last updated 6 years ago

Component/part description

Best described by functionality

  • click on word, play video at corresponding part

  • video plays, words change color to show you were it's at.

  • sync scroll (optional)

  • search text (optional)

It’s a view. It’s extensible. Eg need to be able to add other components, for text selections, annotations, tags, search, etc to the view.

Related projects

What is an hypertranscript?

== Clickable transcript in sync with video.

img/sketches/Transcription%20Show.png

Implementations Options considered

in quickQuote, made hypertranscript using rails and erb.

Current implementation

Using backbone and browserify, with ejs templating.

--

What needs refactoring

Reusable front end client side components.

At the moment the views are one block, it could be smaller views combined together, with defined interfaces, to make it more reusable.

Eg the hypertranscript "component" in transcript show and in paper edit is repeated. See view components for paper-edit

Paper-edit show and transcription show could be made of components.

Eg in branch paper-edit (which is an attempt to implement “v3”) I have tried to put hypertranscript template as a separate view.

Which extracts it from transcription show template.

Entertaining the idea of using to help with this. Or to do more research on how to best use backbone views in a more modular way.

https://github.com/OpenNewsLabs/autoEdit_2/blob/paperedit/lib/app/templates/hypertranscript.html.ejs
https://github.com/OpenNewsLabs/autoEdit_2/blob/paperedit/lib/app/templates/transcription_show.html.ejs
vuejs
HyperTranscript representation as described in hyperaudio