protected static function homePage()
{
?>
<html>
<head>
<?php
if (file_exists("jquery-2.2.0.min.js")) {
$jquery = "jquery-2.2.0.min.js";
} else {
$jquery = "https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js";
}
?>
<script type="text/javascript" src="<?php
echo $jquery;
?>
"></script>
<script type="text/javascript">
var csrf_token = "<?php
echo CSRFProtection::getCSRFToken();
?>
";
$(document).ready(function ($) {
var rules_table = {
add_rows: function (data) {
for (alias in data) {
this.add_row(alias, data[alias]);
}
},
add_row: function (alias, data) {
var table = $('#real_rules');
var rule = $('#sample_rule').clone();
rule.attr('id', false);
rule.find('.rule_serial_number').text(table.find('tr').length + 1);
rule.find('.rule_enabled').prop('checked', "true" == data.enabled);
rule.find('.rule_http_status_code').find(':contains(' + data.http_status_code + ')').prop('selected', true);
rule.find('.rule_alias').val(alias);
rule.find('.rule_url').val(data.url);
table.append(rule);
},
createRows: function (number) {
var table = $('#real_rules');
for (var i = 1; i <= number; i++) {
var rule = $('#sample_rule').clone();
rule.attr('id', false);
rule.find('.rule_serial_number').text(table.find('tr').length + 1);
rule.find('.rule_enabled').prop('checked', true);
table.append(rule);
}
},
reloadIndex: function () {
var table = $('#real_rules');
var a = 1;
table.find('.rule_serial_number').each(function () {
$(this).text(a++);
});
},
empty: function () {
var table = $('#real_rules');
table.children('tr').remove();
}
}
var redirect_rules = {
load: function () {
return $.ajax({
url: '',
method: 'POST',
data: {action: 'get_redirect_rules'},
async: false,
}).responseText;
},
update: function (data) {
return $.ajax({
url: '',
method: 'POST',
data: {action: 'update_redirect_rules', data: data, csrf_token: csrf_token},
async: false,
}).responseText;
}
}
jQuery('#op_mom').click(function () {
if (!(confirm("Press F5, You Idiot!\n\nCan you do this?"))) {
location.reload();
}
});
jQuery('#rows_add').click(function () {
rules_table.createRows(5);
});
jQuery(document).on('click', '.rule_delete', function () {
$(this).closest('tr').remove();
rules_table.reloadIndex();
});
jQuery('#update_rules').click(function () {
$('#loader').css('display', 'block');
jQuery('#update_rules').val('Updating..');
var table = $('#real_rules');
var data = {};
table.children('tr').each(function () {
var tr = $(this);
if (tr.find('.rule_alias').val() && tr.find('.rule_url').val()) {
data[tr.find('.rule_alias').val()] = {
enabled: tr.find('.rule_enabled').prop('checked'),
http_status_code: tr.find('.rule_http_status_code option:selected').val(),
url: tr.find('.rule_url').val(),
};
}
});
var data = redirect_rules.update(data);
var json = $.parseJSON(data);
rules_table.empty();
rules_table.add_rows(json);
rules_table.createRows(2);
$('#loader').css('display', 'none');
jQuery('#update_rules').val('Update');
alert('Updated');
});
var data = redirect_rules.load();
var json = $.parseJSON(data);
rules_table.add_rows(json);
rules_table.createRows(2);
$('#loader').css('display', 'none');
});
</script>
</head>
<body>
<div id="loader" style="height:100%; width:100%; position: fixed; background-color: white;">
<h1 style="position: fixed; top:35%; left:45%">Loading...</h1>
</div>
<h1>Welcome to SURLS: Simple URL Shortener </h1>
<table>
<thead>
<tr><th>S.No.</th><th>Enabled</th><th>Status Code</th><th>Alias (No Space)</th><th>URL</th></tr>
</thead>
<tbody id="real_rules">
</tbody>
<tfoot style="display: none;">
<tr id="sample_rule">
<td><label class="rule_serial_number"></label></td>
<td><input type="checkbox" class="rule_enabled"/></td>
<td><select class="rule_http_status_code">
<option value="302">302</option><option value="301">301</option>
</select></td>
<td><input type="text" class="rule_alias" style="width:200px" /></td>
<td><input type="text" class="rule_url" style="width:500px" /></td>
<td><input type="submit" class="rule_delete" value="Delete"/></td>
</tr>
</tfoot>
</table>
<input type="submit" id="rows_add" value="Add more rows"/><br />
<br />
<input id="update_rules" style="width:100%;height:35px" type="submit" value="Update"/><br /><br />
<input id="op_mom" style="width:100%;height:35px" type="submit" value="Refresh"/>
</body>
</html>
<?php
}
