lato_view 1.1

data/app/assets/javascripts/lato_view/application.js

@@ -0,0 +1,68 @@
+// This is a manifest file that'll be compiled into application.js, which will include all the files
+// listed below.
+//
+// Any JavaScript/Coffee file within this directory, lib/assets/javascripts, vendor/assets/javascripts,
+// or any plugin's vendor/assets/javascripts directory can be referenced here using a relative path.
+//
+// It's not advisable to add code directly here, but if you do, it'll appear at the bottom of the
+// compiled file.
+//
+// Read Sprockets README (https://github.com/rails/sprockets#sprockets-directives) for details
+// about supported directives.
+//
+//= require jquery2
+//= require jquery_ujs
+//= require lato_view/vendor/modernizr
+//= require selectize
+//= require lato_view/vendor/moment.min
+//= require lato_view/vendor/picker
+//= require lato_view/vendor/picker.date
+//= require lato_view/vendor/picker.time
+//= require lato_view/vendor/picker-it_IT
+//= require lato_view/vendor/dropzone.min
+//= require lato_view/vendor/jquery.email-autocomplete.min
+//= require lato_view/vendor/trumbowyg
+//= require lato_view/build/Util
+//= require lato_view/build/Validator
+//= require lato_view/build/FormManager
+//= require lato_view/build/Dropdown
+//= require lato_view/build/Navigation
+//= require lato_view/build/ActionBar
+//= require lato_view/build/Flash
+
+var Application = (function($) {
+
+  var onResize = function() {
+    $(window).on('resize', function() {
+      Navigation.manageSidebarDropdown();
+    });
+  };
+
+  var init = function() {
+    $(document).on('ready', function() {
+
+      // Active js functionalities
+      document.documentElement.className = 'js';
+
+      // Init our modules
+      Dropdown.init();
+      Navigation.init();
+      //ActionBar.init();
+      Flash.init();
+      FormManager.init();
+      $('.editor').trumbowyg({
+        svgPath: '/ui/icons.svg'
+      });
+
+      // Functions executed on resize
+      onResize();
+    });
+  };
+
+  return {
+    init: init,
+  };
+
+})(jQuery);
+
+Application.init();

data/app/assets/javascripts/lato_view/build/ActionBar.js

@@ -0,0 +1,65 @@
+var ActionBar = (function($) {
+  'use strict';
+
+   /*
+  * Manage responsive Action Bar component - moves the unnecessary elements to a separate menu.
+  * @params: -
+  * @return: undefined
+  */
+  var _responsiveActionBar = function() {
+    var resizing = false;
+    var $actionBar = $('.action-bar');
+    var $actionRemove = $actionBar.find('.action-remove');
+
+    function _detachElements(elements) {
+      $(elements).detach();
+    }
+     
+    var moveActionBarElement = Util.debounce(function() {
+
+      if($actionRemove.length) {
+        $actionBar.each(function(index, el) {
+          var $elToRemove = $(el).find('.action-remove');
+          var $actionHolder = $(el).find('.action-nav-menu');
+          var $header = $('.main-navigation-header');
+
+          var dataAttrs = [];
+          $elToRemove.each(function(index, el) {
+            dataAttrs.push($(el).data('position'));
+          });
+
+          if ( Modernizr.mq("only screen and (max-width: 1070px)")) {
+            _detachElements($elToRemove);
+            $elToRemove.appendTo($actionHolder);
+          } else if ( Modernizr.mq("only screen and (min-width: 1071px)") ) {
+            _detachElements($elToRemove);
+            $elToRemove.each(function(index, el) {
+              $(el).appendTo($elToRemove.eq(0));
+            });
+            $header.find('.nav-logo').after($elToRemove);
+          }
+        });
+
+        resizing = false;
+      }
+
+    }, 200);
+
+    moveActionBarElement();
+    $(window).on('resize', function() {
+      if( !resizing ) {
+        window.requestAnimationFrame(moveActionBarElement);
+        resizing = true;
+      }
+    });
+  };
+
+  var init = function() {
+    _responsiveActionBar();
+  };
+
+  return {
+    init: init
+  };
+  
+})(jQuery);

data/app/assets/javascripts/lato_view/build/Dropdown.js

@@ -0,0 +1,33 @@
+var Dropdown = (function($) {
+  'use strict';
+
+  var _manageDropdown = function() {
+
+    $(document).on('click', '.active-voice', function(event) {
+      event.stopPropagation();
+      $(this).parent('.dropdown').toggleClass('is-arranger-open');
+    });
+
+    $(document).on('click', '.nav-account-area', function(event) {
+      event.stopPropagation();
+      $('body').toggleClass('is-dropdown-open');
+    });
+
+    // FIXME - da rivedere il click fuori dall'area dropdown
+    $('html').on('click', function(event) {
+      if($('body').hasClass('is-dropdown-open')) {
+        //$('body').removeClass('is-dropdown-open');
+      }
+    });
+
+  };
+
+  var init = function() {
+    _manageDropdown();
+  };
+
+  return {
+    init: init
+  };
+  
+})(jQuery);

data/app/assets/javascripts/lato_view/build/Flash.js

@@ -0,0 +1,23 @@
+var Flash = (function($) {
+
+  var flashTimeout = 4000;
+
+  var _showFlashes = function() {
+    var $flash = $('.flashes-container');
+
+    if($flash.length) {
+      setTimeout(function() {
+        $flash.addClass('is-remove');
+      }, flashTimeout);
+    }
+  };
+
+  var init = function() {
+    _showFlashes();
+  };
+
+  return {
+    init: init
+  };
+
+})(jQuery);

data/app/assets/javascripts/lato_view/build/FormManager.js

@@ -0,0 +1,159 @@
+var FormManager = (function($) {
+  'use strict';
+
+  // Activate selectize.js module
+  var _manageSelect = function() {
+    $('.select').selectize({
+      hideSelected: 'true' // for multiple-select working
+    });
+  };
+
+  // Activate pikaday.js module
+  var _manageDatePicker = function() {
+    var $datepicker = $('.date-picker').pickadate({
+      firstDay: 1,
+      min: new Date(1900, 0, 1),
+      max: new Date(3000, 12, 31),
+      format: 'dd/mm/yyyy'
+    });
+  };
+
+  var _manageTimePicker = function() {
+    var $timePicker = $('.time-picker').pickatime();
+  };
+
+  var _manageFileUploader = function() {
+    var $dropZone = $('.drop-zone');
+    var parentForm = $dropZone.parent('.lato-form');
+
+    $dropZone.dropzone({ url: parentForm.attr('action') });
+  };
+
+  // Manage input type="file" component.
+  // Replaces the label text depending on the uploaded files.
+  var _manageInputFile = function() {
+    if($('.input-file').length) {
+      $('.input-file').each( function() {
+        var $input = $(this);
+        var $label   = $input.next('label');
+        var labelVal = $label.html();
+
+        $input.on('change', function(event) {
+          var fileName = '';
+
+          if(this.files && this.files.length > 1) {
+            fileName = (this.getAttribute('data-multiple-caption') || '' ).replace( '{count}', this.files.length );
+          } else if(event.target.value) {
+            fileName = event.target.value.split('\\').pop();
+          }
+
+          if(fileName) {
+            $label.find('span').html(fileName);
+          } else {
+            $label.html(labelVal);
+          }
+
+        });
+
+        // Firefox bug fix
+        $input
+        .on('focus', function(){ $input.addClass( 'has-focus' ); })
+        .on('blur', function(){ $input.removeClass( 'has-focus' ); });
+      });
+    }
+  };
+
+  // Manage password-reveal sub-module.
+  // Transforms the input type.
+  var _manageInputPassword = function() {
+    $(document).on('click', '.password-reveal', function(event) {
+      event.preventDefault();
+      var $input = $(this).prev('.input');
+
+      $(this).toggleClass('is-text');
+      $input.attr('type') === 'password' ? $input.attr('type', 'text') : $input.attr('type', 'password');
+    });
+  };
+
+  // Activate email data-list autocomplete
+  var _insertSuggestions = function() {
+    if($('.email-suggestion').length) {
+      var domains = ['yahoo.com', 'gmail.com', 'google.com', 'hotmail.com', 'me.com', 'libero.it', 'live.it', 'live.com'];
+
+      $('.email-suggestion').emailautocomplete({
+        domains: domains
+      });
+    }
+  };
+
+  /*
+  * Manage form submission/validation
+  * @return: undefined or boolean
+  */
+  var _manageFormSubmit = function() {
+    $('.lato-form').on('submit', function(event) {
+
+      var tests = {
+        "number": Validator.controlNumber('.input-number'),
+        "required": Validator.controlRequired('data-input="required"'),
+        "email": Validator.controlEmail('.input-email'),
+        "password": Validator.controlPasswordEquality('.input-password', '.confirm-password'),
+        "length": Validator.controlInputLength('.input-length'),
+        "radiobox": Validator.controlRadiobox('data-input="radio"')
+      };
+
+      // Basta che uno dei test fallisca per generare un errore
+      $.each(tests, function(index, val) {
+        if(val === false) {
+          event.preventDefault();
+          return false;
+        }
+      });
+
+    });
+  }
+
+  // Manage form validation in semi-real-time.
+  var _manageBlurValidation = function() {
+    $('.lato-form').on('blur', '.input', function(event) {
+      var type = $(this).parent('.form-control').data('input');
+      var controlType = $(this).parent('.form-control').data('control');
+
+      // Email suggestion case
+      if($('.eac-input-wrap').length) {
+        Validator.controlEmail('.input-email');
+      }
+
+      // Get input desired className.
+      var tester = '.' + $(this).attr('class').split(' ')[1];
+
+      // Manage data-control type
+      switch(controlType) {
+        case 'number':
+          Validator.controlNumber(tester);
+          break;
+        case 'email':
+          Validator.controlEmail(tester);
+          break;
+      }
+
+    });
+  };
+
+  var init = function() {
+    _manageSelect();
+    _manageDatePicker();
+    _manageTimePicker();
+    // _manageFileUploader();
+    _manageInputFile();
+    _manageInputPassword();
+    _insertSuggestions();
+    _manageFormSubmit();
+    _manageBlurValidation();
+  };
+
+  return {
+    init: init
+  };
+
+})(jQuery);

data/app/assets/javascripts/lato_view/build/Navigation.js

@@ -0,0 +1,79 @@
+var Navigation = (function($) {
+  'use strict';
+
+  /*
+  * Debounced function which manages the click handler for the dropdown's list-item.
+  * @params: -
+  * @return: undefined
+  */
+  var sidebarDropdown = Util.debounce(function() {
+    var $sidebarListItem = $('.sidebar-list-item');
+
+    if(Modernizr.mq("only screen and (max-width: 1023px)")) {
+      $(document).on('click', '.sidebar-main-link', function(event) {
+        if($(this).parent('.sidebar-list-item').hasClass('has-child')) {
+          event.preventDefault();
+          $(this).next('ul').toggleClass('is-drop-open');
+        }
+      });
+    } else {
+      $(document).off('click', '.sidebar-main-link');
+      $sidebarListItem.find('ul').removeClass('is-drop-open');
+    }
+  }, 200);
+
+  /*
+  * Manage responsive menu - moves the admin dropdown to the sidebar.
+  * @params: -
+  * @return: undefined
+  */
+  var responsiveMenu = function() {
+    var resizing = false;
+    var $topNavigation = $('.nav-account-area');
+    var $sidebar = $('.main-navigation-sidebar');
+    var $header = $('.main-navigation-header');
+
+    function _detachElements() {
+      $topNavigation.detach();
+    }
+     
+    var moveNavigation = Util.debounce(function() {
+      if ( Modernizr.mq("only screen and (max-width: 766px)")) {
+        _detachElements();
+        $topNavigation.appendTo($sidebar);
+      } else if ( Modernizr.mq("only screen and (min-width: 767px)") ) {
+        _detachElements();
+        $header.find('.nav-logo').after($topNavigation);
+      }
+      resizing = false;
+    }, 200);
+
+    moveNavigation();
+    $(window).on('resize', function() {
+      if( !resizing ) {
+        window.requestAnimationFrame(moveNavigation);
+        resizing = true;
+      }
+    });
+  };
+
+  var _openMobileMenu = function() {
+    var $sidebar = $('.main-navigation-sidebar');
+    $(document).on('click', '.menu-toggle', function() {
+      $(this).toggleClass('is-mobile-menu-open');
+      $sidebar.toggleClass('is-mobile-menu-open');
+    });
+  }
+
+  var init = function() {
+    sidebarDropdown();
+    responsiveMenu();
+    _openMobileMenu();
+  };
+
+  return {
+    init: init,
+    manageSidebarDropdown: sidebarDropdown
+  };
+  
+})(jQuery);

data/app/assets/javascripts/lato_view/build/Util.js

@@ -0,0 +1,91 @@
+var Util = (function($) {
+  'use strict';
+
+  /*
+  * Debounce any function
+  * @params: 
+  * func: function to test.
+  * wait: the time interval for the next function execution.
+  * immediate: triggers the function on the leading edge, instead of the trailing.
+  * @return: a function, that, as long as it continues to be invoked, will not be triggered.
+  */ 
+  var debounce = function(func, wait, immediate) {
+    var timeout;
+    return function() {
+      var context = this, args = arguments;
+      var later = function() {
+        timeout = null;
+        if (!immediate) func.apply(context, args);
+      };
+      var callNow = immediate && !timeout;
+      clearTimeout(timeout);
+      timeout = setTimeout(later, wait);
+      if (callNow) func.apply(context, args);
+    };
+  };
+
+  /*
+  * Check if the value given is a number.
+  * @params: 
+  * value: value to test
+  * @return: boolean
+  */
+  var isNumber = function(value) {
+    return !Number(value);
+  };
+
+  /*
+  * Check if two strings have the same value.
+  * @params: 
+  * firstValue: value to test.
+  * secondValue: value to compare to.
+  * @return: boolean
+  */
+  var isEqual = function(firstValue, secondValue) {
+    return firstValue === secondValue ? true : false;
+  };
+
+  /*
+  * Check if a string is empty
+  * @params: 
+  * value: value to test
+  * @return: boolean
+  */
+  var isEmptyString = function(value) {
+    return value === '';
+  };
+
+  /*
+  * Check if the lenght of a given value respects the limit given.
+  * @params: 
+  * el: element to test
+  * limit: limit to give. Ex: max, min, between
+  * minValue: minimum value to respect
+  * maxValue: maximum value to respect
+  * @return: boolean
+  */
+  var checkLength = function(el, limit, minValue, maxValue) {
+    var $length = $(el).val().length;
+    minValue = minValue || 1;
+    maxValue = maxValue || 0;
+
+    if (limit === 'max') {
+      return $length <= maxValue;
+    } else if (limit === 'min') {
+      return $length >= minValue;
+    } else if (limit === 'between') {
+      return $length >= minValue && $length <= maxValue;
+    } else {
+      return false;
+    }
+  };
+
+  return {
+    debounce: debounce,
+    isNumber: isNumber,
+    isEqual: isEqual,
+    isEmptyString: isEmptyString,
+    checkLength: checkLength
+  };
+  
+})(jQuery);