initial

resources/[gameplay]/channelfeed/__resource.lua

@@ -0,0 +1,18 @@
+description 'output lists for game content'
+
+SetResourceInfo('uiPage', 'client/html/index.html')
+
+client_script 'client/channelfeed.lua'
+
+export 'printTo'
+export 'addChannel'
+export 'removeChannel'
+
+files
+{
+    'client/html/index.html',
+    'client/html/feed.js',
+    'client/html/feed.css',
+    'client/fonts/roboto-regular.ttf',
+    'client/fonts/roboto-condensed.ttf',
+}

resources/[gameplay]/channelfeed/client/channelfeed.lua

@@ -0,0 +1,40 @@
+local eventBuffer = {}
+
+AddUIHandler('getNew', function(data, cb)
+    local localBuf = eventBuffer
+    eventBuffer = {}
+
+    cb(localBuf)
+end)
+
+function printTo(channel, data)
+    table.insert(eventBuffer, {
+        meta = 'print',
+        channel = channel,
+        data = data
+    })
+
+    PollUI()
+end
+
+function addChannel(id, options)
+    if not options.template then
+        return
+    end
+
+    options.id = id
+
+    table.insert(eventBuffer, {
+        meta = 'addChannel',
+        data = options
+    })
+
+    PollUI()
+end
+
+function removeChannel(id)
+    table.insert(eventBuffer, {
+        meta = 'removeChannel',
+        data = id
+    })
+end

resources/[gameplay]/channelfeed/client/html/feed.js

@@ -0,0 +1,118 @@
+(function() {
+    var getLock = 0;
+
+    var channels = {};
+
+    var zoomLevel = '100%';
+
+    $(function()
+    {
+        zoomLevel = Math.round(($(window).height() / 720) * 100) + '%'; // yay dynamic typing
+    });
+
+    function refetchData()
+    {
+        getLock = 0;
+
+        $.get('http://channelfeed/getNew', function(data)
+        {
+            if (getLock > 1)
+            {
+                setTimeout(refetchData, 50);
+
+                return;
+            }
+
+            getLock++;
+
+            data.forEach(function(item)
+            {
+                switch (item.meta)
+                {
+                    case 'print':
+                        var channel = item.channel;
+
+                        if (!(channel in channels))
+                        {
+                            return;
+                        }
+
+                        channel = channels[channel];
+
+                        var elem = $($.Mustache.render(item.channel, item.data, { method: channel.method })).appendTo(channel.$elem);
+
+                        setTimeout(function()
+                        {
+                            elem.fadeOut(400, function()
+                            {
+                                elem.remove();
+                            });
+                        }, 7500);
+
+                        break;
+
+                    case 'addChannel':
+                        var channel = item.data;
+
+                        if (channel.id in channels)
+                        {
+                            return;
+                        }
+
+                        channel.$elem = $('<div></div>').attr('id', 'channel-' + channel.id).appendTo('#channels');
+
+                        if (channel.styles !== undefined)
+                        {
+                            channel.$elem.css(channel.styles);
+                        }
+
+                        channel.$elem = $('<div></div>').css('zoom', zoomLevel).appendTo(channel.$elem);
+
+                        if (channel.styleUrl !== undefined)
+                        {
+                            $('<link>').appendTo('head').attr({ type: 'text/css', rel: 'stylesheet' }).attr('href', channel.styleUrl);
+                        }
+
+                        $.Mustache.add(channel.id, channel.template);
+
+                        channels[channel.id] = channel;
+
+                        break;
+                    case 'removeChannel':
+                        var channelId = item.data;
+
+                        if (channelId in channels)
+                        {
+                            channel.$elem.parent().remove();
+
+                            delete channels[channelId];
+                        }
+
+                        break;
+                    case 'clear':
+                        var channel = item.channel;
+
+                        if (!(channel in channels))
+                        {
+                            return;
+                        }
+
+                        channel = channels[channel];
+
+                        channel.$elem.html();
+                        break;
+                }
+            });
+        });
+    }
+
+    window.addEventListener('message', function(event)
+    {
+        if (event.data.type != 'poll')
+        {
+            return;
+        }
+
+        refetchData();
+    });
+})();

resources/[gameplay]/channelfeed/client/html/index.html

@@ -0,0 +1,13 @@
+<!DOCTYPE html>
+<html>
+    <head>
+        <script src="nui://game/ui/jquery.js" type="text/javascript"></script>
+        <script src="nui://game/ui/mustache.js" type="text/javascript"></script>
+        <script src="nui://game/ui/jquery.mustache.js" type="text/javascript"></script>
+        <script src="feed.js" type="text/javascript"></script>
+    </head>
+    <body>
+        <div id="channels">
+        </div>
+    </body>
+</html>