Пример #1
0
function app() {
    //////////////// Collection
    var CongressionalCollection = Backbone.Collection.extend({
        url: "http://congress.api.sunlightfoundation.com/legislators/",

        apiKey: "325ade0da4514bb29ff036144a8bc016",

        parse:function(rawData){
            console.log(rawData)
            return rawData.results
        }
    })


    /////////////// Router
    var CongressionalRouter = Backbone.Router.extend({
    	routes: {
    		"favorites": "handleFaves", 
    		"*default" : "handleCuties"
    	},

    	handleCuties: function() {
            var cc = new CongressionalCollection()

            cc.fetch({
                data:{
                    "apikey":cc.apiKey
                }
            }).then(function(){
                DOM.render(<CutiesView congressColl={cc}/>, document.querySelector('.container'))
                })
    	},

    	handleFaves: function() {
    		DOM.render(<FavesView />, document.querySelector('.container'))
    	},

    	initialize: function() {
    		Backbone.history.start()
    	}
    }) 

    
    var cr = new CongressionalRouter()

    
}
Пример #2
0
function app() {
    // start app
    // new Router()

    var ItemModel = Backbone.Model.extend({

    	defaults: {
    		done: false,
            dueDate: "",
            descript: ""
    	},

    	initialize: function(taskName) {
    		this.set({task: taskName})
    	}
    })

    var ToDoCollection = Backbone.Collection.extend({
    	model: ItemModel
    })

    var ToDoView = React.createClass({

    	_addItem: function(taskName) {
            // var mod = new ItemModel({task: taskName}) 
    		
    		this.state.all.add(new ItemModel(taskName))
    		this._updater()
    	},

    	_updater: function(){
    		this.setState({
    			all: this.state.all,
    			done: this.state.all.where({done:true}),
    			undone: this.state.all.where({done: false}),
    			showing: location.hash.substr(1)
    		})
    	},

    	getInitialState: function() {
    		return {
    			all: this.props.toDoColl,
    			done: this.props.toDoColl.where({
    				done: true}),
    			undone: this.props.toDoColl.where({done: false}),
    			showing: this.props.showing
    		}
    	},

    	render: function() {
    		var coll = this.state.all
    		if (this.state.showing === "done") coll = this.state.done
    		if (this.state.showing === "undone") coll = this.state.undone
    		
    		return (
    			<div className="toDoView">
	    			<Tabs updater={this._updater}
	    				showing={this.state.showing} />
	    			<ItemAdder adderFunc={this._addItem}/>
	    			<ToDoList updater={this._updater}
	    				toDoColl={coll}/>
    			</div>		
    		)	
    	}		
    })

    var Tabs = React.createClass({
    	_genTab: function(tabType, i) {
    		return <Tab updater={this.props.updater}
    		key={i} type={tabType} showing={this.props.showing} />
    	},
    	
    	render: function() {
    		return (
    			<div className="tabs">
    			{["all", "done", "undone"].map(this._genTab)}
    			</div>
    		)
    	}	
    })

    var Tab = React.createClass({
    	_changeRoute: function() {
    		location.hash = this.props.type
    		this.props.updater()
    	},

    	render: function() {
    		var styleObj = {}
    		if (this.props.type === this.props.showing){
    				styleObj.background = "orange"
    		}

    		return (
    			<div onClick={this._changeRoute}
    			style={styleObj} className="tab">
    			<p>{this.props.type}</p>
    		</div>	
    		)	
    	}
    })

    var ItemAdder = React.createClass({

    	_handleKeyDown: function(keyEvent) {
            if(keyEvent.keyCode === 13) {
                var newToDoItem = keyEvent.target.value
                this.props.adderFunc(newToDoItem)
                keyEvent.target.value = ""
            }   
    	},

    	render: function() {
    		return <input onKeyDown={this._handleKeyDown} className="toDoAdder" type="text" placeholder="whatca gotta do?" id="toDo"/>
    	}
    })
    
    var ToDoList = React.createClass({

    	_makeItem: function(model,i) {
    		console.log(model, i)
    		return <Item key={i} updater={this.props.updater} itemModel={model} />
    	},
    	
    	render: function() {
    		return (
    			<div className="toDoList">
    				{this.props.toDoColl.map(this._makeItem)}
    			</div>	
    		)
    	}	
    })

    var Item = React.createClass({
    	_toggleDone: function() {
    		if (this.props.itemModel.get('done')) {
    			this.props.itemModel.set({done: false})
    		}
    		else {
    			this.props.itemModel.set({done: true}
    			)
    		}	
    		this.props.updater()
    	},

        _handleDescription: function(keyEvent) {
            if(keyEvent.keyCode === 13) {
                var newDesc = keyEvent.target.value
                this.props.itemModel.set({descript: newDesc})
                console.log(this.props.itemModel)
                keyEvent.target.value = ""
            }   
        },

        _handleDueDate: function(keyEvent) {
            if(keyEvent.keyCode === 13) {
                var newDueDate = keyEvent.target.value
                this.props.itemModel.set({dueDate: newDueDate})
                console.log(this.props.itemModel)
                keyEvent.target.value = ""
            }   
        },

    	render: function() {
    		var buttonFiller = this.props.itemModel.
    		get('done') ? "\u2713" : ' '

    		return (
    			<div className="toDoItem">
    				{this.props.itemModel.get('task')}
                    <input onKeyDown={this._handleDescription} className="descAdder" type="text" placeholder="description..." id="desc"/>
                    <input onKeyDown={this._handleDueDate} className="dueDateAdder" type="text" placeholder="Due when?" id="dueDate"/>
    			<button onClick={this._toggleDone}>{buttonFiller}</button>
    			</div>	
    		)
    	}
    })

    var ToDoRouter = Backbone.Router.extend({
    	routes: {
    		"undone": "showUndone",
    		"done" : "showDone",
    		"*default" : "home"
    	},

    	showDone: function(){
    	DOM.render(<ToDoView showing="done" toDoColl={new ToDoCollection()}/>, document.querySelector('.container'))	
    	},

    	home: function(){
    	DOM.render(<ToDoView showing="all" toDoColl={new ToDoCollection()}/>, document.querySelector('.container'))
    	},

    	showUnDone: function(){
    	DOM.render(<ToDoView showing="undone" toDoColl={new ToDoCollection()}/>, document.querySelector('.container'))
    	},

    	initialize: function() {
    		Backbone.history.start()
    	}
    })

    var pr = new ToDoRouter()
    
}
Пример #3
0
function app() {

	//------------ Models ------------//

	// set up model for user of the to-do list app
	// the username default is null because it is overwritten by SignInView
	var UserModel = Backbone.Model.extend({
	    defaults: {
	        username: null
	    },

	    // this url requries .json because the persistance data is returned in this format
	    url: function() {
	        return `https://no-reservations.firebaseio.com/users/${this.get('username').json}`
	    }
	})

	// default view on the model is that a task is false or "un-done"
	var ListModel = Backbone.Model.extend({
	    defaults: {
	        status: "pending"
	    }
	})

	// put the initialize method on collection
	// initialize is passed in a username from below
	var ListCollection = Backbone.Firebase.Collection.extend({
	    model: ListModel,
	    initialize: function(username) {
	        this.url = `https://no-reservations.firebaseio.com/users/${username}/tasks`
	    },
	    parse: function(rawData) {
	    	// console.log(rawData)
	    	return rawData
	    }
	})

	//------------ Sign-In View ------------//

	// captures value in input bar where user signs into the to-do-list
	var SignInView = React.createClass ({
	    _submitUsername: function(evt) {
	        if (evt.keyCode === 13) {
	            var username = evt.target.value
	            this.props.handleUserSubmit(username)
	        }
	    },

	    render: function() {
	        return (
	            <div className="signinContainer">
	                <input onKeyDown={this._submitUsername} name="username" />
	            </div>
	            )
	    }
	})

	//------------ Router ------------//

	var Router = Backbone.Router.extend({
	    routes: {
	        "*todo": "home",
	        "default": "showLogin"
	    },

	    handleUserSubmit: function(username) { 
	    	console.log('running handle submit')
	        localStorage.todoUsername = username
	        var userModel = new UserModel({username: username}) 
	        userModel.fetch().then(function(resp){
	            if (resp !== null) { 
	                window.location.hash = "todo"
	            }
	        })
	    },
	    
	    showLogin: function() { 
	        window.location.hash = "login"
	        var boundSubmitter = this.handleUserSubmit.bind(this)
	        DOM.render(<SignInView handleUserSubmit={boundSubmitter}/>, document.querySelector('.container')) 
	    },

	    home: function() {
	        if (typeof localStorage.todoUsername !== 'string') {window.location.hash = "login"}
	        var lc = new ListCollection(localStorage.todoUsername)
	    	//console.log(lc)
	        //var intervalID = setInterval(lc.fetch.bind(lc),1500)
	        DOM.render(<ListView listColl={lc}/>,document.querySelector('.container'))
	    },

	    initialize: function() {
	        Backbone.history.start()
	    }
	}) 

var rtr = new Router()	

}
var BlogRouter = BackboneFire.Router.extend({
	routes:{
		"authenticate"   : "handleAuth",
		"createblog"     : "handleWriterView",
		"readblog"		 : "handleReaderView",
		"*Default"       : "handleHome"
	},

	handleHome:function(){

		var userInfoColl = new BlogPostCollection(ref.getAuth().uid)

		DOM.render(<HomeView userInfo={this.userInfoColl}/>, document.querySelector('.container') )
	},

	handleWriterView: function(){

		var newPostColl = new BlogPostCollection(ref.getAuth().uid)

		DOM.render(<WriterView freshPost={newPostColl}/>, document.querySelector('.container') )
	},

	handleReaderView: function(){
		var pc = new BlogPostCollection(ref.getAuth().uid)

		DOM.render(<ReaderView finishedPostColl={pc}/>, document.querySelector('.container') )
	},

	handleAuth: function(){

		DOM.render(<AuthView/>, document.querySelector('.container') )
	},

	initialize: function(){

		var self = this
		var auth = ref.getAuth()

		if (!auth) location.hash = "authenticate"

		self.on("all", function(){
			if(!ref.getAuth()) location.hash="authenticate"
		}, self)

		// ref.onAuth(function(authData){
		// 	if (authData === null){
		// 		self.authenticateUser = null
		// 	} else {
		// 		self.authenticateUser = authData
		// 	}
		// })

		BackboneFire.history.start()
	}
})
function app() {

//--------------------------//
// Collection and Models    //
//--------------------------//

	var FaveCutiesCollection = Backbone.Firebase.Collection.extend({ //This is the url that firebase will sync with each time a new cutie is favorited
		url: 'https://congressionalcuties.firebaseio.com/favecuties'
	})

	var CutieModel = Backbone.Model.extend({
		defaults: {
			'fave': false //This will affect the heart (for favorites)
		}
	})

	var CongressionalCollection = Backbone.Collection.extend ({

		url: "http://congress.api.sunlightfoundation.com/legislators/",
		apiKey: "325ade0da4514bb29ff036144a8bc016",

		parse: function(rawData){
			console.log(rawData)
			return rawData.results
		},

		model: CutieModel

	})

//--------------------------//
//         Router           //
//--------------------------//

    var CongressionalRouter = Backbone.Router.extend ({

		routes: {
			"favorites": "handleFaves",
			"*default": "handleCuties"
		},

		handleCuties: function() {
			var cc = new CongressionalCollection()
			var fc = new FaveCutiesCollection()
			cc.fetch ({
				data: {
					"apikey": cc.apiKey
				}
			}).then(function(){
				(DOM.render(<CutiesView cutieType="all" congressColl={cc} faveColl={fc}/>, document.querySelector('.container')))
			})
		},

		handleFaves: function() {
				
			DOM.render(<CutiesView cutieType="fave" congressColl={new FaveCutiesCollection}/>, document.querySelector('.container'))
		},

		initialize: function() {
			Backbone.history.start()
		}

	})

//------------------------------------//
//  Views - located in other js files //
//------------------------------------//

    var cr = new CongressionalRouter()
    
}
Пример #6
0
function app() {
    // start app
    // new Router()

    var GiftHorseRouter = Backbone.Router.extend({
    	routes: {
    		"splash" : "_showSplashPage",
    		"hoofbeats" : "_showHoofBeatsView",
    		"stable" : "_showStableView",
    		"send" : "_showSendView",
    		"logout" : "_handleLogOut",
    		"*default" : "_showSplashPage",
    	},

    	initialize: function() {
    		this.ref = new Firebase("https://gifthorse.firebaseio.com/")
    		window.ref = this.ref

    	if (!this.ref.getAuth()) {
                location.hash = "splash"
            }	

    	this.on("route", function() {	
    		if (!this.ref.getAuth()) {
    			location.hash = "splash"
    		}
    	})	
    },

    _handleLogOut: function() {
    	this.ref.unauth()
    	location.hash = "splash"
    },

    _showSplashPage: function() {
    	DOM.render(<SplashPage logUserIn={this._logUserIn.bind(this)}
    		createUser={this._createUser.bind(this)} />, document.querySelector(".container"))
    },

    _showHoofBeatsView: function() {
    	var uid = ref.getAuth().uid
    	var giftHorseColl = new GiftHorses(uid)
    	
    	DOM.render(<HoofBeatsView giftHorseColl={giftHorseColl}/>, document.querySelector(".container"))
    },

    _showStableView: function() {
    	var uid = ref.getAuth().uid
    	var giftHorseColl = new GiftHorses(uid)

    	DOM.render(<StableView giftHorseColl={giftHorseColl}/>, document.querySelector(".container"))
    },

    _showSendView: function() {
    	var uid = ref.getAuth().uid
    	var giftHorseColl = new GiftHorses(uid)

    	DOM.render(<SenderView giftHorseColl={giftHorseColl}/>, document.querySelector(".container"))
    },

    _logUserIn: function(email,password){
    	console.log(email,password)
    	this.ref.authWithPassword({
    		email: email,
    		password: password
    	}, function(err, authData) {
    	   		if (err) console.log(err)
    			else {
    				location.hash = "hoofbeats"
    			}	
    		}	
    	)
    },

    _createUser: function(email,password) {
    	console.log(email, password)
    	var self = this
    	this.ref.createUser({
    		email: email,
    		password: password,
    		profileImage: "http://lorempixel.com/80/80/"  
    	}, function(err, authData) {
    		if (err) console.log(err)
    		else {
    			var userMod = new UserModel(authData.uid)
    			userMod.set({
    				email: email,
    				id: authData.uid,
    				profileImage: "http://lorempixel.com/80/80/" 
    			})	   			
    			self._logUserIn(email,password)
    		}		
    	})
    }
})
    var pr = new GiftHorseRouter()
    Backbone.history.start()
}
Пример #7
0
function app() {
    // start app
    // new Router()
    var AuthView = React.createClass({

    	_handleSignUp: function(evt){
		    var component = this
		    var evt = evt
		    console.log("event!", evt)
		    evt.preventDefault()

		    var emailInput    = evt.currentTarget.email.value
		    var pwInput       = evt.currentTarget.password.value
		    var userNameInput = evt.currentTarget.username.value


		    fbRef.createUser(
		      {
		        email    : emailInput,  // internal to fb
		        password : pwInput //internal to fb
		      }, 

		    function(err, authData){
		       console.log(err)
		       console.log(authData)
		       var userBlogsColl = new UserBlogsColl(fbRef);

		        userBlogsColl.create({
		           username: userNameInput,
		           id: authData.uid,
		           posts: ''
		        })

		         //notify app of authenticatedUser
		        myRouter.authenticatedUser = authData.uid
		        myRouter.authenticatedUserPosts = new PostsByUserColl(fbRef, authData.uid)

		        myRouter.navigate('', {trigger: true} )

		    })
		},

		componentDidMount: function(){
		    var component = this
		    this.props.coll.on('sync', function(){
		        console.log("mounted", component.props.coll)
		      	component.setState({
		        	userSecretColl: component.props.coll
		    	})
		    })
		},

    	render: function(){
		    return (
		      <div>
		        <form onSubmit={this._handleSignUp}>
		          <h3>Welcome to Another Blog Site!</h3>
		          <input type="text" id="email" placeholder="Email"/><br/>
		          <input type="password" id="password" placeholder="Password"/><br/><br/>

		          <input type="text" id="username" placeholder="Your Name"/><br/>
		          <input id="signup" type="submit" defaultValue="Sign Up"/><br/>

		        </form>
		        <hr/>
		        <form onSubmit={this._handleLogIn}>
		          <h3 className="signin">Sign In</h3>
		          <input type="text" id="email" placeholder="Email"/><br/>
		          <input className="button-primary" type="submit" defaultValue="Log In"/><br/>
		        </form>
		      </div>
		    )
  		}
    })

    var HomeView = React.createClass({
    	getInitialState: function(){	
    		return {
    			posts: this.props.postsColl
    		}
    	},

    	// componentDidMount: function(){
    	// 	var self = this
    	// 	this.props.postsColl.on('sync', function(){

    	// 	})
    	// },

    	_addPost: function(e) {
    		console.log("new post")

    		this.props.postsColl.add({
    			content: e.currentTarget.value
    		})
    	},

    	render: function() {

    		console.log('home')
    		var coll = this.props //.get('id')
    		console.log(coll)
    		return (
    			<div id="homeDiv">
    				<div>Your posts go here</div>
    				<input onKeyPress={this._addPost}type="text"></input>
    			</div>
    		)
    	}
    })

    var UserBlogsColl = BackboneFire.Firebase.Collection.extend({
  		url: "",
  		initialize: function(fb){
    		this.url = fb.child('users')
  		}
	})

	var PostsByUserColl = BackboneFire.Firebase.Collection.extend({
		url: "",
		initialize: function(fb, usrUid){
  		this.url = fb.child('users').child(usrUid).child('posts')
  		console.log(this.url)
  	}
	})



    var AppRouter = BackboneFire.Router.extend({
    	routes: {
    		"authenticate": "showSplash",
    		"*home": "showHome"
    	},

    	showHome: function() {
    		if (this.authenticatedUser === null) {
    			this.navigate('authenticate', {'trigger': true})
    			return
    		}
 			

    		DOM.render(<HomeView postsColl={this.authenticatedUserPosts}/>, document.querySelector('.container'))
    	},

    	showSplash: function() {
    		console.log("work please")
    		
    		var fbColl = new UserBlogsColl(fbRef)
    		console.log(fbColl)
    		 DOM.render(<AuthView coll={fbColl}/>, document.querySelector('.container'))
    	},

    	initialize: function() {
    		var rtr = this
    		fbRef.onAuth(function(authData){
      			if(authData){
		        	console.log('authenticated')
		        	rtr.authenticatedUser = authData.uid

		      	} else {
		        	console.log('Not authenticated')
		        	rtr.authenticatedUser = null
		        }
      		})
    		console.log("routing")
    		BackboneFire.history.start()
    	}
    })
    var fbRef = new Firebase("https://anotherblog.firebaseio.com/")
    var myRouter = new AppRouter()
}
Пример #8
0
function app() {
    // start app
    // new Router()

    var PrewardRouter = Backbone.Router.extend({
    	routes: {
    		"splash" : "_showSplashPage",
    		"dash" : "_showDashboard",
    		"logout" : "_handleLogOut",
    	},

    	initialize: function() {
    		this.ref = new Firebase("https://preward.firebaseio.com/")
    		window.ref = this.ref

    	if (!this.ref.getAuth()) {
                location.hash = "splash"
            }	

    	this.on("route", function() {	
    		if (!this.ref.getAuth()) {
    			location.hash = "splash"
    		}
    	})	
    },

    _handleLogOut: function() {
    	this.ref.unauth()
    	location.hash = "splash"
    },

    _showSplashPage: function() {
    	DOM.render(<SplashPage logUserIn={this._logUserIn.bind(this)}
    		createUser={this._createUser.bind(this)} />, document.querySelector(".container"))
    },

    _showDashboard: function() {
    	var uid = ref.getAuth().uid
    	var msgColl = new UserMessages(uid)
    	DOM.render(<DashPage user={this.email} msgColl={msgColl}/>,document.querySelector(".container"))
    },

    _logUserIn: function(email,password){
    	console.log(email,password)
    	this.ref.authWithPassword({
    		email: email,
    		password: password
    	}, function(err, authData) {
    	   		if (err) console.log(err)
    			else {
    				location.hash = "dash"
    			}	
    		}	
    	)
    },

    _createUser: function(email,password,nickName) {
    	console.log(email, password)
    	var self = this
    	this.ref.createUser({
    		email: email,
    		password: password,
    		nickName: nickName
    	}, function(err, authData) {
    		if (err) console.log(err)
    		else {
    			var userMod = new UserModel(authData.uid)
    			userMod.set({
    				name: nickName,
    				email: email,
    				id: authData.uid
    			})
    			self._logUserIn(email,password)
    		}		
    	})
    }
})
    var pr = new PrewardRouter()
    Backbone.history.start()
}
Пример #9
0
function app() {
    // start app
    // new Router()

    var GiphyModel = Backbone.Model.extend({
    	defaults: {
    		"fave":false,
    	}
    })

    var GiphyCollection = Backbone.Collection.extend ({
    	url: "http://api.giphy.com/v1/gifs/search",
    	apiKey: "dc6zaTOxFJmzC",

    	parse: function(rawData){
    
            return rawData.data
        },

        model:GiphyModel
    })

    var FavesCollection = Backbone.Firebase.Collection.extend({
    	url: "https://giphybase.firebaseio.com/favegiphys"
    })

    var GiphyRouter = Backbone.Router.extend({
    	routes: {
    		"favorites": "handleFaves",
    		"*default" : "handleGiphys"
    	},

    	handleGiphys: function(query){
    		var fc = new FavesCollection()
    		var gc = new GiphyCollection()
    		gc.reset.bind(this)
			gc.fetch ({
    			data: {
	    			"api_key": gc.apiKey,
	    			"q": query
    			}
    			}).then(function(){
    			DOM.render(<GiphyView giphyType="all" query={query} giphyColl={gc} faveColl={fc} />, document.querySelector('.container'))
    		})
		},
    	
    	handleFaves: function() {
    		DOM.render(<GiphyView giphyType="faves" giphyColl={new FavesCollection} />, document.querySelector('.container'))
    	},

    	initialize: function() {
    		Backbone.history.start()
    	}
    }) 

    var GiphyView = React.createClass({

    _handleSearch: function(event){
    	
    	var query = event.currentTarget.search.value

    	location.hash = query
    },	

	// componentWillMount: function(){
	// 	var self = this
	// 	self.props.giphyColl.on("sync reset", function() {self.forceUpdate()})
	// },

	// componentWillUnmount: function(){
	// 	var self = this
	// 	self.props.giphyColl.off("sync reset")
	// },

	render: function(){

		return (
			<div className="giphyView">
			<h1>{this.props.query}</h1>
			<form onSubmit={this._handleSearch}>
			<input className="searchBar" type="text" placeholder="search..." id="search"/> 
			</form>
				<GiphyList giphyColl={this.props.giphyColl.models} faveColl={this.props.faveColl} />		
			</div>
			)	
		}
	})	
	
    var GiphyList = React.createClass ({
    	_makeGiphyComponent: function(model, id) {
    		return <Giphy giphyData={model} key={id} faveColl={this.props.faveColl} updater={this._updater} />
    		console.log(model)
    	},

    	_updater: function(){
    		this.setState({
    			giphyColl: this.state.giphyColl
    		})
    	},

    	getInitialState: function(){
    		return{
    			giphyColl: this.props.giphyColl
    		}
    	},

    	render: function(){

    		return (
    			<div className="giphyList">
    				{this.props.giphyColl.map(this._makeGiphyComponent)}
    			</div>	
    		)
    	}
    })

    var Giphy = React.createClass ({

    	_handleComment: function(){

    	},

    	render: function(){

    		var giphyModel = this.props.giphyModel

    		return (
    			<div className="giphy">
    				<img src={this.props.giphyData.attributes.images.original.url}/>
    				<div className="interactive"><button className="heart">&#10084;</button><form onSubmit={this._handleComment}>
    				 <input className="comment" type="text" id="comment" placeholder="add a comment..."/>
    				</form>
    				</div>
    			</div>
    		)
    	}		
    })

    var gr = new GiphyRouter()

}
Пример #10
0
var BlogRouter =  BackboneFire.Router.extend({
	routes: {
		'bloglist':'handleBlogList',
		'createblog':'handleCreateBlog',
		'logout': 'handleLogOut',
		'publicblog':'handlePublicBlog',
		'*splash':'handleSplashPage'
	},

	handlePublicBlog:function(){
		var publicListColl = new PublicBlogCollection()
		var queriedUserMdl = new UserModel(fbRef.getAuth().uid)

		DOM.render(<PublicBlog userModel={queriedUserMdl} publicListColl={publicListColl} />, document.querySelector('.container'))
	},

	handleLogOut:function(evt){
		fbRef.unauth()
		this.navigate('splash',{trigger:true})
	},

	handleBlogList:function(){
		console.log('handling blog list')
		rtr = this
		fbRef.authData = fbRef.getAuth()
		// UM = UserModel
		var queriedUserMdl = new UserModel(fbRef.getAuth().uid)
		var blogListColl = new BlogListCollection(fbRef.getAuth().uid)
		var publicListColl = new PublicBlogCollection()
		
		DOM.render(<Bloglist blogListColl={blogListColl} userModel={queriedUserMdl} publicListColl={publicListColl}/>, document.querySelector('.container'))
	},

	handleCreateBlog:function(){
		rtr = this
		var queriedUserMdl = new UserModel(fbRef.getAuth().uid)
		console.log('userName>>>>>>>', queriedUserMdl)

		DOM.render(<Createblog userModel={queriedUserMdl} />, document.querySelector('.container'))
	},

	handleSplashPage:function(){
			DOM.render(<SplashPage/>, document.querySelector('.container'))
	},

	initialize:function(){
		var rtr = this
		console.log('initializing')
		rtr.authenticatedUser = fbRef.getAuth()

		if (!rtr.authenticatedUser) location.hash = "splash"

		// fbRef.onAuth(function(authData){
		// 	console.log('new auth status! >>>>>', authData)

		// 	if(authData){
		// 		rtr.userId = authData.uid
		// 		rtr.authenticatedUser = authData
		// 	} else {
		// 		rtr.authenticatedUser = null
		// 	}
		// })


		rtr.on('all', function() {
			if(!fbRef.getAuth()){
				location.hash = "splash"
			}	
		})
		BackboneFire.history.start()
	}
})
Пример #11
0
function app() {
   // start app
   // new Router()
    var FavCutiesCollection = Backbone.Firebase.Collection.extend({
      url: "http://cutiesofcongress.firebaseio.com/users",
      initialize: function(uid) {
        this.url = `http://cutiesofcongress.firebaseio.com/users/${uid}/faves`
      }
    })

    var CutieModel = Backbone.Model.extend({
    	defaults:{
    		'fave': false
    	},

      parse: function(rawData) {
        this.set({id:rawData.bioguide_id})
        return rawData
      }
    })

    var CongressionalCollection = Backbone.Collection.extend ({
      url: 'http://congress.api.sunlightfoundation.com/legislators',
      apiKey:"325ade0da4514bb29ff036144a8bc016",

      parse: function (rawData){
        return rawData.results
      },

      model: CutieModel,

    })

    var CongressionalRouter = Backbone.Router.extend ({
      routes: {
        "allcuties": "showAllCuties",
        "faves": "showFaves",
        "dash": "showDashboard",
        "logout": "handleLogOut",
        "splash": "showSplashPage"
      },

      initialize: function() {
        this.ref = new Firebase("https://cutiesofcongress.firebaseio.com")
        var auth = this.ref.getAuth()
        console.log(auth)
        if (!auth) location.hash = "splash"

        this.on("all",function() {
          if (!this.ref.getAuth()) location.hash = "splash"
        }, this)
      },

      handleLogOut: function() {
        this.ref.unauth()
        location.hash = "splash"
      },

      showDashboard: function() {
        DOM.render(<Dashboard email={this.ref.getAuth().password.email}/>, document.querySelector('.container'))
      },

      showAllCuties: function() {
        var cc = new CongressionalCollection()
        var fc = new FavCutiesCollection(this.ref.getAuth().uid)

        cc.fetch({
          data:{
            "apikey": cc.apiKey
          }
        })
          
        DOM.render(<CutiesView email={this.ref.getAuth().password.email} cutieType="all" faveColl={fc} congressColl={cc} />, document.querySelector('.container'))
      },

      showFaves: function() {
        var fc = new FavCutiesCollection(this.ref.getAuth().uid)        
        DOM.render(<FavesView email={this.ref.getAuth().password.email} congressColl={fc} />, document.querySelector('.container'))
      },

      showSplashPage: function() {
        var boundSignerUpper = this._signUserUp.bind(this)
        var boundLoggerInner = this._logUserIn.bind(this)

        DOM.render(<SplashPage loggerInner={boundLoggerInner} error={null} signerUpper={boundSignerUpper} />, document.querySelector('.container'))
      },

      _logUserIn: function(submittedEmail,submittedPassword) {
        var ref = this.ref
        var handler = function(error, authData) {
          if (error) {
            console.log("Login Failed!", error);
          } else {
            console.log("Authenticated successfully with payload:");
            console.log(authData)
            location.hash = "dash"
          }
        }

        ref.authWithPassword({
          email    : submittedEmail,
          password : submittedPassword
        }, handler);
      },

      _signUserUp: function(submittedEmail,submittedPassword) {
          var ref = this.ref
          var boundSignerUpper = this._signUserUp.bind(this)
          var boundLoggerInner = this._logUserIn.bind(this)
          var storeUser = function(userData) {
            ref.child('users').child(userData.uid).set({email:submittedEmail})
          }

          var handler = function(error, userData) {
            if (error) {
              console.log("Error creating user:"******"Successfully created user account with uid:", userData.uid);
              storeUser(userData)
              boundLoggerInner(submittedEmail,submittedPassword)
            }
          }

          ref.createUser({
            email    : submittedEmail,
            password : submittedPassword
          }, handler);          
      }
    })

    var cr = new CongressionalRouter()

    Backbone.history.start()

}