RubyGems - pinball_wizard - Versions diffs - 0.0.1.pre → 0.3.0 - Mend

pinball_wizard 0.0.1.pre → 0.3.0

Files changed (36) hide show

checksums.yaml +5 -13
data/.gitignore +9 -0
data/CHANGELOG.md +6 -0
data/Gemfile +8 -0
data/Gemfile.lock +32 -0
data/LICENSE +21 -0
data/README.md +336 -0
data/Rakefile +4 -0
data/bower.json +14 -0
data/dist/css_tagger.js +42 -0
data/dist/css_tagger.min.js +3 -0
data/dist/pinball_wizard.js +227 -0
data/gulpfile.js +40 -0
data/karma.conf.js +66 -0
data/lib/pinball_wizard.rb +5 -0
data/lib/pinball_wizard/configuration.rb +17 -0
data/lib/pinball_wizard/dsl.rb +38 -0
data/lib/pinball_wizard/feature.rb +52 -0
data/lib/pinball_wizard/helpers/hash.rb +26 -0
data/lib/pinball_wizard/null_feature.rb +7 -0
data/lib/pinball_wizard/railtie.rb +9 -0
data/lib/pinball_wizard/registry.rb +44 -0
data/lib/pinball_wizard/version.rb +3 -0
data/lib/pinball_wizard/view_helpers/rails.rb +13 -0
data/lib/pinball_wizard/view_helpers/sinatra/slim.rb +15 -0
data/package.json +45 -0
data/pinball_wizard.gemspec +20 -0
data/spec/pinball_wizard/dsl_spec.rb +73 -0
data/spec/pinball_wizard/feature_spec.rb +89 -0
data/spec/pinball_wizard/registry_spec.rb +56 -0
data/src/css_tagger.coffee +44 -0
data/src/pinball_wizard.coffee +157 -0
data/test/spec/css_tagger_spec.coffee +50 -0
data/test/spec/pinball_wizard_spec.coffee +268 -0
data/test/test-main.coffee +25 -0
metadata +47 -10

data/src/css_tagger.coffee ADDED Viewed

@@ -0,0 +1,44 @@
+define ->
+  # Add .use-{feature-name} to <html> right away to prevent flickering.
+  # Works with ?pinball=feature_name and activated via optimizely.
+  # NOTE: underscores are converted to -. e.g. my_feature -> use-my-feature
+  # This component is designed to be minified and put in an inline <script> in
+  # the document <head>. Above CSS (so that it runs right away).
+  # Usage
+  # <script type="text/javascript">
+  #  (
+  #    function (...) { # minified script }
+  #  )(document.documentElement, window.pinball, , window.location.search)
+  # </script>
+  (ele, pinballQueue, searchQuery) ->
+    classNames = []
+    add = (name) ->
+      classNames.push 'use-' + name.split('_').join('-')
+    for entry in pinballQueue
+      continue unless entry.length
+      switch entry[0]
+        when 'activate'
+          add entry[1]
+        when 'add'
+          for feature, state of entry[1]
+            add feature if state == 'active'
+    matches = searchQuery.match(/pinball=([a-z-_,]+)/i)
+    if matches && matches.length > 1
+      featureNames = (matches[1] + '').split(',')
+      for feature in featureNames
+        add feature
+    ele.className += ' ' + classNames.join(' ') if ele
+    return

data/src/pinball_wizard.coffee ADDED Viewed

@@ -0,0 +1,157 @@
+'use strict'
+define ->
+  features = {}
+  subscribers = {}
+  showLog = false
+  logPrefix = '[PinballWizard]'
+  _log = (message, args...) ->
+    if showLog && window.console && window.console.log
+      console.log("#{logPrefix} #{message}", args...)
+    return
+  _notifySubscribersOnActivate = (name) ->
+    subscribers[name] ?= []
+    for subscriber in subscribers[name]
+      _notifySubscriberOnActivate(subscriber, name)
+  _notifySubscriberOnActivate = (subscriber, name) ->
+    _log 'Notify subscriber that %s is active', name
+    subscriber.onActivate()
+  _notifySubscribersOnDeactivate = (name) ->
+    subscribers[name] ?= []
+    for subscriber in subscribers[name]
+      subscriber.onDeactivate()
+  # Support ?pinball=name1,name2,debug
+  _urlValueMatches = (value) ->
+    for v in _urlValues()
+      return true if value == v
+    false
+  _urlValues = (search = window.location.search) ->
+    pairs = search.substr(1).split('&')
+    for pair in pairs
+      [key, value] = pair.split('=')
+      if key == 'pinball' and value?
+        return value.split(',')
+    []
+  urlValues = _urlValues() # Memoize
+  cssClassName = (name, prefix = 'use-') ->
+    prefix + name.split('_').join('-')
+  addCSSClassName = (name, ele = document.documentElement) ->
+    cN = cssClassName(name)
+    if ele.className.indexOf(cN) < 0
+      ele.className += ' ' + cN
+  removeCSSClassName = (name, ele = document.documentElement) ->
+    cN = cssClassName(name)
+    if ele.className.indexOf(cN) >= 0
+      ele.className = ele.className.replace cN, ''
+  add = (list) ->
+    for name, state of list
+      features[name] = state
+      _log "Added %s: %s.", name, state
+      if isActive(name)
+        activate(name, "automatic. added as '#{state}'")
+      else if _urlValueMatches(name, urlValues)
+        activate(name, 'URL')
+  get = (name) ->
+    features[name]
+  update = (name, state) ->
+    features[name] = state
+  activate = (name, sourceName = null) ->
+    state = get(name)
+    source = if sourceName? then " (source: #{sourceName})" else ''
+    switch state
+      when undefined
+        _log "Attempted to activate %s, but it was not found%s.", name, source
+      when 'inactive'
+        _log "Activate %s%s.", name, source
+        update(name, 'active')
+        addCSSClassName(name)
+        _notifySubscribersOnActivate(name)
+      when 'active'
+        _log "Attempted to activate %s, but it is already active%s.", name, source
+      else
+        _log "Attempted to activate %s, but it is %s%s.", name, state, source
+  deactivate = (name, source = null) ->
+    state = get(name)
+    source = if sourceName? then " (source: #{sourceName})" else ''
+    switch state
+      when undefined
+        _log "Attempted to deactivate %s, but it was not found%s.", name, source
+      when 'active'
+        _log "Dectivate %s%s.", name, source
+        update(name, 'inactive')
+        removeCSSClassName(name)
+        _notifySubscribersOnDeactivate(name)
+      else
+        _log "Attempted to deactivate %s, but it is %s%s.", name, state, source
+  isActive = (name) ->
+    get(name) == 'active'
+  _buildSubscriber = (onActivate, onDeactivate) ->
+    onActivate:   if onActivate?   then onActivate else ->
+    onDeactivate: if onDeactivate? then onDeactivate else ->
+  # If the feature is already active, the callback is invoked immediately.
+  subscribe = (name, onActivate, onDeactivate) ->
+    _log 'Added subscriber to %s', name
+    subscriber = _buildSubscriber(onActivate, onDeactivate)
+    subscribers[name] ?= []
+    subscribers[name].push(subscriber)
+    _notifySubscriberOnActivate(subscriber, name) if isActive(name)
+  push = (params) ->
+    method = params.shift()
+    @[method].apply(@, params)
+  state = ->
+    features
+  reset = ->
+    features = {}
+  debug = ->
+    showLog = true
+  # Exports
+  exports = {
+    add
+    get
+    activate
+    deactivate
+    isActive
+    subscribe
+    push
+    state
+    reset
+    debug
+    cssClassName
+    addCSSClassName
+    removeCSSClassName
+    _urlValues
+  }
+  # Initialize
+  if window?.pinball
+    debug() if _urlValueMatches('debug')
+    while window.pinball.length
+      exports.push window.pinball.shift()
+    window.pinball = exports
+  exports

data/test/spec/css_tagger_spec.coffee ADDED Viewed

@@ -0,0 +1,50 @@
+define ['css_tagger'], (tagger) ->
+  describe 'css_tagger', ->
+    it 'should add classes from the pinball async function queue', ->
+      ele = document.createElement 'div'
+      pinballQueue = [
+        ['activate','my_feature']
+      ]
+      tagger ele, pinballQueue, ''
+      expect(ele.className).toEqual ' use-my-feature'
+    it 'should add classes from query params', ->
+      ele = document.createElement 'div'
+      tagger ele, [], '?pinball=feature_a,feature_b&other=param'
+      expect(ele.className).toEqual ' use-feature-a use-feature-b'
+    it 'should not interfere with existing class names', ->
+      ele = document.createElement 'div'
+      ele.className = 'foo-bar'
+      tagger ele, [], '?pinball=feature_a,feature_b&other=param'
+      expect(ele.className).toEqual 'foo-bar use-feature-a use-feature-b'
+    it 'should add classes from added pinball features', ->
+      ele = document.createElement 'div'
+      pinballQueue = [
+        [
+          'add'
+          feature_a: 'active'
+          feature_b: 'inactive'
+          feature_c: 'active'
+        ]
+      ]
+      tagger ele, pinballQueue, ''
+      expect(ele.className).toEqual ' use-feature-a use-feature-c'
+    it 'should add classes from queue and query params', ->
+      ele = document.createElement 'div'
+      pinballQueue = [
+        [
+          'add'
+          feature_a: 'active'
+        ],
+        ['activate', 'feature_b'],
+        ['something-odd']
+      ]
+      tagger ele, pinballQueue, '?pinball=feature_c'
+      expect(ele.className).toEqual ' use-feature-a use-feature-b use-feature-c'

data/test/spec/pinball_wizard_spec.coffee ADDED Viewed

@@ -0,0 +1,268 @@
+define ['pinball_wizard'], (pinball) ->
+  beforeEach ->
+    pinball.reset()
+  describe 'initialize', ->
+    it 'is defined', ->
+      expect(pinball).toBeDefined()
+  describe '#reset', ->
+    it 'removes all features', ->
+      pinball.add
+        a: 'active'
+      pinball.reset()
+      expect(pinball.state()).toEqual({})
+  describe '#add', ->
+    it 'activates if active', ->
+      pinball.add
+        a: 'active'
+      expect(pinball.isActive('a')).toEqual(true)
+    it 'does not activate if inactive', ->
+      pinball.add
+        a: 'inactive'
+      expect(pinball.isActive('a')).toEqual(false)
+    it 'does not activate if disabled', ->
+      pinball.add
+        a: 'disabled: reason'
+      expect(pinball.isActive('a')).toEqual(false)
+    describe 'with a ?pinball=feature,feature url param', ->
+      originalPathname = null
+      beforeEach ->
+        originalPathname = window.location.pathname
+      afterEach ->
+        window.history.replaceState(null, null, originalPathname)
+      it 'is not active when mismatched', ->
+        urlParam = '?pinball=foo,bar'
+        window.history.replaceState(null, null, window.location.pathname + urlParam)
+        pinball.add
+          a: 'inactive'
+          b: 'inactive'
+        expect(pinball.isActive('a')).toEqual(false)
+        expect(pinball.isActive('b')).toEqual(false)
+      it 'is active when matching', ->
+        urlParam = '?pinball=a,b'
+        # Mock a different url
+        window.history.replaceState(null, null, window.location.pathname + urlParam)
+        pinball.add
+          a: 'inactive'
+          b: 'inactive'
+        expect(pinball.isActive('a')).toEqual(true)
+        expect(pinball.isActive('b')).toEqual(true)
+  describe '#state', ->
+    it 'displays a list based on state', ->
+      pinball.add
+        a: 'active'
+        b: 'inactive'
+        c: 'disabled: reason'
+      expect(pinball.state()).toEqual({
+        a: 'active'
+        b: 'inactive'
+        c: 'disabled: reason'
+      })
+  describe '#activate', ->
+    it 'makes an inactive feature active', ->
+      pinball.add
+        a: 'inactive'
+      pinball.activate 'a'
+      expect(pinball.get('a')).toEqual('active')
+    it 'does not make a disabled feature active', ->
+      pinball.add
+        a: 'disabled'
+      pinball.activate 'a'
+      expect(pinball.get('a')).toEqual('disabled')
+  describe '#deactivate', ->
+    it 'makes an active feature inactive', ->
+      pinball.add
+        a: 'active'
+      pinball.deactivate 'a'
+      expect(pinball.get('a')).toEqual('inactive')
+  describe '#isActive', ->
+    beforeEach ->
+      pinball.add
+        a: 'inactive'
+    it 'is true after activating', ->
+      pinball.activate 'a'
+      expect(pinball.isActive('a')).toEqual(true)
+  describe '#subscribe', ->
+    callback = null
+    beforeEach ->
+      callback = jasmine.createSpy('callback')
+    describe 'when the activate callback should be called', ->
+      it 'calls after activating', ->
+        pinball.add
+          a: 'inactive'
+        pinball.subscribe 'a', callback
+        pinball.activate 'a'
+        expect(callback).toHaveBeenCalled()
+      it 'calls it once on multiple activations', ->
+        pinball.add
+          a: 'inactive'
+        pinball.subscribe 'a', callback
+        pinball.activate 'a'
+        pinball.activate 'a'
+        pinball.activate 'a'
+        expect(callback.calls.count()).toEqual(1)
+      it 'calls it twice when toggling activations', ->
+        pinball.add
+          a: 'inactive'
+        pinball.subscribe 'a', callback
+        pinball.activate 'a'
+        pinball.deactivate 'a'
+        pinball.activate 'a'
+        expect(callback.calls.count()).toEqual(2)
+      it 'calls when subscribing then adding and then activating a feature', ->
+        pinball.subscribe 'a', callback
+        pinball.add
+          a: 'inactive'
+        pinball.activate 'a'
+        expect(callback).toHaveBeenCalled()
+      it 'calls when subscribing to an already active feature', ->
+        pinball.add
+          a: 'active'
+        pinball.subscribe 'a', callback
+        expect(callback).toHaveBeenCalled()
+    describe 'when the activate callback should not be called', ->
+      it 'does not call when the feature is missing', ->
+        pinball.subscribe 'a', callback
+        pinball.activate 'a'
+        expect(callback).not.toHaveBeenCalled()
+      it 'does not call when the feature is disabled', ->
+        pinball.add
+          a: 'disabled: reason'
+        pinball.subscribe 'a', callback
+        pinball.activate 'a'
+        expect(callback).not.toHaveBeenCalled()
+    describe 'when the deactivate callback should be called', ->
+      it 'calls after deactivate', ->
+        pinball.add
+          a: 'inactive'
+        pinball.subscribe 'a', null, callback
+        pinball.activate 'a'
+        pinball.deactivate 'a'
+        expect(callback).toHaveBeenCalled()
+      it 'calls it once on multiple deactivations', ->
+        pinball.add
+          a: 'inactive'
+        pinball.subscribe 'a', null, callback
+        pinball.activate 'a'
+        pinball.deactivate 'a'
+        pinball.deactivate 'a'
+        expect(callback.calls.count()).toEqual(1)
+      it 'calls it twice when toggling deactivations', ->
+        pinball.add
+          a: 'inactive'
+        pinball.subscribe 'a', null, callback
+        pinball.activate 'a'
+        pinball.deactivate 'a'
+        pinball.activate 'a'
+        pinball.deactivate 'a'
+        expect(callback.calls.count()).toEqual(2)
+      it 'calls when subscribing, adding adding an active then deactivating', ->
+        pinball.subscribe 'a', null, callback
+        pinball.add
+          a: 'active'
+        pinball.deactivate 'a'
+        expect(callback).toHaveBeenCalled()
+      it 'calls when subscribing then adding and then deactivating a feature', ->
+        pinball.subscribe 'a', null, callback
+        pinball.add
+          a: 'inactive'
+        pinball.activate 'a'
+        pinball.deactivate 'a'
+        expect(callback).toHaveBeenCalled()
+    describe 'when the deactivate callback should not be called', ->
+       it 'does not call when subscribing then adding an active feature', ->
+        pinball.subscribe 'a', null, callback
+        pinball.add
+          a: 'active'
+        expect(callback).not.toHaveBeenCalled()
+      it 'does not call when the feature is missing', ->
+        pinball.subscribe 'a', null, callback
+        pinball.activate 'a'
+        pinball.deactivate 'a'
+        expect(callback).not.toHaveBeenCalled()
+      it 'does not call when the feature is disabled', ->
+        pinball.add
+          a: 'disabled'
+        pinball.subscribe 'a', null, callback
+        pinball.activate 'a'
+        pinball.deactivate 'a'
+        expect(callback).not.toHaveBeenCalled()
+  describe '#push', ->
+    it 'calls the function with the first entry and the args for the rest', ->
+      spyOn(pinball, 'activate')
+      pinball.push ['activate','my-feature']
+      expect(pinball.activate).toHaveBeenCalledWith('my-feature')
+  describe '#cssClassName', ->
+    it 'builds the name with the prefix', ->
+      expect(pinball.cssClassName('my_feature')).toEqual 'use-my-feature'
+  describe '#addCSSClassName', ->
+    it 'appends', ->
+      ele = document.createElement 'div'
+      pinball.addCSSClassName('my_feature', ele)
+      expect(ele.className).toEqual ' use-my-feature'
+    it 'does not append twice', ->
+      ele = document.createElement 'div'
+      pinball.addCSSClassName('my_feature', ele)
+      pinball.addCSSClassName('my_feature', ele)
+      expect(ele.className).toEqual ' use-my-feature'
+  describe '#removeCSSClassName', ->
+    it 'removes it', ->
+      ele = document.createElement 'div'
+      pinball.addCSSClassName('my_feature', ele)
+      pinball.removeCSSClassName('my_feature', ele)
+      expect(ele.className).toEqual ''
+  describe '#_urlValues', ->
+    it 'pulls out the parts', ->
+      urlParam = '?pinball=a,b'
+      expect(pinball._urlValues(urlParam)).toEqual(['a','b'])
+    it 'is empty for blank values', ->
+      urlParam = '?pinball'
+      expect(pinball._urlValues(urlParam)).toEqual([])
+    it 'works with other keys/values', ->
+      urlParam = '?foo=bar&pinball=a,b&bar'
+      expect(pinball._urlValues(urlParam)).toEqual(['a','b'])