Skip to content
master
Go to file
Code

Latest commit

 

Git stats

Files

Permalink
Failed to load latest commit information.
Type
Name
Latest commit message
Commit time
 
 
 
 
 
 
src
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

README.md

LibCrowds Viewer

npm version npm downloads Build Status DOI

A Vue.js component for crowdsourcing Web Annotations using a IIIF viewer.

Try the demo

Read the documentation

Installation

The component can by installed via npm.

npm install libcrowds-viewer --save

Usage

Install the component:

// main.js
import Vue from 'vue';
import LibcrowdsViewer from 'libcrowds-viewer';

Vue.use(LibcrowdsViewer);

Use it in your templates (minimal configuration options shown):

<template>
  <div class="container">
    <libcrowds-viewer
      :task-opts="taskOpts">
    </libcrowds-viewer>
  </div>
</template>

<script>
  export default {
    data () {
      return {
        taskOpts: [
          {
            mode: 'select',
            objective: 'Draw rectangles around stuff'
            tileSource: 'http://www.example.org/image-service/abcd123/info.json',
            target: 'http://example.org/iiif/book1/canvas/p1'
          }
        ]
      }
    }
  }
</script>

<style lang="scss">
  @import "~libcrowds-viewer/dist/scss/libcrowds-viewer.scss";

  // A height must be set on the viewer container.
  .viewer-container {
    margin: 0;
    height: 100vh;
  }
</style>

Development

# install dependencies
npm install

# serve demo at localhost:8080
npm run dev

# deploy to gh-pages (rights permitting)
npm run demo:deploy

# test
npm run test

# serve docs
gitbook install
gitbook serve
You can’t perform that action at this time.