diff options
Diffstat (limited to 'static/js/kosten.js')
| -rw-r--r-- | static/js/kosten.js | 520 |
1 files changed, 263 insertions, 257 deletions
diff --git a/static/js/kosten.js b/static/js/kosten.js index 7d6582c..a3bb3b6 100644 --- a/static/js/kosten.js +++ b/static/js/kosten.js @@ -1,284 +1,290 @@ -// Generated by LiveScript 1.4.0 -(function(){ - var jq, setLang, extendDate, addJS, showJS, statJS, catsJS, out$ = typeof exports != 'undefined' && exports || this; - jQuery.fn.extend({ +"use strict"; + +{ + +jQuery.fn.extend({ copy: function(){ return this.clone().removeAttr('id class'); } }); - String.prototype.splitAt = function(pos){ + +String.prototype.splitAt = function(pos){ return [this.slice(0, pos), this.slice(pos)]; - }; - Date.prototype.format = function(){ +}; + +Date.prototype.format = function(){ return $.datepicker.formatDate('dd.mm.yy', this); - }; - jq = function(f){ - return function(){ - $(f); - }; - }; - setLang = function(){ +}; + +let jq = (f) => () => $(f); + +// Call this to localize HighCharts +let setLang = function(){ Highcharts.setOptions({ - colors: ['#2f7ed8', '#0d233a', '#8bbc21', '#910000', '#1aadce', '#492970', '#f28f43', '#77a1e5', '#c42525', '#a6c96a'], - lang: { - months: ['Januar', 'Februar', 'März', 'April', 'Mai', 'Juni', 'Juli', 'August', 'September', 'Oktober', 'November', 'Dezember'], - shortMonths: ['Jan', 'Feb', 'Mär', 'Apr', 'Mai', 'Jun', 'Jul', 'Aug', 'Sep', 'Okt', 'Nov', 'Dez'], - weekdays: ['Sonntag', 'Montag', 'Dienstag', 'Mittwoch', 'Donnerstag', 'Freitag', 'Samstag'], - rangeSelectorFrom: 'von', - rangeSelectorTo: 'bis', - rangeSelectorZoom: null, - numericSymbols: null - } + colors: ['#2f7ed8', '#0d233a', '#8bbc21', '#910000', '#1aadce', '#492970', '#f28f43', '#77a1e5', '#c42525', '#a6c96a'], + lang: { + months: ['Januar', 'Februar', 'März', 'April', 'Mai', 'Juni', 'Juli', 'August', 'September', 'Oktober', 'November', 'Dezember'], + shortMonths: ['Jan', 'Feb', 'Mär', 'Apr', 'Mai', 'Jun', 'Jul', 'Aug', 'Sep', 'Okt', 'Nov', 'Dez'], + weekdays: ['Sonntag', 'Montag', 'Dienstag', 'Mittwoch', 'Donnerstag', 'Freitag', 'Samstag'], + rangeSelectorFrom: 'von', + rangeSelectorTo: 'bis', + rangeSelectorZoom: null, + numericSymbols: null + } }); - }; - extendDate = function(input){ - var that, now, _, day, month, year; - if (that = /^([12][0-9]|3[01]|0?[1-9])(?:(0?[1-9]|1[0-2])((?:20)?[0-9][0-9])?)?$/.exec(input.val())) { - now = new Date(); - _ = that[0], day = that[1], month = that[2], year = that[3]; - year == null && (year = now.getFullYear()); - month == null && (month = now.getMonth() + 1); - if (!(year > 99)) { - year = "20" + year; - } - input.val( - new Date(year, month - 1, day).format()); +}; + +let extendDate = function(input) { + const re = /^([12][0-9]|3[01]|0?[1-9])(?:(0?[1-9]|1[0-2])((?:20)?[0-9][0-9])?)?$/; + let match, day, month, year; + + if (match = re.exec(input.val())) { + const now = new Date(); + [ , day, month, year] = match; + + if (year == null) year = now.getFullYear(); + if (month == null) month = now.getMonth() + 1; + + if (year <= 99) year = "20" + year; + + const date = new Date(year, month - 1, day).format(); + + input.val(date); } - }; - $(function(){ +}; + +let searchController = function() { $('form.search').hide(); - $('li.search').click(function(){ - var x$; - x$ = $('form.search'); - x$.toggle(); - if (x$.is(':visible')) { - $('input.search').focus(); - } + $('li.search').click(() => { + const search = $('form.search'); + search.toggle(); + if (search.is(':visible')) $('input.search').focus(); }); - $('input.search').focusout(function(){ - $('form.search').hide(); - }); - }); - out$.addJS = addJS = jq(function(){ - var x$; - x$ = $('input[name=date]'); - x$.datepicker({ - dateFormat: 'dd.mm.yy', - firstDay: 1 + + $('input.search').focusout(() => $('form.search').hide()); +}; + +$(searchController); + +var addJS = jq(() => { + const datepicker = $('input[name=date]'); + datepicker.datepicker({ + dateFormat: 'dd.mm.yy', + firstDay: 1 }); - x$.blur(function(){ - extendDate(x$); - }); - }); - out$.showJS = showJS = jq(function(){ + + datepicker.blur(() => extendDate(datepicker)); +}); + +var showJS = jq(() => { setLang(); - $(".detail .heading").click(function(){ - $(this).closest('.detail').children('.mark:first').click(); + + $(".detail .heading").click(function() { + $(this).closest('.detail').children('.mark:first').click(); }); - $(".detail > .mark").click(function(){ - if (this.src.indexOf('closed') !== -1) { - this.src = this.src.replace('closed', 'open'); - } else { - this.src = this.src.replace('open', 'closed'); - } - $(this).nextAll('.details:first').toggle(); + + $(".detail > .mark").click(function() { + if (this.src.indexOf('closed') !== -1) { + this.src = this.src.replace('closed', 'open'); + } else { + this.src = this.src.replace('open', 'closed'); + } + $(this).nextAll('.details:first').toggle(); }); + $('.details').hide(); - $('.pie').each(function(){ - var x$, k, v; - x$ = $(this); - x$.highcharts({ - title: { - text: null - }, - tooltip: { - hideDelay: 200, - formatter: function(){ - return this.key + ": <b>" + this.y.toFixed(2) + " €</b> / " + this.percentage.toFixed(2) + "%"; - } - }, - chart: { - backgroundColor: null, - plotBorderWidth: null, - plotShadow: false, - spacingTop: 0 - }, - credits: { - enabled: false - }, - series: [{ - type: 'pie', - size: '70%', - states: { - hover: { - halo: null - } - }, - allowPointSelect: true, - dataLabels: { - color: x$.css('color'), - distance: 20 - }, - data: (function(){ - var ref$, results$ = []; - for (k in ref$ = x$.data('pie')) { - v = ref$[k]; - results$.push({ - name: v > 0 ? k : '', - y: v, - visible: v > 0 - }); - } - return results$; - }()) - }] - }); + + // draw the pies + $('.pie').each(function() { + const pie = $(this); + const piedata = Object.entries(pie.data('pie')).map(([key, value]) => ( + { + name: value > 0 ? key : '', + y: value, + visible: value > 0 + })); + + pie.highcharts({ + title: { + text: null + }, + tooltip: { + hideDelay: 200, + formatter: function() { + return `${this.key}: <b>${this.y.toFixed(2)}€</b> / ${this.percentage.toFixed(2)}%`; + } + }, + chart: { + backgroundColor: null, + plotBorderWidth: null, + plotShadow: false, + spacingTop: 0 + }, + credits: { + enabled: false + }, + series: [{ + type: 'pie', + size: '70%', + states: { + hover: { + halo: null + } + }, + allowPointSelect: true, + dataLabels: { + color: pie.css('color'), + distance: 20 + }, + data: piedata + }] + }); }); - }); - out$.statJS = statJS = jq(function(){ - var df, month, constDialog; +}); + +var statJS = jq(() => { setLang(); - df = Highcharts.dateFormat; - month = 30 * 24 * 60 * 60 * 1000; - constDialog = function(){ - var time; - time = this.x; - $.get(df('/stats/_const/%Y/%m', time), function(data){ - $(data).dialog({ - title: df('%B %Y', time) - }); - }); + + const df = Highcharts.dateFormat; + const month = 30 * 24 * 60 * 60 * 1000; + + const constDialog = function() { + const time = this.x; + + $.get(df('/stats/_const/%Y/%m', time), + data => $(data).dialog({ title: df('%B %Y', time) }) + ); }; - $('.stats').each(function(){ - var x$; - x$ = $(this); - x$.highcharts('StockChart', { - credits: { - enabled: false - }, - rangeSelector: { - buttons: [], - inputDateFormat: "%b %Y", - inputEditDateFormat: "%m.%Y", - inputDateParser: function(value){ - value = value.split(/\./); - return Date.UTC(value[1], value[0] - 1, 1, 0, 0, 0, 0); - } - }, - plotOptions: { - series: { - stacking: 'normal', - marker: { - enabled: false, - radius: 2 - } - } - }, - chart: { - events: { - click: function(){ - var i$, ref$, len$, p; - for (i$ = 0, len$ = (ref$ = this.series[0].data).length; i$ < len$; ++i$) { - p = ref$[i$]; - if (p.state) { - constDialog.apply(p); - break; + + $('.stats').each(function (){ + const stats = $(this); + stats.highcharts('StockChart', { + credits: { + enabled: false + }, + rangeSelector: { + buttons: [], + inputDateFormat: "%b %Y", + inputEditDateFormat: "%m.%Y", + inputDateParser: value => { + value = value.split(/\./); + return Date.UTC( + value[1], // year + value[0] - 1, // month ... 0-based -.- + 1, // day + 0, 0, 0, 0 // time + ); + } + }, + plotOptions: { + series: { + stacking: 'normal', + marker: { + enabled: false, + radius: 2 + } + } + }, + chart: { + events: { + click: function() { + for (let point of this.series[0].data) { + if (point.state) { + // constDialog is used as a normal callback later on, so has to use 'this' + constDialog.apply(point); + break; + } + } + } + } + }, + xAxis: { + minTickInterval: month, + minRange: month + }, + yAxis: { + reversedStacks: false, + labels: { + x: 5, + align: 'left' + } + }, + series: [ + { + data: stats.data('consts'), + step: 'left', + name: 'Konstant', + point: { + events: { + click: constDialog + } + } + }, { + data: stats.data('expenses'), + name: 'Variabel', + step: 'left' + } + ], + tooltip: { + formatter: function(){ + const header = `<span style="font-size: 10px">${df('%B %Y', this.x)}</span><br/>`; + const body = this.points.map(p => `${p.series.name}: <b>${p.point.y} €</b><br/>`).join(''); + const footer = `<strong>Summe: ${this.points[0].total}</strong>`; + return header + body + footer; } - } - } - } - }, - xAxis: { - minTickInterval: month, - minRange: month - }, - yAxis: { - reversedStacks: false, - labels: { - x: 5, - align: 'left' - } - }, - series: [ - { - data: x$.data('consts'), - step: 'left', - name: 'Konstant', - point: { - events: { - click: constDialog - } } - }, { - data: x$.data('expenses'), - name: 'Variabel', - step: 'left' - } - ], - tooltip: { - formatter: function(){ - var header, body, p, footer; - header = "<span style=\"font-size: 10px\">" + df('%B %Y', this.x) + "</span><br/>"; - body = (function(){ - var i$, ref$, len$, results$ = []; - for (i$ = 0, len$ = (ref$ = this.points).length; i$ < len$; ++i$) { - p = ref$[i$]; - results$.push(p.series.name + ": <b>" + p.point.y + " €</b><br/>"); - } - return results$; - }.call(this)).join(''); - footer = "<strong>Summe: " + this.points[0].total + "</strong>"; - return header + body + footer; - } - } - }); + }); }); - }); - out$.catsJS = catsJS = jq(function(){ - var counter, addImg, newInput, newImage; - counter = 0; - addImg = $('img#add'); - newInput = $('input#new'); - newImage = function(newName){ - var x$; - x$ = addImg.copy(); - x$.attr('src', function(){ - return this.src.replace('add', newName); - }); - return x$; +}); + +var catsJS = jq(() => { + let counter = 0; + const addImg = $('img#add'); + const newInput = $('input#new'); + const newImage = newName => { + const copy = addImg.copy(); + copy.attr('src', function() { + return this.src.replace('add', newName); + }); + return copy; }; - $("li > span").click(function(){ - var span, input, x$, img; - span = $(this); - input = span.next(); - x$ = img = newImage('undo'); - x$.click(function(){ - $(this).remove(); - input.val(span.text()); - input.fadeOut('slow', function(){ - span.toggle(); + + $("li > span").click(function() { + const span = $(this); + const input = span.next(); + const img = newImage('undo'); + + img.click(function() { + $(this).remove(); + input.val(span.text()); + input.fadeOut('slow', () => span.toggle() ); }); - }); - span.toggle(); - input.fadeIn('slow', function(){ - img.insertAfter(input); - }); + + span.toggle(); + input.fadeIn('slow', () => img.insertAfter(input)); }); - addImg.click(function(){ - var input, x$, img; - input = newInput.copy(); - x$ = img = newImage('minus'); - x$.click(function(){ - $(this).parent().fadeOut('slow', function(){ - $(this).remove(); + + addImg.click(() => { + const img = newImage('minus'); + img.click(function() { + $(this).parent().fadeOut('slow', function() { + $(this).remove(); + }); }); - }); - input.attr('name', function(){ - return this.name + counter; - }).removeAttr('style').wrap("<li />").parent().append(img).hide().insertBefore(addImg.parent()).fadeIn('slow', function(){ - input.focus(); - }); - counter++; + + const input = newInput.copy(); + console.log(input.focus); + input + .attr('name', function(){ return this.name + counter; }) + .removeAttr('style') + .wrap("<li />") + .parent() + .append(img) + .hide() + .insertBefore(addImg.parent()) + .fadeIn('slow', () => input.focus() ); + + counter++; }); - }); -}).call(this); +}); +} |