blacklight-spotlight 0.3.1 → 0.4.1

data/app/assets/javascripts/spotlight/sir-trevor.js

@@ -0,0 +1,7 @@
+(function ($){
+
+  SirTrevor.BlockControl.prototype.render = function() {
+    this.$el.html('<span class="st-icon st-icon-'+ _.result(this.block_type, "type") + '">'+ _.result(this.block_type, 'icon_name') +'</span>' + _.result(this.block_type, 'title'));
+    return this;
+  };
+})(jQuery);

data/app/assets/javascripts/spotlight/sir-trevor/block_limits.js

@@ -0,0 +1,42 @@
+Spotlight.BlockLimits = function(editor) {
+  this.editor = editor;
+
+}
+
+Spotlight.BlockLimits.prototype.enforceLimits = function() {
+  this.addEditorCallbacks();
+  this.checkGlobalBlockTypeLimit()();
+}
+
+Spotlight.BlockLimits.prototype.addEditorCallbacks = function() {
+  SirTrevor.EventBus.on('block:create:new', this.checkBlockTypeLimitOnAdd());
+  SirTrevor.EventBus.on('block:remove', this.checkGlobalBlockTypeLimit());
+}
+
+Spotlight.BlockLimits.prototype.checkBlockTypeLimitOnAdd = function() {
+  var editor = this.editor;
+
+  return function(block) {
+    var control = editor.$outer.find("a[data-type='" + block.blockCSSClass() + "']");
+
+    control.toggleClass("disabled", !editor.block_manager.canAddBlockType(block.class()));
+  }
+}
+
+Spotlight.BlockLimits.prototype.checkGlobalBlockTypeLimit = function() {
+  // we don't know what type of block was created or removed.. So, try them all.
+  var editor = this.editor;
+
+  return function() {
+    $.each(editor.block_manager.blockTypes, function(type) {
+      var block_type = SirTrevor.Blocks[type].prototype;
+
+      var control = editor.$outer.find(".st-block-control[data-type='" + block_type.type + "']");
+      if (editor.block_manager._getBlockTypeLimit(type) < 0) {
+        control.remove();
+      } else {
+        control.toggleClass("disabled", !editor.block_manager.canAddBlockType(type));
+      }
+    });
+  }
+}

data/app/assets/javascripts/spotlight/sir-trevor/grouped_block_controls.js

@@ -0,0 +1,33 @@
+SirTrevor.BlockControls.prototype.initialize = function() {
+  var groups = {};
+  for(var block_type in this.available_types) {
+    if (SirTrevor.Blocks.hasOwnProperty(block_type)) {
+      var block_control = new SirTrevor.BlockControl(block_type, this.instance_scope);
+      if (block_control.can_be_rendered) {
+        var blockGroup;
+
+        if ($.isFunction(SirTrevor.Blocks[block_type].prototype.blockGroup)) {
+          blockGroup = SirTrevor.Blocks[block_type].prototype.blockGroup();
+        } else {
+          blockGroup = SirTrevor.Blocks[block_type].prototype.blockGroup;
+        }
+        
+        groups[blockGroup] = groups[blockGroup] || [];
+        groups[blockGroup].push(block_control.render().$el);
+      }
+    }
+  }
+  for(groupKey in groups) {
+    var group   = groups[groupKey];
+    if(groupKey == 'undefined' || groupKey === undefined) {
+      groupKey = i18n.t("blocks:group:undefined");
+    }
+    var groupEl = $("<div class='st-controls-group'><div class='st-group-control-label'>" + groupKey + "</div></div>");
+    $.each(group, function(){
+      groupEl.append($(this));
+    });
+    this.$el.append(groupEl);
+  }
+
+  this.$el.delegate('.st-block-control', 'click', this.handleControlButtonClick);
+};

data/app/assets/javascripts/spotlight/sir-trevor/locales.js

@@ -0,0 +1,101 @@
+SirTrevor.Locales.en.blocks = $.extend(SirTrevor.Locales.en.blocks, {
+  autocompleteable: {
+    placeholder: "Enter a title..."
+  },
+
+  browse: {
+    title: "Browse Categories",
+    description: "This widget highlights browse categories. Each highlighted category links to the corresponding browse category results page.",
+    item_counts: "Include item counts?"
+  },
+
+  iframe: {
+    title:  "IFrame",
+    description: "This widget embeds iframe-based embed code into pages",
+    placeholder: "Enter embed code here. It should begin with e.g. '<iframe'"
+  },
+
+  oembed: {
+    title: "Embed + Text",
+    description: 'This widget embeds a web resource and a text block to the left or right of it.',
+    url: "URL",
+  },
+
+  featured_pages: {
+    title:  "Feature Pages",
+    description: "This widget highlights feature pages. Each highlighted item links to the corresponding feature page."
+  },
+
+  previewable: {
+    title: "Preview"
+  },
+
+  resources: {
+    panel: {
+      drag: "Drag",
+      display: "Display?",
+      remove: "Remove"
+    }
+  },
+
+  rule: {
+    title: "Horizontal Rule"
+  },
+
+  search_results: {
+    title: "Search Results",
+    description: "This widget displays a set of search results on a page. Specify a search result set by selecting an existing browse category. You can also select the view types that are available to the user when viewing the result set."
+  },
+
+  solr_documents: {
+    title: "Item Row",
+    description: "This widget displays exhibit items in a horizontal row. Optionally, you can add a heading and/or text to be displayed adjacent to the items.",
+    caption: {
+      placeholder: "Select...",
+      primary: "Primary caption",
+      secondary: "Secondary caption"
+    }
+  },
+
+  solr_documents_carousel: {
+    title: "Item Carousel",
+    description: "This widget displays exhibit items in a carousel. You can configure the item captions, how the images are cycled, and the size of the carousel.",
+    interval: {
+      title: "Automatically cycle images",
+      placeholder: "Select..."
+    },
+    height: {
+      title: "Maximum carousel height"
+    }
+  },
+  
+  solr_documents_embed: {
+    title: "Item Embed",
+    description: "This widget embeds exhibit items on a page. Optionally, you can add a heading and/or text to be displayed adjacent to the items.",
+  },
+
+  solr_documents_features: {
+    title: "Item Slideshow",
+    description: "This widget displays exhibit items in a static slideshow. The user will move between items in the slideshow using the field you select as the primary caption."
+  },
+
+  solr_documents_grid: {
+    title: "Item Grid",
+    description: "This widget displays exhibit items in a multi-row grid. Optionally, you can add a heading and/or text to be displayed adjacent to the items."
+  },
+
+  textable: {
+    heading: "Heading",
+    text: "Text",
+    align: {
+      title: "Display text on:",
+      left: "Left",
+      right: "Right"
+    }
+  },
+
+  group: {
+    undefined: "Standard widgets",
+    items: "Exhibit item widgets"
+  }
+});

data/app/assets/javascripts/spotlight/spotlight_nestable.js

@@ -3,8 +3,9 @@
   var Module = (function() {
     var nestableSelector = '[data-behavior="nestable"]';
     return {
-      init: function(){
-        $(nestableSelector).each(function(){
+      init: function(selector){
+
+        $(selector || nestableSelector).each(function(){
           $(this).nestable($(this).data());
           updateWeightsAndRelationships($(this));
         });

data/app/assets/stylesheets/spotlight/_blacklight_configuration.scss

@@ -64,10 +64,6 @@
   }
 }
 
-.index_title {
-  padding-left: 0;
-}
-
 .disabled-sort-option {
   .panel {margin-bottom: 0;}
 }

data/app/assets/stylesheets/spotlight/_bootstrap_overrides.scss

@@ -59,3 +59,23 @@ h1,h2,h3,h4,h5,h6 {
 label.radio {
   font-weight: normal;
 }
+
+#main-container .nav {
+  margin-bottom: $line-height-computed;
+}
+
+.tab-pane {
+  > p.instructions:first-child, > fieldset:first-child {
+    margin-top: -$padding-base-vertical;
+  }
+  fieldset {
+    margin-bottom: $padding-large-vertical * 3;
+    margin-top: $padding-large-vertical * 2;
+  }
+  legend {
+    margin-bottom: $padding-large-vertical;
+  }
+  div.radio + div input, div.radio + input[type="file"] {
+    margin-top: $padding-large-vertical;
+  }
+}

data/app/assets/stylesheets/spotlight/_browse.scss

@@ -1,5 +1,93 @@
-.blacklight-browse {
-  .index-document-functions {
-    display: none;
+$image-overlay-max-height: 300px;
+$image-overlay-bottom-margin: $padding-large-vertical * 3;
+
+@function category-min-height($overlay-max-height) {
+  @return $overlay-max-height + $image-overlay-bottom-margin;
+}
+
+.long-description-text {
+  column-width: 20em;
+  column-gap: 3em;
+  margin: ($padding-base-vertical * 2) 0;
+}
+
+.browse-landing {
+  text-align: center;
+  // Placeholder for vertically alignment - might already be available from use in another feature
+  %vertical-align {
+    position: relative;
+    top: 50%;
+    transform: translateY(-50%);
+  }
+
+  .category {
+    min-height: category-min-height($image-overlay-max-height);
+  }
+
+  .image-overlay {
+    img {width: 100%;}
+    position: relative;
+    margin-bottom: $image-overlay-bottom-margin;
+    max-height: 240px;
+    border-radius: $border-radius-large;
+    border: 2px solid $gray-light;
+    overflow: hidden;
+  }
+
+  .text-overlay {
+    position: absolute;
+    bottom: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    background: linear-gradient(to bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, .2), rgba(0, 0, 0, .4));
+    color: $white;
+    padding: 8%;
+    text-align: center;
+    text-shadow: 0 1px 0 $black;
+    // prevents potential blur caused by the vertical-align technique
+    transform-style: preserve-3d;
+
+    .browse-category-title {
+      font-size: $font-size-h3;
+      @extend %vertical-align;
+
+      small {
+        display: block;
+        color: $white;
+        margin-top: $padding-large-vertical;
+        text-transform: uppercase;
+      }
+    }
+
+    &:hover {
+      background: linear-gradient(to bottom, rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.7));
+    }
+  }
+
+  @media screen and (max-width: $screen-xs-max) {
+    .image-overlay {
+      margin: 10px auto;
+      max-width: 350px;
+    }
+    .text-overlay .browse-category-title {font-size: $font-size-h3;}
+  }
+  @media screen and (min-width: $screen-sm-min) and (max-width: $screen-md-max) {
+    $image-overlay-max-height: 250px;
+    .category {min-height: category-min-height($image-overlay-max-height);}
+    .text-overlay .browse-category-title {font-size: $font-size-h4;}
+  }
+  @media screen and (min-width: $screen-sm-min) and (max-width: $screen-sm-max) {
+    $image-overlay-max-height: 180px;
+    .category {min-height: category-min-height($image-overlay-max-height);}
+    .image-overlay {max-height: $image-overlay-max-height;}
+  }
+  @media screen and (max-width: $screen-sm-min) {
+    $image-overlay-max-height: 180px;
+    .category {min-height: category-min-height($image-overlay-max-height);}
+  }
+  @media screen and (min-width: $screen-lg-min) {
+    .category {min-height: category-min-height($image-overlay-max-height);}
+    .image-overlay {max-height: $image-overlay-max-height;}
   }
 }

data/app/assets/stylesheets/spotlight/_catalog.scss

@@ -1,31 +1,29 @@
 #documents.table {
-  .documentHeader {
+  font-size: $font-size-base;
 
+  .document-thumbnail {
+    border: none;
+    margin-bottom: 0;
+    padding: 0;
   }
 
-  .checkbox-toggle {
-    text-align: center;
-    form {
-      display: inline-block;
-    }
+  .document-thumbnail a > img {
+    border: 1px solid $gray-light;
+    width: 60px;
+    height: 60px;
+    object-fit: cover;
   }
 
-  .row {
-    margin: 0;
-  }
+  .document-counter {display: none;}
 
-  .index-document-functions {
-    display: none;
+  .index_title {
+    margin-top: 0;
+    margin-bottom: 0;
   }
 
-  .document-thumbnail {
-    @extend .thumbnail;
-
-    img {
-      max-width: 60px !important;
-    }
+  .checkbox.toggle_visibility {
+    padding-top: 0;
   }
-
 }
 
 #document {
@@ -106,3 +104,15 @@ form.edit_solr_document {
   float:left;
   margin-right: $padding-xs-horizontal;
 }
+
+#document {
+  dd.blacklight-exhibit_tags {
+    color: $body-bg;
+    line-height: 2em;
+  }
+
+  .blacklight-exhibit_tags a {
+    @extend .label;
+    @extend .label-default;
+  }
+}

data/app/assets/stylesheets/spotlight/_croppable.scss

@@ -0,0 +1,16 @@
+@mixin jcrop-loading-background {
+  background-image: image-url('Jcrop.gif');
+  background-color: transparent !important;
+}
+.form-group.croppable-loading-area {
+  min-height: 100px;
+  margin: ($padding-large-vertical * 2) $padding-large-vertical;
+}
+
+.loading-jcrop {
+  @include jcrop-loading-background;
+  .jcrop-tracker {
+    @include jcrop-loading-background;
+  }
+}
+

data/app/assets/stylesheets/spotlight/_curation.scss

@@ -44,6 +44,19 @@
   }
 }
 
+.panel-heading {
+  .publish-control {
+    display: inline;
+    .checkbox {
+      padding-top: 0;
+    }
+  }
+  .main {
+    display: inline-block;
+    vertical-align: text-bottom;
+  }
+}
+
 .panel-heading.page {
   &:hover {
     @include panel-hover-highlighting;
@@ -63,12 +76,6 @@
     }
   }
 
-  .publish-control {
-    display: inline;
-    .checkbox {
-      padding-top: 0;
-    }
-  }
   .page-links, .contact-links {
     text-align: right;
     a {
@@ -78,7 +85,6 @@
   .main {
     width: 99%;
     vertical-align: text-top;
-    display: inline-block;
   }
 }