From 32592cbfa44548eea2d7ad8d7f1e9b055cc1b504 Mon Sep 17 00:00:00 2001 From: Subhodip Biswas Date: Thu, 10 May 2012 16:16:27 +0530 Subject: [PATCH] Stop editor form field visible on click --- chaloBEST/static/js/buseditor.js | 229 +++++++++++++++++-------------- 1 file changed, 126 insertions(+), 103 deletions(-) diff --git a/chaloBEST/static/js/buseditor.js b/chaloBEST/static/js/buseditor.js index b6166db..70bef40 100644 --- a/chaloBEST/static/js/buseditor.js +++ b/chaloBEST/static/js/buseditor.js @@ -1,11 +1,14 @@ (function($) { - var API_BASE = 'http://chalobest.in/1.0/'; + var API_BASE = 'http://localhost:8000/1.0/'; console.log(API_BASE); var clickedName = 'stops'; var searchQuery = 'None'; var url1 = API_BASE + clickedName + '/' + '?q='; var url2 = API_BASE + clickedName + '/'; - var Features = Backbone.Model.extend({}); + var Features = Backbone.Model.extend({ + + + }); var apiCollection = Backbone.Collection.extend({ model: Features, @@ -15,126 +18,146 @@ } }); + var apiView = Backbone.View.extend({ - //el: '#sideBar', - events: { - "click a": "stopDetails" - }, + //el: '#content', + events: { + "click a": "clicked" + }, initialize: function() { - //this.render(); - _.bindAll(this, "render"); - this.collection.bind("all", this.render); + //this.render(); + _.bindAll(this, "render", "clicked"); + this.collection.bind("all", this.render, this.clicked); //apiView.prototype.initialize.call(this); }, render: function() { //$(this.el).html(this.counter = this.collection.length); - console.log(this.collection.length); - //console.log(this.el); - this.collection.each( function(model){ - $('#sideBar').append('
  • ' + model.get('properties').official_name + "
    • "); - //console.log(model.cid); + //console.log(this.collection.length); + //console.log(this.el); + this.collection.each(function(model) { + $('#sideBar').append('
  • ' + model.get('properties').official_name + "
    • "); + //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); - - - }, + 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); + events.trigger('stopdetailsEvent', e); + //return this; + }, + + //close: function() { + // $(this.el).unbind(); + // $(this.el).remove(); + //} + + + }); +var stopView = Backbone.View.extend({ + el: '#content', + initialize: function() { + _.bindAll(this, "stopDetails"); + this.collection.bind("stopdetailsEvent", this.stopDetails); + + }, + 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(); - } - + //console.log(e); + //alert("you clicked me"+ e.target.innerHTML); + 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); + //console.log(this.el); + $(this.el).find('input#sLug').val(this.values.get('properties').slug); + //$('#sLug').attr('id', 'sLug').value(this.values.get('properties').slug); + $(this.el).find('input#rOads').val(this.values.get('properties').road); + $(this.el).find('textarea#rOutes').html(this.values.get('properties').routes); + $(this.el).find('input#dIrection').val(this.values.get('properties').direction); + //console.log(e.target); + $(this.el).find('input#dIsplayName').val(this.values.get('properties').official_name); + $(this.el).find('input#mArathiName').val(this.values.get('properties').name_mr); + $(this.el).find('input#aLtName').val(this.values.get('properties').alternative_names); + + }, + }); + - }), events = new apiCollection(); - $(function() { + $(function() { + stopDetailsView = new stopView({ + el: $("#content"), + collection: events + }); eventView = new apiView({ - el: $("#sideBar"), - //el: $('#slug'), - //el:$('#displayName'), + el: $("#sideBar"), + //el: $('#slug'), + //el:$('#displayName'), collection: events }); - - events.fetch({ - success: function() { - console.log(events.length); - //console.log(this.official_name); - //alert(); + + + events.fetch({ + success: function() { + console.log(events.length); + //console.log(this.official_name); + //alert(); + } + }); + }); + + + + var Map = Backbone.Model.extend({}); + + + var MapView = Backbone.View.extend({ + el: '#mapCol', + + initialize: function() { + _.bindAll(this, 'initMap'); + this.initMap(); + + }, + + initMap: function() { + // Initialize Basic Openlayers; + var center = new OpenLayers.LonLat(8110203.9998955, 2170000.4068373); + //alert("you are here"); + map = new OpenLayers.Map(this.el, { + projection: new OpenLayers.Projection("EPSG:900913"), + displayProjection: new OpenLayers.Projection("EPSG:4326") + }); + //alert(this.el); + var layers = []; + layers[0] = new OpenLayers.Layer.OSM(); //some more layer will go here + //$(this.el).html(map); + map.addLayers(layers); + map.setCenter(center, 12); } }); -}); + $(function() { + var map_view = new MapView(); + //alert("I am here" + this.el); + }); - - - var Map = Backbone.Model.extend({}); - - - var MapView = Backbone.View.extend({ - el: '#mapCol', - - initialize: function() { - _.bindAll(this, 'initMap'); - this.initMap(); - - }, - - initMap: function() { - // Initialize Basic Openlayers; - var center = new OpenLayers.LonLat(8110203.9998955, 2170000.4068373); - //alert("you are here"); - map = new OpenLayers.Map(this.el, { - projection: new OpenLayers.Projection("EPSG:900913"), - displayProjection: new OpenLayers.Projection("EPSG:4326") - }); - //alert(this.el); - var layers = []; - layers[0] = new OpenLayers.Layer.OSM(); //some more layer will go here - //$(this.el).html(map); - map.addLayers(layers); - map.setCenter(center, 12); - - } - }); - $(function() { - var map_view = new MapView(); - //alert("I am here" + this.el); - }); - - //var router = Backbone.Router.extend({ - //routes:{ - - //}) - - })(jQuery); + //var router = Backbone.Router.extend({ + //routes:{ + //}) +})(jQuery);