supahgreg

#MVVM For JavaScript Developers

MVVM (Model View ViewModel) is an architectural pattern based on MVC and MVP, which attempts to more clearly separate the development of user-interfaces (UI) from that of the business logic and behaviour in an application. To this end, many implementations of this pattern make use of declarative data bindings to allow a separation of work on Views from other layers.

This facilitates UI and development work occurring almost simultaneously within the same codebase. UI developers write bindings to the ViewModel within their document markup (HTML), where the Model and ViewModel are maintained by developers working on the logic for the application.

##History

MVVM was originally defined by Microsoft for use with Windows Presentation Foundation (WPF) and Silverlight, having been officially announced in 2005 by John Grossman in a blog p

supahgreg

// ==UserScript==
// @id             [email protected]
// @name           GM_watchValue test
// @version        1.0
// @namespace      phob.net
// @author         wn
// @description    Testing GM_watchValue and GM_unwatchValue
// @include        http://phob.net/
// @run-at         document-end
// ==/UserScript==

supahgreg

#Lessons From A JavaScript Code Review

I was recently asked to review some code and thought I might share some of the feedback I provided as it includes a mention of JavaScript fundamentals that are always useful to bear in mind.

####Problem: Functions to be used as callbacks (as well as objects) are passed as parameters to other functions without any type validation.

Feedback: For functions, at minimum 1) test to ensure the callback exists and 2) do a typeof check to avoid issues with the app attempting to execute input which may not in fact be a valid function at all.

if (callback && typeof(callback) === "function"){

supahgreg

// ==UserScript==
// @id             [email protected]
// @name           Quake Live Escaper
// @version        1.6
// @namespace      phob.net
// @author         wn
// @description    Press escape to close Quake Live's Game Summary, Live Game Info and notification popups
// @include        http://*.quakelive.com/*
// @exclude        http://*.quakelive.com/forum*
// @run-at         document-end

supahgreg

// ==UserScript==
// @name         GitHub Your Fork Switcher
// @namespace    githubYourForkSwitcher
// @include      http*://github.com/*/*
// @datecreated  2010-06-02
// @lastupdated  2011-07-16
// @version      0.3
// @author       Erik Vergobbi Vold
// @contributor  Greg Parris
// @license      GPL version 3 or any later version; http://www.gnu.org/copyleft/gpl.html

supahgreg

// ==UserScript==
// @id             [email protected]
// @name           GM_setValue return test
// @namespace      http://phob.net
// @description    GM_setValue return test
// @include        http://phob.net/*
// ==/UserScript==

GM_log("Setting scriptval 'isGood' to true");
var val = GM_setValue("isGood", true);

supahgreg

// ==UserScript==
// @id             BoerseFFm
// @name           BoerseFFm
// @namespace      tests
// @description    checking the time changing
// @include        http://www.boerse-frankfurt.de/DE/index.aspx?pageID=1
// ==/UserScript==

var clock = document.getElementById("clock");
var h, m, s, time;

supahgreg

setting update.uso.lastFetch
done setting update.uso.lastFetch

checking if any scripts are from USO

8: [email protected] is a USO script
TIMEOUT TIMEOUT TIMEOUT!!!   delay is: 800 (typeof: number)

5: [email protected] is a USO script
TIMEOUT TIMEOUT TIMEOUT!!!   delay is: 500 (typeof: number)

supahgreg

// ==UserScript==
// @id             [email protected]
// @name           Scriptish menu command test!
// @author         Greg Parris
// @namespace      http://phob.net
// @description    testing GM_(register|unregister|enable|disable)MenuCommand
// @include        http://phob.net/
// ==/UserScript==

var body = document.getElementsByTagName("body")[0];

supahgreg

// ==UserScript==
// @name          YouTube Enhancer - Scriptish test
// @include       http://youtube.*/*
// @include       http://*.youtube.*/*
// @include       https://youtube.*/*
// @include       https://*.youtube.*/*
// ==/UserScript==

var ytplayer = unsafeWindow.document.getElementById("movie_player");
if (!ytplayer) {