Added very basic loading system in pages.crushes module

* Templates created: crushes.content, crushes.item
* Moved "exact" to "regex" for handling URL hash
* Changed app.php basic template

web/src/app/app.php

@@ -31,7 +31,9 @@ $width = '40em';
 
 <main class="flex">
 	<div id="app-container" class="flex center width-max">
-		<div class="panel center">APP HERE</div>
+		<div class="panel center">
+			<div id="mcontent">...</div>
+		</div>
 	</div>
 </main>
 <?php tpl('app.footer') ?>

web/src/app/js/app.js

@@ -135,7 +135,7 @@ window.onload = function(e) {
 	if (getNormalizedURI() === app.vars.app_dir) {
 		scriptPageHandler('pages.home',		{ exact: '' });
 		scriptPageHandler('pages.meet',		{ exact: 'meet' });
-		scriptPageHandler('pages.crushes',	{ exact: 'crushes' });
+		scriptPageHandler('pages.crushes',	{ regex: /^crushes(\/you)?$/ });
 		scriptPageHandler('pages.chat',		{ exact: 'chat' });
 	}
 	window.onhashchange();

web/src/app/js/pages/crushes.js

@@ -1,5 +1,29 @@
 app.pages.crushes = {
 	load: function(args) {
-		console.log('CRUSHES');
+		let key = 'from_me';
+		if (args.length === 2 && args[1] === 'you')
+			key = 'to_me';
+
+		const dom = document.getElementById('mcontent');
+		dom.innerHTML = '...'; // TODO: replace to a better loader?
+		http.get('/api/v1/me/pending_follows', {}, function(json) {
+			app.template.loadMany(['crushes.content','crushes.item'], function(_) {
+				dom.innerHTML = app.template.fill({}, app.template.get('crushes.content'));
+				if (json === undefined)
+					return false; // TODO: handle unknown error
+				json = json[key];
+				if (json.length === 0)
+					return false; // TODO: handle empty items here
+
+				const itdom = document.getElementById('crush-items');
+				itdom.innerHTML = '';
+				for (var i = 0; i < json.length; i++) {
+					var item = json[i];
+					var tpl = app.template.fill(item, app.template.get('crushes.item'));
+					// TODO: add item logic here (if needed)
+					itdom.innerHTML += tpl;
+				}
+			});
+		})
 	},
 };

web/src/app/js/templates/crushes/content.html

@@ -0,0 +1,2 @@
+<div class="header">HEADER_HERE</div>
+<div id="crush-items">ITEMS HERE</div>

web/src/app/js/templates/crushes/item.html

@@ -0,0 +1 @@
+<div>{.name}</div>