threddedDANIEL 0.14.5

data/app/assets/javascripts/thredded/components/turboforms.es6

@@ -0,0 +1,25 @@
+//= require thredded/core/on_page_load
+//= require thredded/core/serialize_form
+
+// Submit GET forms with turbolinks
+(() => {
+  const Thredded = window.Thredded;
+  const Turbolinks = window.Turbolinks;
+
+  Thredded.onPageLoad(() => {
+    if (!Turbolinks || !Turbolinks.supported) return;
+    Array.prototype.forEach.call(document.querySelectorAll('[data-thredded-turboform]'), (form) => {
+      form.addEventListener('submit', handleSubmit);
+    });
+  });
+
+  const handleSubmit = (evt) => {
+    evt.preventDefault();
+    const form = evt.currentTarget;
+    Turbolinks.visit(form.action + (form.action.indexOf('?') === -1 ? '?' : '&') + Thredded.serializeForm(form));
+
+    // On mobile the soft keyboard doesn't won't go away after the submit since we're submitting with
+    // Turbolinks. Hide it:
+    Thredded.hideSoftKeyboard();
+  };
+})();

data/app/assets/javascripts/thredded/components/user_preferences_form.es6

@@ -0,0 +1,66 @@
+//= require thredded/core/on_page_load
+
+// Reflects the logic of user preference settings by enabling/disabling certain inputs.
+(() => {
+  const Thredded = window.Thredded;
+
+  const COMPONENT_SELECTOR = '[data-thredded-user-preferences-form]';
+  const BOUND_MESSAGEBOARD_NAME = 'data-thredded-bound-messageboard-pref';
+  const UPDATE_ON_CHANGE_NAME = 'data-thredded-update-checkbox-on-change';
+
+  class MessageboardPreferenceBinding {
+    constructor(form, genericCheckboxName, messageboardCheckboxName) {
+      this.messageboardCheckbox = form.querySelector(`[type="checkbox"][name="${messageboardCheckboxName}"]`);
+      if (!this.messageboardCheckbox) {
+        return;
+      }
+      this.messageboardCheckbox.addEventListener('change', () => {
+        this.rememberMessageboardChecked();
+      });
+      this.rememberMessageboardChecked();
+
+      this.genericCheckbox = form.querySelector(`[type="checkbox"][name="${genericCheckboxName}"]`);
+      this.genericCheckbox.addEventListener('change', () => {
+        this.updateMessageboardCheckbox();
+      });
+      this.updateMessageboardCheckbox();
+    }
+
+    rememberMessageboardChecked() {
+      this.messageboardCheckedWas = this.messageboardCheckbox.checked;
+    }
+
+    updateMessageboardCheckbox() {
+      const enabled = this.genericCheckbox.checked;
+      this.messageboardCheckbox.disabled = !enabled;
+      this.messageboardCheckbox.checked = enabled ? this.messageboardCheckedWas : false;
+    }
+  }
+
+  class UpdateOnChange {
+    constructor(form, sourceElement, targetName) {
+      const target = form.querySelector(`[type="checkbox"][name="${targetName}"]`);
+      if (!target) return;
+      sourceElement.addEventListener('change', () => {
+        target.checked = sourceElement.checked;
+      });
+    }
+  }
+
+  class UserPreferencesForm {
+    constructor(form) {
+      Array.prototype.forEach.call(form.querySelectorAll(`input[${BOUND_MESSAGEBOARD_NAME}]`), (element) => {
+        new MessageboardPreferenceBinding(form, element.name, element.getAttribute(BOUND_MESSAGEBOARD_NAME));
+      });
+      Array.prototype.forEach.call(form.querySelectorAll(`input[${UPDATE_ON_CHANGE_NAME}]`), (element) => {
+        new UpdateOnChange(form, element, element.getAttribute(UPDATE_ON_CHANGE_NAME));
+      });
+    }
+  }
+
+  Thredded.onPageLoad(() => {
+    Array.prototype.forEach.call(document.querySelectorAll(COMPONENT_SELECTOR), (form) => {
+      new UserPreferencesForm(form);
+    });
+  });
+})();

data/app/assets/javascripts/thredded/components/user_textcomplete.es6

@@ -0,0 +1,50 @@
+//= require thredded/core/thredded
+//= require thredded/core/escape_html
+
+(() => {
+  const Thredded = window.Thredded;
+
+  Thredded.UserTextcomplete = {
+    DROPDOWN_CLASS_NAME: 'thredded--textcomplete-dropdown',
+
+    formatUser({avatar_url, name, display_name}) {
+      return "<div class='thredded--textcomplete-user-result'>" +
+        `<img class='thredded--textcomplete-user-result__avatar' src='${Thredded.escapeHtml(avatar_url)}' >` +
+        `<span class='thredded--textcomplete-user-result__name'>${Thredded.escapeHtml(name)}</span>` +
+        (name !== display_name && display_name ?
+          `<span class='thredded--textcomplete-user-result__display_name'>${Thredded.escapeHtml(display_name)}</span>` :
+          '') +
+        '</div>';
+    },
+
+    searchFn({url, autocompleteMinLength}) {
+      return function search(term, callback, match) {
+        if (term.length < autocompleteMinLength) {
+          callback([]);
+          return;
+        }
+        const request = new XMLHttpRequest();
+        request.open('GET', `${url}?q=${term}`, /* async */ true);
+        request.setRequestHeader('X-Requested-With', 'XMLHttpRequest');
+        request.onload = () => {
+          // Ignore errors
+          if (request.status < 200 || request.status >= 400) {
+            callback([]);
+            return;
+          }
+          callback(JSON.parse(request.responseText).results.map(({avatar_url, id, display_name, name}) => {
+            return {avatar_url, id, name, display_name, match};
+          }));
+        };
+        request.send();
+      }
+    }
+  };
+
+  document.addEventListener('turbolinks:before-cache', () => {
+    Array.prototype.forEach.call(
+      document.getElementsByClassName(Thredded.UserTextcomplete.DROPDOWN_CLASS_NAME), (node) => {
+        node.parentNode.removeChild(node);
+      });
+  });
+})();

data/app/assets/javascripts/thredded/components/users_select.es6

@@ -0,0 +1,122 @@
+//= require thredded/core/on_page_load
+//= require thredded/components/user_textcomplete
+//= require thredded/dependencies/autosize
+
+(() => {
+  const Thredded = window.Thredded;
+  const autosize = window.autosize;
+
+  const COMPONENT_SELECTOR = '[data-thredded-users-select]';
+
+  Thredded.UsersSelect = {
+    DROPDOWN_MAX_COUNT: 6,
+  };
+
+  function parseNames(text) {
+    const result = [];
+    let current = [];
+    let currentIndex = 0;
+    let inQuoted = false;
+    let inName = false;
+    for (let i = 0; i < text.length; ++i) {
+      const char = text.charAt(i);
+      switch (char) {
+        case '"':
+          inQuoted = !inQuoted;
+          break;
+        case ' ':
+          if (inName) current.push(char);
+          break;
+        case ',':
+          if (inQuoted) {
+            current.push(char);
+          } else {
+            inName = false;
+            if (current.length) {
+              result.push({name: current.join(''), index: currentIndex});
+              current.length = 0;
+            }
+          }
+          break;
+        default:
+          if (!inName) currentIndex = i;
+          inName = true;
+          current.push(char);
+      }
+    }
+    if (current.length) result.push({name: current.join(''), index: currentIndex});
+    return result;
+  }
+
+  const initUsersSelect = (textarea) => {
+    autosize(textarea);
+    // Prevent multiple lines
+    textarea.addEventListener('keypress', (evt) => {
+      if (evt.keyCode === 13 || evt.keyCode === 10) {
+        evt.preventDefault()
+      }
+    });
+    const editor = new Textcomplete.editors.Textarea(textarea);
+    const textcomplete = new Textcomplete(editor, {
+      dropdown: {
+        className: Thredded.UserTextcomplete.DROPDOWN_CLASS_NAME,
+        maxCount: Thredded.UsersSelect.DROPDOWN_MAX_COUNT,
+      },
+    });
+
+    const searchFn = Thredded.UserTextcomplete.searchFn({
+      url: textarea.getAttribute('data-autocomplete-url'),
+      autocompleteMinLength: parseInt(textarea.getAttribute('data-autocomplete-min-length'), 10)
+    });
+    textcomplete.on('rendered', function() {
+      if (textcomplete.dropdown.items.length) {
+        textcomplete.dropdown.items[0].activate();
+      }
+    });
+    textcomplete.register([{
+      index: 0,
+      match: (text) => {
+        const names = parseNames(text);
+        if (names.length) {
+          const {name, index} = names[names.length - 1];
+          const matchData = [name];
+          matchData.index = index;
+          return matchData;
+        } else {
+          return null;
+        }
+      },
+      search (term, callback, match) {
+        searchFn(term, function(results) {
+          const names = parseNames(textarea.value).map(({name}) => name);
+          callback(results.filter((result) => names.indexOf(result.name) === -1));
+        }, match);
+      },
+      template: Thredded.UserTextcomplete.formatUser,
+      replace  ({name}) {
+        if (/,/.test(name)) {
+          return `"${name}", `
+        } else {
+          return `${name}, `
+        }
+      }
+    }]);
+  };
+
+  function destroyUsersSelect(textarea) {
+    autosize.destroy(textarea);
+  }
+
+  window.Thredded.onPageLoad(() => {
+    Array.prototype.forEach.call(document.querySelectorAll(COMPONENT_SELECTOR), (node) => {
+      initUsersSelect(node);
+    });
+  });
+
+  document.addEventListener('turbolinks:before-cache', () => {
+    Array.prototype.forEach.call(document.querySelectorAll(COMPONENT_SELECTOR), (node) => {
+      destroyUsersSelect(node);
+    });
+  });
+
+})();

data/app/assets/javascripts/thredded/core/csrf_tokens.es6

@@ -0,0 +1,9 @@
+//= require thredded/core/on_page_load
+
+window.Thredded.onPageLoad(() => {
+  if ('Rails' in window) {
+    window.Rails.refreshCSRFTokens();
+  } else if ('jQuery' in window && 'rails' in window.jQuery) {
+    window.jQuery.rails.refreshCSRFTokens();
+  }
+});

data/app/assets/javascripts/thredded/core/debounce.es6

@@ -0,0 +1,32 @@
+//= require thredded/core/thredded
+
+/**
+ * Return a function, that, as long as it continues to be invoked, will
+ * not be triggered. The function will be called after it stops being
+ * called for `wait` milliseconds. If `immediate` is passed, trigger the
+ * function on the leading edge, instead of the trailing.
+ * Based on https://john-dugan.com/javascript-debounce/.
+ *
+ * @param {Function} func
+ * @param {Number} wait in milliseconds
+ * @param {Boolean} immediate
+ * @returns {Function}
+ */
+window.Thredded.debounce = function(func, wait, immediate) {
+  let timeoutId = null;
+  return function() {
+    const context = this, args = arguments;
+    const later = function() {
+      timeoutId = null;
+      if (!immediate) {
+        func.apply(context, args);
+      }
+    };
+    const callNow = immediate && !timeoutId;
+    clearTimeout(timeoutId);
+    timeoutId = setTimeout(later, wait || 200);
+    if (callNow) {
+      func.apply(context, args);
+    }
+  };
+};

data/app/assets/javascripts/thredded/core/escape_html.es6

@@ -0,0 +1,7 @@
+//= require thredded/core/thredded
+
+window.Thredded.escapeHtml = function(text) {
+  const node = document.createElement('div');
+  node.textContent = text;
+  return node.innerHTML;
+};

data/app/assets/javascripts/thredded/core/hide_soft_keyboard.es6

@@ -0,0 +1,7 @@
+//= require thredded/core/thredded
+
+window.Thredded.hideSoftKeyboard = () => {
+  const activeElement = document.activeElement;
+  if (!activeElement || !activeElement.blur) return;
+  activeElement.blur();
+};

data/app/assets/javascripts/thredded/core/on_page_load.es6

@@ -0,0 +1,54 @@
+//= require thredded/core/thredded
+
+(() => {
+  const isTurbolinks = 'Turbolinks' in window && window.Turbolinks.supported;
+  const isTurbolinks5 = isTurbolinks && 'clearCache' in window.Turbolinks;
+
+  let onPageLoadFiredOnce = false;
+  const pageLoadCallbacks = [];
+  const triggerOnPageLoad = () => {
+    pageLoadCallbacks.forEach((callback) => {
+      callback();
+    });
+    onPageLoadFiredOnce = true;
+  };
+
+  // Fires the callback on DOMContentLoaded or a Turbolinks page load.
+  // If called from an async script on the first page load, and the DOMContentLoad event
+  // has already fired, will execute the callback immediately.
+  window.Thredded.onPageLoad = (callback) => {
+    pageLoadCallbacks.push(callback);
+    // With async script loading, a callback may be added after the DOMContentLoaded event has already triggered.
+    // This means we will receive neither a DOMContentLoaded event, nor a turbolinks:load event on Turbolinks 5.
+    if (!onPageLoadFiredOnce && window.Thredded.DOMContentLoadedFired) {
+      callback();
+    }
+  };
+
+  if (isTurbolinks5) {
+    // In Turbolinks 5.0.1, turbolinks:load may have already fired (before DOMContentLoaded).
+    // If so, add our own DOMContentLoaded listener:
+    // See: https://github.com/turbolinks/turbolinks/commit/69d353ea73d10ee6b25c2866fc5706879ba403e3
+    if (window.Turbolinks.controller.lastRenderedLocation) {
+      document.addEventListener('DOMContentLoaded', () => {
+        triggerOnPageLoad();
+      });
+    }
+    document.addEventListener('turbolinks:load', () => {
+      triggerOnPageLoad();
+    });
+  } else {
+    // Turbolinks Classic (with or without jQuery.Turbolinks), or no Turbolinks:
+    if (!window.Thredded.DOMContentLoadedFired) {
+      document.addEventListener('DOMContentLoaded', () => {
+        triggerOnPageLoad();
+      });
+    }
+    if (isTurbolinks) {
+      document.addEventListener('page:load', () => {
+        triggerOnPageLoad();
+      })
+    }
+  }
+})();
+

data/app/assets/javascripts/thredded/core/serialize_form.es6

@@ -0,0 +1,9 @@
+//= require thredded/core/thredded
+
+window.Thredded.serializeForm = (form) => {
+  // Can't use new FormData(form).entries() because it's not supported on any IE
+  // The below is not a full replacement, but enough for Thredded's purposes.
+  return Array.prototype.map.call(form.querySelectorAll('[name]'), (e) => {
+    return `${encodeURIComponent(e.name)}=${encodeURIComponent(e.value)}`;
+  }).join('&');
+};

data/app/assets/javascripts/thredded/core/thredded.es6

@@ -0,0 +1 @@
+window.Thredded = window.Thredded || {};

data/app/assets/javascripts/thredded/dependencies.js

@@ -0,0 +1,8 @@
+//= require thredded/dependencies/timeago
+//= require thredded/dependencies/ujs
+//= require thredded/dependencies/autosize
+//= require thredded/dependencies/textcomplete
+
+// We are not currently using any features that require the Babel polyfill
+// Enable this if we do:
+//- require babel/polyfill

data/app/assets/javascripts/thredded/dependencies/autosize.js

@@ -0,0 +1 @@
+//= require autosize.min

data/app/assets/javascripts/thredded/dependencies/textcomplete.js

@@ -0,0 +1 @@
+//= require textcomplete.min

data/app/assets/javascripts/thredded/dependencies/timeago.js

@@ -0,0 +1 @@
+//= require timeago

data/app/assets/javascripts/thredded/dependencies/ujs.js

@@ -0,0 +1 @@
+//= require rails-ujs

data/app/assets/javascripts/thredded/thredded.es6

@@ -0,0 +1,2 @@
+//= require_tree ./core
+//= require_tree ./components

data/app/assets/stylesheets/thredded.scss

@@ -0,0 +1,3 @@
+@import "thredded/dependencies";
+@import "thredded/thredded";
+

data/app/assets/stylesheets/thredded/_base.scss

@@ -0,0 +1,13 @@
+// This Sass package defines Thredded variables, mixins, and placeholders.
+
+@import "base/variables";
+@import "base/grid";
+
+@import "base/alerts";
+@import "base/buttons";
+@import "base/dropdown-menu";
+@import "base/forms";
+@import "base/lists";
+@import "base/nav";
+@import "base/tables";
+@import "base/typography";

data/app/assets/stylesheets/thredded/_email.scss

@@ -0,0 +1,51 @@
+@import "thredded/base";
+@import "thredded/components/post";
+@import "thredded/components/onebox";
+
+.thredded--email {
+  font-family: $thredded-base-font-family;
+  color: $thredded-text-color;
+  -webkit-font-smoothing: antialiased;
+  font-size: 16px;
+  line-height: 1.5;
+
+  a {
+    @extend %thredded--link;
+  }
+  hr {
+    @extend %thredded--hr;
+  }
+}
+
+.thredded--email-post {
+  margin: 0;
+
+  &--author {
+    margin-bottom: 2px;
+  }
+
+  .thredded--post--content {
+    font-size: inherit;
+    margin: 0 0 0.75rem;
+    padding-left: 0;
+
+    .onebox-wrapper-table {
+      width: 100%;
+      td {
+        border: $thredded-base-border;
+        text-align: left;
+        padding: $thredded-small-spacing;
+        > aside.onebox {
+          margin-bottom: 0;
+          padding: 0;
+          border: 0;
+          box-shadow: none;
+        }
+      }
+    }
+
+    aside.onebox {
+      margin-bottom: $thredded-small-spacing;
+    }
+  }
+}