brite
Version:
DOM Centric Minimalistic MVC Framework
92 lines (70 loc) • 2.39 kB
HTML
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>briteUITest - doc events namespace</title>
<!-- ****** Generic Test Includes ****** -->
<link rel="stylesheet" href="css/test.css"/>
<link rel="stylesheet" href="../others/bootstrap/css/bootstrap.css" />
<!-- only brite.js dependency -->
<script type="text/javascript" src="../js-dependencies/jquery.js" ></script>
<!-- include the brite.min.js in prod -->
<script type="text/javascript" src="../dist/brite.js" ></script>
<!-- some test utilities -->
<script type="text/javascript" src="../others/handlebars.min.js" ></script>
<script type="text/javascript" src="js/main.js" ></script>
<!-- ****** /Generic Test Includes ****** -->
<link rel="stylesheet" href="css/Popup.css"/>
<style type="text/css">
#view-ctn-1{
height: 40px;
border: solid 1px #ddd;
margin: 32px;
}
</style>
<!-- The UserListView Component -->
<script type="text/javascript">
var globalCount = 0;
brite.registerView("TestView",{
create: function(){
return "<div>TestView<div>"
},
events: {
"click mouseover": function(){
// nothing, just to see binding
}
},
docEvents: {
"FIRST_EVENT SECOND_EVENT": function(){
globalCount++;
}
}
})
$(function(){
var $message = $("#message");
brite.display("TestView","#view-ctn-1").done(function(testView){
$message.html(globalCount);
// Setup
$(document).trigger("FIRST_EVENT");
$(document).trigger("SECOND_EVENT");
assertEquals(2,globalCount, "global count should be 2");
// Act
$("#view-ctn-1").bEmpty();
// now, those should have no effect, since the binding should be removed
$(document).trigger("FIRST_EVENT");
$(document).trigger("SECOND_EVENT");
$(document).trigger("SECOND_EVENT");
// Assert
// so, globalCount should still be 2
assertEquals(2,globalCount,"global count should be 2");
});
});
</script>
</head>
<body>
<h2>doc event</h2>
<div id="view-ctn-1">
</div>
<div id="message" class="msg"></div>
</body>
</html>