HyperLinked Video Authoring Tool & Player

Hypervideo, or Hyperlinked video. Hypervideo video is a displayed video stream that contains embedded, user-clickable anchors allowing navigation between video and other hypermedia elements. Look at GitHub

① Feature

A Low latency, synchronized, easy-to-use tool integrating functions of both authoring hyperlinks for videos (a directory containing a series of continuous .rgb image files and a .wav audio file with the same name) and playing hyperlinked videos.

Authoring Tool Demo Video

② Architecture

1. Authoring Tool

A authoring tool integrating Import Video, Slide over Frame, Create Editable Link, Edit Bounding Box, Save HyperLink to create hyperlinks from one file to another.

How it works

Run Authoring Tool

javac src/*.java -d bin
java -cp bin Authoring

• Make sure to import directory like C:\CSCI576\Project\AIFilmTwo
• The directory should look like this:

Data Structure

• HashMap: restore links of maping pair of primary file to list of Region of Interest (includes region shape, size and hyperlink).

public class Links {

    Map<String, List<Region>> linkedMap = new HashMap<String, List<Region>>();

    public List<Region> get(String fileName) {
      // get item from links
    }

    public void put(String fromFile, Region newRegion) {
        // put item into links
    }

    public List<Region> inRegion(String fromFile, int frame) {
        // interpolate all regions given certain frame
    }

    public void readLocalFile(String localFilePath) {
        // initial links by reading file
    }

    public void toLocalFile(File curFile) {
        // write links info into file
    }

}

Meta file

• File path: .txt file with same base name as the primary video saved within primary video files directory.

e.g. The meta file for video /usr/AIFilmOne/ will be save at /usr/AIFilmOne/AIFilmOne.txt

• Content format: The first line will refer to primary file, while the following lines will refer to Regions of Interest with hyperlink information respectively.

e.g. Example of /usr/AIFilmOne/AIFilmOne.txt is as below.

/usr/AIFilmOne
[region1start.shapeInfo, region1start.frame]?[region1end.shapeInfo, region1end.frame]?targetFile1?targetframe1
[region2start.shapeInfo, region2start.frame]?[region2end.shapeInfo, region2end.frame]?targetFile2?targetframe2
[region3start.shapeInfo, region3start.frame]?[region3end.shapeInfo, region3end.frame]?targetFile3?targetframe3
...
[regionNstart.shapeInfo, regionNstart.frame]?[regionNend.shapeInfo, regionNend.frame]?targetFileN?targetframeN

2. Video Player

Description: Play video and synchronize Video source (.rgb files) and Audio source (.wav files) automatically for the given frame rate.

How to run Video Player

javac src/*.java -d bin
java -cp bin VideoPlayer

• Make sure to import directory like C:\CSCI576\Project\AIFilmTwo

Input Format

• Video Format
  • Framerate: 30 fps.
  • File Format: rgb file.
  • Total Frames: 9000
  • Resolution: 352×288
• Audio Format
  • Sampling Rate: 44100
  • Bits Per Sample: 16 bits

Synchronize Mechanism

• Timer.scheduleAtFixedRate: schedule rendering image task for repeated fixed-rate (frame rate) execution, beginning after the specified delay.

  Timer timer = new Timer();
  timer.scheduleAtFixedRate(new TimerTask() {
    public void run() {
      // Render Image Operation
    }
  }, 0, 1000 / 30);

• Cache: use LinkedHashMap (hashing-based data structure maintaining insertion order or access order) as a Buffer to pre-load image data for rendering.

  class Cache extends LinkedHashMap<Integer, BufferedImage> {
    private int capacity;
  
    public Cache(int capacity) {
      super(capacity, 0.75F, false); // Maintain access order
    }
  
    @Override
    protected boolean removeEldestEntry(Map.Entry<Integer, BufferedImage> eldest) {
      return size() >= capacity; // Maintain maximum size of cache.
    }
  }

• Thread: allow cache-updating to excute concurrently throughout video playing.

  new Thread(new Runnable() {
      public void run() {
        while (true) {
          // pre-loading cache
        }
      }
    }).start();

• Periodical Manual Synchronize: amend precision error based on given frame rate to ensure frames per second.

  Timer timer = new Timer();
  timer.scheduleAtFixedRate(new TimerTask() {
      public void run() {
        // Check every integral second to synchronize
        if ((currentTotalTime + currentTime - lastStartTime) % 1000 < 10) {
          currentFrame = (int) ((currentTotalTime + currentTime - lastStartTime) / 1000) * 30;
        }
      }
    }, 0, 1000 / 30);

• Clip: a special kind of data line whose audio data can be loaded prior to playback, and supports play(), stop() and setMicrosecondPosition() which is essential when redirect through hyperlink.

  public class Sound {
    private Clip clip;
  
    public Sound(String fileName) {
      // Initiate sound
    }
  
    public void play(long microseconds) {
      clip.setMicrosecondPosition(microseconds * 1000);
      clip.start();
    }
  
    public void stop() {
      clip.stop();
    }
  }

③ Folder Structure

The workspace contains two folders by default, where:

• src: the folder to maintain sources
• lib: the folder to maintain dependencies

Meanwhile, the compiled output files will be generated in the bin folder by default.

If you want to customize the folder structure, open .vscode/settings.json and update the related settings there.

④ Dependency Management

The JAVA PROJECTS view allows you to manage your dependencies. More details can be found here.

---

This project is for CSCI 576: Multimedia Systems Design, finished by both Yuqing Liu and Xu Chen. Thanks for the professor and TAs!