sublime_video_layout 2.7.0

data/app/assets/javascripts/media/preloader.js.coffee

@@ -0,0 +1,30 @@
+class SublimeVideo.Media.Preloader
+  constructor: (@src, @callback, @options = {}) ->
+    @problem = false
+    this.preload()
+
+class SublimeVideo.Media.ImagePreloader extends SublimeVideo.Media.Preloader
+  preload: ->
+    @image = new Image()
+
+    @image['onload']  = this.didComplete
+    @image['onerror'] = this.didFail
+    @image['onabort'] = this.didAbort
+    @image['src']     = @src
+
+  didFail: =>
+    @problem = true
+    this.didComplete()
+
+  didAbort: =>
+    @problem = true
+    this.didComplete()
+
+  didComplete: =>
+    @options['width']  = @image['width']
+    @options['height'] = @image['height']
+    @callback(@problem, @src, @options)
+
+class SublimeVideo.Media.VideoPreloader extends SublimeVideo.Media.Preloader
+  preload: ->
+    SublimeVideoSizeChecker.getVideoSize(@src, @callback)

data/app/assets/javascripts/misc/browser_bugs_fixer.js.coffee

@@ -0,0 +1,12 @@
+class SublimeVideo.Misc.BrowserBugsFixer
+  @fixAllBugs: ->
+    # ## Fix a <select> CSS bug in Safari (under v4.0.5)
+    # Safari 5.0 has webkit version 533
+    # Safari 4.0.5 is the last version pre-5.0
+    # NOTE: Safari 4.0.4 and 4.0.5 have the same webkit version number (531)
+    webkitVersionNumber   = navigator.userAgent.match(/AppleWebKit\/([0-9]+)./)
+    isSafari405OrPrevious = navigator.userAgent.indexOf("Macintosh") > -1 and webkitVersionNumber and parseInt(webkitVersionNumber[1],10) <= 531;
+
+    if isSafari405OrPrevious
+      $('select').each ->
+        $(this).css('font-family': 'Lucida Grande, Arial, sans-serif', 'font-size': '15px')

data/app/assets/javascripts/misc/cookie.js.coffee

@@ -0,0 +1,42 @@
+class SublimeVideo.Misc.Cookie
+  constructor: (@name) ->
+
+  # It retrieve the value of the cookie with the `@name` key.
+  #
+  # @return [String] the cookie value or `null` if no cookie with this name exists
+  #
+  get: ->
+    escapedName = this._escapedAndAssignName()
+    if document.cookie.indexOf(escapedName) >= 0
+      cookies = document.cookie.split(/\s*;\s*/)
+      for cookie in cookies
+        if cookie.indexOf(escapedName) is 0
+          return unescape(cookie.substring(escapedName.length, cookie.length))
+
+    null
+
+  # It stores the given `value` at the `@name` key, given `options`.
+  #
+  # @param [String] value the value of the cookie to store
+  # @param [Object] options cookie options
+  # @option options [Date] expires the date when the cookie will expire
+  # @option options [String] path the path for which the cookie is available
+  # @option options [String] domain the domain for which the cookie is available
+  # @option options [Boolean] secure wether the cookie is accessible only through HTTPS
+  #
+  # @return [String] the cookie value
+  #
+  set: (value, options = {}) ->
+    newcookie = [this._escapedAndAssignName() + escape(value)]
+    if options
+      if options.expires then newcookie.push "expires=" + options.expires.toGMTString()
+      if options.path    then newcookie.push "path=#{options.path}"
+      if options.domain  then newcookie.push "domain=#{options.domain}"
+      if options.secure  then newcookie.push "secure"
+    document.cookie = newcookie.join '; '
+
+  #
+  # @private
+  #
+  _escapedAndAssignName: ->
+    escape(@name) + '='

data/app/assets/javascripts/misc/utils.js.coffee

@@ -0,0 +1,17 @@
+SublimeVideo.Misc.Utils =
+  topDomainHost: ->
+    document.location.host.split('.').slice(-2).join('.')
+
+  docsUrl: (path, stage = 'stable') ->
+    stage = if stage is 'stable'
+      ''
+    else
+      "/#{stage}"
+
+    "http://docs.#{SublimeVideo.Misc.Utils.topDomainHost()}#{stage}/#{path}"
+
+  iOS: ->
+    /i(p[oa]d|phone)/i.test(navigator.userAgent)
+
+  capitalize: (str) ->
+    str.replace(/^\w/, ($0) -> $0.toUpperCase())

data/app/assets/javascripts/sublimevideo.js.coffee

@@ -0,0 +1,66 @@
+#= require modernizr
+#= require jquery_ujs
+#
+#= require_self
+#= require_tree ./form
+#= require_tree ./media
+#= require_tree ./misc
+#= require_tree ./ui
+
+window.SublimeVideo =
+  Form: {}
+  Media: {}
+  Misc: {}
+  UI: {}
+
+$.fn.exists = -> @length > 0
+
+SublimeVideo.UI.prepareRemoteLinks = ->
+  $('a.remote').each ->
+    new SublimeVideo.UI.RemoteLink($(this))
+
+SublimeVideo.UI.prepareStickyMenus = ->
+  $('ul.sticky').each ->
+    new SublimeVideo.UI.Menu($(this)).setupStickyItems()
+
+SublimeVideo.UI.updateActiveItemMenus = ->
+  $('ul.sticky').each ->
+    new SublimeVideo.UI.Menu($(this)).updateActiveItem()
+
+SublimeVideo.UI.prepareSignupAndLoginPopup = ->
+  $.each ['signup', 'login'], (index, action) ->
+    $("##{action}_button").on 'click', (event) ->
+      event.preventDefault()
+      SublimeVideo.UI.Utils.openAccountPopup(action)
+
+SublimeVideo.documentReady = ->
+  SublimeVideo.Misc.BrowserBugsFixer.fixAllBugs()
+
+  # Only one popup can be opened-up at a time
+  SublimeVideo.UI.popup = null
+
+  if matches = document.location.search.match(/p=(login|signup)/)
+    SublimeVideo.UI.Utils.openAccountPopup(matches[1])
+
+  SublimeVideo.UI.prepareSignupAndLoginPopup()
+
+  $('input.show_password[type=password]').each (index, input) ->
+    new SublimeVideo.Form.ShowPassword($(this), index)
+
+  unless Modernizr.input.placeholder
+    $('input[placeholder]').each ->
+      new SublimeVideo.Form.PseudoPlaceholder($(this))
+    $('textarea[placeholder]').each ->
+      new SublimeVideo.Form.PseudoPlaceholder($(this))
+
+  $('form').each ->
+    new SublimeVideo.Form.SubmitManager($(this))
+
+  SublimeVideo.UI.prepareStickyMenus()
+
+  SublimeVideo.UI.prepareRemoteLinks()
+
+  new SublimeVideo.UI.Menu($('#header_menu')).setupLoggedInBehavior()
+
+$(document).ready ->
+  SublimeVideo.documentReady()

data/app/assets/javascripts/ui/link.js.coffee

@@ -0,0 +1,24 @@
+# The RemoteLink add a sticky behavior, shows a table spinner and push new state.
+#
+class SublimeVideo.UI.RemoteLink
+  #
+  # @param [DOM Element] element the element to which attach the behavior
+  #
+  constructor: (element) ->
+    @element = $(element)
+    this.setupObserver()
+
+  setupObserver: ->
+    @element.on 'click', =>
+      this.stickyBehavior()
+      SublimeVideo.UI.Table.showSpinner()
+
+      if history and history.pushState?
+        history.pushState({ isHistory: true }, document.title, @element.attr('href'))
+
+  # @private
+  #
+  stickyBehavior: ->
+    @element.parent().find('a.active').each ->
+      $(this).removeClass('active')
+    @element.addClass('active')

data/app/assets/javascripts/ui/menu.js.coffee

@@ -0,0 +1,36 @@
+# The Flash create a new flash notice element and prepend it to the `#content` element.
+#
+class SublimeVideo.UI.Menu
+  #
+  # @param [jQuery Element] element the menu (ul) element
+  #
+  constructor: (@element) ->
+
+  setupStickyItems: ->
+    @element.find('a').each (index, el) =>
+      $el = $(el)
+      unless $el.hasClass('no_sticky')
+        $el.on('click', this.stickyBehavior)
+
+  updateActiveItem: ->
+    @element.find('.active').removeClass('active')
+    @element.find('li').each (index, el) =>
+      $li = $(el)
+      if $li.find('a').first().attr('href') is location.href
+        $li.addClass 'active'
+
+  # @private
+  #
+  stickyBehavior: (event) =>
+    @element.find('.active').removeClass('active')
+    $link = $(event.delegateTarget)
+    if $li = $link.parent('li')
+      $li.addClass('active')
+    else
+      $link.addClass('active')
+
+  setupLoggedInBehavior: ->
+    @cookie = new SublimeVideo.Misc.Cookie('l')
+    if @cookie.get() is '1'
+      @element.find('.unlogged').hide()
+      @element.find('.logged').show()

data/app/assets/javascripts/ui/popup.js.coffee

@@ -0,0 +1,121 @@
+# The SimplePopup simply add observers behaviors on a given `element` object.
+#
+class SublimeVideo.UI.SimplePopup
+  #
+  # @param [Object] options a set of options to customize the popup
+  # @option options [jQuery Element] element the element that represents the popup
+  #
+  constructor: (@options = {}) ->
+    @element = @options.element
+
+  startObservers: ->
+    $(document).on('keydown', { popup: this }, this.keyDown)
+    @element.on('click', { popup: this }, this.click)
+
+  stopObservers: ->
+    $(document).off('keydown', this.keyDown)
+    @element.off('click', this.click) if @element?
+
+  pauseVideos: ->
+    sublime_api = if sublime?
+      sublime
+    else
+      sublimevideo
+
+    sublime_api.ready ->
+      sublimevideo.pause() if SublimeVideo.Misc.Utils.iOS()
+
+  # It closes the popup if it's open, stop the current video playing with SublimeVideo on iOS,
+  # shows the popup (simply shows `@element`) and starts the observers that take care of the popup closing.
+  #
+  open: ->
+    this.close()
+
+    this.pauseVideos()
+
+    @element.show()
+    this.startObservers()
+
+  # Hides the popup (simply show `@element`) and stops the observers that take care of the popup closing.
+  #
+  close: ->
+    this.stopObservers()
+    @element.hide()
+
+  # @private
+  #
+  keyDown: (event) ->
+    switch event.which
+      when 27 then event.data.popup.close() # ESC
+
+  # @private
+  #
+  click: (event) ->
+    if event.target is event.data.popup.element[0]
+      event.data.popup.close()
+
+#
+# Handles creation and behavior of SV pop-up (used for showing the embed code and the usage, asking the password..)
+#
+class SublimeVideo.UI.Popup extends SublimeVideo.UI.SimplePopup
+  #
+  # @param [Object] options a set of options to customize the popup. Default: `{ class: 'popup' }`
+  # @option options [String] id the id of the popup (note that this id is also used as a class for
+  #   the "content" div inside the popup element)
+  # @option options [String] class the class to apply to the popup
+  # @option options [jQuery Element] form the form from which originated the popup opening
+  # @option options [jQuery Element] anchor the anchor element in which re-add popup content after closing
+  # @option options [jQuery Element] url an url to GET in AJAX (not that the AJAX response must take care
+  # @option options [jQuery Element] content the content to put in the popup
+  #   of populating the popup if needed)
+  #
+  constructor: (@options = { class: 'popup' }) ->
+    @element = null
+
+  setContent: (content) ->
+    @element.removeClass('loading')
+    @element.find('.content').html(content)
+
+  # Create the popup (if needed), append it to the `#content` div (if needed) and show it.
+  # It also starts the observers that take care of the popup closing.
+  #
+  open: ->
+    this.close()
+
+    this.pauseVideos()
+
+    unless @element?
+      @element = $('<div>', id: "#{@options.id or ''}", class: "#{@options.class or ''} loading")
+      @element.html("<div class='popup_wrap'>
+                       <div class='lights'>
+                         <div class='content'></div>
+                       </div>
+                       <a href='' onclick='return SublimeVideo.UI.Utils.closePopup()' data-no-turbolink class='close'><span>Close</span></a>
+                     </div>")
+      if @options.content
+        this.setContent(@options.content)
+      else if @options.anchor
+        this.setContent(@options.anchor.html())
+        @options.anchor.html('')
+      $('#content').append(@element)
+
+    if @options.url?
+      # the called method will take care of replacing the wrap div with the response content
+      new Ajax.Request(@options.url, method: 'get')
+
+    this.startObservers()
+
+  # Stops the observers, move the popup content back to its `anchor` (if applicable)
+  # and re-enable `@options.form` buttons.
+  #
+  close: ->
+    this.stopObservers()
+
+    if @element
+      if @options.anchor?
+        @options.anchor.html(@element.find('.content').html())
+      @element.remove()
+
+    if @options.form?
+      @options.form.find('input[type=submit]', 'button').each ->
+        $(this).prop('disabled', false)

data/app/assets/javascripts/ui/table.js.coffee

@@ -0,0 +1,8 @@
+# The Flash create a new flash notice element and prepend it to the `#content` element.
+#
+SublimeVideo.UI.Table =
+  # Shows a spinner
+  #
+  showSpinner: ->
+    if ($tableSpinner = $('#table_spinner')).exists()
+      $tableSpinner.show()

data/app/assets/javascripts/ui/utils.js.coffee

@@ -0,0 +1,41 @@
+SublimeVideo.UI.Utils =
+  # Opens a new popup and stores its reference in `SublimeVideo.UI.popup`
+  #
+  # @param [Object] options the options accepted by {SublimeVideo.UI.Popup}
+  # @see SublimeVideo.UI.Popup
+  #
+  openPopup: (options) ->
+    SublimeVideo.UI.popup = new SublimeVideo.UI.Popup(options)
+    SublimeVideo.UI.popup.open()
+
+  # Closes the currently opened `SublimeVideo.UI.popup`
+  #
+  closePopup: ->
+    unless SublimeVideo.UI.popup?
+      SublimeVideo.UI.popup = new SublimeVideo.UI.Popup()
+    SublimeVideo.UI.popup.close()
+
+    false
+
+  # Opens a new login or signup popup and stores its reference in `SublimeVideo.UI.popup`
+  #
+  # @param [String] type the type of popup ('login' or 'signup')
+  # @param [String] successUrl the URL to which redirect the user once login/signup succeeds (default: null)
+  # @see SublimeVideo.UI.Popup
+  #
+  openAccountPopup: (type, successUrl = null) ->
+    if ($el = $("#popup_#{type}")).exists()
+      SublimeVideo.UI.popup = new SublimeVideo.UI.SimplePopup(element: $el)
+
+      if successUrl?
+        $("#user_return_to").val(successUrl)
+
+      SublimeVideo.UI.popup.open()
+
+      if SublimeVideo.Misc.Utils.iOS()
+        $("#popup_#{type}").find("#user_email").focus()
+
+      if _gaq? and type is 'signup'
+        _gaq.push(['_trackEvent', 'SignUp', 'Clicked', undefined, 1, true])
+
+    false

data/app/assets/stylesheets/_css3.scss

@@ -0,0 +1,41 @@
+@mixin transition($type, $time, $ease) {
+  -o-transition:$type $time $ease;
+  -moz-transition:$type $time $ease;
+  -webkit-transition:$type $time $ease;
+  transition:$type $time $ease;
+}
+
+@mixin gradient($from, $to, $middle) {
+  background:$middle;
+  background:-moz-linear-gradient($from, $to);
+  background:-webkit-gradient(linear, 0% 0%, 0% 100%, from($from), to($to));
+  background:-webkit-linear-gradient($from, $to);
+  background:-o-linear-gradient($from, $to);
+}
+
+@mixin box-shadow($value) {
+  -moz-box-shadow:$value;
+  -webkit-box-shadow:$value;
+  box-shadow:$value;
+}
+
+@mixin border-radius($value) {
+  -moz-border-radius:$value;
+  -webkit-border-radius:$value;
+  border-radius:$value;
+}
+
+@mixin mask-image($value) {
+  -webkit-mask-image:url($value);
+  -o-mask-image:url($value);
+  -moz-mask-image:url($value);
+  mask-image:url($value);
+}
+
+@mixin rotate($value) {
+  -webkit-transform:rotate($value);
+  -moz-transform:rotate($value);
+  -o-transform:rotate($value);
+  -ms-transform:rotate($value);
+  transform:rotate($value);
+}