sports_db 0.0.3 → 0.0.4

data/app/assets/javascripts/clients/android/client.js

@@ -0,0 +1,53 @@
+if ($.client.android) {
+    console.log('=> Using AndroidClient.js');
+
+    // This should be in a mock file...
+    if (!window.ClientBridge) {
+        window.ClientBridge = {
+            notify: function(obj) {
+                window.console.debug(obj);
+            }
+        };
+    }
+
+    var Client = Class.extend({
+        initialize: function() {
+
+        },
+        /**
+         * Called by the web application to send values to the client.
+         *
+         * @param {Object} obj - a set of key/value parameters to send to client
+         */
+        notify: function(obj) {
+            var arr = [];
+            for (var prop in obj) {
+                arr.push(prop +'='+ encodeURIComponent(obj[prop]));
+            }
+            ClientBridge.notify( arr.join('&') );
+        },
+
+        /**
+         * Called by the client to set a value or trigger an action in the web page.
+         *
+         * @param {String} name
+         * @param {Object} value (optional)
+         */
+        callback: function(name, value) {
+            Application.onClientCallback(name, value);
+        }
+    });
+
+    // Singleton
+    Client = new Client();
+
+    // Fix console as it doesn't appear to exist in Android WebView, and we frequently leave these statements in our code
+    if (!window.console) {
+        window.console = {};
+        var f = function() {};
+        ["debug", "info", "warn", "error", "assert", "dir", "dirxml", "trace", "group", "groupCollapsed",
+        "groupEnd", "time", "timeEnd", "profile", "profileEnd", "count"].forEach(function(func) {
+            window.console[func] = f;
+        });
+    }
+}

data/app/assets/javascripts/clients/ios/client.js

@@ -0,0 +1,58 @@
+if ($.client.ios) {
+    console.log('=> Using iOSClient.js');
+
+    var Client = Class.extend({
+        // Called by the web application to send values to the client.
+        //
+        //     @param {Object} obj - a set of key/value parameters to send to client
+        notify: function(obj) {
+            if (top.location === self.location) {
+                this._createUrlForClientInterception("client_notify", obj);
+            }
+        },
+        // Called by the client to set a value or trigger an action in the web page.
+        //
+        //     @param {String} name
+        //     @param {Object} value (optional)
+        callback: function(name, value) {
+            Application.onClientCallback(name, value);
+        },
+        _createUrlForClientInterception: function(prefix, obj) {
+            this._initClientTransportIfNecessary(prefix);
+            for (var prop in obj) {
+                if (typeof obj[prop] !== 'function') {
+                    var input = document.createElement("input");
+                    input.type = "hidden";
+                    input.name = prop;
+                    // these do not need to be encoded, because the form does this for us.
+                    input.value = obj[prop];
+                    this.form.appendChild(input);
+                }
+            }
+            // prevent embedded iframe from being source of further events.
+            if (top.location === self.location) {
+                this.form.submit();
+            }
+        },
+        _initClientTransportIfNecessary: function(prefix) {
+            if (this.iframe === null || this.iframe === undefined) {
+                this.iframe = document.createElement("iframe");
+                this.iframe.name = "postit";
+                this.iframe.setAttribute("style", "position:absolute; left:-1000px; top:-100px;");
+                this.iframe.width = this.iframe.height = 10;
+                document.body.appendChild(this.iframe);
+
+                this.form = document.createElement("form");
+                this.form.target = "postit";
+                this.form.style.visibility = "hidden";
+                this.form.style.position = "absolute";
+                document.body.appendChild(this.form);
+            }
+            this.form.action = prefix;
+            this.form.innerHTML = "";
+        }
+    });
+
+    // Singleton
+    Client = new Client();
+}

data/app/assets/javascripts/core/Application.js

@@ -0,0 +1,173 @@
+var Application = Class.extend({
+    initialize: function() {
+        this.app_is_initializing = true;
+        this.views = {};
+        this.params = {};
+        this.cache = {};
+        this.currentView = null;
+        this.clientCallbackHandlers = [];
+        this.params = {};
+
+        // Get hash params
+        if (window.location.hash) {
+            this.params = $.hashStrToObj();
+        }
+
+        // I'm not reallys ure we want to store these together, but whatever (For now)
+        this.params = $.extend(window.CONFIG, this.params);
+
+        // Start timer for game updates
+        // TODO only run this on game views
+        this.timer = new Timer($.proxy(this._fireTimerEvent, this), this.params.GAME_UPDATE_FREQUENCY);
+        this.timer.start();
+    },
+    // Fire a timer event
+    _fireTimerEvent: function() {
+        $(document.body).trigger("timerReachInterval", false, false);
+    },
+    // Call the view if the method exists
+    _onTimerReachedInterval: function() {
+        var view = this.currentView;
+        if (view && view._onTimerReachedInterval) {
+            view._onTimerReachedInterval.call(view);
+        }
+    },
+    // Register a view constructor under a specific name. If a link in the application has
+    // a parameter named "view" that points to a registered view name, then the `Application`
+    // will load that view. Optionally, you can pass in parameters, and these will be merged
+    // with any other parameters in the link that triggers view loading (parameters in the
+    // link override parameters in the registration binding). This allows you to bind the
+    // same view under different names with different parameters in order to parameterize
+    // its behavior.
+    //
+    //      @param {Object} name
+    //      @param {Object} constructor
+    //      @param {Object} params (optional)
+    registerView: function(name, constructor, params) {
+        this.views[name] = { constructor: constructor, params: (params || {}) };
+    },
+    // Stash a view, i.e. change the url to something meaningful, but do not show the
+    // view based on this URL change. This is needed in cases where the device goes to
+    // sleep, and then reloads upon awakening.
+    stashView: function(params) {
+        var local = {};
+        local.view = params.view;
+        if (params.filter) { local.filter = params.filter; }
+        if (params.key) { local.key = params.key; }
+        local.stash = true;
+        var url = "#" + $.objToQueryStr(local);
+
+        document.location = url;
+    },
+    // Show a view based on the supplied parameters. The only required parameter is "view"
+    // which must reference a valid view name.
+    //
+    //      @param {Object} params
+    showView: function(params) {
+        $.assert(params.view, "No view specified (use #view=<viewName>)", "Error: no view specified.");
+        var binding = this.views[params.view];
+
+        $.assert(binding, params.view + " is not a registered view name. Did you add it to views.js?", "Error: not a registered view.");
+
+        // Merge binding parameters (from views.js) into any parameters that were supplied in the URL
+        for (var prop in binding.params) {
+            if (typeof params[prop] === 'undefined') {
+                params[prop] = binding.params[prop];
+            }
+        }
+        var view = new binding.constructor(params);
+        $.assert(view.create, params.view + " doesn't have a create method and is not a valid view", "Error: not a valid view.");
+
+        view.create();
+    },
+    // When the view is done initializing, it must call this method.
+    appendView: function(view) {
+        view.beforeViewAppended(view.params);
+        view.buffer.html('empty');
+
+        // if we have a reference to the previous view, remove() it
+        if (this.currentView && this.currentView.element) {
+            $(this.currentView.element).remove();
+        }
+
+        // re-assign this.curentView to the new view, and add it to the
+        // Application.cache
+        this.currentView = this.cache[History.currentHash()] = view;
+
+        document.body.appendChild(view.element);
+
+        if (view.params.scrollY) {
+            window.scrollTo(0,view.params.scrollY);
+            this.params.scrollY = 0;
+        } else {
+            window.scrollTo(0,0);
+        }
+        $.alignLoader();
+
+        view.afterViewAppended(view.params);
+
+        $(view.element).addClass('cached');
+        if (!view.params.skip_metrics === true) this.sendMetrics();
+    },
+    sendMetrics: function() {
+        var view = Application.currentView;
+        Client.notify({
+            "metric": view.getMetric(),
+            "title": view.getTitle(),
+            "buttons": view.getButtons(),
+            "action": view.getAction(),
+            "filter": view.getFilter(),
+            "section": view.getSection()
+        });
+    },
+    // The web application is receiving a callback from the client to set a value or execute some
+    // behavior. If the view has an `onClientCallback` method, this will be executed first. It can
+    // cancel any further event handling by returning `true`. Otherwise, the application sends the
+    // event to all of the `clientCallbackHandlers` that are registered with the application, in the
+    // order they were registered.
+    //
+    //      @param {String} name
+    //      @param {Object} value
+    onClientCallback: function(name, value) {
+        var handled = false;
+        var view = this.currentView;
+        if (view && view.onClientCallback) {
+            handled = view.onClientCallback.call(view, name, value);
+        }
+        if (!handled) {
+            this.clientCallbackHandlers.forEach(function(handler) {
+                handler.call(this, name, value);
+            }, this);
+        }
+    },
+    // load a view from cache or the server when we get a hashchange event
+    _onHashChange: function(event, data) {
+        // If the app is not initializing, and the view is stashed, do not do anything
+        if (!this.app_is_initializing && data.stash) {
+            console.log('=> App is not initializing & a view is stashed. RETURN');
+            return;
+        }
+
+        $.assert(data.view, "No view specified (use #view=<viewName>)", "Error: no view specified.");
+
+        var view = this.cache[History.currentHash()];
+        view ? this.appendView(view) : this.showView(data);
+
+        this.app_is_initializing = false;
+    },
+    // Initializes application functionality on page load, and kicks off loading the view.
+    //
+    //     @private
+    _onReady: function() {
+        $(document.body)
+            .on("hashchange", $.proxy(Application._onHashChange, this))
+            .on("timerReachInterval", $.proxy(Application._onTimerReachedInterval, this));
+    }
+});
+
+// Singleton.
+Application = new Application();
+
+Zepto(function($) {
+    Application._onReady();
+});

data/app/assets/javascripts/core/BaseView.js

@@ -0,0 +1,117 @@
+// A basic view implementation that expects an `URL` to be passed as one of the parameters
+// to the view; it will format that `URL` using any other parameters, and use it to retrieve
+// an `HTML` fragment from the server. This is only one of many strategies that could be
+// followed to create views, of course. It also assumes that the parameters object will
+// get a title property.
+var BaseView = View.extend({
+    // Subclasses must ensure there is an url property to the parameter object passed
+    // into this superconstructor, i.e.:
+    //
+    //     this._super(params)
+    //
+    // Any parameters passed in to the view constructor will be substituted
+    // into the URL string using the String format method (see utilities.js).
+    //
+    //     @param {Object} params
+    initialize: function(params) {
+        this.url    = this.getUrl(params);
+        this.params = params;
+        this.buffer = Application.params.BUFFER_EL;
+    },
+    getUrl: function(params) {
+        if (params.url) {
+            return params.url.format(params);
+        } else {
+            return "/" + Application.params.APP_NAME + "/" + params.view;
+        }
+    },
+    getTitle: function() {
+        // The title varies on the Team View between Android and iOS.
+        // cstuart 2011-08-29
+        if ($.client.ios) {
+            this.params.title = this.params.ios_title || this.params.title;
+        }
+        return this.params.title || this.params.view.capitalize();
+    },
+    getMetric: function() {
+        return this.params.metric || "/" + this.params.view.capitalize();
+    },
+    getButtons: function() {
+        return this.params.buttons || "Back:";
+    },
+    getAction: function() {
+        return this.params.action || "<None>";
+    },
+    getFilter: function() {
+        return this.params.filter || "<None>";
+    },
+    getSection: function() {
+        return this.params.view;
+    },
+    // Loads the content of the view from the server (the content should be wrapped by a `div`).
+    // The content is inserted into the page.
+    create: function() {
+        var view = this;
+
+        // This is a hack. The TSN keys include periods that confuse the Rails page caching system. Convert
+        // here to underscores, and back to periods again on the server using a filter.
+        view.url = view.url.replace(/\./g,"_");
+
+        function onError() {
+            var params = {};
+            // The old currentView won't exist in the case of a 404 or
+            // other server error.
+            if (Application.currentView && Application.currentView.params) {
+                params = Application.currentView.params;
+            }
+            $.hideLoader();
+            $.flash("A network error occurred.", params, true);
+            throw new Error('An error occurred.');
+        }
+        $.showLoader();
+        $.ajax({
+            url: view.url,
+            success: function(response) {
+                // If the server is unreachable, zepto calls `success`
+                // and then the `response` is empty. Catch it here and throw an error.
+                if (response === "") onError();
+
+                var response = $.highResifyLogosForRetinaAndAndroid(response);
+
+                view.buffer.html(response);
+                view.element = view.buffer.find('div').get(0);
+                view._evaluateDataAttribute();
+                Application.appendView(view);
+                $.hideLoader();
+                $.delayedLoad();
+            },
+            error: function() {
+                onError();
+            }
+        });
+    },
+    onClientCallback: function(name, value) {
+        console.log('BaseView.onClientCallback({' + name + ': ' + value + '})');
+    },
+    // If HTML returned from the server includes a `<data id="view_data" data=""></data>` element,
+    // this should contain an object literal (JSON string) with values that will be merged into
+    // the parameters for this view instance. This is used to pass back additional information
+    // from the server via the HTML. For example, when loading a player it might be useful to
+    // return the key for the player's team so that can be used when communicating with the client:
+    //
+    //     <data id="view_data" data="{'title': '<%= @team.city_name %> <%= @team.team_name %>'}"></data>
+    //
+    // This will add the integer 1588 (correctly typed) under the property "team_key" to the
+    // parameters (`this.params`) for this view.
+    _evaluateDataAttribute: function() {
+        var view_data_el = Application.params.BUFFER_EL.find("#view_data");
+        if (view_data_el.size() === 0) return;
+        if (!view_data_el.attr('data')) return;
+
+        var data = eval.call(window, "(" + view_data_el.attr("data") + ")");
+        for (var key in data) {
+            // If you escape a non-string value, it is first converted to a string, which we don't want
+            this.params[key] = (typeof data[key] == "string") ? unescape(data[key]) : data[key];
+        }
+    }
+});

data/app/assets/javascripts/core/History.js

@@ -0,0 +1,45 @@
+// A very simple history implementation. Generates events on the `document.body` element when the
+// hash changes, and includes a parsed object of parameters or a string from the hash.
+
+var History = (function() {
+
+    var currentHash = null;
+
+    function getMemo() {
+        return currentHash.toParameters();
+    }
+
+    function getHash() {
+        return window.location.hash.substring(1);
+    }
+
+    function poll() {
+        var hash = getHash();
+        if (currentHash !== hash) {
+            currentHash = hash;
+            $(document.body).trigger("hashchange", [getMemo()]);
+        }
+    }
+
+    $(document).ready(function() {
+        currentHash = getHash();
+
+        if ('onhashchange' in window) {
+            $(window).on('hashchange', poll);
+        } else {
+            setInterval(poll, 50);
+        }
+
+        $(document.body).trigger("hashchange", [getMemo()]);
+    });
+
+    return {
+        add: function(params) {
+            window.location.hash = "#" + $.objToQueryStr(params);
+        },
+        currentHash: function() {
+            return getHash();
+        }
+    }
+
+})();

data/app/assets/javascripts/core/Mock.js

@@ -0,0 +1,90 @@
+// Mock client interface
+var Mock = Class.extend({
+    initialize: function(client) {
+        this.client = client;
+        window.addEventListener("load", this._makeToolbar.bind(this), true);
+    },
+    _makeToolbar: function(){
+        var toolbar = document.createElement("div");
+        toolbar.id = "mock-toolbar-container";
+        // CSS is set in `mock.css`
+        toolbar.innerHTML = "<div id='mock-toolbar'>\
+                                <div id='mock-left'></div>\
+                                <div id='mock-center'></div>\
+                                <div id='mock-right'></div>\
+                            </div>";
+
+        document.body.insertBefore(toolbar, document.body.firstChild);
+        this.toolbar = toolbar;
+    }
+});
+
+var Mock = new Mock(Client);
+
+Client.notify = function(obj) {
+    if (typeof obj.buttons !== 'undefined') {
+        this.makeButtons(obj.buttons);
+    }
+    if (typeof obj.title !== 'undefined') {
+        this.makeTitle(obj.title);
+    }
+
+    if (obj.action === "getFavesAndNotifs") {
+        Client.callback("favesAndNotifs", {
+            faves: Application.params.MOCK_FAVORITES,
+            notifs: Application.params.MOCK_NOTIFS
+        });
+    }
+
+    // Client.notify logs notifications to the console.
+    if (window.console && window.console.log) {
+        var arr = [];
+        for (var prop in obj) {
+            if (typeof obj[prop] !== "function") {
+                arr.push(escape(prop) + ": " + escape(obj[prop]));
+            }
+        }
+        console.log("Client.notify({ " + arr.join(", ") + " })");
+    }
+};
+
+Client.makeButtons = function(str) {
+    if (!str) return;
+    var specs = str.split(":");
+    if (specs.length != 2) {
+        alert("There should be 2 segments to a buttons specification");
+    } else {
+        makeButtonsForSection(specs[0], "mock-left");
+        makeButtonsForSection(specs[1], "mock-right");
+    }
+    function makeButtonsForSection(str, id) {
+        $('#'+id).hide();
+        if (str !== "") {
+            $('#'+id).show();
+            if (str === "NudgeNav") {
+                // Support for nudge nav in mock toolbar.
+                $('#'+id).html("<action name='nudge' value='prev'>&uarr;</action>&nbsp;<action name='nudge' value='next'>&darr;</action>");
+            } else {
+                $('#'+id).html("<action name='callback' value=" + str + ">" + str + "</action>");
+            }
+        }
+    }
+};
+
+// Set the view title
+Client.makeTitle = function(title) {
+    $("#mock-center").html(title);
+};
+
+setTimeout(function() {
+    $('#mock-toolbar').delegate('action', 'click', function(e) {
+        var name = $(e.target).attr('name');
+        var value = $(e.target).attr('value');
+
+        Application.onClientCallback(name, value);
+    });
+}, 400);
+
+Application.clientCallbackHandlers.push(function(name, value) {
+    if (value === "Back") history.back();
+});

data/app/assets/javascripts/core/Timer.js

@@ -0,0 +1,18 @@
+// Timer class for use with auto-updating of game status'.
+var Timer = Class.extend({
+    initialize: function(func, period) {
+        this.func = func;
+        this.period = period;
+        this.interval = null;
+    },
+    // startNow: function() {
+    //     this.func();
+    //     this.interval = window.setInterval(this.func, this.period);
+    // },
+    start: function() {
+        this.interval = window.setInterval(this.func, this.period);
+    },
+    stop: function() {
+        window.clearInterval(this.interval);
+    }
+});

data/app/assets/javascripts/core/View.js

@@ -0,0 +1,56 @@
+// If your view implements an initialization function, that function will be passed a parameter
+// object containing all the query parameters in the URL that triggered the view's creation, plus
+// all of those values that were assigned to the view when it was registered and bound to a name.
+// It does not need to hold on to these values (although the base implementation of view does, as
+// `this.params`). At the end of a view's create method, it should have inserted a dom element into
+// the body of the page. This will be assigned as the "element" property to the view by the application,
+// as it needs to be referenced outside your view class.
+var View = Class.extend({
+    // This method should create (by any means desirable) a DOM element and insert it into the page.
+    // Our base implementation queries for an HTML fragment from the server, but this is up to
+    // your view implementation.
+    create: function() {
+        throw new Error("Create method not implemented in subclass");
+    },
+    // Title of this view. We may not actually use titles in this version of the application,
+    // but we needed to provide this in the past.
+    getTitle: function() {
+        throw new Error("getTitle method not implemented in subclass");
+    },
+    // The name of the view that is used to log metrics to Google Analytics. The view
+    // may also provide additional calls to `Client.notify({'metric': 'metricName'})` if it updates
+    // internally (changing tabs, for example).
+    getMetric: function() {
+        throw new Error("getMetric method not implemented in subclass");
+    },
+    getButtons: function() {
+        throw new Error("getButtons method not implemented in subclass");
+    },
+    // Send off any necessary notifications to the client. This avoids and issue on iOS where
+    // two notifications send right after one another causes one of them to fail.
+    getAction: function() {
+        throw new Error("getAction method not implemented in subclass");
+    },
+    // Tell the client what a filtereable view is filtered to.
+    getFilter: function() {
+        throw new Error("getFilter method not implemented in subclass");
+    },
+    // Tell the client what section we are in.
+    getSection: function() {
+        throw new Error("getSection method not implemented in subclass");
+    },
+    // Called before the view is appended to the page.
+    beforeViewAppended: function() {
+
+    },
+    // Called after the view is appended into the page. Either if comes from the cache, or if
+    // it is from a get request.
+    afterViewAppended: function() {
+
+    }
+    // The client has executed a callback on the web page, to pass a value to the page
+    // or to execute some functionality.
+    /*
+    ,onClientCallback( name, value ) {}
+    */
+});