Merge pull request #410 from SumOfUs/development

Champaign 1.0.1
SumOfUs · Mar 8, 2016 · 3537602 · 3537602
2 parents a91b007 + a3604e7
commit 3537602
Show file tree

Hide file tree

Showing 103 changed files with 1,141 additions and 676 deletions.
diff --git a/Gemfile b/Gemfile
@@ -70,6 +70,9 @@ gem 'lograge'
 # gem 'rack-cache'
 # gem 'redis-rack-cache'
 
+# Cross browser rich text editor
+gem 'summernote-rails'
+
 # Gem for user agent / browser detection
 gem 'browser'
 
@@ -140,9 +143,6 @@ source 'https://rails-assets.org' do
   # Generate a slug – transliteration with a lot of options
   gem 'rails-assets-speakingurl'
 
-  # Cross browser rich text editor
-  gem 'rails-assets-quill'
-
   # braintree js
   gem 'rails-assets-braintree-web'
 

diff --git a/Gemfile.lock b/Gemfile.lock
@@ -339,7 +339,6 @@ GEM
     rails-assets-mailcheck (1.1.1)
     rails-assets-moment (2.11.1)
     rails-assets-odometer (0.4.7)
-    rails-assets-quill (0.20.0)
     rails-assets-speakingurl (6.0.0)
     rails-assets-underscore (1.8.3)
     rails-deprecated_sanitizer (1.0.3)
@@ -433,6 +432,8 @@ GEM
       actionpack (>= 3.0)
       activesupport (>= 3.0)
       sprockets (>= 2.8, < 4.0)
+    summernote-rails (0.8.1.1)
+      railties (>= 3.1)
     teaspoon (1.1.1)
       railties (>= 3.2.5, < 5)
     teaspoon-mocha (2.3.3)
@@ -522,7 +523,6 @@ DEPENDENCIES
   rails-assets-mailcheck!
   rails-assets-moment!
   rails-assets-odometer!
-  rails-assets-quill!
   rails-assets-speakingurl!
   rails-assets-underscore!
   rails-observers
@@ -539,6 +539,7 @@ DEPENDENCIES
   spring
   spring-commands-rspec
   sprockets-rails (< 3.0)
+  summernote-rails
   teaspoon
   teaspoon-mocha
   terminal-notifier-guard

diff --git a/app/admin/form_element.rb b/app/admin/form_element.rb
@@ -1,5 +1,5 @@
 ActiveAdmin.register FormElement do
-  permit_params :label, :data_type, :field_type, :default_value, :required, :visible, :name, :position
+  permit_params :label, :data_type, :default_value, :required, :visible, :name, :position
 
   index do
     selectable_column

diff --git a/app/assets/javascripts/application.js b/app/assets/javascripts/application.js
@@ -27,14 +27,17 @@
 //= require syntax-highlighting
 //= require typeahead.jquery
 //= require speakingurl
-//= require quill
+//= require summernote
 //= require datatables
 //= require datatables/dataTables.bootstrap
 
+//= require i18n
+//= require i18n/translations
 //= require show_errors
 //= require dropzone_image_upload
-//= require selectize_config.js
-//= require configure_quill_editor
+//= require selectize_config
+//= require search
+//= require configure_wysiwyg
 //= require_tree ./plugins/admin
 
 require('ajax')

diff --git a/app/assets/javascripts/collection_editor.js b/app/assets/javascripts/collection_editor.js
@@ -9,6 +9,7 @@
 //   - Use for autocompleting for setting the field's name value
 
 const setupOnce = require('setup_once');
+const ErrorDisplay = require('show_errors');
 
 (function(){
   let CollectionEditor = Backbone.View.extend({
@@ -99,6 +100,8 @@ const setupOnce = require('setup_once');
 
     newElementAdded: function(e, resp, c) {
       this.$('.list-group').append(resp);
+      this.$('#form_element_label, #form_element_name').val('');
+      ErrorDisplay.clearErrors(this.$('form#new_collection_element'));
       this.makeSortable();
     },
 

diff --git a/app/assets/javascripts/configure_quill_editor.js b/app/assets/javascripts/configure_quill_editor.js
diff --git a/app/assets/javascripts/configure_wysiwyg.js b/app/assets/javascripts/configure_wysiwyg.js
@@ -0,0 +1,34 @@
+(function(){
+  var configureWysiwyg = function() {
+    var $editor = $('#summernote');
+    if($editor.length === 0){
+      return false;
+    }
+
+    $editor.summernote({
+      toolbar: [
+        ['style', ['bold', 'italic', 'underline', 'clear']],
+        ['font', ['fontname', 'fontsize']],
+        ['para', ['paragraph']],
+        ['color', ['color']],
+        ['insert', ['link', 'picture', 'video']],
+        ['view', ['fullscreen', 'codeview', 'help']]
+      ],
+      height: 280,
+      fontSizes: ['8', '10', '11', '12', '14', '16', '20', '24', '36', '72'],
+    });
+    $contentField = $('#page_content');
+
+    $editor.summernote('fontSize', '16'); // default
+    $editor.summernote('code', $contentField.val());
+
+    updateContentBeforeSave = function(){
+      var content = $editor.summernote('code');
+      $contentField.val(content);
+    };
+
+    $.subscribe("wysiwyg:submit", updateContentBeforeSave);
+  }
+
+  $.subscribe("wysiwyg:setup", configureWysiwyg);
+}());
diff --git a/app/assets/javascripts/page_edit_bar.js b/app/assets/javascripts/page_edit_bar.js
@@ -17,7 +17,11 @@ let PageModel = Backbone.Model.extend({
       this.lastSaved = data;
       Backbone.Model.prototype.save.call(this, data, _.extend({patch: true}, callbacks));
     }
-  }
+  },
+
+  setLastSaved: function(data) {
+    this.lastSaved = data;
+  },
 
 });
 
@@ -97,7 +101,7 @@ let PageEditBar = Backbone.View.extend({
   },
 
   save: function() {
-    $.publish('quill_editor:submit'); // for quill to update content
+    $.publish('wysiwyg:submit'); // for summernote to update content
     if (!this.outstandingSaveRequest) {
       this.disableSubmit();
       this.model.save(this.readData(), {
@@ -117,24 +121,30 @@ let PageEditBar = Backbone.View.extend({
       if (data.refresh){ location.reload(); }
       this.enableSubmit();
       $.publish('page:saved', data);
-      let now = new Date();
       $('.page-edit-bar__save-box').removeClass('page-edit-bar__save-box--has-error');
       $('.page-edit-bar__error-message').text('');
-      $('.page-edit-bar__last-saved').text(`Last saved at ${now.getHours()}:${now.getMinutes()}:${now.getSeconds()}`);
+      $('.page-edit-bar__last-saved').text(I18n.t('pages.edit.last_saved_at', {time: this.currentTime()}));
     }
   },
 
+  currentTime: function() {
+    const now = new Date();
+    const minutes = (`0${now.getMinutes()}`).slice(-2); // for leading zero
+    const seconds = (`0${now.getSeconds()}`).slice(-2); // for leading zero
+    return `${now.getHours()}:${minutes}:${seconds}`
+  },
+
   saveFailed: function() {
     return (e, data) => { // closure for `this` cause it's an event callback
       console.log("save failed with", e, data);
       this.enableSubmit();
       $('.page-edit-bar__save-box').addClass('page-edit-bar__save-box--has-error')
       if(data.status == 422) {
         ErrorDisplay.show(e, data);
-        $('.page-edit-bar__error-message').text("The server didn't like something you entered. Click here to see the error.");
+        $('.page-edit-bar__error-message').text(I18n.t('pages.edit.user_error'));
         $.publish('page:errors');
       } else {
-        $('.page-edit-bar__error-message').text("The server unexpectedly messed up saving your work.");
+        $('.page-edit-bar__error-message').text(I18n.t('pages.edit.unknown_error'));
       }
     }
   },
@@ -161,30 +171,46 @@ let PageEditBar = Backbone.View.extend({
 
   disableSubmit: function(){
     this.outstandingSaveRequest = true;
-    this.$saveBtn.text('Saving...');
+    this.$saveBtn.text(I18n.t('pages.edit.saving'));
     this.$saveBtn.addClass('disabled');
   },
 
   enableSubmit: function(){
     this.outstandingSaveRequest = false;
-    this.$saveBtn.text('Save my work');
+    this.$saveBtn.text(I18n.t('pages.edit.save_work'));
     this.$saveBtn.removeClass('disabled');
   },
 
   setupAutosave: function() {
     const SAVE_PERIOD = 5000; // milliseconds
     const shouldAutosave = (this.$('.page-edit-bar__toggle-autosave').data('autosave') == true);
     this.autosave = true;
+    this.model.setLastSaved(this.readData());
     if (shouldAutosave != this.autosave) {
       this.toggleAutosave();
     }
     window.setInterval(() => {
       if(this.autosave) {
         this.save();
+      } else {
+        this.showUnsavedAlert();
       }
     }, SAVE_PERIOD)
   },
 
+  showUnsavedAlert: function() {
+    let $lastSaved = $('.page-edit-bar__last-saved');
+    const noNotice = $lastSaved.find('.page-edit-bar__unsaved-notice').length < 1;
+    const unsavedDataExists = !_.isEqual(this.model.lastSaved, this.readData());
+    if (unsavedDataExists){
+      if (noNotice) {
+        $lastSaved.append(`<div class="page-edit-bar__unsaved-notice">${I18n.t('pages.edit.unsaved_changes')}</div>`);
+      }
+    } else {
+      $lastSaved.find('.page-edit-bar__unsaved-notice').remove();
+    }
+  },
+
 });
 
 module.exports = PageEditBar;
diff --git a/app/assets/javascripts/search.js b/app/assets/javascripts/search.js
@@ -0,0 +1,21 @@
+(function(){
+
+  var searchConfig = function() {
+
+    $('.page-filter__reset').click( function() {
+      $('select.selectize-container').map(function(index, item){
+        item.selectize.clear();
+      });
+      $(this).closest('form').find('.form-control').map(function(index, item){
+        $(item).val("");
+      });
+    });
+
+    $('#pages-table').DataTable({
+      /* Disable initial sort */
+      "aaSorting": []
+    });
+  }
+
+  $.subscribe("search:load", searchConfig);
+}());
diff --git a/app/assets/javascripts/shares_editor.js b/app/assets/javascripts/shares_editor.js
@@ -106,7 +106,11 @@ let setupOnce = require('setup_once');
         $.get(`/api/pages/${data.id}/share-rows`, (rows) => {
           _.each(rows, (row) => {
             let $row = $(row.html);
-            $row = $(`#${$row.prop('id')}`).replaceWith($row);
+            let $original = $(`#${$row.prop('id')}`);
+            if ($original.hasClass('hidden-closed')) {
+              $row.addClass('hidden-closed');
+            }
+            $row = $original.replaceWith($row);
             $row = $(`#${$row.prop('id')}`);
             if (!this.editRow($row).hasClass('hidden-closed')) {
               $row.find('.shares-editor__toggle-edit').text('Done');

diff --git a/app/assets/javascripts/sumofus/backbone/form_methods.js b/app/assets/javascripts/sumofus/backbone/form_methods.js
@@ -37,6 +37,17 @@ const FormMethods = {
   completePrefill(prefillValues, unvalidatedPrefillValues) {
     this.$('.petition-bar__field-container').addClass('form__group--prefilled');
     this.partialPrefill(prefillValues, unvalidatedPrefillValues, []);
+
+    // DESIRED BUT WEIRD BEHAVIOR - UNHIDE CHECKBOXES AND EMPTY FIELDS
+    let $empties = this.$('.petition-bar__field-container').
+                        find('input, textarea, select').
+                        filter(function(){
+                          return $(this).val().length === 0
+                        });
+    let $checkboxes = this.$('.petition-bar__field-container').find('.checkbox-label');
+    $.merge($empties, $checkboxes).
+         parents('.petition-bar__field-container').
+         removeClass('form__group--prefilled');
   },
 
   // prefillValues - an object mapping form names to prefill values

diff --git a/app/assets/javascripts/sumofus/backbone/hosted_fields.js b/app/assets/javascripts/sumofus/backbone/hosted_fields.js
@@ -9,6 +9,7 @@ const HostedFieldsMethods = {
       id: "hosted-fields",
       onPaymentMethodReceived: this.paymentMethodReceived(),
       onError: this.handleErrors(),
+      onReady: this.hideSpinner(),
       paypal: {
         container: 'hosted-fields__paypal',
         onCancelled: () => { this.$('.hosted-fields__credit-card-fields').slideDown(); },
@@ -60,6 +61,13 @@ const HostedFieldsMethods = {
     }
   },
 
+  hideSpinner() {
+    return (clientToken) => {
+      this.$('.fundraiser-bar__fields-loading').addClass('hidden-closed');
+      this.$('#hosted-fields').removeClass('hidden-closed');
+    }
+  },
+
   handleErrors() {
     return (error) => {
       this.enableButton();

diff --git a/app/assets/stylesheets/application.scss b/app/assets/stylesheets/application.scss
@@ -4,8 +4,7 @@
 @import "bootstrap";
 @import "selectize";
 @import "selectize.bootstrap2";
-@import "quill";
-@import "quill/quill.snow";
+@import "summernote";
 @import "interactive";
 @import "widget";
 @import "common";

diff --git a/app/assets/stylesheets/common.scss b/app/assets/stylesheets/common.scss
@@ -119,6 +119,11 @@ section {
       }
     }
   }
+  .secondary-label {
+    opacity: 0.4;
+    font-size: 12px;
+    margin-left: 5px;
+  }
 }
 
 li.list-group-item {