Commit e88b8cf0 authored by Nicolas Maleve's avatar Nicolas Maleve

backbone model update, fichiers découplés

parent 226a7788
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>Notation W</title>
<link rel="stylesheet" type="text/css" href="w.backbone.css" />
</head>
<body>
<div class="container"></div>
<div id="input_container"></div>
<script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
<script src="http://underscorejs.org/underscore-min.js"></script>
<script src="http://backbonejs.org/backbone-min.js"></script>
<script type="text/template" id="input_template">
<p class="desc">
<label><%= titrelabel %></label>
<textarea id="input">{"titre":"Mon titre", "children":[{"titre":"titre enfant","children":[{"titre":"Petit enfant"}]},{"titre":"titre enfant2"}]}</textarea></p>
<p><input type="button" id="parse" value="parse"></p>
<p id="desc">éléments décodés</p>
<p id="output"></p>
</script>
<script id="axisTemplate" type="text/template">
<strong><%= titre %></strong> (<%= contingent %>) - <%= module_ %>
</script>
<script src="w.backbone.axis.js"></script>
</body>
</html>
var Axis = Backbone.Model.extend({
defaults: {
id:1,
titre:'Sans titre', //(uniq)
contingent:false,
module_:false,
aspect:'', //choix dans un array (duratif, itératif, sémelfactif)
indications:'',
piece_jointe:'', //url qui pointe vers un document
terme:'', //(str)
boucle:'', //de n à p
alternative:'', //choix dans un array (exclusive, inclusive, conditionnelle) Validation importante des conditions dans une boucle inclusive
condition:'', //(voir validation ci-dessus)
tag:'', //Validation: peut avoir un tag seulement si l'axe n'est pas principal, de plus le tag doit être le même pour ses siblings. Succession ordonnée, sans ordre, simultaméité, accumulation
goto:null //reference de l'axe vers lequel il renvoie
},
validate: function (attrs){
if ( attrs.id > 3 ){
return 'Mauvais id.';
}
},
explain: function(){
return this.get('titre') + ' est un axe.';}
});
var AxisCollection= Backbone.Collection.extend({
model: Axis
});
var AxisView = Backbone.View.extend({
tagName: 'li',
className:'axis',
template: _.template( $('#axisTemplate').html()),
/* initialize: function(){
this.render();
},
*/
render: function(){
this.$el.html( this.template(this.model.toJSON()));
return this;
}
});
var AxisCollectionView = Backbone.View.extend({
tagName: 'ul',
render: function(){
console.log("entering render");
console.log(this.collection);
this.collection.each(function(axis){
var axisView = new AxisView({ model: axis });
//get children
this.$el.append(axisView.render().el); // adding all the person objects.
}, this);
return this;
}
});
var axiscoll= new AxisCollection([
{titre:"Premier axe", children:[{titre:'sous axe'},{titre:'autre sous axe'}]},
{titre:"Deuxième axe"}
]);
var aView=new AxisCollectionView({collection:axiscoll});
var ar=aView.render();
$(document.body).append(ar.el);
\ No newline at end of file
body{
font-size:0.9em;
}
#input{
height:120px;
width:500px;
}
.axis_attribute{
margin:5px;
}
.titre{
/*background:pink;*/
color:black;
font-weight:bold;
}
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment