Add a router to handle fragment identifier
Set up a listener of the router in the scene to update it
Start Backbone.history (eventlistener of the router) when all the project is loaded
Include router.js to all the test file
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
<title>RENKAN test in read-only mode : body 100%</title>
<meta name="description" content="" />
<meta name="author" content="Institut de Recherche et d'Innovation" />
<script src="../lib/jquery/jquery.js"></script>
<script src="../lib/jquery-mousewheel/jquery.mousewheel.js"></script>
<script src="../lib/lodash/lodash.js"></script>
<script src="../lib/backbone/backbone.js"></script>
<script src="../lib/backbone-relational/backbone-relational.js"></script>
<script src="../lib/paper/paper-full.js"></script>
<script src="../js/main.js"></script>
<script src="../js/dataloader.js"></script>
<script src="../js/router.js"></script>
<script src="../js/models.js"></script>
<script src="../js/defaults.js"></script>
<script src="../js/i18n.js"></script>
<script src="../dist/js/templates.js"></script>
<script src="../js/full-json.js"></script>
<script src="../js/ldtjson-bin.js"></script>
<script src="../js/list-bin.js"></script>
<script src="../js/wikipedia-bin.js"></script>
<script data-main="../js/main-renderer.js" src="../lib/requirejs/require.js"></script>
<script type="text/javascript">
function startRenkan(){
var _renkan = new Rkns.Renkan({
editor_mode: false,
show_bins: false,
static_url: "../"
});
Rkns.jsonIO(_renkan, {
url: "../data/example-cinema.json"
});
};
</script>
<link rel="stylesheet" href="../css/renkan.css" />
<style type="text/css">
html {
heigt: 100%;
}
body{
margin: 0 auto;
width: 100%;
heigt: 100%;
}
header {
font-size: 14px;
height: 40px;
padding-top: 10px;
}
footer {
font-size: 14px;
height: 40px;
padding-top: 10px;
position:absolute;
bottom: 0;
}
.wrapper {
position:absolute;
top:40px;
left: 0;
right: 0;
bottom: 40px;
}
.rnk-container {
min-height: 100%;
position: relative;
width: 100%;
}
</style>
</head>
<body>
<header>
This is a header
</header>
<div class="wrapper">
<div class="rnk-container">
<div id="renkan"></div>
</div>
</div>
<footer>
This is a footer
</footer>
</body>
</html>