List Items clickable Now

This commit is contained in:
Subhodip Biswas 2012-05-08 10:18:34 +05:30
parent e52959abd2
commit ae4d4d76aa
2 changed files with 67 additions and 34 deletions

View File

@ -1,10 +1,10 @@
(function($) {
var API_BASE = 'http://chalobest.in/1.0/';
console.log(API_BASE);
var testName = 'stops';
var clickedName = 'stops';
var searchQuery = 'None';
var url1 = API_BASE + testName + '/' + '?q=';
var url2 = API_BASE + testName + '/';
var url1 = API_BASE + clickedName + '/' + '?q=';
var url2 = API_BASE + clickedName + '/';
var Features = Backbone.Model.extend({});
var apiCollection = Backbone.Collection.extend({
@ -16,44 +16,76 @@
});
var apiView = Backbone.View.extend({
el: $('#sideBar'),
//el: '#sideBar',
events: {
"click a": "stopDetails"
},
initialize: function() {
//this.render();
_.bindAll(this, "render");
this.collection.bind("all", this.render);
//apiView.prototype.initialize.call(this);
},
render: function() {
$(this.el).html(this.counter = this.collection.length);
//$(this.el).html(this.counter = this.collection.length);
console.log(this.collection.length);
//console.log(this.el);
this.collection.each( function(model){
console.log(model.get('properties'));
//alert(this.el);
$('#sideBar').append("<li>" + model.get('properties').official_name + "</li>");
//$('#sideBar').append("<li>" + model.get('properties').area + "</li>");
$('#sideBar').append('<li> <a id=\''+model.cid+'\' href="#">' + model.get('properties').official_name + "</a></li>");
//console.log(model.cid);
});
return this;
},
clicked: function(e) {
//e.preventDefaults();
//var name1 = this.model.get('properties').official_name;
console.log(e);
//alert("you clicked me"+ e.target.innerHTML);
},
//for(i=0; i< this.collection.length; i++) {
// console.log(model.get('official_name')));
// }
// $(this.el).append("<li>" + this.properties.official_name + "</li>");
// $(this.el).html(this.template(this.model.toJSON()));
// $(this.el).html(this.counter = this.model.toJSON());
return this;
}
stopDetails: function(e) {
var cid = $(e.target).attr('id');
//this.trigger
//console.log(cid);
this.values= this.collection.getByCid(cid);
//this.trigger('new-stage', this.collection.get)
this.stopName = e.target.innerHTML;
//var test = this.collection.where({official_name: this.stopName});
console.log(this.values.get('properties').road);
$('#sLug').append(this.values.get('properties').slug);
$('#rOads').append(this.values.get('properties').road);
$('#rOutes').append(this.values.get('properties').routes);
$('#dIrection').append(this.values.get('properties').direction);
//console.log(e.target);
$('#dIsplayName').append(this.values.get('properties').official_name);
$('#mArathiName').append(this.values.get('properties').name_mr);
$('#aLtName').append(this.values.get('properties').alternative_names);
},
close:function () {
$(this.el).unbind();
$(this.el).remove();
}
}),
events = new apiCollection(),
events = new apiCollection();
$(function() {
eventView = new apiView({
el: $("#sideBar"),
//el: $('#slug'),
//el:$('#displayName'),
collection: events
});
events.fetch({
success: function() {
console.log(events.length);
@ -62,7 +94,7 @@
}
});
});
@ -100,6 +132,9 @@
//alert("I am here" + this.el);
});
//var router = Backbone.Router.extend({
//routes:{
//})
})(jQuery);

View File

@ -8,7 +8,7 @@
<link rel="stylesheet" href="/static/css/styles.css" ></script>
<script type = "text/javascript" src="/static/js/underscore-min.js"></script>
<script type ="text/javascript" src="/static/js/backbone-min.js"></script>
<script type="text/javascript" src="/static/js/buseditor.js"></script>
<script type="text/javascript" src="/static/js/thebus.js"></script>
<script type="text/javascript">
console.firebug=true;//fix the openlayer problem
</script>
@ -37,13 +37,14 @@
This BEST Bus stop editor allows you to edit Stops and Areas.
</p>
<p>
<input id="slug" type="text" placeholder="stop-slug" disabled>
<input id="roads" type="text" placeholder="Road Name" disabled>
<input id="routes" type="text" placeholder="Routes" disabled>
<input id="direction" type="text" placeholder="Direction (u - up/d - Down)" disabled>
<input id="displayName" type="text" placeholder="Display Name">
<input id="marathiName" type="text" placeholder="Marathi Name">
<input id="altName" type="text" placeholder="Alternative Names">
<input id="sLug" type="text" placeholder="stop-slug" disabled>
<input id="rOads" type="text" placeholder="Road Name" disabled>
<input id="rOutes" type="text" placeholder="Routes" disabled>
<input id="dIrection" type="text" placeholder="Direction (u - up/d - Down)" disabled>
<input id="dIsplayName" type="text" placeholder="Display Name" >
<input id="mArathiName" type="text" placeholder="Marathi Name" >
<input id="aLtName" type="text" placeholder="Alternative Names" >
</p>
<p>
<input id="save" type="button" value="Save">
@ -54,7 +55,4 @@ This BEST Bus stop editor allows you to edit Stops and Areas.
</div>
{% endblock %}