Skip to content

Commit f95f513

Browse files
cajogoscajogos
committed
Resources Table working with JSON
1 parent fe3ae48 commit f95f513

File tree

13 files changed

+768
-6
lines changed

13 files changed

+768
-6
lines changed

‎README.md‎

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,6 @@
66

77
### Website
88

9-
* TODO: Resources pages
109
* TODO: Supporters pages
1110
* TODO: Add Google Analytics tag
1211

‎_includes/partials/resources-table.html‎

Lines changed: 81 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,81 @@
1+
<div class="resources-table-container" data-type="{{ include.type }}">
2+
<span id="loading-data"><i class="fa fa-spin fa-spinner"></i> Loading, please wait...</span>
3+
<table id="resources-data" class="table table-striped table-condensed" cellspacing="0" width="100%"></table>
4+
</div>
5+
6+
<script type="text/javascript">
7+
var MIN_HEIGHT = 0;
8+
9+
$(document).ready(function()
10+
{
11+
var tableContainer = $('div.resources-table-container');
12+
var fetchType = tableContainer.data('type');
13+
var ajaxUrl = '/resources/' + fetchType + '.json';
14+
15+
$.getJSON(ajaxUrl, function(response)
16+
{
17+
var dataSet = [];
18+
for (var i = 0; i < response.results.length; i++)
19+
{
20+
21+
var curResult = response.results[i];
22+
var verifiedIcon = curResult.verified ? '<i class="fa fa-check"></i>' : '';
23+
var level = 'Starting Out';
24+
switch (curResult.level)
25+
{
26+
case 1: level = 'Some Experience'; break;
27+
case 2: level = 'Very Experienced'; break;
28+
}
29+
30+
var curData = [];
31+
curData.push(curResult.title);
32+
curData.push(level);
33+
curData.push(curResult.description);
34+
curData.push(curResult.type);
35+
curData.push(verifiedIcon);
36+
curData.push('<a href="' + curResult.link + '" class="btn" target="_blank">Get</a>');
37+
dataSet.push(curData);
38+
}
39+
var dataTablesOptions = {
40+
data: dataSet,
41+
columns: [
42+
{
43+
title: 'Title',
44+
className: 'col-title'
45+
}, {
46+
title: 'Level',
47+
className: 'col-level'
48+
}, {
49+
title: 'Description',
50+
className: 'col-description'
51+
}, {
52+
title: 'Type',
53+
className: 'col-type'
54+
}, {
55+
title: 'Verified',
56+
className: 'col-verified',
57+
searchable: false
58+
}, {
59+
title: '',
60+
className: 'col-getbtn',
61+
orderable: false,
62+
searchable: false
63+
}
64+
],
65+
drawCallback: function()
66+
{
67+
if (MIN_HEIGHT === 0)
68+
{
69+
setTimeout(function()
70+
{
71+
MIN_HEIGHT = $('div.resources-table-container').height();
72+
$('div.resources-table-container').css('min-height', MIN_HEIGHT);
73+
}, 1000);
74+
}
75+
}
76+
};
77+
$('#loading-data').fadeOut();
78+
$('#resources-data').DataTable(dataTablesOptions);
79+
});
80+
});
81+
</script>

‎_layouts/main.html‎

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -9,10 +9,16 @@
99

1010
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" />
1111
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootswatch/3.3.7/paper/bootstrap.min.css" />
12+
<link rel="stylesheet" href="https://cdn.datatables.net/1.10.13/css/dataTables.bootstrap.min.css" />
13+
1214
<link rel="stylesheet" href="{{ 'assets/css/styles.css' | relative_url }}" />
1315

1416
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
1517
<script type="text/javascript" src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
18+
19+
<script type="text/javascript" src="https://cdn.datatables.net/1.10.13/js/jquery.dataTables.min.js"></script>
20+
<script type="text/javascript" src="https://cdn.datatables.net/1.10.13/js/dataTables.bootstrap.min.js"></script>
21+
1622
<script type="text/javascript" src="{{ 'assets/js/utils.js' | relative_url }}"></script>
1723
<script type="text/javascript" src="{{ 'assets/js/scripts.js' | relative_url }}"></script>
1824
</head>

‎pages/resources/idea.html‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -46,7 +46,7 @@ <h3>Getting Started</h3>
4646
<h3>Coding Cards</h3>
4747
</div>
4848
<div class="col-xs-12">
49-
{include file="partials/resources_table.tpl" type="idea"} TODO
49+
{%- include partials/resources-table.html type="idea" -%}
5050
</div>
5151
</div>
5252

‎pages/resources/javascript.html‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -55,7 +55,7 @@ <h4>Lets do some loggin</h4>
5555
<h3>Coding Cards</h3>
5656
</div>
5757
<div class="col-xs-12">
58-
{include file="partials/resources_table.tpl" type="javascript"} TODO
58+
{%- include partials/resources-table.html type="javascript" -%}
5959
</div>
6060
</div>
6161
</div>

‎pages/resources/python.html‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -55,7 +55,7 @@ <h4>Install Python and try this</h4>
5555
<h3>Coding Cards</h3>
5656
</div>
5757
<div class="col-xs-12">
58-
{include file="partials/resources_table.tpl" type="python"} TODO
58+
{%- include partials/resources-table.html type="python" -%}
5959
</div>
6060
</div>
6161
</div>

‎pages/resources/raspberry-pi.html‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -50,7 +50,7 @@ <h3>Getting Started</h3>
5050
<h3>Coding Cards</h3>
5151
</div>
5252
<div class="col-xs-12">
53-
{include file="partials/resources_table.tpl" type="raspberrypi"} TODO
53+
{%- include partials/resources-table.html type="javascript" -%}
5454
</div>
5555
</div>
5656

‎pages/resources/scratch.html‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -49,7 +49,7 @@ <h3>Getting Started</h3>
4949
<hr />
5050
<div class="coding-cards-container">
5151
<h3>Coding Cards</h3>
52-
{include file="partials/resources_table.tpl" type="scratch"} TODO
52+
{%- include partials/resources-table.html type="scratch" -%}
5353
</div>
5454

5555
<hr />

0 commit comments

Comments
 (0)