trestle 0.9.9 → 0.10.0.pre2

data/frontend/js/components/form.js

@@ -1,100 +0,0 @@
-/* global history */
-
-import $ from 'jquery'
-
-import { init, triggerInit } from '../core/events'
-import { refreshMainContext } from '../core/contexts'
-
-import { focusActiveTab } from './tabs'
-import { showError } from './dialog'
-
-const FORM_SELECTOR = 'form[data-behavior="trestle-form"]'
-
-// Prevent enter key from submitting the form
-$(document).on('keypress', `${FORM_SELECTOR} :input:not(textarea):not([type=submit])`, function (e) {
-  if (e.keyCode === 13) {
-    e.preventDefault()
-  }
-})
-
-init(function (root) {
-  const $form = $(root).find(FORM_SELECTOR)
-
-  $form
-    .on('ajax:send', function (e) {
-      // Only run when triggered directly on form
-      if (e.target !== this) return
-
-      // Disable submit buttons
-      $(this).find(':submit').prop('disabled', true)
-
-      // Set loading status on button that triggered submission
-      const button = $(this).data('trestle:submitButton')
-      if (button) { $(button).addClass('loading') }
-    })
-    .on('ajax:complete', function (e) {
-      // Only run when triggered directly on form
-      if (e.target !== this) return
-
-      const xhr = e.detail[0]
-
-      // Reset submit buttons
-      $(this).find(':submit').prop('disabled', false).removeClass('loading')
-      $(this).removeData('trestle:submitButton')
-
-      const contentType = (xhr.getResponseHeader('Content-Type') || '').split(';')[0]
-
-      if (contentType === 'text/html') {
-        if (/<html/i.test(xhr.responseText)) {
-          // Response is a full HTML page, likely an error page. Render within an iframe.
-          const $context = $(this).closest('[data-context]')
-          const iframe = $('<iframe>').addClass('error-iframe').get(0)
-          $context.html(iframe)
-
-          iframe.contentWindow.document.documentElement.innerHTML = xhr.responseText
-        } else {
-          // Find the parent context and replace content
-          const $context = $(this).closest('[data-context]')
-          $context.html(xhr.responseText)
-
-          // Initialize replaced elements within the context
-          triggerInit($context)
-
-          // Focus the correct tab
-          focusActiveTab()
-        }
-      } else if (contentType === 'text/plain') {
-        // Assume an error response
-        const title = `${xhr.status} (${xhr.statusText})`
-        showError(title, xhr.responseText)
-      }
-    })
-    .on('ajax:success', function (e) {
-      // Only run when triggered directly on form
-      if (e.target !== this) return
-
-      const xhr = e.detail[2]
-
-      const $context = $(this).closest('[data-context]')
-      let location = xhr.getResponseHeader('X-Trestle-Location')
-
-      if (location) {
-        // Retain current active tab
-        location = location + document.location.hash
-
-        // Update the URL in the browser and context
-        history.replaceState({}, '', location)
-        $context.data('context', location)
-      }
-
-      // Refresh the main context
-      if (!$context.hasClass('app-main')) {
-        refreshMainContext()
-      }
-    })
-
-  $form.find(':submit').click(function () {
-    // Save this as the button that triggered the form
-    $(this).closest('form').data('trestle:submitButton', this)
-  })
-})

data/frontend/js/components/gallery.js

@@ -1,33 +0,0 @@
-import $ from 'jquery'
-
-import { init } from '../core/events'
-
-init(function (root) {
-  $(root).find('[data-behavior~="zoom"]').magnificPopup({
-    type: 'image',
-    closeOnContentClick: false,
-    closeBtnInside: false,
-    mainClass: 'mfp-with-zoom mfp-img-mobile',
-    zoom: {
-      enabled: true,
-      duration: 150
-    }
-  })
-
-  $(root).find('[data-behavior~="gallery"]').each(function () {
-    $(this).magnificPopup({
-      delegate: 'a',
-      type: 'image',
-      closeOnContentClick: false,
-      closeBtnInside: false,
-      mainClass: 'mfp-with-zoom mfp-img-mobile',
-      gallery: {
-        enabled: true
-      },
-      zoom: {
-        enabled: true,
-        duration: 150
-      }
-    })
-  })
-})

data/frontend/js/components/pagination.js

@@ -1,51 +0,0 @@
-/* global history */
-
-import $ from 'jquery'
-
-import { triggerInit } from '../core/events'
-
-const REMOTE_PAGINATION_SELECTOR = '.page-link[data-remote]'
-
-$(document)
-  .on('ajax:send', function (e) {
-    const $context = $(e.target).closest('[data-context]')
-    const $table = $context.find('.table-container')
-    $table.addClass('loading')
-  })
-
-  .on('ajax:complete', function (e) {
-    const $context = $(e.target).closest('[data-context]')
-    const $table = $context.find('.table-container')
-    $table.removeClass('loading')
-  })
-
-  .on('ajax:success', REMOTE_PAGINATION_SELECTOR, function (e) {
-    const $link = $(e.target)
-    const $context = $link.closest('[data-context]')
-
-    // Update table and pagination
-    const $doc = $(e.detail[0])
-
-    const $table = $doc.find('.table-container')
-    $context.find('.table-container').replaceWith($table)
-
-    triggerInit($table)
-
-    const $pagination = $doc.find('.pagination-container')
-    $context.find('.pagination-container').replaceWith($pagination)
-
-    // Update the URL in the browser and context
-    const location = $link.attr('href')
-
-    if (location) {
-      // TODO: Implement URL updating with back button support
-      // if ($context.hasClass('app-main')) {
-      //   history.pushState({}, '', location)
-      // }
-
-      $context.data('context', location)
-    }
-
-    // Scroll to top of table
-    $table[0].scrollIntoView(true)
-  })

data/frontend/js/components/select.js

@@ -1,18 +0,0 @@
-import $ from 'jquery'
-
-import { init } from '../core/events'
-
-// Use Bootstrap theme
-$.fn.select2.defaults.set('theme', 'bootstrap')
-
-// Copy all classes from select tag to replacement select field (.select2-selection)
-$.fn.select2.defaults.set('containerCssClass', ':all:')
-
-// Copy all classes excluding 'form-control'/'form-control-*' from select tag to dropdown container (.select2-dropdown)
-$.fn.select2.defaults.set('dropdownCssClass', function (el) {
-  return el[0].className.replace(/\s*form-control(-\w+)?\s*/g, '')
-})
-
-init(function (root) {
-  $(root).find('select[data-enable-select2]').select2()
-})

data/frontend/js/components/sidebar.js

@@ -1,75 +0,0 @@
-import $ from 'jquery'
-
-import { ready } from '../core/events'
-import cookie from '../core/cookie'
-
-import Navigation from './navigation'
-
-ready(function () {
-  const $body = $('body')
-  const $wrapper = $('.app-wrapper')
-  const $sidebar = $('.app-sidebar')
-
-  // Toggle mobile navigation using menu button
-
-  $sidebar.find('.navbar-toggler').on('click', function (e) {
-    e.preventDefault()
-
-    $wrapper.addClass('animate')
-    $body.toggleClass('mobile-nav-expanded')
-  })
-
-  $wrapper.on('transitionend webkitTransitionEnd', function () {
-    $(this).removeClass('animate')
-  })
-
-  // Interacting outside of the sidebar closes the navigation
-
-  $wrapper.on('click touchstart', function (e) {
-    const navExpanded = $('body').hasClass('mobile-nav-expanded')
-
-    const clickInHeader = $(e.target).closest('.app-header').length
-    const clickInSidebar = $(e.target).closest('.app-sidebar').length
-
-    if (navExpanded && !clickInHeader && !clickInSidebar) {
-      e.stopPropagation()
-      e.preventDefault()
-
-      $wrapper.addClass('animate')
-      $body.removeClass('mobile-nav-expanded')
-    }
-  })
-
-  // Toggle sidebar expand/collapse
-
-  $sidebar.find('.toggle-sidebar').on('click', function (e) {
-    e.preventDefault()
-
-    if ($body.hasClass('sidebar-expanded') || $body.hasClass('sidebar-collapsed')) {
-      $body.removeClass('sidebar-expanded').removeClass('sidebar-collapsed')
-      cookie.delete('trestle:sidebar')
-    } else if ($(document).width() >= 1200) {
-      $body.addClass('sidebar-collapsed')
-      cookie.set('trestle:sidebar', 'collapsed')
-    } else if ($(document).width() >= 768) {
-      $body.addClass('sidebar-expanded')
-      cookie.set('trestle:sidebar', 'expanded')
-    }
-  })
-
-  // Toggle navigation groups
-
-  $sidebar.find('.nav-header a').on('click', function (e) {
-    e.preventDefault()
-
-    const list = $(this).closest('ul')
-    Navigation.toggle(list)
-  })
-
-  // Scroll sidebar to active item
-
-  const $active = $sidebar.find('.active')
-  if ($active.length) {
-    $sidebar.find('.app-sidebar-inner').scrollTop($active.offset().top - 100)
-  }
-})

data/frontend/js/components/table.js

@@ -1,61 +0,0 @@
-import $ from 'jquery'
-
-import visit from '../core/visit'
-
-// Allow clicking on any part of a table row to follow either the table's data-url
-// or the first link within the row (that is not in the actions column).
-$(document).on('click', 'tr[data-url]:not([data-behavior="dialog"])', function (e) {
-  const row = $(e.currentTarget)
-
-  let url
-
-  if (row.data('url') === 'auto') {
-    url = row.find('td:not(.actions) a:first').attr('href')
-  } else {
-    url = row.data('url')
-  }
-
-  if (url) {
-    if (e.metaKey || e.ctrlKey) {
-      window.open(url, '_blank')
-    } else {
-      visit(url)
-    }
-  }
-})
-
-// Ignore the above event handler when clicking directly on a link or input element
-$(document).on('click', 'tr[data-url] a, tr[data-url] input, .select-row', function (e) {
-  e.stopPropagation()
-})
-
-// Handle clicking on select all checkbox in table header
-$(document).on('click', 'th.select-row input', function (e) {
-  const table = $(this).closest('table')
-  const checked = $(this).is(':checked')
-
-  table.find('td.select-row input').prop('checked', checked)
-})
-
-// Handle single row selection to update header row status
-$(document).on('click', 'td.select-row input', function (e) {
-  const table = $(this).closest('table')
-
-  const checkboxes = table.find('td.select-row input')
-  const selectedCheckboxes = checkboxes.filter(':checked')
-
-  const header = table.find('th.select-row input')
-
-  if (checkboxes.length === selectedCheckboxes.length) {
-    // All checked
-    header.prop('indeterminate', false)
-    header.prop('checked', true)
-  } else if (selectedCheckboxes.length === 0) {
-    // None checked
-    header.prop('indeterminate', false)
-    header.prop('checked', false)
-  } else {
-    // Some checked
-    header.prop('indeterminate', true)
-  }
-})

data/frontend/js/components/tabs.js

@@ -1,59 +0,0 @@
-/* global history, location */
-
-import $ from 'jquery'
-
-import { init } from '../core/events'
-
-const TAB_SELECTOR = 'a[data-toggle="tab"]'
-const TAB_PANE_SELECTOR = '.tab-pane'
-const ERROR_SELECTOR = '.has-error'
-
-// Save active tab to URL hash
-init(function (root) {
-  $(root).find(TAB_SELECTOR).on('shown.bs.tab', function (e) {
-    const hash = $(this).attr('href')
-    const withinModal = $(this).closest('.modal').length > 0
-
-    if (hash.substr(0, 1) === '#' && !withinModal) {
-      history.replaceState({ turbolinks: {} }, '', '#!' + hash.substr(1))
-    }
-  })
-})
-
-// Restore active tab when loading
-init(function () {
-  focusActiveTab()
-})
-
-// Add error count to tabs
-init(function (root) {
-  $(root).find(TAB_PANE_SELECTOR).each(function () {
-    const errorCount = $(this).find(ERROR_SELECTOR).length
-
-    if (errorCount > 0) {
-      const badge = $('<span>').addClass('badge badge-danger badge-pill').text(errorCount)
-      const id = $(this).attr('id')
-      const selector = `${TAB_SELECTOR}[href='#${id}']`
-
-      $(selector).append(badge)
-    }
-  })
-})
-
-export function focusTab (id) {
-  const selector = `${TAB_SELECTOR}[href='#${id}']`
-  $(selector).tab('show')
-}
-
-export function focusActiveTab () {
-  if (location.hash.substr(0, 2) === '#!') {
-    // Focus on active tab from URL
-    focusTab(location.hash.substr(2))
-  } else {
-    const $errorTabs = $(`${TAB_PANE_SELECTOR}:has(${ERROR_SELECTOR})`)
-
-    if ($errorTabs.length) {
-      focusTab($errorTabs.first().attr('id'))
-    }
-  }
-}

data/frontend/js/components/tooltips.js

@@ -1,25 +0,0 @@
-import $ from 'jquery'
-
-import { init, ready } from '../core/events'
-
-// Enable general tooltips and popovers
-init(function (root) {
-  $(root).find('[data-toggle="tooltip"]').tooltip()
-  $(root).find('[data-toggle="popover"]').popover()
-})
-
-// Enable navigation tooltips for non-touch devices
-if (!('ontouchstart' in window)) {
-  ready(function () {
-    $(document).tooltip({
-      selector: '.app-nav a',
-      trigger: 'hover',
-      placement: 'right',
-      boundary: 'window',
-      template: '<div class="tooltip nav-tooltip" role="tooltip"><div class="arrow"></div><div class="tooltip-inner"></div></div>',
-      title: function () {
-        return $(this).find('.nav-label').text()
-      }
-    })
-  })
-};

data/frontend/js/core/contexts.js

@@ -1,17 +0,0 @@
-import $ from 'jquery'
-
-import { triggerInit } from './events'
-
-export function refreshContext ($context) {
-  const url = $context.data('context')
-
-  $.get(url, function (data) {
-    $context.html(data)
-    triggerInit($context)
-  })
-}
-
-export function refreshMainContext () {
-  const $context = $('.app-main[data-context]')
-  refreshContext($context)
-}

data/frontend/js/core/turbolinks.js

@@ -1,3 +0,0 @@
-/* global Turbolinks */
-
-export default typeof Turbolinks !== 'undefined' && Turbolinks.supported

data/frontend/js/core/visit.js

@@ -1,16 +0,0 @@
-/* global Turbolinks */
-
-import turbolinks from './turbolinks'
-
-// The visit function is used to direct the user to the given URL. It is provided as an abstraction as the redirection
-// is handled differently depending on whether or not Turbolinks is enabled.
-//
-//     Trestle.visit("/admin/pages");
-//
-export default function (url) {
-  if (turbolinks) {
-    Turbolinks.visit(url)
-  } else {
-    document.location = url
-  }
-}

data/frontend/theme/trestle/_theme.scss

@@ -1,4 +0,0 @@
-// This file is left as an extension point for user configuration.
-//
-// It will be overridden by the similarly named file within
-// the app/assets folder of the Rails application.

data/frontend/theme/trestle/_variables.scss

@@ -1,4 +0,0 @@
-// This file is left as a (deprecated) extension point for user configuration.
-//
-// It will be overridden by the similarly named file within
-// the app/assets folder of the Rails application.

data/frontend/theme/trestle/theme/_defaults.scss

@@ -1,152 +0,0 @@
-// Theme colors to override
-
-$theme-colors: (
-  "primary": #4d6bb2
-) !default;
-
-// Set a specific jump point for requesting color jumps
-$theme-color-interval: 8% !default;
-
-// The yiq lightness value that determines when the lightness of color changes from "dark" to "light". Acceptable values are between 0 and 255.
-$yiq-contrasted-threshold: 175 !default;
-
-// Customize the light and dark text colors for use in our YIQ color contrast function.
-$yiq-text-dark:  #212529 !default;
-$yiq-text-light: #ffffff !default;
-
-
-// Links
-
-$link-color:       theme-color("primary") !default;
-$link-hover-color: darken($link-color, 15%) !default;
-
-// Darken percentage for links with `.text-*` class (e.g. `.text-success`)
-$emphasized-link-hover-darken-percentage: 15% !default;
-
-
-// Components
-
-$component-active-bg: theme-color("primary") !default;
-
-
-// Tables
-
-$table-bg-level:     -11 !default;
-$table-border-level: -7 !default;
-
-
-// Buttons + Forms
-
-$input-btn-focus-width:      .2rem !default;
-$input-btn-focus-color:      rgba($component-active-bg, 0.25) !default;
-$input-btn-focus-box-shadow: 0 0 0 $input-btn-focus-width $input-btn-focus-color !default;
-
-$btn-focus-width:            $input-btn-focus-width !default;
-
-
-// Forms
-
-$input-focus-border-color: lighten($component-active-bg, 25%) !default;
-$input-focus-width:        $input-btn-focus-width !default;
-$input-focus-box-shadow:   $input-btn-focus-box-shadow !default;
-
-$custom-control-indicator-checked-bg:           $component-active-bg !default;
-$custom-control-indicator-checked-disabled-bg:  rgba(theme-color("primary"), 0.5) !default;
-$custom-control-indicator-checked-border-color: $custom-control-indicator-checked-bg !default;
-
-$custom-control-indicator-focus-box-shadow:     $input-focus-box-shadow !default;
-$custom-control-indicator-focus-border-color:   $input-focus-border-color !default;
-
-$custom-control-indicator-active-bg:            lighten($component-active-bg, 35%) !default;
-$custom-control-indicator-active-border-color:  $custom-control-indicator-active-bg !default;
-
-$custom-checkbox-indicator-indeterminate-bg:           $component-active-bg !default;
-$custom-checkbox-indicator-indeterminate-border-color: $custom-checkbox-indicator-indeterminate-bg !default;
-
-$custom-select-focus-border-color: $input-focus-border-color !default;
-$custom-select-focus-width:        $input-focus-width !default;
-$custom-select-focus-box-shadow:   0 0 0 $custom-select-focus-width $input-btn-focus-color !default;
-
-$custom-range-thumb-bg:        $component-active-bg !default;
-$custom-range-thumb-active-bg: lighten($component-active-bg, 35%) !default;
-
-$custom-file-focus-border-color: $input-focus-border-color !default;
-$custom-file-focus-box-shadow:   $input-focus-box-shadow !default;
-
-
-// Navs
-
-$nav-pills-link-active-bg: $component-active-bg !default;
-
-
-// Navbar
-
-$sidebar-mobile-toggle-bg:     transparent !default;
-$sidebar-mobile-toggle-color:  white !default;
-$sidebar-mobile-toggle-border: 1px solid rgba($sidebar-mobile-toggle-color, 0.15) !default;
-
-$sidebar-mobile-toggle-active-bg:     rgba($sidebar-mobile-toggle-color, 0.1) !default;
-$sidebar-mobile-toggle-active-border: $sidebar-mobile-toggle-border !default;
-
-$sidebar-mobile-toggle-icon-bg: str-replace(url("data:image/svg+xml,%3csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3e%3cpath stroke='#{$sidebar-mobile-toggle-color}' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e"), "#", "%23") !default;
-
-
-// Dropdowns
-
-$dropdown-link-active-bg: $component-active-bg !default;
-
-
-// Pagination
-
-$pagination-color:               $link-color !default;
-
-$pagination-focus-box-shadow:    $input-btn-focus-box-shadow !default;
-
-$pagination-hover-color:         $link-hover-color !default;
-
-$pagination-active-bg:           $component-active-bg !default;
-$pagination-active-border-color: $pagination-active-bg !default;
-
-
-// Badges
-
-$badge-focus-width: $input-btn-focus-width !default;
-
-
-// Alerts
-
-$alert-bg-level:     2 !default;
-$alert-border-level: 3 !default;
-$alert-color-level:  -12 !default;
-
-
-// Progress bars
-
-$progress-bar-bg: theme-color("primary") !default;
-
-
-// List group
-
-$list-group-active-bg:           $component-active-bg !default;
-$list-group-active-border-color: $list-group-active-bg !default;
-
-
-// Select2
-
-$s2bs-input-border-focus:            $input-focus-border-color !default;
-$s2bs-form-control-focus-box-shadow: $input-focus-box-shadow !default;
-$s2bs-dropdown-link-active-bg:       $dropdown-link-active-bg !default;
-
-
-// Trestle
-
-$theme-bg:       null !default;
-$theme-bg-color: darken(theme-color("primary"), 15%) !default;
-
-$sidebar-active-border-color: theme-color("primary") !default;
-
-$tag-bg:      lighten(theme-color("primary"), 10%) !default;
-$tag-border:  theme-color("primary") !default;
-
-$tag-hover-bg:     theme-color("primary") !default;
-$tag-hover-border: darken(theme-color("primary"), 10%) !default;

data/frontend/theme/trestle/theme/_functions.scss

@@ -1,44 +0,0 @@
-// Replace `$search` with `$replace` in `$string`
-@function str-replace($string, $search, $replace: "") {
-  $index: str-index($string, $search);
-
-  @if $index {
-    @return str-slice($string, 1, $index - 1) + $replace + str-replace(str-slice($string, $index + str-length($search)), $search, $replace);
-  }
-
-  @return $string;
-}
-
-// Color contrast
-@function color-yiq($color, $dark: $yiq-text-dark, $light: $yiq-text-light) {
-  $r: red($color);
-  $g: green($color);
-  $b: blue($color);
-
-  $yiq: (($r * 299) + ($g * 587) + ($b * 114)) / 1000;
-
-  @if ($yiq >= $yiq-contrasted-threshold) {
-    @return $dark;
-  } @else {
-    @return $light;
-  }
-}
-
-// Retrieve color Sass maps
-@function theme-color($key: "primary") {
-  @return map-get($theme-colors, $key);
-}
-
-// Request a theme color level
-@function theme-color-level($color-name: "primary", $level: 0) {
-  $color: theme-color($color-name);
-  $color-base: if($level > 0, black, white);
-  $level: abs($level);
-
-  @return mix($color-base, $color, $level * $theme-color-interval);
-}
-
-@function gradient-mask($color, $alpha) {
-  $mask: rgba($color, $alpha);
-  @return linear-gradient($mask, $mask);
-}