middleman-bem-html 1.0.1

checksums.yaml

@@ -0,0 +1,7 @@
+---
+SHA1:
+  metadata.gz: 26e4c5bb74924edf2372c094c3ef63ee6e72c1ce
+  data.tar.gz: 44c17a39685b5762bd5b828c9a7f28dcca516d1b
+SHA512:
+  metadata.gz: 5dfe42cf4b92df86d33bedca54fc3240376c119b8514633a036580c15e6e9788a3a00d7c1f3e650c3cdf894e5744355cbad6e10a46f0596e2e4c1fdf23e89e7c
+  data.tar.gz: 3b0504febac3530765572cb1a215e58c81e125ccc6a2cf4b5901d52cd1b18858eaa74cd95b3f34de5a39d2c92e1cd6d22c027c554a65aee93584404cce4f142f

data/.gitignore

@@ -0,0 +1,7 @@
+*.gem
+
+# Ignore bundler lock file
+/Gemfile.lock
+
+# Ignore pkg folder
+/pkg

data/Gemfile

@@ -0,0 +1,18 @@
+# If you do not have OpenSSL installed, update
+# the following line to use "http://" instead
+source 'https://rubygems.org'
+
+# Specify your gem's dependencies in bem_html.gemspec
+gemspec
+
+group :development do
+  gem 'rake'
+  gem 'rdoc'
+  gem 'yard'
+end
+
+group :test do
+  gem 'cucumber'
+  gem 'aruba'
+  gem 'rspec'
+end

data/Rakefile

@@ -0,0 +1,14 @@
+require 'bundler'
+Bundler::GemHelper.install_tasks
+
+require 'cucumber/rake/task'
+
+Cucumber::Rake::Task.new(:cucumber, 'Run features that should pass') do |t|
+  t.cucumber_opts = '--color --tags ~@wip --strict'
+end
+
+require 'rake/clean'
+
+task test: ['cucumber']
+
+task default: :test

data/Readme.md

@@ -0,0 +1,82 @@
+# middleman-bem-html
+
+A Middleman extension to add BEM classes to HTML based on HTML attributes. 
+
+Makes use of [bem_html](https://github.com/oncomouse/bem_html) to handle class generation and [css_dead_class](https://github.com/oncomouse/css_dead_class) to cleanup unused CSS classes.
+
+## Purpose
+
+In large projects, BEM namespacing can get fairly complicated. In Sass and PostCSS, there exist a number of helper methods to simply the creation of nested Block, Element, Modifier classes; however, this plugin provides similar helper methods within HTML itself.
+
+## Sample Usage
+
+Say you had a BEM block called "widget" that had the following structure in HTML:
+
+~~~html
+
+<div class="widget">
+	<h1 class="widget__heading widget__heading--lime">Heading</h1>
+	<section class="widget__content">
+		<p class="widget__content__first-paragraph">First Paragraph</p>
+	</section>
+</div>
+~~~
+
+With bem-html, you could define that structure instead as the following:
+
+~~~html
+<div bem-block="widget">
+	<h1 bem-element="heading" modifiers="[:lime]">Heading</h1>
+	<section bem-element="content">
+		<p bem-element="first-paragraph">First Paragraph</p>
+	</section>
+</div>
+~~~
+
+And this extension would produce the desired HTML.
+
+Originally, this extension was specifically designed for HAML, where it really shines:
+
+~~~haml
+%div{bem:{block: :widget}}
+	%h1{bem:{element: :heading, modifiers: [:lime]}} Heading
+	%section{bem:{element: :content}}
+		%p{bem: {element: "first-paragraph"}} First Paragraph
+~~~
+
+## Installation
+
+Add
+
+~~~
+gem "middleman-bem-html"
+~~~
+
+to your `Gemfile` and run `bundle update`
+
+## Configuration
+
+In `config.rb`, add the following:
+
+~~~ruby
+activate :bem_html
+
+config[:classes_to_keep] = [
+	'no-js',
+]
+config[:internal_css] = true
+~~~
+
+The two configuration options are:
+
+### `:classes_to_keep`
+
+An array of CSS class names to not remove, even if they are not present in any of the CSS files.
+
+### `:internal_css`
+
+**defaults to `true`**
+
+If you are using any `external_pipeline` calls to configure your CSS files (like gulp or PostCSS), the `after_build` method that this extension uses to remove all the unused CSS from production HTML will run before the CSS has been generated (as `external_pipeline` calls always run *after* extension methods), as such you *must* use an `external_pipeline` to remove the unused CSS classes this extension may generate.
+
+If this effects you, please consider using [postcss-deadclass](https://github.com/oncomouse/postcss-deadclass) to remove the unused CSS classes using PostCSS.

data/features/support/env.rb

@@ -0,0 +1,4 @@
+PROJECT_ROOT_PATH = File.dirname(File.dirname(File.dirname(__FILE__)))
+require 'middleman-core'
+require 'middleman-core/step_definitions'
+require File.join(PROJECT_ROOT_PATH, 'lib', 'bem_html')

data/lib/middleman-bem-html.rb

@@ -0,0 +1,112 @@
+require 'active_support/core_ext/object/try'
+require 'memoist'
+require 'middleman-core/contracts'
+require 'css_dead_class'
+require 'bem_html'
+
+class ::Middleman::Extension::BemHtml < ::Middleman::Extension
+	option :ignore, [], 'Patterns to avoid minifying'
+	option :inline_content_types, %w(text/html text/php), 'Content types of resources that contain bem commands'
+
+	def initialize(app, options_hash={}, &block)
+		super
+	end
+	
+	def ready
+		# Setup Rack middleware to minify CSS
+		app.use Rack, compressor: options[:compressor],
+									ignore: Array(options[:ignore]) + [/\.min\./],
+									inline_content_types: options[:inline_content_types]
+	end
+	
+	def after_build
+		# This will work if you are building your CSS files in Middleman. If you are using an external_pipeline,
+		# this after_build method will trigger before the external_pipeline. As such, you need to use PostCSS
+		# and http://github.com/oncomouse/postcss-deadclass to remove all the cruft.
+
+		# Set config[:internal_css] to false if you are using an external_pipeline and postcss-deadclass
+		runInternalDeCrufter = app.config.internal_css || true
+		if runInternalDeCrufter
+			classesToKeep = app.config.classes_to_keep || []
+			cssFiles = Dir.glob("#{app.config.build_dir}/#{app.config.css_dir}/**/*.css")
+			htmlFiles = Dir.glob("#{app.config.build_dir}/**/*.html")
+			
+			css_deadfiles = CSSDeadClass.new({
+				html_files: htmlFiles,
+				css_files: cssFiles,
+				classes_to_keep: classesToKeep
+			})
+			css_deadfiles.parse
+		end
+	end
+
+	class Rack
+		extend Memoist
+		include Contracts
+
+		# Init
+		# @param [Class] app
+		# @param [Hash] options
+		Contract RespondTo[:call], {
+			ignore: ArrayOf[PATH_MATCHER]
+		} => Any
+		def initialize(app, options={})
+			@app = app
+			@ignore = options.fetch(:ignore)
+			@inline_content_types = options[:inline_content_types]
+		end
+
+		# Rack interface
+		# @param [Rack::Environmemt] env
+		# @return [Array]
+		def call(env)
+			status, headers, response = @app.call(env)
+
+			content_type = headers['Content-Type'].try(:slice, /^[^;]*/)
+			path = env['PATH_INFO']
+
+			minified = if minifiable_inline?(content_type)
+				minify_inline(::Middleman::Util.extract_response_text(response))
+			end
+
+			if minified
+				headers['Content-Length'] = ::Rack::Utils.bytesize(minified).to_s
+				response = [minified]
+			end
+
+			[status, headers, response]
+		end
+
+		private
+
+		# Whether the path should be ignored
+		# @param [String] path
+		# @return [Boolean]
+		def ignore?(path)
+			@ignore.any? { |ignore| ::Middleman::Util.path_match(ignore, path) }
+		end
+		memoize :ignore?
+		
+		# Whether this type of content contains inline content that can be minified
+		# @param [String, nil] content_type
+		# @return [Boolean]
+		def minifiable_inline?(content_type)
+			@inline_content_types.include?(content_type)
+		end
+		memoize :minifiable_inline?
+
+		# Detect and minify inline content
+		# @param [String] content
+		# @return [String]
+		def minify_inline(content)
+			BemHtml.parse(content)
+		end
+		memoize :minify_inline
+	end
+end
+
+
+Middleman::Extensions.register :bem_html do
+  #require "bem_html/extension"
+  ::Middleman::Extension::BemHtml
+end

data/middleman-bem-html.gemspec

@@ -0,0 +1,28 @@
+# -*- encoding: utf-8 -*-
+$:.push File.expand_path("../lib", __FILE__)
+
+Gem::Specification.new do |s|
+  s.name        = "middleman-bem-html"
+  s.version     = "1.0.1"
+  s.platform    = Gem::Platform::RUBY
+  s.authors     = ["Andrew Pilsch"]
+  s.email       = ["apilsch@tamu.edu"]
+  s.homepage    = "http://github.com/oncomouse/middleman-bem-html"
+  s.summary     = %q{Middleman extension to use bem_html and css_dead_class to add BEM class tags to HTML objects that have attributes (bem-block, bem-element, bem-modifiers).}
+  # s.description = %q{A longer description of your extension}
+
+  s.files         = `git ls-files`.split("\n")
+  s.test_files    = `git ls-files -- {test,spec,features}/*`.split("\n")
+  s.executables   = `git ls-files -- bin/*`.split("\n").map{ |f| File.basename(f) }
+  s.require_paths = ["lib"]
+  
+  # The version of middleman-core your extension depends on
+  s.add_runtime_dependency("middleman-core", ["~> 4"])
+  s.add_runtime_dependency("bem_html", ["~> 1"])
+  s.add_runtime_dependency("css_dead_class", ["~> 1"])
+  
+  s.license = "ISC"
+  
+  # Additional dependencies
+  # s.add_runtime_dependency("gem-name", "gem-version")
+end

metadata

@@ -0,0 +1,95 @@
+--- !ruby/object:Gem::Specification
+name: middleman-bem-html
+version: !ruby/object:Gem::Version
+  version: 1.0.1
+platform: ruby
+authors:
+- Andrew Pilsch
+autorequire: 
+bindir: bin
+cert_chain: []
+date: 2016-07-02 00:00:00.000000000 Z
+dependencies:
+- !ruby/object:Gem::Dependency
+  name: middleman-core
+  requirement: !ruby/object:Gem::Requirement
+    requirements:
+    - - "~>"
+      - !ruby/object:Gem::Version
+        version: '4'
+  type: :runtime
+  prerelease: false
+  version_requirements: !ruby/object:Gem::Requirement
+    requirements:
+    - - "~>"
+      - !ruby/object:Gem::Version
+        version: '4'
+- !ruby/object:Gem::Dependency
+  name: bem_html
+  requirement: !ruby/object:Gem::Requirement
+    requirements:
+    - - "~>"
+      - !ruby/object:Gem::Version
+        version: '1'
+  type: :runtime
+  prerelease: false
+  version_requirements: !ruby/object:Gem::Requirement
+    requirements:
+    - - "~>"
+      - !ruby/object:Gem::Version
+        version: '1'
+- !ruby/object:Gem::Dependency
+  name: css_dead_class
+  requirement: !ruby/object:Gem::Requirement
+    requirements:
+    - - "~>"
+      - !ruby/object:Gem::Version
+        version: '1'
+  type: :runtime
+  prerelease: false
+  version_requirements: !ruby/object:Gem::Requirement
+    requirements:
+    - - "~>"
+      - !ruby/object:Gem::Version
+        version: '1'
+description: 
+email:
+- apilsch@tamu.edu
+executables: []
+extensions: []
+extra_rdoc_files: []
+files:
+- ".gitignore"
+- Gemfile
+- Rakefile
+- Readme.md
+- features/support/env.rb
+- lib/middleman-bem-html.rb
+- middleman-bem-html.gemspec
+homepage: http://github.com/oncomouse/middleman-bem-html
+licenses:
+- ISC
+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: Middleman extension to use bem_html and css_dead_class to add BEM class tags
+  to HTML objects that have attributes (bem-block, bem-element, bem-modifiers).
+test_files:
+- features/support/env.rb