I noticed a weird page jump in the piggy bank section so it seemed a good moment to clean up some javascript.

public/js/piggy-banks/index.js

@@ -1,12 +1,23 @@
+/*
+ * index.js
+ * Copyright (C) 2016 Sander Dorigo
+ *
+ * This software may be modified and distributed under the terms
+ * of the MIT license.  See the LICENSE file for details.
+ */
+
 /* globals $, lineChart, token, piggyBankID */
 
 // Return a helper with preserved width of cells
-var fixHelper = function (e, ui) {
+var fixHelper = function (e, tr) {
     "use strict";
-    ui.children().each(function () {
+    var $originals = tr.children();
-        $(this).width($(this).width());
+    var $helper = tr.clone();
+    $helper.children().each(function (index) {
+        // Set helper cell sizes to match the original sizes
+        $(this).width($originals.eq(index).width());
     });
-    return ui;
+    return $helper;
 };
 
 $(function () {
@@ -14,10 +25,6 @@ $(function () {
     $('.addMoney').on('click', addMoney);
     $('.removeMoney').on('click', removeMoney);
 
-    if (typeof(lineChart) === 'function' && typeof(piggyBankID) !== 'undefined') {
-        lineChart('chart/piggy-bank/' + piggyBankID, 'piggy-bank-history');
-    }
-
     $('#sortable tbody').sortable(
         {
             helper: fixHelper,

public/js/piggy-banks/show.js

@@ -0,0 +1,16 @@
+/*
+ * show.js
+ * Copyright (C) 2016 Sander Dorigo
+ *
+ * This software may be modified and distributed under the terms
+ * of the MIT license.  See the LICENSE file for details.
+ */
+
+/* globals $, lineChart, piggyBankID */
+
+$(function () {
+    "use strict";
+    if (typeof(lineChart) === 'function' && typeof(piggyBankID) !== 'undefined') {
+        lineChart('chart/piggy-bank/' + piggyBankID, 'piggy-bank-history');
+    }
+});

resources/views/piggy-banks/index.twig

@@ -41,7 +41,7 @@
                         <tbody>
                         {% for id,info in accounts %}
                             <tr>
-                                <td><a href="{{ route('accounts.show',id) }}">{{ info.name }}</a></td>
+                                <td><a href="{{ route('accounts.show',id) }}" title="{{ info.name }}">{{ info.name }}</a></td>
                                 <td class="hidden-sm hidden-xs">{{ info.balance|formatAmount }}</td>
                                 <td>{{ info.leftForPiggyBanks|formatAmount }}</td>
                                 <td class="hidden-sm hidden-xs">{{ info.sumOfTargets|formatAmount }}</td>
@@ -57,6 +57,6 @@
     </div>
 {% endblock %}
 {% block scripts %}
-    <script src="js/jquery-ui.min.js" type="text/javascript"></script>
+    <script src="js/lib/jquery-ui.min.js" type="text/javascript"></script>
-    <script type="text/javascript" src="js/piggy-banks.js"></script>
+    <script type="text/javascript" src="js/piggy-banks/index.js"></script>
 {% endblock %}

resources/views/piggy-banks/show.twig

@@ -94,5 +94,5 @@
 
     <script type="text/javascript" src="js/Chart.min.js"></script>
     <script type="text/javascript" src="js/charts.js"></script>
-    <script type="text/javascript" src="js/piggy-banks.js"></script>
+    <script type="text/javascript" src="js/piggy-banks/show.js"></script>
 {% endblock %}