jquery-bgswitcher-rails 0.0.1

checksums.yaml

@@ -0,0 +1,7 @@
+---
+SHA1:
+  metadata.gz: c52e8b5fccc863beb3a2f5388bd066b460a7fba0
+  data.tar.gz: 1e0eb44e434b7f4f622896b507c1be72a2d5d476
+SHA512:
+  metadata.gz: c2f65e9b6b741d837eb7d62c66f70c4b00d17944c3b777b39dccbf98d0c87be35df513e7c77274b7d668d7e472ff754939298b5eab41c15482f8b31fb14630e8
+  data.tar.gz: 4260bbc098e3397146e2027524254a82993fd51a10f068d8beaff1ccb2432dca4672e061a8fc38d3122306aca02cfb3da35c52135fccfe1fc8fa501820d74d70

data/.gitignore

@@ -0,0 +1,9 @@
+/.bundle/
+/.yardoc
+/Gemfile.lock
+/_yardoc/
+/coverage/
+/doc/
+/pkg/
+/spec/reports/
+/tmp/

data/CODE_OF_CONDUCT.md

@@ -0,0 +1,49 @@
+# Contributor Code of Conduct
+
+As contributors and maintainers of this project, and in the interest of
+fostering an open and welcoming community, we pledge to respect all people who
+contribute through reporting issues, posting feature requests, updating
+documentation, submitting pull requests or patches, and other activities.
+
+We are committed to making participation in this project a harassment-free
+experience for everyone, regardless of level of experience, gender, gender
+identity and expression, sexual orientation, disability, personal appearance,
+body size, race, ethnicity, age, religion, or nationality.
+
+Examples of unacceptable behavior by participants include:
+
+* The use of sexualized language or imagery
+* Personal attacks
+* Trolling or insulting/derogatory comments
+* Public or private harassment
+* Publishing other's private information, such as physical or electronic
+  addresses, without explicit permission
+* Other unethical or unprofessional conduct
+
+Project maintainers have the right and responsibility to remove, edit, or
+reject comments, commits, code, wiki edits, issues, and other contributions
+that are not aligned to this Code of Conduct, or to ban temporarily or
+permanently any contributor for other behaviors that they deem inappropriate,
+threatening, offensive, or harmful.
+
+By adopting this Code of Conduct, project maintainers commit themselves to
+fairly and consistently applying these principles to every aspect of managing
+this project. Project maintainers who do not follow or enforce the Code of
+Conduct may be permanently removed from the project team.
+
+This code of conduct applies both within project spaces and in public spaces
+when an individual is representing the project or its community.
+
+Instances of abusive, harassing, or otherwise unacceptable behavior may be
+reported by contacting a project maintainer at usgitan@gmail.com. All
+complaints will be reviewed and investigated and will result in a response that
+is deemed necessary and appropriate to the circumstances. Maintainers are
+obligated to maintain confidentiality with regard to the reporter of an
+incident.
+
+This Code of Conduct is adapted from the [Contributor Covenant][homepage],
+version 1.3.0, available at
+[http://contributor-covenant.org/version/1/3/0/][version]
+
+[homepage]: http://contributor-covenant.org
+[version]: http://contributor-covenant.org/version/1/3/0/

data/Gemfile

@@ -0,0 +1,4 @@
+source 'https://rubygems.org'
+
+# Specify your gem's dependencies in jquery-bgswitcher-rails.gemspec
+gemspec

data/LICENSE.txt

@@ -0,0 +1,21 @@
+The MIT License (MIT)
+
+Copyright (c) 2016 Yuta Hasada
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in
+all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
+THE SOFTWARE.

data/README.md

@@ -0,0 +1,31 @@
+# jquery-bgswitcher-rails
+
+[jquery-bgswitcher](https://github.com/rewish/jquery-bgswitcher) is Switch the background image with using effect.  
+
+This gem just installs jquery.bgswitcher.js for you.  
+
+## Installation
+
+Add this line to your application's Gemfile:
+
+```ruby
+gem 'jquery-bgswitcher-rails'
+```
+
+And then execute:
+
+    $ bundle
+
+Or install it yourself as:
+
+    $ gem install jquery-bgswitcher-rails
+
+## Usage
+
+Add `//= require jquery.bgswitcher`  
+to your `app/assets/javascripts/application.js.`
+
+## License
+
+The gem is available as open source under the terms of the [MIT License](http://opensource.org/licenses/MIT).
+

data/Rakefile

@@ -0,0 +1,2 @@
+require "bundler/gem_tasks"
+task :default => :spec

data/bin/console

@@ -0,0 +1,14 @@
+#!/usr/bin/env ruby
+
+require "bundler/setup"
+require "jquery/bgswitcher/rails"
+
+# You can add fixtures and/or initialization code here to make experimenting
+# with your gem easier. You can also use a different console, if you like.
+
+# (If you use this, don't forget to add pry to your Gemfile!)
+# require "pry"
+# Pry.start
+
+require "irb"
+IRB.start

data/bin/setup

@@ -0,0 +1,8 @@
+#!/usr/bin/env bash
+set -euo pipefail
+IFS=$'\n\t'
+set -vx
+
+bundle install
+
+# Do any other automated setup that you need to do here

data/jquery-bgswitcher-rails.gemspec

@@ -0,0 +1,24 @@
+# coding: utf-8
+lib = File.expand_path('../lib', __FILE__)
+$LOAD_PATH.unshift(lib) unless $LOAD_PATH.include?(lib)
+require 'jquery/bgswitcher/rails/version'
+
+Gem::Specification.new do |spec|
+  spec.name          = "jquery-bgswitcher-rails"
+  spec.version       = Jquery::Bgswitcher::Rails::VERSION
+  spec.authors       = ["Yuta Hasada"]
+  spec.email         = ["usgitan@gmail.com"]
+
+  spec.summary       = %q{Switch the background image with using effect for Rails}
+  spec.description   = %q{Switch the background image with using effect}
+  spec.homepage      = "https://github.com/yuta17/jquery-bgswitcher-rails"
+  spec.license       = "MIT"
+
+  spec.files         = `git ls-files -z`.split("\x0").reject { |f| f.match(%r{^(test|spec|features)/}) }
+  spec.bindir        = "exe"
+  spec.executables   = spec.files.grep(%r{^exe/}) { |f| File.basename(f) }
+  spec.require_paths = ["lib"]
+
+  spec.add_development_dependency "bundler", "~> 1.12"
+  spec.add_development_dependency "rake", "~> 10.0"
+end

data/lib/jquery/bgswitcher/rails/version.rb

@@ -0,0 +1,7 @@
+module Jquery
+  module Bgswitcher
+    module Rails
+      VERSION = "0.0.1"
+    end
+  end
+end

data/lib/jquery/bgswitcher/rails.rb

@@ -0,0 +1,9 @@
+require "jquery/bgswitcher/rails/version"
+
+module Jquery
+  module Bgswitcher
+    module Rails
+      # Your code goes here...
+    end
+  end
+end

data/vender/assets/javascripts/jquery.bgswitcher.js

@@ -0,0 +1,559 @@
+/*!
+ * jQuery.BgSwitcher
+ *
+ * @version  0.4.3
+ * @author   rewish <rewish.org@gmail.com>
+ * @license  MIT License (https://github.com/rewish/jquery-bgswitcher/blob/master/LICENSE.md)
+ * @link     https://github.com/rewish/jquery-bgswitcher
+ */
+(function($) {
+  'use strict';
+
+  var loadedImages = {},
+
+      slice = Array.prototype.slice,
+      toString = Object.prototype.toString,
+
+      corners = ['Top', 'Right', 'Bottom', 'Left'],
+      backgroundProperties = [
+        'Attachment', 'Color', 'Image', 'Repeat',
+        'Position', 'Size', 'Clip', 'Origin'
+      ];
+
+  $.fn.bgswitcher = function() {
+    var args = arguments,
+        instanceKey = BgSwitcher.keys.instance;
+
+    return this.each(function() {
+      var instance = $.data(this, instanceKey);
+
+      if (!instance) {
+        instance = new BgSwitcher(this);
+        $.data(this, instanceKey, instance);
+      }
+
+      instance.dispatch.apply(instance, args);
+    });
+  };
+
+  // Backward Compatibility
+  $.fn.bgSwitcher = $.fn.bgswitcher;
+
+  /**
+   * BgSwitcher
+   *
+   * @param {HTMLElement} el
+   * @constructor
+   */
+  function BgSwitcher(el) {
+    this.$el = $(el);
+    this.index = 0;
+    this.config = $.extend({}, BgSwitcher.defaultConfig);
+
+    this._setupBackgroundElement();
+    this._listenToResize();
+  }
+
+  $.extend(BgSwitcher.prototype, {
+    /**
+     * Dispatch
+     *
+     * @param {string|Array} one
+     */
+    dispatch: function(one) {
+      switch (toString.call(one)) {
+        case '[object Object]':
+          this.setConfig(one);
+          break;
+        case '[object String]':
+          this[one].apply(this, slice.call(arguments, 1));
+          break;
+        default:
+          throw new Error('Please specify a Object or String');
+      }
+    },
+
+    /**
+     * Set config
+     *
+     * @param {Object} config
+     */
+    setConfig: function(config) {
+      this.config = $.extend(this.config, config);
+
+      if (typeof this.config.random !== 'undefined') {
+        this.config.shuffle = this.config.random;
+      }
+
+      this.refresh();
+    },
+
+    /**
+     * Set images
+     *
+     * @param {Array} images
+     */
+    setImages: function(images) {
+      this.imageList = new this.constructor.ImageList(images);
+
+      if (this.config.shuffle) {
+        this.imageList.shuffle();
+      }
+    },
+
+    /**
+     * Set switch handler
+     *
+     * @param {Function} fn
+     */
+    setSwitchHandler: function(fn) {
+      this.switchHandler = $.proxy(fn, this);
+    },
+
+    /**
+     * Default switch handler
+     *
+     * @param {string} type
+     * @returns {Function}
+     */
+    getBuiltInSwitchHandler: function(type) {
+      return this.constructor.switchHandlers[type || this.config.effect];
+    },
+
+    /**
+     * Refresh
+     */
+    refresh: function() {
+      this.setImages(this.config.images);
+      this.setSwitchHandler(this.getBuiltInSwitchHandler());
+      this._prepareSwitching();
+
+      if (this.config.start) {
+        this.start();
+      }
+    },
+
+    /**
+     * Start switching
+     */
+    start: function() {
+      if (!this._timerID) {
+        this._timerID = setTimeout($.proxy(this, 'next'), this.config.interval);
+      }
+    },
+
+    /**
+     * Stop switching
+     */
+    stop: function() {
+      if (this._timerID) {
+        clearTimeout(this._timerID);
+        this._timerID = null;
+      }
+    },
+
+    /**
+     * Toggle between start/stop
+     */
+    toggle: function() {
+      if (this._timerID) {
+        this.stop();
+      } else {
+        this.start();
+      }
+    },
+
+    /**
+     * Reset switching
+     */
+    reset: function() {
+      this.index = 0;
+      this._prepareSwitching();
+    },
+
+    /**
+     * Go to next switching
+     */
+    next: function() {
+      var max = this.imageList.count();
+
+      if (!this.config.loop && this.index + 1 === max) {
+        return;
+      }
+
+      if (++this.index === max) {
+        this.index = 0;
+      }
+
+      this.switching();
+    },
+
+    /**
+     * Go to previous switching
+     */
+    prev: function() {
+      if (!this.config.loop && this.index === 0) {
+        return;
+      }
+
+      if (--this.index === -1) {
+        this.index = this.imageList.count() - 1;
+      }
+
+      this.switching();
+    },
+
+    /**
+     * Select the switching at index
+     *
+     * @param {number} index
+     */
+    select: function(index) {
+      if (index === -1) {
+        index = this.imageList.count() - 1;
+      }
+
+      this.index = index;
+      this.switching();
+    },
+
+    /**
+     * Switching the background image
+     */
+    switching: function() {
+      var started = !!this._timerID;
+
+      if (started) {
+        this.stop();
+      }
+
+      this._createSwitchableElement();
+      this._prepareSwitching();
+      this.switchHandler(this.$switchable);
+
+      if (started) {
+        this.start();
+      }
+    },
+
+    /**
+     * Destroy...
+     */
+    destroy: function() {
+      this.stop();
+      this._stopListeningToResize();
+
+      if (this.$switchable) {
+        this.$switchable.stop();
+        this.$switchable.remove();
+        this.$switchable = null;
+      }
+
+      if (this.$bg) {
+        this.$bg.remove();
+        this.$bg = null;
+      }
+
+      this.$el.removeAttr('style');
+      this.$el.removeData(this.constructor.keys.instance);
+      this.$el = null;
+    },
+
+    /**
+     * Adjust rectangle
+     */
+    _adjustRectangle: function() {
+      var corner,
+          i = 0,
+          length = corners.length,
+          offset = this.$el.position(),
+          copiedStyles = {
+            top: offset.top,
+            left: offset.left,
+            width: this.$el.innerWidth(),
+            height: this.$el.innerHeight()
+          };
+
+      for (; i < length; i++) {
+        corner = corners[i];
+        copiedStyles['margin' + corner] = this.$el.css('margin' + corner);
+        copiedStyles['border' + corner] = this.$el.css('border' + corner);
+      }
+
+      this.$bg.css(copiedStyles);
+    },
+
+    /**
+     * Setup background element
+     */
+    _setupBackgroundElement: function() {
+      this.$bg = $(document.createElement('div'));
+      this.$bg.css({
+        position: 'absolute',
+        zIndex: (parseInt(this.$el.css('zIndex'), 10) || 0) - 1,
+        overflow: 'hidden'
+      });
+
+      this._copyBackgroundStyles();
+      this._adjustRectangle();
+
+      if (this.$el[0].tagName === 'BODY') {
+        this.$el.prepend(this.$bg);
+      } else {
+        this.$el.before(this.$bg);
+        this.$el.css('background', 'none');
+      }
+    },
+
+    /**
+     * Create switchable element
+     */
+    _createSwitchableElement: function() {
+      if (this.$switchable) {
+        this.$switchable.remove();
+      }
+
+      this.$switchable = this.$bg.clone();
+      this.$switchable.css({top: 0, left: 0, margin: 0, border: 'none'});
+      this.$switchable.appendTo(this.$bg);
+    },
+
+    /**
+     * Copy background styles
+     */
+    _copyBackgroundStyles: function () {
+      var prop,
+          copiedStyle = {},
+          i = 0,
+          length = backgroundProperties.length,
+          backgroundPosition = 'backgroundPosition';
+
+      for (; i < length; i++) {
+        prop = 'background' + backgroundProperties[i];
+        copiedStyle[prop] = this.$el.css(prop);
+      }
+
+      // For IE<=9
+      if (copiedStyle[backgroundPosition] === undefined) {
+        copiedStyle[backgroundPosition] = [
+          this.$el.css(backgroundPosition + 'X'),
+          this.$el.css(backgroundPosition + 'Y')
+        ].join(' ');
+      }
+
+      this.$bg.css(copiedStyle);
+    },
+
+    /**
+     * Listen to the resize event
+     */
+    _listenToResize: function() {
+      var that = this;
+      this._resizeHandler = function() {
+        that._adjustRectangle();
+      };
+      $(window).on('resize', this._resizeHandler);
+    },
+
+    /**
+     * Stop listening to the resize event
+     */
+    _stopListeningToResize: function() {
+      $(window).off('resize', this._resizeHandler);
+      this._resizeHandler = null;
+    },
+
+    /**
+     * Prepare the Switching
+     */
+    _prepareSwitching: function() {
+      this.$bg.css('backgroundImage', this.imageList.url(this.index));
+    }
+  });
+
+  /**
+   * Data Keys
+   * @type {Object}
+   */
+  BgSwitcher.keys = {
+    instance: 'bgSwitcher'
+  };
+
+  /**
+   * Default Config
+   * @type {Object}
+   */
+  BgSwitcher.defaultConfig = {
+    images: [],
+    interval: 5000,
+    start: true,
+    loop: true,
+    shuffle: false,
+    effect: 'fade',
+    duration: 1000,
+    easing: 'swing'
+  };
+
+  /**
+   * Built-In switch handlers (effects)
+   * @type {Object}
+   */
+  BgSwitcher.switchHandlers = {
+    fade: function($el) {
+      $el.animate({opacity: 0}, this.config.duration, this.config.easing);
+    },
+
+    blind: function($el) {
+      $el.animate({height: 0}, this.config.duration, this.config.easing);
+    },
+
+    clip: function($el) {
+      $el.animate({
+        top: parseInt($el.css('top'), 10) + $el.height() / 2,
+        height: 0
+      }, this.config.duration, this.config.easing);
+    },
+
+    slide: function($el) {
+      $el.animate({top: -$el.height()}, this.config.duration, this.config.easing);
+    },
+
+    drop: function($el) {
+      $el.animate({
+        left: -$el.width(),
+        opacity: 0
+      }, this.config.duration, this.config.easing);
+    },
+
+    hide: function($el) {
+      $el.hide();
+    }
+  };
+
+  /**
+   * Define effect
+   *
+   * @param {String} name
+   * @param {Function} fn
+   */
+  BgSwitcher.defineEffect = function(name, fn) {
+    this.switchHandlers[name] = fn;
+  };
+
+  /**
+   * BgSwitcher.ImageList
+   *
+   * @param {Array} images
+   * @constructor
+   */
+  BgSwitcher.ImageList = function(images) {
+    this.images = images;
+    this.createImagesBySequence();
+    this.preload();
+  };
+
+  $.extend(BgSwitcher.ImageList.prototype, {
+    /**
+     * Images is sequenceable
+     *
+     * @returns {boolean}
+     */
+    isSequenceable: function() {
+      return typeof this.images[0] === 'string' &&
+          typeof this.images[1] === 'number' &&
+          typeof this.images[2] === 'number';
+    },
+
+    /**
+     * Create an images by sequence
+     */
+    createImagesBySequence: function() {
+      if (!this.isSequenceable()) {
+        return;
+      }
+
+      var images = [],
+          base = this.images[0],
+          min = this.images[1],
+          max = this.images[2];
+
+      do {
+        images.push(base.replace(/\.\w+$/, min + '$&'));
+      } while (++min <= max);
+
+      this.images = images;
+    },
+
+    /**
+     * Preload an images
+     */
+    preload: function() {
+      var path,
+          length = this.images.length,
+          i = 0;
+
+      for (; i < length; i++) {
+        path = this.images[i];
+        if (!loadedImages[path]) {
+          loadedImages[path] = new Image();
+          loadedImages[path].src = path;
+        }
+      }
+    },
+
+    /**
+     * Shuffle an images
+     */
+    shuffle: function() {
+      var j, t,
+          i = this.images.length,
+          original = this.images.join();
+
+      if (!i) {
+        return;
+      }
+
+      while (i) {
+        j = Math.floor(Math.random() * i);
+        t = this.images[--i];
+        this.images[i] = this.images[j];
+        this.images[j] = t;
+      }
+
+      if (this.images.join() === original) {
+        this.shuffle();
+      }
+    },
+
+    /**
+     * Get the image from index
+     *
+     * @param {number} index
+     * @returns {string}
+     */
+    get: function(index) {
+      return this.images[index];
+    },
+
+    /**
+     * Get the URL with function of CSS
+     *
+     * @param {number} index
+     * @returns {string}
+     */
+    url: function(index) {
+      return 'url(' + this.get(index) + ')';
+    },
+
+    /**
+     * Count of images
+     *
+     * @returns {number}
+     */
+    count: function() {
+      return this.images.length;
+    }
+  });
+
+  $.BgSwitcher = BgSwitcher;
+}(jQuery));

metadata

@@ -0,0 +1,85 @@
+--- !ruby/object:Gem::Specification
+name: jquery-bgswitcher-rails
+version: !ruby/object:Gem::Version
+  version: 0.0.1
+platform: ruby
+authors:
+- Yuta Hasada
+autorequire: 
+bindir: exe
+cert_chain: []
+date: 2016-07-17 00:00:00.000000000 Z
+dependencies:
+- !ruby/object:Gem::Dependency
+  name: bundler
+  requirement: !ruby/object:Gem::Requirement
+    requirements:
+    - - "~>"
+      - !ruby/object:Gem::Version
+        version: '1.12'
+  type: :development
+  prerelease: false
+  version_requirements: !ruby/object:Gem::Requirement
+    requirements:
+    - - "~>"
+      - !ruby/object:Gem::Version
+        version: '1.12'
+- !ruby/object:Gem::Dependency
+  name: rake
+  requirement: !ruby/object:Gem::Requirement
+    requirements:
+    - - "~>"
+      - !ruby/object:Gem::Version
+        version: '10.0'
+  type: :development
+  prerelease: false
+  version_requirements: !ruby/object:Gem::Requirement
+    requirements:
+    - - "~>"
+      - !ruby/object:Gem::Version
+        version: '10.0'
+description: Switch the background image with using effect
+email:
+- usgitan@gmail.com
+executables: []
+extensions: []
+extra_rdoc_files: []
+files:
+- ".gitignore"
+- CODE_OF_CONDUCT.md
+- Gemfile
+- LICENSE.txt
+- README.md
+- Rakefile
+- bin/console
+- bin/setup
+- jquery-bgswitcher-rails.gemspec
+- lib/jquery/bgswitcher/rails.rb
+- lib/jquery/bgswitcher/rails/version.rb
+- vender/assets/javascripts/jquery.bgswitcher.js
+homepage: https://github.com/yuta17/jquery-bgswitcher-rails
+licenses:
+- MIT
+metadata: {}
+post_install_message: 
+rdoc_options: []
+require_paths:
+- lib
+required_ruby_version: !ruby/object:Gem::Requirement
+  requirements:
+  - - ">="
+    - !ruby/object:Gem::Version
+      version: '0'
+required_rubygems_version: !ruby/object:Gem::Requirement
+  requirements:
+  - - ">="
+    - !ruby/object:Gem::Version
+      version: '0'
+requirements: []
+rubyforge_project: 
+rubygems_version: 2.5.1
+signing_key: 
+specification_version: 4
+summary: Switch the background image with using effect for Rails
+test_files: []
+has_rdoc: