X-Git-Url: https://disinclined.org/git/?a=blobdiff_plain;f=mud.js;h=b8e3074ca2dbac81c2b18d5376e7ccf08ff909b5;hb=19bbaf5a8dee8338c686751ddfe9abb9a12148c3;hp=eb1b55c5c7f2db5d4b533d399342fb364248cbc6;hpb=620baa26c102f5a97830593c55d67ab27dbe596a;p=mudd.git

diff --git a/mud.js b/mud.js
index eb1b55c..b8e3074 100644
--- a/mud.js
+++ b/mud.js
@@ -1,44 +1,62 @@
 $(document).ready(function(){
     
-    var canvas = $('#world')[0];
+    var canvas = $('#universe')[0];
     var c = canvas.getContext('2d');
+    var endpoint = '/mud/mud.php';
 
-    function player(x, y) {
+    function player(x, y, id) {
         this.x = x;
         this.y = y;
+        this.id = id;
+        self = this;
+
+        mud.rooms[this.x][this.y].join();
 
         this.move = function(direction) {
             var rooms = mud.rooms;
+
+            function move(direction, oldroom, newroom) {
+                $.get(endpoint, {
+                        'cmd' : 'move',
+                        'direction' : direction
+                    }, function(json) {
+                        oldroom.clear();
+                        newroom.join();
+                        if (json && json.description)
+                            writeToLog('', 'env', json.description);
+                    }
+                );
+            }
             switch (direction) {
                 case 'left':
+                case 'west':
                     if (rooms[this.x-1] && rooms[this.x-1][this.y]
                             && !rooms[this.x-1][this.y].state) {
-                        rooms[this.x][this.y].clear();
-                        rooms[this.x-1][this.y].join();
+                        move('west', rooms[self.x][self.y], rooms[self.x-1][self.y])
                         this.x--;
                     }
                     break;
                 case 'up':
+                case 'north':
                     if (rooms[this.x][this.y-1]
                             && !rooms[this.x][this.y-1].state) {
-                        rooms[this.x][this.y].clear();
-                        rooms[this.x][this.y-1].join();
+                        move('north', rooms[this.x][this.y], rooms[this.x][this.y-1]);
                         this.y--;
                     }
                     break;
                 case 'right':
-                    if (rooms[this.x+1] && rooms[this.x+1][this.y+1]
+                case 'east':
+                    if (rooms[this.x+1] && rooms[this.x+1][this.y]
                         && !rooms[this.x+1][this.y].state) {
-                        rooms[this.x][this.y].clear();
-                        rooms[this.x+1][this.y].join();
+                        move('east', rooms[this.x][this.y], rooms[this.x+1][this.y]);
                         this.x++;
                     }
                     break;
                 case 'down':
+                case 'south':
                     if (rooms[this.x][this.y+1]
                         && !rooms[this.x][this.y+1].state) {
-                        rooms[this.x][this.y].clear();
-                        rooms[this.x][this.y+1].join();
+                        move('south', rooms[this.x][this.y], rooms[this.x][this.y+1]);
                         this.y++;
                     }
                     break;
@@ -46,91 +64,193 @@ $(document).ready(function(){
         }
     }
 
-    function room(x, y, h, l) {
+    function room(x, y, width, height) {
         this.x = x;
         this.y = y;
-        this.h = h;
-        this.l = l;
+        this.width = width;
+        this.height = height;
         this.state = 0;
+        this.population = 0;
         this.fill = function() {
             c.fillStyle = "rgb(0,0,0)";
-            c.fillRect(this.x, this.y, this.h, this.l);
+            c.fillRect(this.x, this.y, this.height, this.width);
             this.state = 1;
         }
-        this.clear = function() {
-            console.log('clearing');
-            c.fillStyle = "rgb(255,255,255)";
-            c.fillRect(this.x, this.y, this.h, this.l);
+        this.clear = function(other, player) {
             this.state = 0;
+            this.population--;
+            if (!this.population) {
+                c.fillStyle = "rgb(255,255,255)";
+                c.fillRect(this.x, this.y, this.height, this.width);
+            }
         }
-        this.join = function() {
-            c.fillStyle = "rgb(0,255,0)";
-            c.fillRect(this.x, this.y, this.h, this.l);
+        this.join = function(other, player) {
+            c.fillStyle = !other || (player && mud && mud.player
+                                    && mud.player.x == player.x && mud.player.y == player.y)
+                            ? "rgb(0,255,0)" : "rgb(0,0,255)";
+            c.fillRect(this.x, this.y, this.height, this.width);
+            this.population++;
         }
     }
 
     function universe() {
-        this.rooms = [];
 
-        this.rows = 30;
-        this.columns = 30;
+        var self = this;
+        this.rooms = [];
+        this.players = [];
 
-        this.roomWidth = canvas.width / this.rows;
-        this.roomHeight = canvas.height / this.columns;
+        this.build = function(seed) {
+            this.rows = seed.length;
+            this.columns = seed[0].length;
+            this.roomWidth = canvas.width / this.rows;
+            this.roomHeight = canvas.height / this.columns;
 
-        for (var i = 0; i < this.columns; i++) {
-            var column = [];
-            var x = i * this.roomWidth;
-            var y = 0;
-            for (var ii = 0; ii < this.columns; ii++) {
-                column.push(new room(x, y, this.roomWidth, this.roomHeight));
-                y += this.roomWidth;
-                Math.random() > .5 ? column[ii].clear() : column[ii].fill();
+            for (var i = 0; i < this.columns; i++) {
+                this.rooms[i] = [];
+                var x = i * this.roomWidth;
+                var y = 0;
+                for (var ii = 0; ii < this.rows; ii++) {
+                    this.rooms[i][ii] = new room(x, y, this.roomWidth, this.roomHeight);
+                    if (seed[i][ii]) this.rooms[i][ii].fill();
+                    y += this.roomHeight;
+                }
             }
-            this.rooms.push(column);
         }
 
-        this.populate = function(seed) {
-            for (var i = 0; i < this.rows; i++) {
-                for (var ii = 0; ii < this.columns; ii++) {
-                    seed[i][ii] ? this.rooms[i][ii].clear()
-                                : this.rooms[i][ii].fill();
-                }
-            }
+        this.join = function(name) {
+            $.getJSON(endpoint, { 'cmd' : 'join', 'name' : name }, function(json) {
+                self.player = new player(json.x, json.y, json.id);
+                setInterval(self.poll, 1000);
+                self.populate(json.poll.players);
+            });
         }
 
-        this.join = function() {
-            do {
-                var x = Math.floor(Math.random()*(this.columns));
-                var y = Math.floor(Math.random()*(this.rows));
-            } while (!this.rooms[x][y].state);
-            this.rooms[x][y].join();
-            return player = new player(x,y);
+        var commands = {
+            tell : function(msg) {
+                var parts = msg.match(/^(\w+)\s(.*)/);
+                if (!parts[1]) return;
+                var dest = parts[1];
+                msg = parts[2];
+                $.ajax({
+                    url: endpoint,
+                    data: { 'cmd' : 'tell', 'dest' : dest, 'msg' : msg },
+                    success: function() {
+                      self.writeToLog('You told ' + dest + ': ', 'tell', msg);
+                    },
+                });
+            },
+            yell : function(msg) {
+                $.ajax({
+                    url: endpoint,
+                    data: { 'cmd' : 'yell', 'msg' : msg },
+                    success: function() {
+                        self.writeToLog('You yelled: ', 'yell', msg);
+                    },
+                });
+            },
+            say : function(msg) {
+                $.ajax({
+                    url: endpoint,
+                    data: { 'cmd' : 'say', 'msg' : msg },
+                    success: function() {
+                        self.writeToLog('You said: ', 'say', msg);
+                    },
+                });
+            },
+            move : function(direction) {
+                self.player.move(direction);
+            },
+        }
+        this.writeToLog = function(action, style, msg) {
+            $('#log').append(
+                $('<div>').addClass('logline').append(
+                    $('<span>').addClass(style).text(action),
+                    $('<span>').addClass('msg').text(msg)
+                )
+            );
+            $("#log").animate({ scrollTop: $('#log')[0].scrollHeight}, 1000);
         }
+        $('#submit').click(function() {
+            var text = $('#chat').val();
+            var parts = text.match(/^(\w+)\s(.*)/);
+            if (parts) {
+                var cmd = parts[1];
+                text = parts[2];
+                if (commands[cmd] != undefined) {
+                    commands[cmd](text);
+                    $('#chat').val('');
+                }
+            }
+        });
+        $('#chat').keydown(function(e) {
+            if (e.which == '13') {
+                typeof self.player == 'undefined' ?
+                    $('#join').click() : $('#submit').click();
+            } else if (e.which >= 37 && e.which <= 40)
+                e.stopPropagation();
+        });
+        $('#join').click(function() {
+            var chat = $('#chat');
+            if (chat.val() == '') {
+                chat.css('border-color', 'red');
+                return;
+            }
+            mud.join(chat.val());
+            chat.css('border-color', 'black').val('');
+            $(this).fadeOut('slow', function() {
+                $('#log, #submit').fadeIn('slow')
+                    .css('display', 'inline-block');
+            });
+        });
 
         $(document).keydown(function(e) {
-            if (typeof player == undefined) return;
+            if (typeof self.player == 'undefined') return;
             switch (e.which) {
                 case 37:
-                    player.move('left');
+                    self.player.move('left');
                     break;
                 case 38:
-                    player.move('up');
+                    self.player.move('up');
                     break;
                 case 39:
-                    player.move('right');
+                    self.player.move('right');
                     break;
                 case 40:
-                    player.move('down');
+                    self.player.move('down');
                     break;
                 default:
                     return;
             }
             e.preventDefault();
         });
+
+        $.getJSON(endpoint, { 'cmd' : 'start' }, function(json) {
+            self.build(json)
+        });
+
+        this.populate = function(players) {
+            for (var i in this.players)
+                if (this.players[i].id != this.player.id)
+                    mud.rooms[this.players[i].x][this.players[i].y].clear();
+            this.players = players;
+            for (var i in this.players)
+                if (this.players[i].id != this.player.id)
+                    mud.rooms[this.players[i].x][this.players[i].y].join(1, this.players[i]);
+        }
+
+        this.poll = function() {
+            $.getJSON(endpoint, { 'cmd' : 'poll' }, function(json) {
+                for (var i in json.messages) {
+                    var msg = json.messages[i];
+                    if (msg.id == self.player.id) continue;
+                    self.writeToLog(msg.name + ':', msg.type, msg.message);
+                    $("#log").animate({ scrollTop: $('#log')[0].scrollHeight }, 1000);
+                }
+                self.populate(json.players);
+            });
+        }
     }
 
-    var mud = new universe;
-    var player = mud.join();
+    mud = new universe;
 
 });