Large Image

The following instructions assume you have installed the Web Annotations module and all of its dependencies, and have successfully made the required changes to Solr. It also assumes a working Islandora installation with the Simple Image Solution Pack installed and configured. In these instructions, you will learn to add annotation capabilities to large image objects.

Creating the context needed by large_image annotations

Adding Islandora Web Annotation assets

In the Drupal administration interface got to Structure > Context > Assets. Click the Index Module Assets header link, then select the Islandora Web Annotations checkbox. Click "Save configuration" so that the CSS and JavaScript assets distributed with Islandora Web Annotations will be available to select when configuring reactions in the steps that follow.

Adding the Islandora Large Image context condition and reactions: Method 1

Go to Structure > Context > Import. Copy the code below and past into the "Context code" box.

$context = new stdClass();
$context->disabled = FALSE; /* Edit this to true to make a default context disabled initially */
$context->api_version = 3;
$context->name = 'large_image';
$context->description = '';
$context->tag = '';
$context->conditions = array(
  'islandora_context_condition_content_models' => array(
    'values' => array(
      0 => TRUE,
    ),
    'options' => array(
      'islandora_cmodels' => array(
        'islandora:sp_large_image_cmodel' => 'islandora:sp_large_image_cmodel',       
      ),
    ),
  ),
);
$context->reactions = array(
  'block' => array(
    'blocks' => array(
      'views-2311609f0bf3cb72feb08a3542345a82' => array(
        'module' => 'views',
        'delta' => '2311609f0bf3cb72feb08a3542345a82',
        'region' => 'content',
        'weight' => '-10',
      ),
    ),
  ),
  'css_module' => array(
    'sites/all/modules/islandora_web_annotations' => array(
      'sites/all/modules/islandora_web_annotations/css/large_image/large_image.css' => 'sites/all/modules/islandora_web_annotations/css/large_image/large_image.css',
      'sites/all/modules/islandora_web_annotations/css/base/base.css' => 'sites/all/modules/islandora_web_annotations/css/base/base.css',
      'sites/all/modules/islandora_web_annotations/lib/css/theme-dark/annotorious-dark.css' => 'sites/all/modules/islandora_web_annotations/lib/css/theme-dark/annotorious-dark.css',
    ),
  ),
  'js_module' => array(
    'sites/all/modules/islandora_web_annotations' => array(
      'sites/all/modules/islandora_web_annotations/js/large_image/large_image.js' => 'sites/all/modules/islandora_web_annotations/js/large_image/large_image.js',
      'sites/all/modules/islandora_web_annotations/js/base/base.js' => 'sites/all/modules/islandora_web_annotations/js/base/base.js',
      'sites/all/modules/islandora_web_annotations/lib/js/tinymce/js/tinymce/tinymce.min.js' => 'sites/all/modules/islandora_web_annotations/lib/js/tinymce/js/tinymce/tinymce.min.js',
      'sites/all/modules/islandora_web_annotations/lib/js/jquery.blockUI.js' => 'sites/all/modules/islandora_web_annotations/lib/js/jquery.blockUI.js',
      'sites/all/modules/islandora_web_annotations/lib/js/annotorious.min.js' => 'sites/all/modules/islandora_web_annotations/lib/js/annotorious.min.js',
    ),
  ),
);
$context->condition_mode = 0;

Press continue. The necessary conditions and reactions (as listed in method 2) should not be set.

Adding the Islandora Large Image context condition and reactions: Method 2

Adding the Islandora Large Image Content Model condition

In the Drupal administration interface got to Structure > Context > Add. In the name field, provide your context with a name - we will use large_image.

Under the Conditions heading, in the drop-down box, select "Islandora Content Models". When you select "Islandora Content Models", you should see a list of content modules under the "Content models to activate this condition". Check the checkbox with the "Islandora Large Image Content Model" label.

Adding needed CSS as a Reaction

Under the Reactions heading in the drop-down box, select "CSS from Modules". You will see a list of paths to CSS assets with checkboxes. Check the checkboxes for the following paths:

1. sites/all/modules/islandora_web_annotations/lib/css/annotorious.css
2. sites/all/modules/islandora_web_annotations/css/large_image/large_image.css
3. sites/all/modules/islandora_web_annotations/css/base/base.css

Adding needed JS as a Reaction

Under the Reactions heading in the drop-down box, select "JS from Modules". You will see a list of paths to JS assets with checkboxes. Check the checkboxes for the following paths:

1. sites/all/modules/islandora_web_annotations/lib/js/annotorious.min.js
2. sites/all/modules/islandora_web_annotations/js/large_image/large_image.js
3. sites/all/modules/islandora_web_annotations/js/base/base.js
4. sites/all/modules/islandora_web_annotations/lib/js/jquery.blockUI.js

Scroll to the bottom of the page and click save. On save, you will be brought to the list of available contexts. You should see large_image in the list. Should you need to edit or make any other modifications to this context reaction, you can click the edit link.

Last Steps

It is advised that you clear your sites cache (if possible) to insure that all the CSS and JS assets included in the large_image context are properly loaded and served.

You should now be able to add and view annotations to large_image content model objects in Islandora.