barras_rails 1.3.1

checksums.yaml

@@ -0,0 +1,7 @@
+---
+SHA1:
+  metadata.gz: c382f7563962d25042c878ca441b1a354d7f252a
+  data.tar.gz: 3cb43ddfc41bb7c292d0c7d27668513a30866490
+SHA512:
+  metadata.gz: bf514261540e2cac391e9b79c6842849b48ffd672ae1e51db3ce3ffde83c609be9e733ba9a7f757131285116f8b7b2293ff511f658f344551875443d514032fd
+  data.tar.gz: 4e22cec1399c5bcb531ec1167f16bdb625690c9dc372697a3c8afd1e6f4984ff9090d8fd3fd4ed0400c2f35bf672d30a7af90db9e237ecc02aa4b002f0a657f4

data/Rakefile

@@ -0,0 +1,22 @@
+#!/usr/bin/env rake
+begin
+  require 'bundler/setup'
+rescue LoadError
+  puts 'You must `gem install bundler` and `bundle install` to run rake tasks'
+end
+
+APP_RAKEFILE = File.expand_path('../spec/dummy/Rakefile', __FILE__)
+load 'rails/tasks/engine.rake'
+
+Bundler::GemHelper.install_tasks
+
+Dir[File.join(File.dirname(__FILE__), 'tasks/**/*.rake')].each { |f| load f }
+
+require 'rspec/core'
+require 'rspec/core/rake_task'
+
+desc 'Run all specs in spec directory (excluding plugin specs)'
+
+RSpec::Core::RakeTask.new(spec: 'app:db:test:prepare')
+
+task default: :spec

data/app/assets/images/barras_rails/logo_uff_branco.svg

@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="410px" height="210px" viewBox="0 0 410 210">
+  <path fill="#ffffff" d="M237.962 71.2 l33.4643 0 0 -17.6 -0.1 0c-0.0767719 -12 -4.4 -23 -11.5 -31.5 -0 -0 -0 -0 -0 -0 -2 -2.4 -4.3 -4.7 -6.8 -6.7 -0 -0 -0 -0 -0 -0 -0.3 -0.3 -0.6 -0.5 -0.9 -0.7 -0 -0 -0 -0 -0 -0 -0.3 -0.2 -0.6 -0.5 -0.9 -0.7 -0 -0 -0 -0 -0 -0 -0.3 -0.2 -0.6 -0.5 -0.9 -0.7 0 -0 -0 -0 -0 -0 -0.3 -0.2 -0.6 -0.5 -1 -0.7 -0 -0 -0 -0 -0.1 -0 -1.6 -1.1 -3.3 -2.1 -5.1 -3 -0 -0 -0 -0 -0 -0 -0.7 -0.4 -1.4 -0.7 -2.1 -1 -0 -0 -0 -0 -0 -0 -0.4 -0.2 -0.7 -0.3 -1.1 -0.5 -0 -0 -0 -0 -0 -0 -0.3 -0.1 -0.7 -0.3 -1.1 -0.4 -0 -0 -0 -0 -0 -0 -0.3 -0.1 -0.5 -0.2 -0.8 -0.3 -0.1 -0 -0.2 -0.1 -0.3 -0.1 -0.2 -0.1 -0.5 -0.2 -0.7 -0.3 -0.1 -0.1 -0.3 -0.1 -0.4 -0.2 -0.2 -0.1 -0.3 -0.1 -0.5 -0.2 -0.2 -0.1 -0.5 -0.2 -0.7 -0.2 -0.1 -0 -0.2 -0 -0.2 -0.1 -0.3 -0.1 -0.6 -0.2 -0.9 -0.3 -0 0 -0 -0 -0 -0 -0.4 -0.1 -0.8 -0.2 -1.1 -0.3 -0 -0 -0 -0 -0 -0 -0.2 -0 -0.4 -0.1 -0.5 -0.1 -0.2 -0.1 -0.5 -0.1 -0.7 -0.2 -0 0 -0 0 -0 0 -0.4 -0.1 -0.8 -0.2 -1.2 -0.3 -0 -0 -0 -0 -0 -0 -0.4 -0.1 -0.8 -0.2 -1.2 -0.2 -0 -0 -0 -0 -0 -0 -0.4 -0.1 -0.8 -0.1 -1.2 -0.2 -0 -0 -0 -0 -0 -0 -0.4 -0.1 -0.8 -0.1 -1.2 -0.2 -0 -0 -0 -0 -0 -0 -0.4 -0.1 -0.8 -0.1 -1.2 -0.1 -0 0 -0 -0 -0 -0 -0.4 -0 -0.8 -0.1 -1.2 -0.1 -0 0 -0 0 -0 -0 -0.4 -0 -0.8 -0.1 -1.3 -0.1 -0 0 -0 0 -0 0 -0.4 -0 -0.8 -0 -1.3 -0 -0 0 -0 0 -0 0 -0.4 -0 -0.9 -0 -1.3 -0 -27.5 0 -49.9 22.4 -49.9 49.9 0 0 0 0.4 0 0.389765l0.0295277 0 0 33.5 -50.5 0.2 -0 68.1 -0 0.00236221c-0.243308 8.9 -7.7 16.1 -16.6 16.1 -8.9 0 -16.3 -7.2 -16.5 -16.0654l-0.00708664 0 0 -0.5 0 -68.1 -27.9 0 0 -0 -54.9 0 0 33.6 49.6 0 0 35 -0 0.00708664c0 27.5 22.4 49.9 49.9 49.9 0.4 0 0.9 -0 1.3 -0 0 0 0 0 0 0 0.4 -0 0.8 -0 1.3 -0 0 0 0 -0 0 -0 0.4 -0 0.8 -0 1.3 -0.1 0 0 0 0 0 -0 0.4 -0 0.8 -0.1 1.2 -0.1 0 0 0 -0 0 -0 0.1 -0 0.2 -0 0.3 -0 0.3 -0 0.6 -0.1 0.9 -0.1 0.4 -0.1 0.8 -0.1 1.2 -0.2 0 -0 0 -0 0 -0 0.4 -0.1 0.8 -0.1 1.2 -0.2 0 0 0 -0 0 -0 0.2 -0 0.4 -0.1 0.7 -0.1 0.2 -0 0.4 -0.1 0.5 -0.1 0 -0 0 -0 0 -0 0.4 -0.1 0.8 -0.2 1.2 -0.3 0 -0 0 -0 0 -0 0.2 -0 0.4 -0.1 0.5 -0.1 0.2 -0.1 0.4 -0.1 0.7 -0.2 0.1 -0 0.3 -0.1 0.4 -0.1 0.3 -0.1 0.5 -0.1 0.8 -0.2 0.2 -0 0.3 -0.1 0.5 -0.1 0.2 -0.1 0.5 -0.1 0.7 -0.2 0.2 -0.1 0.5 -0.1 0.7 -0.2 0.2 -0.1 0.3 -0.1 0.5 -0.2 0.2 -0.1 0.4 -0.2 0.7 -0.2 0.2 -0.1 0.3 -0.1 0.5 -0.2 0.2 -0.1 0.5 -0.2 0.7 -0.3 0.1 -0.1 0.3 -0.1 0.4 -0.2 0.3 -0.1 0.5 -0.2 0.8 -0.3 0.1 -0 0.2 -0.1 0.3 -0.1 0.3 -0.1 0.5 -0.2 0.8 -0.3 0.1 -0 0.2 -0.1 0.3 -0.1 0.3 -0.1 0.5 -0.2 0.8 -0.4 0.1 -0 0.2 -0.1 0.3 -0.1 0.3 -0.1 0.5 -0.3 0.8 -0.4 0.1 -0 0.2 -0.1 0.3 -0.1 0.3 -0.1 0.6 -0.3 0.9 -0.5 0.1 -0 0.1 -0.1 0.2 -0.1 0.3 -0.2 0.6 -0.3 0.9 -0.5 0.1 -0 0.1 -0.1 0.2 -0.1 0.3 -0.2 0.6 -0.3 0.9 -0.5 0 -0 0.1 -0.1 0.1 -0.1 0.6 -0.4 1.3 -0.8 1.9 -1.2 0 -0 0.1 -0 0.1 -0.1 0.3 -0.2 0.6 -0.4 0.9 -0.6 0 -0 0 -0 0 -0 0.3 -0.2 0.6 -0.4 0.9 -0.6 0 -0 0.1 -0 0.1 -0.1 0.3 -0.2 0.5 -0.4 0.8 -0.6 0.1 -0 0.1 -0.1 0.2 -0.1 0.3 -0.2 0.5 -0.4 0.8 -0.6 0 -0 0.1 -0.1 0.1 -0.1 0.9 -0.8 1.8 -1.5 2.7 -2.4 0 -0 0 -0 0 -0 0.3 -0.3 0.6 -0.5 0.8 -0.8 0 -0 0 -0 0 -0 0.8 -0.8 1.6 -1.7 2.4 -2.6 0 -0 0 -0 0 -0 0.2 -0.3 0.5 -0.5 0.7 -0.8 0 -0 0.1 -0.1 0.1 -0.1 0.2 -0.3 0.5 -0.6 0.7 -0.9 0 -0 0 -0 0 -0 0.2 -0.3 0.4 -0.6 0.7 -0.9 0 -0 0 -0.1 0.1 -0.1 2.6 -3.5 4.8 -7.3 6.5 -11.5 0 -0 0 -0 0 -0 2.3 -5.6 3.8 -11.8 3.8 -18.1583l0.00354332 0 0 -35.3 16.8 0 0 83.3 33.2 0 0 -83.3 66.8 0 0 83 33.4 0 0 -83 100.1 0 0 -33.4 -100.1 0 0 -33.5363c-0.00118111 -0 -0 -0 -0 -0 0 -9.1 7.5 -16.6 16.6 -16.6 9.1 0 16.6 7.6 16.6 16.7 -0 0 0 -0 0 -0.0118111l0 16.8 33.4 0 0 -16.8 -0 0c0 -27.5 -22.4 -49.9 -49.9 -49.9 -0.4 0 -0.9 0 -1.3 0 -0 0 -0 0 -0 0 -0.4 0 -0.8 0 -1.3 0 -0 0 -0 0 -0 0 -0.4 0 -0.8 0 -1.2 0.1 -0 0 -0 0 -0 0 -0.4 0 -0.8 0.1 -1.2 0.1 -0 0 -0 0 -0 0 -0.4 0 -0.8 0.1 -1.2 0.1 -0 0 -0 0 -0 0 -0.4 0.1 -0.8 0.1 -1.2 0.2 -0 0 -0 0 -0 0 -0.2 0 -0.5 0.1 -0.7 0.1 -0.2 0 -0.4 0.1 -0.6 0.1 -0.1 0 -0.3 0.1 -0.4 0.1 -0.3 0.1 -0.5 0.1 -0.8 0.2 -0.1 0 -0.2 0 -0.3 0.1 -0.3 0.1 -0.6 0.1 -0.9 0.2 -0.1 0 -0.1 0 -0.2 0 -0.3 0.1 -0.7 0.2 -1 0.2 -0.1 0 -0.3 0.1 -0.4 0.1 -0.3 0.1 -0.6 0.1 -0.8 0.2 -0.1 0 -0.1 0 -0.2 0.1 -0.3 0.1 -0.6 0.2 -1 0.3 -0.3 0.1 -0.6 0.2 -0.8 0.3 -0.1 0 -0.2 0.1 -0.3 0.1 -0.3 0.1 -0.5 0.2 -0.8 0.3 -0.1 0 -0.3 0.1 -0.4 0.1 -0.2 0.1 -0.4 0.1 -0.6 0.2 -0.2 0.1 -0.4 0.1 -0.6 0.2 -0.2 0.1 -0.4 0.1 -0.5 0.2 -0.2 0.1 -0.4 0.2 -0.6 0.2 -0.2 0.1 -0.3 0.2 -0.5 0.2 -0.2 0.1 -0.4 0.2 -0.6 0.3 -0.1 0.1 -0.3 0.1 -0.4 0.2 -0.2 0.1 -0.5 0.2 -0.7 0.3 -0.2 0.1 -0.3 0.2 -0.5 0.2 -0.2 0.1 -0.4 0.2 -0.6 0.3 -0.2 0.1 -0.5 0.2 -0.7 0.4 -0.1 0.1 -0.3 0.1 -0.4 0.2 -0.2 0.1 -0.5 0.3 -0.7 0.4 -0.1 0.1 -0.2 0.1 -0.3 0.2 -0.3 0.2 -0.6 0.4 -0.9 0.5 -0 0 -0 0 -0.1 0 -0.3 0.2 -0.6 0.4 -1 0.6 -0 0 -0 0 -0.1 0 -0.3 0.2 -0.6 0.4 -1 0.6 -0 0 -0 0 -0 0 -0.3 0.2 -0.6 0.4 -0.9 0.6 -0 0 -0 0 -0 0 -0.3 0.2 -0.6 0.4 -0.9 0.6 -0 0 -0.1 0 -0.1 0.1 -0.3 0.2 -0.6 0.4 -0.9 0.6 -0 0 -0.1 0.1 -0.1 0.1 -0.3 0.2 -0.6 0.4 -0.8 0.7 -0 0 -0.1 0.1 -0.1 0.1 -1.2 1 -2.4 2 -3.5 3.1 -0 0 -0 0 -0 0 -1.1 1.1 -2.2 2.3 -3.2 3.5 -0 0 -0 0 -0 0 -0.2 0.3 -0.5 0.6 -0.7 0.9 -0 0 -0 0 -0 0 -0.2 0.3 -0.5 0.6 -0.7 0.9 -0 0 -0 0 -0 0 -0.2 0.3 -0.5 0.6 -0.7 0.9 -0 0 -0 0 -0 0 -0.2 0.3 -0.4 0.6 -0.7 0.9 -0 0 -0 0 -0 0 -0.2 0.3 -0.4 0.6 -0.6 0.9 -0 0 -0 0.1 -0.1 0.1 -1.7 2.6 -3.2 5.4 -4.4 8.4 -0 0 -0 0.1 -0.1 0.1 -0.1 0.3 -0.3 0.7 -0.4 1 -0 0 -0 0.1 -0 0.1 -0.1 0.4 -0.3 0.7 -0.4 1.1 -0 0 -0 0 -0 0 -0.1 0.4 -0.3 0.8 -0.4 1.1 -0 0 -0 0 -0 0 -0.1 0.4 -0.2 0.8 -0.3 1.1 -0 0 -0 0 -0 0 -0.1 0.4 -0.2 0.8 -0.3 1.2 0 0 -0 0 -0 0 -0.2 0.8 -0.4 1.6 -0.6 2.4 -0 0 -0 0 -0 0 -0.1 0.4 -0.2 0.8 -0.2 1.2 -0 0 -0 0 -0 0 -0.1 0.4 -0.1 0.8 -0.2 1.2 -0 0 -0 0 -0 0.1 -0.1 0.4 -0.1 0.7 -0.2 1.1 -0 0 -0 0.1 -0 0.1 -0.1 0.4 -0.1 0.8 -0.1 1.2 -0 0 -0 0 -0 0.1 -0 0.4 -0.1 0.7 -0.1 1.1 -0 0.1 -0 0.1 -0 0.2 -0 0.4 -0.1 0.8 -0.1 1.2 -0 0 -0 0 -0 0.1 -0 0.4 -0 0.8 -0.1 1.2 -0 0 -0 0 -0 0.1 -0 0.4 -0 0.8 -0 1.2 0 0 0 0 0 0.0271655l-0.160631 0 0 34.1 -66.8 0 -0 -33.7147c0 0 0 0 0 0 0 -9.1 7.6 -16.7 16.7 -16.7 9.1 0 16.6 7.4 16.6 16.6 0 0.2 -0 0.5 -0 0.726381l0 16.5603z"/>
+</svg>

data/app/assets/javascripts/barras_rails/barras_rails.js

@@ -0,0 +1,352 @@
+/*
+ * Módulo JavaScript da API BarrasUFF.
+ * Este módulo adiciona a funcionalidade de um layout responsivo para a barra de
+ * aplicações. O número de links visíveis na barra será ajustado de acordo com o
+ * tamanho da janela do usuário, ou de acordo com um limite de links visíveis.
+ *
+ * Este módulo depende do jQuery para funcionar.
+ *
+ * Autor: Rodrigo Castro
+ * Criado em: 07/08/2015
+ * Atualizado em: 11/08/2015
+ */
+
+// Apenas carrega o módulo se o jQuery estiver carregado
+if (typeof jQuery != 'undefined') {
+    jQuery(window).on('turbolinks:load load', function() {
+        var barraAplicacoes = BarrasRails.iniciar();
+
+        if (barraAplicacoes != null) {
+            jQuery(window).resize(function () {
+                barraAplicacoes.recalcularLayout();
+            });
+        }
+    });
+
+    var BarrasRails = (function($) {
+        var _barraAplicacoes, _barraAplicacoesNav, _submenu;
+        var _limiteAppsVisiveis = 0;
+
+        // Um objeto que vai conter as 2 funções públicas do módulo.
+        // Esse objeto será retornado para a aplicação
+        var moduloBarrasRails = {};
+
+        /**
+         * Inicia BarrasRails, fazendo o posicionamento inicial dos links.
+         *
+         * @returns {Object} O módulo BarrasRails
+         */
+        moduloBarrasRails.iniciar = function() {
+            _setarVariaveisIniciais();
+            if (_barraAplicacoes.data('initialized') === 'true') {
+                alert('ieie');
+                return null;
+            }
+            _barraAplicacoesNav.css('visibility', 'visible');
+            moduloBarrasRails.recalcularLayout();
+            return moduloBarrasRails;
+        };
+
+        /**
+         * Refaz o cálculo do layout e posicionamento dos links, de acordo com o
+         * tamanho da página e com o limite manual setado pelo usuário
+         */
+        moduloBarrasRails.recalcularLayout = function() {
+            // Começa normalizando a barra e atualizando os separadores
+            _normalizarBarra();
+            _atualizarSeparadores();
+
+            // Define quantos e quais links permanecerão visíveis na barra, e
+            // move para o submenu os que não serão visíveis
+            _definirLinksVisiveis();
+
+            // Checa a visibilidade do submenu e recria os separadores.
+            _visibilidadeSubmenu();
+            _atualizarSeparadores();
+        };
+
+        // =====================================================================
+        // | Funções privadas (não podem ser chamadas de fora deste módulo)    |
+        // =====================================================================
+
+        /**
+         * Inicializa as variáveis internas necessárias para funcionar.
+         *
+         * @private
+         */
+        var _setarVariaveisIniciais = function() {
+            _barraAplicacoes = $("#barra-aplicacoes");
+            _barraAplicacoes.prop('data-initialized', 'true');
+            _barraAplicacoesNav = _barraAplicacoes.find("#nav");
+            _submenu = $("#outras-aplicacoes");
+            _limiteAppsVisiveis = _barraAplicacoes.data('limite-apps-visiveis');
+            if (!_limiteAppsVisiveis) { _limiteAppsVisiveis = 0; }
+        };
+
+        /**
+         * Reseta a barra, removendo todos os links de aplicações do submenu e
+         * colocando-os na barra, e também remove todos os separadores.
+         *
+         * @private
+         */
+        var _normalizarBarra = function() {
+            _barraAplicacoesNav.children(".sep").remove();
+            var itemsSubmenu = _submenu.find("ul").children();
+            _moverParaBarra(itemsSubmenu);
+        };
+
+        /**
+         * Calcula quantos links podem ficar visíveis, aplicando as 2 regras de
+         * visibilidade: limite manual e tamanho da página.
+         *
+         * Primeiro calcula o index do primeiro elemento a ser movido para o
+         * submenu, pelo limite manual.
+         * Depois calcula o mesmo index do último elemento que cabe na tela.
+         * No final, pega o menor dos índices e move todos os links a partir do
+         * índice calculado para o submenu.
+         *
+         * @private
+         */
+        var _definirLinksVisiveis = function() {
+            // Pega os links da barra e verifica o limite manual e de largura
+            var links = _barraAplicacoesNav.children(":not(.sep, .dir)");
+            var indexLimManual = _verificarLimiteManualDeLinks();
+            var indexLimLargura = _indexUltimoElementoQueCabe(links);
+
+            // Calcula o index final e move os links de acordo com esse index
+            var indexFinal = Math.min(indexLimManual, indexLimLargura);
+            _moverParaSubmenu(links, indexFinal + 1);
+        };
+
+        /**
+         * Caso exista um limite manual para o número de links visíveis na barra
+         * "principal", essa função vai retornar esse limite. Caso o limite não
+         * exista, ela retorna "infinito".
+         *
+         * @returns {number} O limite de apps, entre 1 e "infinito"
+         *
+         * @private
+         */
+        var _verificarLimiteManualDeLinks = function() {
+            if (_limiteAppsVisiveis > 0) { return _limiteAppsVisiveis - 1; }
+            return Infinity;
+        };
+
+        /**
+         * Move links de aplicações da barra principal para dentro do submenu,
+         * começando pelo elemento de indexInicial até o último link da barra.
+         *
+         * @param elementos {Object} Uma lista jQuery contendo os links que
+         * estão fora do submenu
+         * @param indexInicial {number} Um número indicando qual o index do
+         * primeiro elemento que deve ser movido para o submenu. Todos os
+         * elementos entre startIndex e o final serão movidos para o submenu.
+         *
+         * @private
+         */
+        var _moverParaSubmenu = function(elementos, indexInicial) {
+            var ulSubmenu = _submenu.find("ul");
+            for (var index = indexInicial; index < elementos.length; index++) {
+                ulSubmenu.append($(elementos[index]).clone());
+                $(elementos[index]).remove();
+            }
+        };
+
+        /**
+         * Move uma lista de links de aplicações do submenu para a barra
+         * principal (fora do submenu). Os elementos movidos são removidos do
+         * submenu e adicionados à barra, sendo posicionados um a um logo antes
+         * do <li> que corresponde ao submenu.
+         *
+         * @param elementos {Object} Uma lista jQuery contendo os links do
+         * submenu
+         *
+         * @private
+         */
+        var _moverParaBarra = function(elementos) {
+            elementos.each(function(index) {
+                // Clona cada elemento para antes do <li> do dropdown
+                _submenu.before($(elementos[index]).clone());
+            });
+            // Remove os elementos antigos
+            elementos.remove();
+        };
+
+        /**
+         * Seta a visibilidade do submenu de acordo com o número de links dentro
+         * dele. Caso não haja nenhum link no submenu, ele será escondido, e
+         * vice-versa.
+         *
+         * @private
+         */
+        var _visibilidadeSubmenu = function() {
+            var numLinksSubmenu = _submenu.find("ul").children().length;
+            (numLinksSubmenu == 0) ? _submenu.hide() : _submenu.show();
+        };
+
+        /**
+         * Calcula e retorna o espaço da barra de aplicações que é destinado aos
+         * links de aplicação. Isso significa retornar a largura da página
+         * inteira (<body>), e tirar a largura e margens do logo da UFF e do
+         * link de deslogar.
+         *
+         * @returns {number} A medida, em pixels, equivalente à largura da
+         * página menos a largura do logo da UFF e do link de deslogar.
+         *
+         * @private
+         */
+        var _espacoParaAplicacoes = function() {
+            var larguraPagina = $("body").width();
+            var larguraLogo = _barraAplicacoes.find("svg").outerWidth(false);
+            var larguraDeslogar = _barraAplicacoes.find(".dados")
+                .outerWidth(false);
+            return larguraPagina - (larguraLogo + larguraDeslogar);
+        };
+
+        /**
+         * Retorna o index do último elemento da barra de aplicações que cabe
+         * sem precisar ser movido para o submenu de "Outras Aplicações".
+         * O último elemento que cabe é o último elemento que pode permanecer
+         * na barra sem que o HTML automaticamente quebre-a em 2 ou mais linhas.
+         *
+         * @param elementos {Object} Um array jQuery contendo os links que estão
+         * na barra principal.
+         *
+         * @returns {number} O index do último elemento da lista de aplicativos
+         * que não ultrapassa o limite horizontal da linha especificado.
+         *
+         * @private
+         */
+        var _indexUltimoElementoQueCabe = function(elementos) {
+            // Começa do último elemento
+            var largura = _espacoParaAplicacoes();
+            var numElementos = elementos.length;
+            var ultimoIndexQueCabe = numElementos - 1;
+            var elementoAtual = elementos[ultimoIndexQueCabe];
+            var i = 1;
+            if (numElementos > 1) {
+                // Adicionamos 5px para dar uma "folga" (leia-se: gambiarra)
+                var largMenosSub = largura - (_submenu.outerWidth(false) + 5);
+                while (!_elementoCabeNaLinha(elementoAtual, largMenosSub)) {
+                    // Enquando o elemento atual não cabe na linha, vamos
+                    // percorrendo o array de trás pra frente até encontrar um
+                    // que caiba.
+                    i++;
+                    if (i > numElementos) { break; }
+                    elementoAtual = elementos[numElementos - i];
+                }
+                // Quando encontramos um elemento que cabe, setamos o index.
+                ultimoIndexQueCabe = (numElementos - i);
+            }
+            return ultimoIndexQueCabe;
+        };
+
+        /**
+         * Verifica se um elemento vai ultrapassar o limite do tamanho
+         * horizontal da página, considerando tanto a posição quanto o tamanho
+         * dele (calcula em cima da posição do seu limite direito).
+         * Essa função usa a posição real do elemento na barra, como se todos os
+         * links estivessem ocupando a mesma linha (o que nem sempre é verdade,
+         * pois se der overflow o HTML vai quebrar em 2 ou mais linhas).
+         *
+         * @param elemento {HTMLElement} Um link de aplicação (elemento <li>)
+         * @param largura {number} O tamanho do espaço para links da barra.
+         *
+         * @returns {boolean} True se o elemento cabe na linha com a largura
+         * especificada, ou false se ultrapassa o tamanho da linha.
+         *
+         * @private
+         */
+        var _elementoCabeNaLinha = function(elemento, largura) {
+            var posicaoMargemEsquerda = _posicaoHorizontal(elemento, largura);
+            var larguraElemento = $(elemento).width();
+            var posicaoMargemDireita = posicaoMargemEsquerda + larguraElemento;
+            return posicaoMargemDireita < largura;
+        };
+
+        /**
+         * Retorna a posição horizontal real de um elemento. Isso é necessário
+         * pois quando há links demais na barra, ela quebra em 2 ou mais linhas,
+         * e quando isso acontece, a função elemento.left retorna a posição left
+         * do elemento em relação à margem esquerda da linha em que ele se
+         * encontra, sem levar em conta toda a largura que ele já ocupou, em
+         * teoria, da primeira linha. Essa função tem como objetivo calcular a
+         * posição horizontal do elemento, como se ele não tivesse quebrado em
+         * mais de uma linha, e como se tudo da barra estivesse em uma linha só.
+         *
+         * @param elemento {HTMLElement} Um link de aplicação (elemento <li>)
+         * @param largura {number} O tamanho do espaço para links da barra.
+         *
+         * @returns {number} A posição horizontal (position.left) real do
+         * elemento. Se a linha quebrar e o elemento estiver na segunda linha,
+         * por exemplo, retornará a largura da primeira linha mais a posição
+         * dele na segunda linha.
+         *
+         * @private
+         */
+        var _posicaoHorizontal = function(elemento, largura) {
+            if (elemento) {
+                var posicao = $(elemento).position();
+                var indexLinha = Math.round(posicao.top / 28.0);
+                return (indexLinha * largura) + posicao.left;
+            }
+        };
+
+        /**ge
+         * Atualiza os separadores verticais da barra de aplicação, que ficam
+         * entre os links. Essa função remove os separadores existentes e cria
+         * novos separadores entre os links.
+         * Isso é necessário pois quando um link é passado para o submenu, o
+         * separador permanece, e acaba tendo um acúmulo de separadores um do
+         * lado do outro. Essa função normaliza os separadores.
+         *
+         * @private
+         */
+        var _atualizarSeparadores = function() {
+            // Remove os separadores antigos
+            _barraAplicacoesNav.children(".sep").remove();
+            // Cria separadores novos
+            var elementos = _barraAplicacoesNav.children(":visible");
+            for (var i = 0; i < elementos.length - 1; i++) {
+                $(elementos[i]).after(_criarSeparador());
+            }
+        };
+
+        /**
+         * Cria um separador vertical para a barra de aplicações.
+         *
+         * @returns {HTMLElement} Um novo elemento <li> com a classe "sep"
+         *
+         * @private
+         */
+        var _criarSeparador = function() {
+            var li = document.createElement("li");
+            li.className = "sep";
+            return li;
+        };
+
+        /**
+         * Cria e retorna um elemento <li> contendo um link de aplicação.
+         *
+         * @param id O id do link_aplicacao
+         * @param nome A label do link
+         * @param url A url para o link
+         *
+         * @private
+         */
+        var _criarLinkAplicacao = function(id, nome, url) {
+            var li = document.createElement("li");
+            var anchor = document.createElement("a");
+            anchor.innerHTML = nome;
+            anchor.href = url;
+            $(anchor).attr("data-id", id);
+            li.appendChild(anchor);
+            return li;
+        };
+
+        return moduloBarrasRails;
+    }(jQuery));
+} else {
+    // Se o jQuery não estiver carregado, exibir um erro no console
+    console.error("BarrasRails JS não foi carregado: jQuery não encontrado");
+}

data/app/assets/stylesheets/barras_rails/barra_de_aplicacoes.css

@@ -0,0 +1,143 @@
+@charset "UTF-8";
+
+/*
+ * Folha de estilos para a barra de aplicações única dos sistemas da STI UFF.
+ *
+ * Autor: Rodrigo Castro Azevedo
+ * Criado em: 07/08/2015
+ * Atualizado em: 11/08/2015
+ */
+
+svg {
+    -webkit-box-sizing: border-box;
+    -moz-box-sizing: border-box;
+    box-sizing: border-box;
+}
+
+#barra-aplicacoes {
+    background-color: #2A68AF;
+    color: white;
+    height: 28px;
+    box-shadow: 0 2px 4px #282828;
+    -moz-box-shadow: 0 2px 4px #282828;
+    -webkit-box-shadow: 0 2px 4px #282828;
+    font-family: Helvetica, Arial, sans-serif;
+    font-size: 11px;
+}
+
+#barra-aplicacoes svg {
+    -webkit-transition: background-color .3s ease, box-shadow .3s ease;
+    -moz-transition: background-color .3s ease, box-shadow .3s ease;
+    -o-transition: background-color .3s ease, box-shadow .3s ease;
+    transition: background-color .3s ease, box-shadow .3s ease;
+    width: 70px;
+    height: 28px;
+    float: left;
+    padding: 4px 5px;
+}
+
+#barra-aplicacoes svg:hover, .dados a:hover {
+    -webkit-box-shadow: 0 -3px 0 0 #4187D1 inset;
+    -moz-box-shadow: 0 -3px 0 0 #4187D1 inset;
+    box-shadow: 0 -3px 0 0 #4187D1 inset;
+    background-color: #1D5BA2;
+    color: white;
+}
+
+#barra-aplicacoes a { text-decoration:none; }
+
+.shadow { position: relative; z-index: 999; }
+
+.dados {
+    display: block;
+    float: right;
+    font-size: 10px;
+}
+
+.dados a {
+    -webkit-transition: background-color .3s ease, box-shadow .3s ease;
+    -moz-transition: background-color .3s ease, box-shadow .3s ease;
+    -o-transition: background-color .3s ease, box-shadow .3s ease;
+    transition: background-color .3s ease, box-shadow .3s ease;
+    display: block;
+    color: white;
+    line-height: 28px;
+    padding: 0 15px;
+}
+
+ul.dropdown, ul.dropdown li, ul.dropdown ul {
+    margin: 0;
+    padding: 0;
+    list-style-type: none;
+}
+
+ul.dropdown {
+    font-weight: normal;
+    position: relative;
+    z-index: 597;
+    float: left;
+}
+
+ul.dropdown ul {
+    height: 28px;
+    width: 150%;
+    margin-top: 1px;
+    visibility: hidden;
+    position: absolute;
+    top: 95%;
+    left: -25%;
+    z-index: 598;
+}
+
+ul.dropdown ul ul { top: 1px; left: 99%; }
+ul.dropdown ul li { font-weight: normal; float: none; }
+ul.dropdown ul li:hover {
+    -webkit-box-shadow: 0 0 0 white;
+    -moz-box-shadow: 0 0 0 white;
+    box-shadow: 0 0 0 white;
+}
+
+ul.dropdown li {
+    -webkit-transition: background-color .3s ease, box-shadow .3s ease;
+    -moz-transition: background-color .3s ease, box-shadow .3s ease;
+    -o-transition: background-color .3s ease, box-shadow .3s ease;
+    transition: background-color .3s ease, box-shadow .3s ease;
+    line-height: 28px;
+    float: left;
+    vertical-align: middle;
+    zoom: 1;
+    border-color: #fff #d9d9d9 #d9d9d9;
+    background-color: #2A68AF;
+    color: white;
+}
+
+ul.dropdown li.hover, ul.dropdown li:hover {
+    position: relative;
+    z-index: 599;
+    cursor: default;
+    background-color: #1D5BA2;
+    -webkit-box-shadow: 0 -3px 0 0 #4187D1 inset;
+    -moz-box-shadow: 0 -3px 0 0 #4187D1 inset;
+    box-shadow: 0 -3px 0 0 #4187D1 inset;
+}
+
+ul.dropdown li a { display: block; padding: 0 10px; }
+
+ul.dropdown li.sep:hover {
+    -webkit-box-shadow: 0 0 0 white;
+    -moz-box-shadow: 0 0 0 white;
+    box-shadow: 0 0 0 white;
+    background-color: #2A68AF;
+}
+
+ul.dropdown li.sep:after{
+    content: "|";
+}
+
+ul.dropdown li.dir { line-height: 27px; padding: 0 10px; }
+ul.dropdown li:hover > ul { visibility: visible; }
+ul.dropdown a { display: block; }
+ul.dropdown a:link, ul.dropdown a:visited {
+    color: white;
+    text-decoration: none;
+}

data/app/assets/stylesheets/barras_rails/barra_do_governo.css

@@ -0,0 +1,140 @@
+/*
+ * Folha de estilos para a barra do governo atual.
+ * Esse arquivo deve ser atualizado junto com a barra do governo, quando esta
+ * for atualizada.
+ *
+ * Autor: Rodrigo Castro Azevedo
+ * Criado em: 07/08/2015
+ * Atualizado em: 19/07/2016
+ */
+
+@font-face {
+    font-family: "Open Sans";
+    font-style: normal;
+    font-weight: 700;
+    src: local('Open Sans Bold'), local('OpenSans-Bold'), url(https://fonts.gstatic.com/s/opensans/v13/k3k702ZOKiLJc3WVjuplzOgdm0LZdjqr5-oayXSOefg.woff2) format('woff2');
+}
+
+#barra-brasil div, #barra-brasil a, #barra-brasil ul, #barra-brasil li {
+    margin: 0;
+    padding: 0;
+    font-size: 100%;
+    font-family: inherit;
+    vertical-align: baseline;
+}
+
+#barra-brasil ul { list-style: none; }
+
+#barra-brasil {
+    height: 32px;
+    background: #f1f1f1;
+    font-weight: bold;
+    font-size: 12px;
+    line-height: 32px;
+    font-family: "Open Sans", Helvetica, Arial, sans-serif;
+    border-bottom: 1px solid #dfdfdf;
+    box-sizing: content-box;
+}
+
+#barra-brasil a { text-decoration: none; }
+body.contraste #barra-brasil { background: #000; }
+
+div#wrapper-barra-brasil {
+    position: relative;
+    overflow: hidden;
+    margin: 0 auto;
+    width: 100%;
+    max-width: 960px;
+    height: 100%;
+}
+
+#barra-brasil .brasil-flag {
+    float: left;
+    padding: 7px 0 6px;
+    width: 115px;
+    height: 19px;
+    border-right: 2px solid #dfdfdf;
+}
+
+#barra-brasil .brasil-flag .link-barra {
+    display: block;
+    padding-left: 42px;
+    width: 43px;
+    background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABoAAAATCAMAAAC5m+00AAAABGdBTUEAALGPC/xhBQAAAAFzUkdCAK7OHOkAAACrUExURQCXSF27iQCWRQOWSQCWSRCdVACSSgCWRwCVSRKcVv/oAP/yAAIvh/bjBQKVTP/rAK3PF/3sARZBkg05ima2LCqiPg+ZRR9JoermBbGwLwEqkgCST1GwMRqdQZfIHdzgCSdSlTlYbEWrNyNKeouUPHOgtEJsn2WOrSClX2m/lF+6i3q8JsDVEBpCgWN2WefTD8i/IYSstzKmO3eIUaa2h3SOjfvlHjVfq6OmNShvDYIAAAFISURBVCjPbVHXksMgDNQBljC4l9iOndjp5VKv//+XnXByb7fDADO7rNAK9v4DngPv/h/24BHBuEhqB3pCeUxJIAWKtMZlIVCTciogH3yhWMpinM2t7ZctS5UgAR74kVICpMauNrfmaucTpMj5e+4VUNTOEvuzCoL8EvZLJCH1SIHAqKjtehowposwTmbIcqZIt+UpNV/3zWa3HYLp2sZ1gegoPXkNU5M238Ow3d132cIYEyel9MHDLo2NcX4519puPkPmbOIowrdTbGyTZXk2BEH1kZo4LPSjFgq2DFcVc3lWNZbt2rGWIIiwTOztzJZV9W77glCp8RsSNHdc1NfL6rxoxp5JCcmUC1cJjdx0GKZ1hxq0eqYBkuPlzLHrjXuiOAwaDUGQFJyWBpyU7EUaQI/xckGeA98jksqNQLmp8BnB4Xh8+ReHX640GNLt25uiAAAAAElFTkSuQmCC") 8px center no-repeat;
+    text-transform: uppercase;
+    line-height: 19px;
+}
+
+#barra-brasil .acesso-info { position: absolute; left: 130px; }
+#barra-brasil .list { position: absolute; top: 0; right: 0; }
+#barra-brasil .list .first { border-left: 2px solid #dfdfdf; }
+#barra-brasil .list-item {
+    display: inline-block;
+    padding: 0 15px 0 13px;
+    height: 32px;
+    line-height: 32px;
+    border-right: 2px solid #dfdfdf;
+}
+
+#barra-brasil .link-barra { color: #606060; }
+body.contraste #barra-brasil .link-barra { color: #FFF; }
+
+#menu-icon {
+    display: none;
+    width: 35px;
+    height: 22px;
+    background: #f1f1f1 url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABkAAAAZBAMAAAA2x5hQAAAAJ1BMVEUAAABubm5ubm5ubm5ubm5ubm5ubm5ubm5vb29ubm5ubm5ubm5ubm5Wlu/fAAAADHRSTlMA6ioQ1wqDzlIj9Vz4BBXdAAAAR0lEQVQY02PAB1izzsCABAMD0xk4OIjOY053gYFqoMZIJRiYwIAfBBvDgAHQvkRBGPDAZx+qSjRT8ABUl6G6Gp99aCFBPAAA++pVuwpeGZsAAAAASUVORK5CYII=") no-repeat center;
+    border-bottom: 1px solid #DFDFDF;
+}
+
+@media only screen and (max-width: 959px) {
+    #barra-brasil #menu-icon {
+        display: inline-block;
+        float: right;
+        padding: 5px;
+    }
+
+    #barra-brasil nav:hover #menu-icon, #barra-brasil nav:active #menu-icon, #barra-brasil nav:focus #menu-icon {
+        background-color: #DDD;
+    }
+
+    #barra-brasil ul.list, #barra-brasil ul.list:active, #barra-brasil ul.list:focus {
+        overflow: hidden;
+        height: 0;
+        transition: 0.3s;
+        padding-top: 32px;
+        width: auto;
+        position: absolute;
+        z-index: 9;
+    }
+
+    #barra-brasil .list-item {
+        display: block;
+        text-align: center;
+        height: 30px;
+        background: #EEE;
+        padding: 0 15px;
+        border: 1px solid #dfdfdf;
+    }
+
+    body.contraste #barra-brasil .list-item { background: #000; }
+
+    #barra-brasil .list a:active li, #barra-brasil .list a:focus li, #barra-brasil .list a:hover li {
+        background: #DDD;
+    }
+
+    body.contraste #barra-brasil .list a:active li, body.contraste #barra-brasil .list a:focus li, body.contraste #barra-brasil .list a:hover li {
+        background: #000;
+    }
+
+    #barra-brasil nav:active ul.list, #barra-brasil nav:focus ul.list, #barra-brasil nav:hover ul.list {
+        height: 150px;
+        transition: 0.5s;
+    }
+
+    div#wrapper-barra-brasil { overflow: visible; }
+}
+
+@media screen and (min-width: 960px) {
+    #wrapper-barra-brasil { width: 960px; }
+}