Juan Olvera j0lvera

Moving from jQuery

Events

// jQuery
$(document).ready(function() {
  // code
})

Basic JavaScript MVC Implementation

Despite being derived from classical MVC pattern JavaScript and the environment it runs in makes Javascript MVC implementation have its own twists. Lets see how typical web MVC functions and then dive into simple, concrete JavaScript MVC implementation.

How Web MVC typically works

Typical server-side MVC implementation has one MVC stack layered behind the singe point of entry. This single point of entry means that all HTTP requests, e.g. http://www.example.com or http://www.example.com/whichever-page/ etc., are routed, by a server configuration, through one point or, to be bold, one file, e.g. index.php.

At that point, there would be an implementation of Front Controller pattern which analyzes HTTP request (URI at first place) and based on it decides which class (Controller) and its method (Action) are to be invoked as a response to the request (method is name for function and member is name for a variable when part of the class/object).

	(function($) {

	$('a[href^="#"]').click(function(event) {
	var id = $(this).attr("href");
	var offset = 60;
	var target = $(id).offset().top - offset;

	$('html, body').animate({scrollTop:target}, 500);

	event.preventDefault();

	var request = require('request')

	/**
	* Handle multiple requests at once
	* @param urls [array]
	* @param callback [function]
	* @requires request module for node ( https://github.com/mikeal/request )
	*/
	var __request = function (urls, callback) {

	function pwg(length, option) {
	var pw = "",
	arr = [],
	isOpera = false,
	chars = [
	"abcdefghijklmnopqrstuvwxyz",
	"1234567890",
	"!@#$%&*()_+}{:?-=}[;/.,]",
	"ABCDEFGHIJKLMNOPQRSTUVWXYZ"
	],

	var smoothScroll = function(id) {
	var target = $(id).offset().top - 60;
	$('html, body').animate({scrollTop:target}, 500);
	};

	/*
	* Use
	*/

	$('a#link').on('click', function(e) {

	<div class="row">
	<div class="col-1-3">
	<img src="something.jpg">
	</div>
	<div class="col-1-3">
	<img src="something.jpg">
	</div>
	<div class="col-1-3">
	<img src="something.jpg">
	</div>

	#!/usr/bin/env python

	from bottle import route, run, template, static_file, request, parse_auth, auth_basic
	from redis import StrictRedis as Redis
	from cork import Cork
	from hashids import Hashids
	from passlib.hash import pbkdf2_sha256

	incr1 = Hashids(salt="Eehu6laucelohh3b", min_length="16")
	incr2 = Hashids(salt="Phiejapie2ahr9wa", min_length="8")

	// Use Gists to store code you would like to remember later on
	console.log(window); // log the "window" object to the console

	// bootstrap
	PX.app = new PX.App();
	Backbone.history.start();