decidim-gallery 0.0.1

data/app/forms/decidim/gallery/admin/gallery_item_image_form.rb

@@ -0,0 +1,14 @@
+# frozen_string_literal: true
+
+module Decidim
+  module Gallery
+    module Admin
+      class GalleryItemImageForm < GalleryItemForm
+        include Decidim::HasUploadValidations
+
+        attribute :photo
+        attribute :remove_photo, Boolean, default: false
+      end
+    end
+  end
+end

data/app/forms/decidim/gallery/admin/gallery_item_video_form.rb

@@ -0,0 +1,12 @@
+# frozen_string_literal: true
+
+module Decidim
+  module Gallery
+    module Admin
+      class GalleryItemVideoForm < GalleryItemForm
+        translatable_attribute :video_url, String
+        validates :video_url, translatable_presence: true
+      end
+    end
+  end
+end

data/app/helpers/decidim/gallery/admin/application_helper.rb

@@ -0,0 +1,18 @@
+# frozen_string_literal: true
+
+module Decidim
+  module Gallery
+    module Admin
+      module ApplicationHelper
+        def formatted_gallery_name(gallery)
+          text = I18n.t("formatted_text",
+                        component_name: translated_attribute(gallery.name),
+                        space_name: translated_attribute(gallery.participatory_space.title),
+                        scope: "decidim.gallery.admin")
+
+          [text, gallery.id]
+        end
+      end
+    end
+  end
+end

data/app/model/decidim/gallery/application_record.rb

@@ -0,0 +1,10 @@
+# frozen_string_literal: true
+
+module Decidim
+  module Gallery
+    # Abstract class from which all models in this engine inherit.
+    class ApplicationRecord < ActiveRecord::Base
+      self.abstract_class = true
+    end
+  end
+end

data/app/model/decidim/gallery/gallery_item.rb

@@ -0,0 +1,38 @@
+# frozen_string_literal: true
+
+module Decidim
+  module Gallery
+    class GalleryItem < ApplicationRecord
+      include Decidim::Resourceable
+      include Decidim::HasComponent
+      include Decidim::Authorable
+      include Decidim::TranslatableResource
+      include Decidim::Publicable
+      include Decidim::HasUploadValidations
+
+      include Traceable
+      include Loggable
+
+      translatable_fields :title, :video_url
+
+      component_manifest_name "gallery"
+
+      has_one_attached :photo
+      validates_upload :photo, uploader: Decidim::ImageUploader
+
+      scope :created_at_desc, -> { order(arel_table[:created_at].desc) }
+
+      def visible?
+        participatory_space.try(:visible?) && component.try(:published?)
+      end
+
+      def video_url=(value)
+        data[:video_url] = value
+      end
+
+      def video_url
+        data.fetch("video_url", {})
+      end
+    end
+  end
+end

data/app/overrides/decidim/admin/static_pages/edit/add_gallery.html.erb.deface

@@ -0,0 +1,11 @@
+<!-- insert_before 'div.form-general-submit' -->
+<div class="card">
+  <div class="card-divider">
+    <h2 class="card-title"><%= t("decidim.gallery.settings")%></h2>
+  </div>
+  <div class="card-section">
+    <div class="row column">
+      <%= f.select :gallery_id, f.object.galleries.map { |gallery| formatted_gallery_name(gallery) }, include_blank: t("decidim.gallery.none") %>
+    </div>
+  </div>
+</div>

data/app/overrides/decidim/pages/_standalone/add_content_blocks.html.erb.deface

@@ -0,0 +1,7 @@
+<!-- insert_after ".card__content" -->
+
+<div class="card__content">
+    <% if page.gallery_id.present? %>
+      <%= cell("decidim/gallery/main", OpenStruct.new(gallery_id: page.gallery_id), context: { view_context: self }) %>
+    <% end %>
+</div>

data/app/overrides/decidim/pages/_tabbed/add_content_blocks.html.erb.deface

@@ -0,0 +1,5 @@
+<!-- insert_after ".static__content" -->
+
+<% if page.gallery_id.present? %>
+  <%= cell("decidim/gallery/main", OpenStruct.new(gallery_id: page.gallery_id), context: { view_context: self }) %>
+<% end %>

data/app/packs/entrypoints/decidim_gallery.js

@@ -0,0 +1,3 @@
+import "src/decidim/gallery/gallery"
+
+require.context("../images", true)

data/app/packs/images/decidim/gallery/icon.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 35 35"><path d="M17.5 35A17.5 17.5 0 1 1 35 17.5 17.52 17.52 0 0 1 17.5 35zm0-33.06A15.56 15.56 0 1 0 33.06 17.5 15.57 15.57 0 0 0 17.5 1.94zm9.5 13.7H8a1 1 0 0 1 0-1.94h19a1 1 0 0 1 0 1.94zm0 3.68H8a1 1 0 0 1 0-1.94h19a1 1 0 0 1 0 1.94zM22.26 23H8a1 1 0 0 1 0-1.94h14.26a1 1 0 0 1 0 1.94z"/></svg>

data/app/packs/src/decidim/gallery/gallery.js

@@ -0,0 +1,42 @@
+import Masonry from "./masonry/masonry";
+
+function addGalleryHandlers() {
+  $(".gallery-item > a").on("click", function(event){
+    event.preventDefault();
+    $(".gallery-item > a.gallery-item-active").removeClass("gallery-item-active");
+    $(event.target).parent("a").addClass("gallery-item-active");
+
+    $(".reveal").on("open.zf.reveal", function(){
+      $(window).trigger('resize');
+    });
+    $(".reveal").on("closeme.zf.reveal", function(){
+      let link = $(".gallery-item > a.gallery-item-active");
+      let id = link.data("id");
+      let chosenSlide = $("[data-target="+id+"]");
+      let index = chosenSlide.index(".orbit-container > li");
+      $('.orbit').foundation('changeSlide', true, chosenSlide, index);
+      $(document).on("slidechange.zf.orbit", function (){
+        $(window).trigger('resize');
+      });
+    });
+  });
+}
+
+$(() => {
+  $(".gallery img").one("load", function() {
+    $('.gallery.image').masonry({
+      itemSelector: '.gallery-item',
+    });
+  }).each(function() {
+    if(this.complete) {
+      $(this).trigger('load'); // For jQuery >= 3.0
+    }
+  });
+
+  $(document).on('open.zf.reveal', '[data-reveal]', function () {
+    $(window).trigger('resize');
+  });
+
+});
+
+document.addEventListener("DOMContentLoaded", function(event) { addGalleryHandlers(); });

data/app/packs/src/decidim/gallery/masonry/EvEmitter.js

@@ -0,0 +1,85 @@
+
+function EvEmitter() {}
+
+var proto = EvEmitter.prototype;
+
+proto.on = function( eventName, listener ) {
+  if ( !eventName || !listener ) {
+    return;
+  }
+  // set events hash
+  var events = this._events = this._events || {};
+  // set listeners array
+  var listeners = events[ eventName ] = events[ eventName ] || [];
+  // only add once
+  if ( listeners.indexOf( listener ) == -1 ) {
+    listeners.push( listener );
+  }
+
+  return this;
+};
+
+proto.once = function( eventName, listener ) {
+  if ( !eventName || !listener ) {
+    return;
+  }
+  // add event
+  this.on( eventName, listener );
+  // set once flag
+  // set onceEvents hash
+  var onceEvents = this._onceEvents = this._onceEvents || {};
+  // set onceListeners object
+  var onceListeners = onceEvents[ eventName ] = onceEvents[ eventName ] || {};
+  // set flag
+  onceListeners[ listener ] = true;
+
+  return this;
+};
+
+proto.off = function( eventName, listener ) {
+  var listeners = this._events && this._events[ eventName ];
+  if ( !listeners || !listeners.length ) {
+    return;
+  }
+  var index = listeners.indexOf( listener );
+  if ( index != -1 ) {
+    listeners.splice( index, 1 );
+  }
+
+  return this;
+};
+
+proto.emitEvent = function( eventName, args ) {
+  var listeners = this._events && this._events[ eventName ];
+  if ( !listeners || !listeners.length ) {
+    return;
+  }
+  // copy over to avoid interference if .off() in listener
+  listeners = listeners.slice(0);
+  args = args || [];
+  // once stuff
+  var onceListeners = this._onceEvents && this._onceEvents[ eventName ];
+
+  for ( var i=0; i < listeners.length; i++ ) {
+    var listener = listeners[i]
+    var isOnce = onceListeners && onceListeners[ listener ];
+    if ( isOnce ) {
+      // remove listener
+      // remove before trigger to prevent recursion
+      this.off( eventName, listener );
+      // unset once flag
+      delete onceListeners[ listener ];
+    }
+    // trigger listener
+    listener.apply( this, args );
+  }
+
+  return this;
+};
+
+proto.allOff = function() {
+  delete this._events;
+  delete this._onceEvents;
+};
+
+export default EvEmitter;

data/app/packs/src/decidim/gallery/masonry/getSize.js

@@ -0,0 +1,181 @@
+
+// -------------------------- helpers -------------------------- //
+
+// get a number from a string, not a percentage
+function getStyleSize( value ) {
+  var num = parseFloat( value );
+  // not a percent like '100%', and a number
+  var isValid = value.indexOf('%') == -1 && !isNaN( num );
+  return isValid && num;
+}
+
+function noop() {}
+
+var logError = typeof console == 'undefined' ? noop :
+  function( message ) {
+    console.error( message );
+  };
+
+// -------------------------- measurements -------------------------- //
+
+var measurements = [
+  'paddingLeft',
+  'paddingRight',
+  'paddingTop',
+  'paddingBottom',
+  'marginLeft',
+  'marginRight',
+  'marginTop',
+  'marginBottom',
+  'borderLeftWidth',
+  'borderRightWidth',
+  'borderTopWidth',
+  'borderBottomWidth'
+];
+
+var measurementsLength = measurements.length;
+
+function getZeroSize() {
+  var size = {
+    width: 0,
+    height: 0,
+    innerWidth: 0,
+    innerHeight: 0,
+    outerWidth: 0,
+    outerHeight: 0
+  };
+  for ( var i=0; i < measurementsLength; i++ ) {
+    var measurement = measurements[i];
+    size[ measurement ] = 0;
+  }
+  return size;
+}
+
+// -------------------------- getStyle -------------------------- //
+
+/**
+ * getStyle, get style of element, check for Firefox bug
+ * https://bugzilla.mozilla.org/show_bug.cgi?id=548397
+ */
+function getStyle( elem ) {
+  var style = getComputedStyle( elem );
+  if ( !style ) {
+    logError( 'Style returned ' + style +
+      '. Are you running this code in a hidden iframe on Firefox? ' +
+      'See https://bit.ly/getsizebug1' );
+  }
+  return style;
+}
+
+// -------------------------- setup -------------------------- //
+
+var isSetup = false;
+
+var isBoxSizeOuter;
+
+/**
+ * setup
+ * check isBoxSizerOuter
+ * do on first getSize() rather than on page load for Firefox bug
+ */
+function setup() {
+  // setup once
+  if ( isSetup ) {
+    return;
+  }
+  isSetup = true;
+
+  // -------------------------- box sizing -------------------------- //
+
+  /**
+   * Chrome & Safari measure the outer-width on style.width on border-box elems
+   * IE11 & Firefox<29 measures the inner-width
+   */
+  var div = document.createElement('div');
+  div.style.width = '200px';
+  div.style.padding = '1px 2px 3px 4px';
+  div.style.borderStyle = 'solid';
+  div.style.borderWidth = '1px 2px 3px 4px';
+  div.style.boxSizing = 'border-box';
+
+  var body = document.body || document.documentElement;
+  body.appendChild( div );
+  var style = getStyle( div );
+  // round value for browser zoom. desandro/masonry#928
+  isBoxSizeOuter = Math.round( getStyleSize( style.width ) ) == 200;
+  getSize.isBoxSizeOuter = isBoxSizeOuter;
+
+  body.removeChild( div );
+}
+
+// -------------------------- getSize -------------------------- //
+
+function getSize( elem ) {
+  setup();
+
+  // use querySeletor if elem is string
+  if ( typeof elem == 'string' ) {
+    elem = document.querySelector( elem );
+  }
+
+  // do not proceed on non-objects
+  if ( !elem || typeof elem != 'object' || !elem.nodeType ) {
+    return;
+  }
+
+  var style = getStyle( elem );
+
+  // if hidden, everything is 0
+  if ( style.display == 'none' ) {
+    return getZeroSize();
+  }
+
+  var size = {};
+  size.width = elem.offsetWidth;
+  size.height = elem.offsetHeight;
+
+  var isBorderBox = size.isBorderBox = style.boxSizing == 'border-box';
+
+  // get all measurements
+  for ( var i=0; i < measurementsLength; i++ ) {
+    var measurement = measurements[i];
+    var value = style[ measurement ];
+    var num = parseFloat( value );
+    // any 'auto', 'medium' value will be 0
+    size[ measurement ] = !isNaN( num ) ? num : 0;
+  }
+
+  var paddingWidth = size.paddingLeft + size.paddingRight;
+  var paddingHeight = size.paddingTop + size.paddingBottom;
+  var marginWidth = size.marginLeft + size.marginRight;
+  var marginHeight = size.marginTop + size.marginBottom;
+  var borderWidth = size.borderLeftWidth + size.borderRightWidth;
+  var borderHeight = size.borderTopWidth + size.borderBottomWidth;
+
+  var isBorderBoxSizeOuter = isBorderBox && isBoxSizeOuter;
+
+  // overwrite width and height if we can get it from style
+  var styleWidth = getStyleSize( style.width );
+  if ( styleWidth !== false ) {
+    size.width = styleWidth +
+      // add padding and border unless it's already including it
+      ( isBorderBoxSizeOuter ? 0 : paddingWidth + borderWidth );
+  }
+
+  var styleHeight = getStyleSize( style.height );
+  if ( styleHeight !== false ) {
+    size.height = styleHeight +
+      // add padding and border unless it's already including it
+      ( isBorderBoxSizeOuter ? 0 : paddingHeight + borderHeight );
+  }
+
+  size.innerWidth = size.width - ( paddingWidth + borderWidth );
+  size.innerHeight = size.height - ( paddingHeight + borderHeight );
+
+  size.outerWidth = size.width + marginWidth;
+  size.outerHeight = size.height + marginHeight;
+
+  return size;
+}
+
+export default getSize;

data/app/packs/src/decidim/gallery/masonry/jQueryBridget.js

@@ -0,0 +1,109 @@
+
+// ----- utils ----- //
+
+var arraySlice = Array.prototype.slice;
+
+// helper function for logging errors
+// $.error breaks jQuery chaining
+var console = window.console;
+var logError = typeof console == 'undefined' ? function() {} :
+  function( message ) {
+    console.error( message );
+  };
+
+// ----- jQueryBridget ----- //
+
+function jQueryBridget( namespace, PluginClass, $ ) {
+  $ = $ || jQuery || window.jQuery;
+  if ( !$ ) {
+    return;
+  }
+
+  // add option method -> $().plugin('option', {...})
+  if ( !PluginClass.prototype.option ) {
+    // option setter
+    PluginClass.prototype.option = function( opts ) {
+      // bail out if not an object
+      if ( !$.isPlainObject( opts ) ){
+        return;
+      }
+      this.options = $.extend( true, this.options, opts );
+    };
+  }
+
+  // make jQuery plugin
+  $.fn[ namespace ] = function( arg0 /*, arg1 */ ) {
+    if ( typeof arg0 == 'string' ) {
+      // method call $().plugin( 'methodName', { options } )
+      // shift arguments by 1
+      var args = arraySlice.call( arguments, 1 );
+      return methodCall( this, arg0, args );
+    }
+    // just $().plugin({ options })
+    plainCall( this, arg0 );
+    return this;
+  };
+
+  // $().plugin('methodName')
+  function methodCall( $elems, methodName, args ) {
+    var returnValue;
+    var pluginMethodStr = '$().' + namespace + '("' + methodName + '")';
+
+    $elems.each( function( i, elem ) {
+      // get instance
+      var instance = $.data( elem, namespace );
+      if ( !instance ) {
+        logError( namespace + ' not initialized. Cannot call methods, i.e. ' +
+          pluginMethodStr );
+        return;
+      }
+
+      var method = instance[ methodName ];
+      if ( !method || methodName.charAt(0) == '_' ) {
+        logError( pluginMethodStr + ' is not a valid method' );
+        return;
+      }
+
+      // apply method, get return value
+      var value = method.apply( instance, args );
+      // set return value if value is returned, use only first value
+      returnValue = returnValue === undefined ? value : returnValue;
+    });
+
+    return returnValue !== undefined ? returnValue : $elems;
+  }
+
+  function plainCall( $elems, options ) {
+    $elems.each( function( i, elem ) {
+      var instance = $.data( elem, namespace );
+      if ( instance ) {
+        // set options & init
+        instance.option( options );
+        instance._init();
+      } else {
+        // initialize new instance
+        instance = new PluginClass( elem, options );
+        $.data( elem, namespace, instance );
+      }
+    });
+  }
+
+  updateJQuery( $ );
+
+}
+
+// ----- updateJQuery ----- //
+
+// set $.bridget for v1 backwards compatibility
+function updateJQuery( $ ) {
+  if ( !$ || ( $ && $.bridget ) ) {
+    return;
+  }
+  $.bridget = jQueryBridget;
+}
+
+updateJQuery( jQuery || window.jQuery );
+
+// -----  ----- //
+
+export default jQueryBridget;