edb/bbs
8
0 Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

JS Cleanups and misc

Browse Source
This commit is contained in:
nikolark committed 2014-02-02 22:20:35 +01:00
1 parent 2295455375
commit e079ad685f
12 files changed
+1697 -1754
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

static/Gruntfile.js
+1 -1
View File
@@ -16,7 +16,7 @@ module.exports = function(grunt) {
tasks: ['compass:dev'],
},
livereload: {
files: ['*.html', '*.css', '*.js'],
files: ['../templates/**/*.html', '**/*.css', '**/*.js'],
options: {
livereload: true
}
static/js/app.js
+365
View File
@@ -1,3 +1,368 @@
function enable_all_customers() {
$("li.customer").each(function(i) {
$(this).removeClass("marked");
$(this).show();
});
}
function filter_customers(typed) {
setTimeout(function() {
$("li.customer").each(function(i) {
var pattern = new RegExp(typed,"i");
var name = $(this).children("span.name").text();
if(!pattern.test(name)) {
$(this).hide();
$(this).removeClass("marked");
} else {
$(this).show();
var full_match = name.toLowerCase() == typed.toLowerCase();
// FIXME: needs one more char.
var single_match = $("li.customer:visible").length == 1;
console.log(full_match, single_match);
//if(full_match || single_match) {
if(full_match) {
$(this).addClass("marked");
} else {
$(this).removeClass("marked");
}
}
});
}, 50);
}
function enable_all_products() {
$("li.product").each(function(i) {
$(this).removeClass("marked");
$(this).show();
});
}
function reset_qtys() {
$(".qty").each(function(i) {
$(this).html('0');
});
$("input[name$=amount]").each(function(i) {
$(this).val("0");
});
}
$(document).ready(function() {
/* Hide alert messages */
$("a[data-dismiss=alert]").click(function(){
$(this).parent().parent().parent().slideUp();
});
setTimeout( function() {
$("a[data-dismiss=alert]").parent().parent().parent().slideUp();
}, 5000);
/* Tooltips */
$("h2").tooltip({placement: 'right'});
$("img.customer").tooltip();
$("a.product").tooltip();
$("#footer .credits .love").tooltip();
/*
* View: Deposit and register
*/
/* Customer search */
$('#id_customer_typeahead').keyup(function(event) {
filter_customers(event.target.value);
});
/* Customer selection */
$("li.customer").click( function() {
enable_all_customers();
/* Disable the customer button just clicked */
$(this).addClass("marked");
/* Update the typeahead field */
var name = $(this).children("span.name").text();
$("#id_customer_typeahead").val(name);
/* Update the select field */
var id = $(this).children("span.id").text();
$("#id_customer option, #id_user option").removeAttr('selected');
$("#id_customer option[value="+id+"], #id_user option[value="+id+"]").attr('selected','selected');
console.log(id);
});
/*
* View: Register
*/
/* Product amount controls */
$("#register li.product").click( function() {
/* Mark the product as selected */
$(this).addClass("marked");
/* Update amounts */
var form_field = $(this).children("input[name$=amount]");
var display = $(this).children(".qty");
var qty = Number(form_field.val()) + 1;
form_field.val(qty);
display.html(qty);
/* Update total*/
var sale_price_int = Number($(this).children("span.sale_price_int").text());
var cur_total = Number($("span.total_text").text());
$("span.total_text").html(cur_total + sale_price_int);
});
/* Form reset */
$("#register button[type=reset]").click( function() {
$('#id_customer option').removeAttr('selected');
$("#id_customer_typeahead").val("");
$("span.total_text").html("");
enable_all_customers();
enable_all_products();
reset_qtys();
});
/* Toggle infrequent users */
$(".toggle-infrequent-users").on('click', function(e) {
e.preventDefault();
$("li.customer.infrequent").toggleClass('hidden');
$(".users-description .infrequent-users").toggleClass('hidden');
if($(this).text() === "Vis alle") {
$(this).text("Skjul gamliser");
}
else {
$(this).text("Vis alle");
}
});
/*
* View: Stats
*/
if( $("#stats").length > 0) {
/* TODO select data element with index 0 of each pie-chart */
var charts = [];
var products_url = '/stats/products/';
var order_url = '/stats/orders/';
var order_hourly_url = '/stats/orders/hourly';
var products_realtime_url = '/stats/orders/products_realtime';
/* orders */
$.getJSON(order_url, function(data) {
var render_to = 'order_chart';
// define the options
var options = {
credits: {
enabled: false
},
chart: {
renderTo: render_to,
plotBackgroundColor: null,
plotBorderWidth: null,
plotShadow: false
},
title: {
text: 'Fordeling av ordre på person'
},
tooltip: {
formatter: function() {
return '<b>'+ this.point.name +'</b>: '+ Highcharts.numberFormat(this.percentage, 1) +' %';
}
},
plotOptions: {
pie: {
allowPointSelect: true,
cursor: 'pointer',
dataLabels: {
enabled: true,
color: '#000000',
connectorColor: '#000000',
formatter: function() {
return '<b>'+ this.point.name +'</b>: '+ this.y;
}
}
}
},
series: [{
type: 'pie',
name: 'Orders',
data: data
}]
};
charts.push(new Highcharts.Chart(options));
});
/* products */
$.getJSON(products_url, function(data) {
var products = data.response.products;
for(var i in products) {
var render_to = 'product_chart' + products[i].product.id;
var series_data = products[i].counts;
// define the options
var options = {
credits: {
enabled: false
},
chart: {
renderTo: render_to,
plotBackgroundColor: null,
plotBorderWidth: null,
plotShadow: false
},
title: {
text: products[i].product.name
},
tooltip: {
formatter: function() {
return '<b>'+ this.point.name +'</b>: '+ Highcharts.numberFormat(this.percentage, 1) +' %';
}
},
plotOptions: {
pie: {
allowPointSelect: true,
cursor: 'pointer',
dataLabels: {
enabled: true,
color: '#000000',
connectorColor: '#000000',
formatter: function() {
return '<b>'+ this.point.name +'</b>: ' + this.y;
}
}
}
},
series: [{
type: 'pie',
name: 'Orders',
data: series_data
}]
};
charts.push(new Highcharts.Chart(options));
}
});
/* orders hourly */
$.getJSON(order_hourly_url, function(data) {
var render_to = 'order_hourly_chart';
// define the options
var options = {
credits: {
enabled: false
},
chart: {
renderTo: render_to,
type: 'column'
},
title: {
text: 'Ordre - time for time'
},
tooltip: {
formatter: function() {
return this.y + " stk";
}
},
yAxis: {
title: {
text: 'Ordre'
},
},
xAxis: {
title: {
text: 'Tid (h)'
},
labels: {
formatter: function() {
return this.value + ":00";
},
}
},
plotOptions: {
column: {
minPointLength: 3,
},
series: {
groupPadding: 0,
pointPadding: 0.05,
},
},
series: [{
name: 'Ordre',
data: data.hourly
}]
};
charts.push(new Highcharts.Chart(options));
});
var products_realtime_chart = new Highcharts.Chart({
chart: {
renderTo: 'products_realtime_chart'
},
title: {
text: "Produkter solgt over tid"
},
xAxis: {
type: "datetime"
},
yAxis: {
title: {
text: "Antall solgt"
}
},
plotOptions: {
series: {
marker: {
radius: 3
}
}
},
series: {}
});
charts.push(products_realtime_chart);
function parse_products_realtime_data(data) {
var chart = products_realtime_chart;
for (var product in data.products) {
if (chart.get(product) === null) {
chart.addSeries({
data: [],
id: product,
name: product
});
var series = chart.get(product);
_.each(data.products[product], function(point) {
series.addPoint({
id: point[0],
x: point[0],
y: point[1]
});
});
}
else {
var series = chart.get(product);
_.each(data.products[product], function(point) {
if (chart.get(point[0]) === null) {
series.addPoint({
id: point[0],
x: point[0],
y: point[1]
});
}
});
}
}
}
function get_products_realtime_data() {
var that = this;
$.ajax( {
url: products_realtime_url,
dataType: "json",
success: function (data) {
parse_products_realtime_data(data);
setTimeout(function () {
get_products_realtime_data();
}, 15000);
},
cache: false
});
}
get_products_realtime_data();
}
});
static/js/deposit.js
-58
View File
@@ -1,58 +0,0 @@
$(document).ready(function() {
function enable_all_customers() {
$("li.customer").each(function(i) {
$(this).removeClass("marked");
$(this).show();
});
}
function filter_customers(typed) {
setTimeout(function() {
$("li.customer").each(function(i) {
var pattern = new RegExp(typed,"i");
var name = $(this).children("span.name").text();
if(!pattern.test(name)) {
$(this).hide();
$(this).removeClass("marked");
} else {
$(this).show();
var full_match = name.toLowerCase() == typed.toLowerCase();
// FIXME: needs one more char.
//var single_match = $("li.customer:visible").length == 1;
//console.log(full_match, single_match);
//if(full_match || single_match) {
if(full_match) {
$(this).addClass("marked");
} else {
$(this).removeClass("marked");
}
}
});
}, 50);
}
/* Customer search */
//$('.typeahead').typeahead();
$('#id_customer_typeahead').keyup(function(event) {
filter_customers(event.target.value);
});
/* Customer selection */
$("li.customer").click( function() {
enable_all_customers();
/* Disable the customer button just clicked */
$(this).addClass("marked");
/* Update the typeahead field */
var name = $(this).children("span.name").text()
$("#id_customer_typeahead").val(name);
/* Update the select field */
var id = $(this).children("span.id").text()
$("#id_user option").removeAttr('selected');
$("#id_user option[value="+id+"]").attr('selected','selected');
});
/* Hide alert messages */
$("a[data-dismiss=alert]").click(function(){
$(this).parent().parent().parent().slideUp();
});
setTimeout( function() {
$("a[data-dismiss=alert]").parent().parent().parent().slideUp();
}, 5000);
});
static/js/log.js
-5
View File
@@ -1,5 +0,0 @@
$(document).ready(function() {
$("img.customer").tooltip();
$("a.product").tooltip();
$("h2").tooltip({placement: 'right'});
});
static/js/register.js
-110
View File
@@ -1,110 +0,0 @@
$(document).ready(function() {
function enable_all_customers() {
$("li.customer").each(function(i) {
$(this).removeClass("marked");
$(this).show();
});
}
function enable_all_products() {
$("li.product").each(function(i) {
$(this).removeClass("marked");
$(this).show();
});
}
function reset_qtys() {
$(".qty").each(function(i) {
$(this).html('0');
});
$("input[name$=amount]").each(function(i) {
$(this).val("0");
});
}
function filter_customers(typed) {
setTimeout(function() {
$("li.customer").each(function(i) {
var pattern = new RegExp(typed,"i");
var name = $(this).children("span.name").text();
if(!pattern.test(name)) {
$(this).hide();
$(this).removeClass("marked");
} else {
$(this).show();
var full_match = name.toLowerCase() == typed.toLowerCase();
// FIXME: needs one more char.
//var single_match = $("li.customer:visible").length == 1;
//console.log(full_match, single_match);
//if(full_match || single_match) {
if(full_match) {
$(this).addClass("marked");
} else {
$(this).removeClass("marked");
}
}
});
}, 50);
}
/* Customer search */
//$('.typeahead').typeahead();
$('#id_customer_typeahead').keyup(function(event) {
filter_customers(event.target.value);
});
/* Customer selection */
$("li.customer").click( function() {
enable_all_customers();
/* Disable the customer button just clicked */
$(this).addClass("marked");
/* Update the typeahead field */
var name = $(this).children("span.name").text()
$("#id_customer_typeahead").val(name);
/* Update the select field */
var id = $(this).children("span.id").text()
$("#id_customer option").removeAttr('selected');
$("#id_customer option[value="+id+"]").attr('selected','selected');
});
/* Product amount controls */
$("li.product").click( function() {
/* Mark the product as selected */
$(this).addClass("marked");
/* Update amounts */
var form_field = $(this).children("input[name$=amount]");
var display = $(this).children(".qty");
var qty = Number(form_field.val()) + 1;
form_field.val(qty);
display.html(qty);
/* Update total*/
var sale_price_int = Number($(this).children("span.sale_price_int").text());
var cur_total = Number($("span.total_text").text());
$("span.total_text").html(cur_total + sale_price_int);
});
/* Form reset */
$("button[type=reset]").click( function() {
$('#id_customer option').removeAttr('selected');
$("#id_customer_typeahead").val("");
$("span.total_text").html("");
enable_all_customers();
enable_all_products();
reset_qtys();
});
/* Hide alert messages */
$("a[data-dismiss=alert]").click(function(){
$(this).parent().parent().parent().slideUp();
});
setTimeout( function() {
$("a[data-dismiss=alert]").parent().parent().parent().slideUp();
}, 5000);
$("h2").tooltip({placement: 'right'});
/* Toggle infrequent users */
$(".toggle-infrequent-users").on('click', function(e) {
e.preventDefault();
$("li.customer.infrequent").toggleClass('hidden');
$(".users-description .infrequent-users").toggleClass('hidden');
if($(this).text() === "Vis alle") {
$(this).text("Skjul gamliser");
}
else {
$(this).text("Vis alle");
}
});
});
static/js/stats.js
-236
View File
@@ -1,236 +0,0 @@
$(document).ready(function() {
/* TODO select data element with index 0 of each pie-chart */
var charts = [];
var products_url = '/stats/products/';
var order_url = '/stats/orders/';
var order_hourly_url = '/stats/orders/hourly';
var products_realtime_url = '/stats/orders/products_realtime'
/* orders */
$.getJSON(order_url, function(data) {
var render_to = 'order_chart';
// define the options
var options = {
credits: {
enabled: false
},
chart: {
renderTo: render_to,
plotBackgroundColor: null,
plotBorderWidth: null,
plotShadow: false
},
title: {
text: 'Fordeling av ordre på person'
},
tooltip: {
formatter: function() {
return '<b>'+ this.point.name +'</b>: '+ Highcharts.numberFormat(this.percentage, 1) +' %';
}
},
plotOptions: {
pie: {
allowPointSelect: true,
cursor: 'pointer',
dataLabels: {
enabled: true,
color: '#000000',
connectorColor: '#000000',
formatter: function() {
return '<b>'+ this.point.name +'</b>: '+ this.y;
}
}
}
},
series: [{
type: 'pie',
name: 'Orders',
data: data
}]
};
charts.push(new Highcharts.Chart(options));
});
/* products */
$.getJSON(products_url, function(data) {
var products = data.response.products;
for(i in products) {
var render_to = 'product_chart' + products[i].product.id;
var series_data = products[i].counts;
// define the options
var options = {
credits: {
enabled: false
},
chart: {
renderTo: render_to,
plotBackgroundColor: null,
plotBorderWidth: null,
plotShadow: false
},
title: {
text: products[i].product.name
},
tooltip: {
formatter: function() {
return '<b>'+ this.point.name +'</b>: '+ Highcharts.numberFormat(this.percentage, 1) +' %';
}
},
plotOptions: {
pie: {
allowPointSelect: true,
cursor: 'pointer',
dataLabels: {
enabled: true,
color: '#000000',
connectorColor: '#000000',
formatter: function() {
return '<b>'+ this.point.name +'</b>: ' + this.y;
}
}
}
},
series: [{
type: 'pie',
name: 'Orders',
data: series_data
}]
};
charts.push(new Highcharts.Chart(options));
}
});
/* orders hourly */
$.getJSON(order_hourly_url, function(data) {
var render_to = 'order_hourly_chart';
// define the options
var options = {
credits: {
enabled: false
},
chart: {
renderTo: render_to,
type: 'column'
},
title: {
text: 'Ordre - time for time'
},
tooltip: {
formatter: function() {
return this.y + " stk";
}
},
yAxis: {
title: {
text: 'Ordre'
},
},
xAxis: {
title: {
text: 'Tid (h)'
},
labels: {
formatter: function() {
return this.value + ":00";
},
}
},
plotOptions: {
column: {
minPointLength: 3,
},
series: {
groupPadding: 0,
pointPadding: 0.05,
},
},
series: [{
name: 'Ordre',
data: data.hourly
}]
};
charts.push(new Highcharts.Chart(options));
});
var products_realtime_chart = new Highcharts.Chart({
chart: {
renderTo: 'products_realtime_chart'
},
title: {
text: "Produkter solgt over tid"
},
xAxis: {
type: "datetime"
},
yAxis: {
title: {
text: "Antall solgt"
}
},
plotOptions: {
series: {
marker: {
radius: 3
}
}
},
series: {}
});
charts.push(products_realtime_chart);
function parse_products_realtime_data(data) {
var chart = products_realtime_chart;
for (product in data.products) {
if (chart.get(product) === null) {
chart.addSeries({
data: [],
id: product,
name: product
});
var series = chart.get(product);
_.each(data.products[product], function(point) {
series.addPoint({
id: point[0],
x: point[0],
y: point[1]
});
});
}
else {
var series = chart.get(product);
_.each(data.products[product], function(point) {
if (chart.get(point[0]) === null) {
series.addPoint({
id: point[0],
x: point[0],
y: point[1]
});
}
});
}
}
}
function get_products_realtime_data() {
var that = this;
$.ajax( {
url: products_realtime_url,
dataType: "json",
success: function (data) {
parse_products_realtime_data(data);
setTimeout(function () {
get_products_realtime_data();
}, 15000);
},
cache: false
});
}
get_products_realtime_data();
});
static/sass/screen.scss
+3 -1
View File
@@ -15,7 +15,6 @@ body {
@include inline-block-list;
li {
padding-right: 10px;
padding-top: 10px;
text-align: center;
width: 79px;
@@ -128,3 +127,6 @@ body {
color: #faafba;
}
}
.alert-error {
@extend .alert-danger;
}
static/stylesheets/screen.css
+1322 -1323
View File
File diff suppressed because it is too large. Load diff
templates/base.html
+2
View File
@@ -37,6 +37,8 @@
<script type="text/javascript" src="{{ STATIC_URL }}js/bootstrap/collapse.js"></script>
<script type="text/javascript" src="{{ STATIC_URL }}js/bootstrap/dropdown.js"></script>
<script type="text/javascript" src="{{ STATIC_URL }}js/bootstrap/tooltip.js"></script>
<script type="text/javascript" src="{{ STATIC_URL }}js/highcharts.js"></script>
<script type="text/javascript" src="{{ STATIC_URL }}js/underscore-min.js"></script>
<script type="text/javascript" src="{{ STATIC_URL }}js/app.js"></script>
{%block tailinc %}
{%endblock%}
templates/deposit.html
+2 -7
View File
@@ -35,7 +35,7 @@
<div class="col-md-12">
<ul class="well">
{% for user in users %}
<li class="customer">
<li class="customer">{% spaceless %}
{% if user.get_profile.image %}
  <img class="profile" src="{{ user.get_profile.image }}" alt="Profile picture"/><br />
{% else %}
@@ -44,7 +44,7 @@
<span class="name">{{ user.first_name }} {{ user.last_name|slice:":1"}}</span><br />
<span class="balance">{{ user.get_profile.balance }}</span>
<span class="id" style="display:none;">{{ user.id }}</span>
</li>
{% endspaceless %}</li>
{% endfor %}
</ul>
</div>
@@ -72,8 +72,3 @@
</form>
</section>
{% endblock %}
{% block tailinc %}
<!--<script src="{{ STATIC_URL }}js/bootstrap-typeahead.js"></script>-->
<script src="{{ STATIC_URL }}js/deposit.js"></script>
{% endblock %}
templates/register.html
+2 -7
View File
@@ -41,7 +41,7 @@
<div class="row">
<div class="col-md-12">
<ul class="well">
{% for user in users %}<li class="customer{% if user.get_profile.last_purchase_date < half_a_year_ago %} infrequent hidden{% endif %}">
{% for user in users %}<li class="customer{% if user.get_profile.last_purchase_date < half_a_year_ago %} infrequent hidden{% endif %}">{% spaceless %}
{% if user.get_profile.image %}
  <img class="profile" src="{{ user.get_profile.image }}" alt="Profile picture" /><br />
{% else %}
@@ -50,7 +50,7 @@
<span class="name">{{ user.first_name }} {{ user.last_name|slice:":1"}}</span><br />
<span class="balance">{{ user.get_profile.balance }}</span>
<span class="id" style="display:none;">{{ user.id }}</span>
</li>{% endfor %}
{% endspaceless %}</li>{% endfor %}
</ul>
<div class="users-description pull-right">
<small>Viser: De med minst <strong>{{ cheapest_product_price }}</strong> i saldo<span class="infrequent-users"> og mer enn ett kjøp siden <strong>{{ half_a_year_ago }}</strong></span>. <a href="#" class="toggle-infrequent-users">Vis alle</a></small>
@@ -98,8 +98,3 @@
</form>
</section>
{% endblock %}
{% block tailinc %}
<!--<script src="{{ STATIC_URL }}js/bootstrap-typeahead.js"></script>-->
<script src="{{ STATIC_URL }}js/bootstrap/tooltip.js"></script>
<script src="{{ STATIC_URL }}js/register.js"></script>
{% endblock %}
templates/stats.html
-6
View File
@@ -40,10 +40,4 @@
</section>
{% endblock %}
{% block tailinc %}
<script src="{{ STATIC_URL }}js/bootstrap/tooltip.js"></script>
<script src="{{ STATIC_URL }}js/highcharts.js"></script>
<script src="{{ STATIC_URL }}js/underscore-min.js"></script>
<script src="{{ STATIC_URL }}js/stats.js"></script>
{% endblock %}