Session settings functioning, but have 500 error on REST call. Working with Seth to figure out what I'm doing wrong

2013-06-09 20:12:43 -06:00 · 2013-06-09 20:12:43 -06:00 · 9c99be17f8
parent 7e730e870d
commit 9c99be17f8
9 changed files with 127 additions and 56 deletions
--- a/app/assets/javascripts/genreSelector.js
+++ b/app/assets/javascripts/genreSelector.js
@ -9,7 +9,7 @@
    context.JK = context.JK || {};
    context.JK.GenreSelectorHelper = (function() {

-        var _logger = context.JK.logger;
+        var logger = context.JK.logger;
        var _genres = [];  // will be list of structs: [ {label:xxx, value:yyy}, {...}, ... ]

        function loadGenres() {
@ -55,6 +55,17 @@
            return selectedGenres;
        }

+        function setSelectedGenres(parentSelector, genreList) {
+            if (!genreList) {
+                return;
+            }
+            var values = [];
+            $.each(genreList, function(index, value) {
+                values.push(value.toLowerCase());
+            });
+            var selectedVal = $('select', parentSelector).val(values);
+        }
+
        function initialize() {
            loadGenres();
        }
@ -62,6 +73,7 @@
        var me = { // This will be our singleton.
            initialize: initialize,
            getSelectedGenres: getSelectedGenres,
+            setSelectedGenres: setSelectedGenres,
            reset: reset,
            render: render,
            loadGenres: loadGenres
--- a/app/assets/javascripts/jam_rest.js
+++ b/app/assets/javascripts/jam_rest.js
@ -12,6 +12,17 @@
        var self = this;
        var logger = context.JK.logger;

+        function updateSession(id, newSession, onSuccess) {
+            logger.debug('Rest.updateSession');
+            return $.ajax('/api/sessions/' + id, {
+                type: "PUT",
+                data : newSession,
+                dataType : 'json',
+                success: onSuccess
+            });
+        }
+
+
        function getUserDetail(options) {
            var id = getId(options);

@ -143,9 +154,10 @@
        this.deleteAvatar = deleteAvatar;
        this.getFilepickerPolicy = getFilepickerPolicy;
        this.getFriends = getFriends;
+        this.updateSession = updateSession;

        return this;
    };


-})(window,jQuery);
+})(window,jQuery);
--- a/app/assets/javascripts/session.js
+++ b/app/assets/javascripts/session.js
@ -723,8 +723,8 @@

        this.tracks = tracks;

-        this.getCurrentSessionModel = function() {
-            return sessionModel;
+        this.getCurrentSession = function() {
+            return sessionModel.getCurrentSession();
        };

        context.JK.HandleBridgeCallback = handleBridgeCallback;
--- a/app/assets/javascripts/sessionModel.js
+++ b/app/assets/javascripts/sessionModel.js
@ -101,6 +101,8 @@
                async: false,
                success: function(response) {
                    sendClientParticipantChanges(currentSession, response);
+                    logger.debug("Current Sesssion Refreshed:");
+                    logger.debug(response);
                    currentSession = response;
                    callback();
                },
@ -342,6 +344,9 @@
        this.addTrack = addTrack;
        this.updateTrack = updateTrack;
        this.deleteTrack = deleteTrack;
+        this.getCurrentSession = function() {
+            return currentSession;
+        };
    };

 })(window,jQuery);
--- a/app/assets/javascripts/sessionSettingsDialog.js
+++ b/app/assets/javascripts/sessionSettingsDialog.js
@ -1,29 +1,87 @@
-// g is the "global" namespace. Easier to type
-// than "context"
-(function(g,$) {
+/**
+* Javascript for the session settings dialog.
+*/
+(function(context,$) {

-    g.JK = g.JK || {};
-    g.JK.SessionSettingsDialog = function(app, sessionScreen) {
-        var logger = g.JK.logger;
+    context.JK = context.JK || {};
+    context.JK.SessionSettingsDialog = function(app, sessionScreen) {
+        var logger = context.JK.logger;
+        var $dialog;
+        var rest = new JK.Rest(app);

        function beforeShow(data) {
-            var currentSession = sessionScreen.getCurrentSessionModel();
+            context.JK.GenreSelectorHelper.render('#session-settings-genre');
+            $dialog = $('[layout-id="session-settings"]');
+            var currentSession = sessionScreen.getCurrentSession();
+            context.JK.GenreSelectorHelper.setSelectedGenres('#session-settings-genre', currentSession.genres);
+            // dynamic object binding to form.
+            // TODO: Generalize, test and bundle with formToObject
+            var skip = [
+                'participants', // has its own API
+                'invitations', // has its own API
+                'join_requests', // has its own API
+                'genres' // handled specifically
+            ];
+            $.each(_.keys(currentSession), function(index,propName) {
+                if (context._.contains(skip, propName)) {
+                    logger.debug("Skipping " + propName);
+                    return true; // "continue"
+                }
+                var inputSelector = '[name="' + propName + '"]';
+                $input = $(inputSelector, $dialog);
+                logger.debug('Found ' + $input.length + ' inputs for selector, ' + inputSelector);
+                var desiredValue = null;
+                if ($.isArray(currentSession[propName])) {
+                    desiredValue = currentSession[propName].join(',');
+                } else {
+                    desiredValue = currentSession[propName];
+                }

+                logger.debug("setting to " + desiredValue);
+                $input.val(desiredValue).change();
+            });
+
+        }
+
+        function updateFanChatDisabled(evt) {
+            logger.debug('updateFanChatDisabled');
+            $dialog = $('[layout-id="session-settings"]');
+            var hasFanAccess = $('select[name="fan_access"]', $dialog).val(); // string
+            hasFanAccess = context.JK.stringToBool(hasFanAccess);
+            logger.debug('hasFanAccess? ' + hasFanAccess);
+            if (hasFanAccess) {
+                $('input[name="fan_chat"]', $dialog).removeAttr("disabled");
+            } else {
+                $('input[name="fan_chat"]', $dialog).attr("disabled", "disabled");
+            }
        }

        function saveSettings(evt) {
+            var newSessionInfo = $('#session-settings-dialog').formToObject();
+            var id = newSessionInfo.id;
+            delete newSessionInfo.id;
+            if (typeof newSessionInfo.genres === "string") {
+                newSessionInfo.genres = [newSessionInfo.genres];
+            }
+            alert("About to try and save: " + JSON.stringify(newSessionInfo));
+            rest.updateSession(id, newSessionInfo, settingsSaved);
+        }
+
+        function settingsSaved(response) {
+            alert(response);
        }

        function events() {
+            $('#session-settings-dialog-submit').on('click', saveSettings);
+            $('#session-settings-dialog select[name="fan_access"]').on('change', updateFanChatDisabled);
        }

        this.initialize = function() {
-            logger.debug("SessionSettingsDialog.initialize");
            events();
-            var screenBindings = {
+            var dialogBindings = {
                'beforeShow': beforeShow
            };
-            app.bindScreen('session-settings', screenBindings);
+            app.bindDialog('session-settings', dialogBindings);
        };
    };

--- a/app/assets/javascripts/utils.js
+++ b/app/assets/javascripts/utils.js
@ -8,6 +8,14 @@
    context.JK = context.JK || {};
    var logger = context.JK.logger;

+    context.JK.stringToBool = function(s) {
+        switch(s.toLowerCase()){
+            case "true": case "yes": case "1": return true;
+            case "false": case "no": case "0": case null: return false;
+            default: return Boolean(s);
+        }
+    };
+
    var instrumentIconMap24 = {
            "acoustic guitar": '../assets/content/icon_instrument_guitar24.png',
            "bass guitar": '../assets/content/icon_instrument_guitar24.png',
--- a/app/views/clients/_genreSelector.html.erb
+++ b/app/views/clients/_genreSelector.html.erb
@ -1,3 +1,3 @@
-<select class="genre-list">
+<select class="genre-list" name="genres">
    <option value="">Select Genre</option>
 </select>
--- a/app/views/clients/_sessionSettings.html.erb
+++ b/app/views/clients/_sessionSettings.html.erb
@ -10,6 +10,8 @@
    </div>

    <div class="dialog-inner">
+        <form id="session-settings-dialog">
+            <input type="hidden" name="id"/>
        <!-- register left column -->
        <div class="left mr35 w40">

@ -19,56 +21,28 @@
            <div id="session-settings-genre">
                <%= render "genreSelector" %>
            </div>
-            <!--
-            <select class="w90">
-                <option>Choose a Genre</option>
-                <option>African</option>
-                <option>Acoustic</option>
-                <option>Adult Contemporary</option>
-                <option>Rock</option>
-                <option>Hard Rock</option>
-                <option>Metal</option>
-                <option>Jazz</option>
-                <option>Classical</option>
-            </select>
-            -->
-
-            <!-- <div id="genrelist" class="w100">
-                <div class="genrecategory"><a href="javascript:genreBox()">Choose up to 3 genres</a></div><a class="arrow-down" id="genrelist-arrow" href="javascript:genreBox()"></a>
-                <div class="genre-wrapper w100">
-                    <div class="genrecategory"><input type="checkbox">&nbsp;African</div>
-                    <div class="genrecategory"><input type="checkbox" checked="checked">&nbsp;Acoustic</div>
-                    <div class="genrecategory"><input type="checkbox">&nbsp;Adult Contemporary</div>
-                    <div class="genrecategory"><input type="checkbox" checked="checked">&nbsp;Rock</div>
-                    <div class="genrecategory"><input type="checkbox">&nbsp;Hard Rock</div>
-                    <div class="genrecategory"><input type="checkbox">&nbsp;Metal</div>
-                    <div class="genrecategory"><input type="checkbox">&nbsp;Jazz</div>
-                    <div class="genrecategory"><input type="checkbox">&nbsp;Classical</div>
-                </div>
-
-            </div>-->
            <br />
            <br />
            <div class="left mr30">
                Musician Access:<br />
-                <select >
-                    <option selected="selected">Public</option>
-                    <option>Private</option>
+                <select id="session-settings-musician-access" name="musician_access">
+                    <option value="true">Public</option>
+                    <option value="false">Private</option>
                </select><br />

-                <input type="radio" name="musician-access" checked="checked" />&nbsp;Open&nbsp;&nbsp;<br />
-                <input type="radio" name="musician-access" />&nbsp;By Approval
+                <input type="radio" value="false" name="approval_required" checked="checked" />&nbsp;Open&nbsp;&nbsp;<br />
+                <input type="radio" value="true" name="approval_required" />&nbsp;By Approval
            </div>   
            <div class="left">

                Fan Access:<br />
-                <select>
-                    <option>Public</option>
-                    <option selected="selected">Private</option>
+                <select name="fan_access">
+                    <option value="true">Public</option>
+                    <option value="false">Private</option>
                </select>
                <br />
-                <input type="radio" name="fan-chat" disabled="disabled" />&nbsp;Chat&nbsp;&nbsp;<br />
-                <input type="radio" name="fan-chat" disabled="disabled" />&nbsp;No Fan Chat
+                <input type="radio" name="fan_chat" value="true" disabled="disabled" />&nbsp;Chat&nbsp;&nbsp;<br />
+                <input type="radio" name="fan_chat" value="false" disabled="disabled" />&nbsp;No Fan Chat

            </div>         
        </div><!-- end left column -->
@ -78,11 +52,12 @@

            <!-- description -->
            Description:<br />
-            <textarea rows=9 class="settings-session-description">Doing some experimental stuff. Lots of freeform with plenty of opportunity for solos. Intermediate skill level or better only please.</textarea>
+            <textarea rows=9 name="description" class="settings-session-description">Doing some experimental stuff. Lots of freeform with plenty of opportunity for solos. Intermediate skill level or better only please.</textarea>
            <br />
            <br />
            <div class="right">
-                <a layout-action="close" class="button-grey">CANCEL</a>&nbsp;<a href="#" class="button-orange">UPDATE SETTINGS</a>
+                <a layout-action="close" class="button-grey">CANCEL</a>&nbsp;
+                <a id="session-settings-dialog-submit" href="#" class="button-orange">UPDATE SETTINGS</a>

            </div>

@ -90,6 +65,7 @@
        <!-- end right column -->
        <br clear="all" />

+        </form>
    </div>
    <!-- end inner --> 

--- a/app/views/clients/index.html.erb
+++ b/app/views/clients/index.html.erb
@ -145,10 +145,10 @@

        // Let's get things rolling...
        if (JK.currentUserId) {
-            JK.JamServer.connect(); // singleton here defined in JamServer.js

            JK.app = JK.JamKazam();
            JK.app.initialize();
+            JK.JamServer.connect(); // singleton here defined in JamServer.js

            // Run a check to see if we're logged in yet. Only after that should
            // we initialize the other screens.