We have the pleasure to introduce you to the first Online Multiplayer Trivia:

The game uses a realtime protocol based on websockets to provide instant feedback to all players.

Technologies implemented:
For the backend:
- Websockets
- Ruby on Rails
- Ajax
- Javascript
For the front end:
- Haml
- Javascript / Jquery
- Less
- Parallax effects made on Javascript


Have a look at our repo in github:


We even have a Facebook fanpage with 40 likes ..and counting ;)


A game that was created by a well organised team:

  1. Graphic Designer: Zvezdana Marjanovic
  2. UX designer: Kenneth Wimmer
  3. Front-End developer: Cynthia Sanchez
  4. Back-end developer: Thomas Schmidt

These are some screenshot of Trivialine:

The home page trivialine.home

The game page trivialine.home

The online chat trivialine.home

Did you like it? Vote for us :D

Looking for hackers with the skills:

graphics creativity websockets javascript jquery

This project is part of:

Hack Week 11

Activity

  • about 10 years ago: aosthof liked this project.
  • about 10 years ago: ddemaio liked this project.
  • about 10 years ago: mcarlini liked this project.
  • about 10 years ago: victorhck liked this project.
  • about 10 years ago: MarcusMoeller liked this project.
  • about 10 years ago: kpimenov liked this project.
  • about 10 years ago: kwwii liked this project.
  • about 10 years ago: kwwii joined this project.
  • about 10 years ago: kfreitag joined this project.
  • about 10 years ago: digitaltomm liked this project.
  • about 10 years ago: cyntss liked this project.
  • about 10 years ago: cyntss added keyword "javascript" to this project.
  • about 10 years ago: cyntss added keyword "jquery" to this project.
  • about 10 years ago: digitaltomm added keyword "websockets" to this project.
  • about 10 years ago: digitaltomm joined this project.
  • about 10 years ago: cyntss joined this project.
  • about 10 years ago: sndirsch liked this project.
  • about 10 years ago: cyntss added keyword "creativity" to this project.
  • about 10 years ago: cyntss added keyword "graphics" to this project.
  • about 10 years ago: cyntss removed keyword html5 from this project.
  • about 10 years ago: cyntss removed keyword ajax from this project.
  • about 10 years ago: cyntss removed keyword javascript from this project.
  • about 10 years ago: zvezdanam started this project.
  • about 10 years ago: cyntss added keyword "html5" to this project.
  • about 10 years ago: cyntss added keyword "ajax" to this project.
  • All Activity

    Comments

    • cyntss
      about 10 years ago by cyntss | Reply

      example image

    • digitaltomm
      about 10 years ago by digitaltomm | Reply

      I will focus on the real-time client-server communication using websockets. I can also help on the frontend side with the javascript dealing with the server communication.

    • cyntss
      about 10 years ago by cyntss | Reply

      trivialine

    • kfreitag
      about 10 years ago by kfreitag | Reply

      hrm, could we easteregg something with a client I am maintaining? Sounds like fun...

    • cyntss
      about 10 years ago by cyntss | Reply

      Visit and play our game: http://trivialine.herokuapp.com/

    • kwwii
      about 10 years ago by kwwii | Reply

      kfreitag: sounds like a great idea :-)

    • cyntss
      about 10 years ago by cyntss | Reply

      Trivialine

    • cyntss
      about 10 years ago by cyntss | Reply

      trivialine

    Similar Projects

    Finish gfxprim application multiplexor (window manager) by metan

    Project Description

    I've implemented drivers for a few e-ink displays during the last hackweek and made sure that gfxprim widgets run nicely on e-ink as well. The missing piece to have a portable e-ink computer/reader/music player/... is a application that can switch between currently running applications and that can start new applications as well. Half of the solution is ready, there is a proxy gfxprim backend where applications render into a piece of a shared memory and input events (e.g. keyboard, mouse) can be multiplexed. What is missing is an interface (possibly touchscreen friendly as well) to make it user friendly.

    Goal for this Hackweek

    Make nekowm usable "window manager".

    Resources


    Create DRM drivers for VESA and EFI framebuffers by tdz

    Description

    We already have simpledrm for firmware framebuffers. But the driver is originally for ARM boards, not PCs. It is already overloaded with code to support both use cases. At the same time it is missing possible features for VESA and EFI, such as palette modes or EDID support. We should have DRM drivers for VESA and EFI interfaces. The infrastructure exists already and initial drivers can be forked from simpledrm.

    Goals

    • Initially, a bare driver for VESA or EFI should be created. It can take functionality from simpledrm.
    • Then we can begin to add additional features. The boot loader can provide EDID data. With VGA hardware, VESA can support paletted modes or color management. Example code exists in vesafb.


    Create a DRM driver for VGA video cards by tdz

    Yes, those VGA video cards. The goal of this project is to implement a DRM graphics driver for such devices. While actual hardware is hard to obtain or even run today, qemu emulates VGA output.

    VGA has a number of limitations, which make this project interesting.

    • There are only 640x480 pixels (or less) on the screen. That resolution is also a soft lower limit imposed by DRM. It's mostly a problem for desktop environments though.
    • Desktop environments assume 16 million colors, but there are only 16 colors with VGA. VGA's 256 color palette is not available at 640x480. We can choose those 16 colors freely. The interesting part is how to choose them. We have to build a palette for the displayed frame and map each color to one of the palette's 16 entries. This is called dithering, and VGA's limitations are a good opportunity to learn about dithering algorithms.
    • VGA has an interesting memory layout. Most graphics devices use linear framebuffers, which store the pixels byte by byte. VGA uses 4 bitplanes instead. Plane 0 holds all bits 0 of all pixels. Plane 1 holds all bits 1 of all pixels, and so on.

    The driver will probably not be useful to many people. But, if finished, it can serve as test environment for low-level hardware. There's some interest in supporting old Amiga and Atari framebuffers in DRM. Those systems have similar limitations as VGA, but are harder to obtain and test with. With qemu, the VGA driver could fill this gap.

    Apart from the Wikipedia entry, good resources on VGA are at osdev.net and FreeVGA


    New openSUSE-welcome by lkocman

    Project Description

    Let's revisit our existing openSUSE welcome app.

    My goal was to show Leap 16 in a new coat. Welcome app adds to the first time use experience. We've recently added donation button to our existing welcome.

    Some things that I recently wanted to address were EOL and possibly upgrade notification.

    I've already done some experiments with mint welcome app, but not sure if it's better than the existing one.

    There is also a PR to rework existing app https://github.com/openSUSE/openSUSE-welcome/pull/36 (this should be considered as an option too)

    Goal for this Hackweek

    New welcome app, possibly with EOL notification for Leap.

    1) Welcome application(s) with (rebrand changes) maintained under github.com/openSUSE

    2) Application is submitted to openSUSE:Factory && openSUSE:Leap:16.0

    3) Updated needles in openQA (probably post hackweek)

    Resources

    Reddit discussion about the best welcome app out there.

    Github repo for the current welcome app.


    Jenny Static Site Generator by adam.pickering

    Description

    For my personal site I have been using hugo. It works, but I am not satisfied: every time I want to make a change (which is infrequently) I have to read through the documentation again to understand how hugo works. I don't find the documentation easy to use, and the structure of the repository that hugo requires is unintuitive/more complex than what I need. So, I have decided to write my own simple static site generator in Go. It is named Jenny, after my wife.

    Goals

    • Pages can be written in markdown (which is automatically converted to HTML), but other file types are also allowed
    • Easy to understand and use
      • Intuitive, simple design
      • Clear documentation
      • Hot reloading
      • Binaries provided for download
    • Future maintenance is easy
      • Automated releases

    Resources

    https://github.com/adamkpickering/jenny


    Try to render Agama in a TUI browser by ancorgs

    Description

    Agama is a new Linux installer that will be very likely used for SLES 16. It offers a modern and convenient web interface that can be executed both locally and remotely.

    But of course some users will miss the old TUI (ncurses) interface of the YaST installer.

    So I want to experiment whether would it be possible to render a simplified version of the web interface for TUI browsers. That's only doable and maintainable if we keep the current technology stack we use for rendering the full-blown page, simply replacing complicated UI elements with others that are easy to render. That means the browser would need to support Javascript.

    Chawan seems to be almost there regarding support for Javascript, XHR and related technologies. But according to this conversation, the next missing piece would be to support recursive import of module script tags.

    Unfortunately, Chawan is written in Nim and I'm pretty sure a week is not enough time for me to learn Nim, implement the feature at Chawan and then fix whatever is the next obstacle on the Agama side.

    But if someone could take care of the Nim part, I would do the same with the Agama one. So this is basically a call for help to get this project even started.


    Agama Expert Partitioner by joseivanlopez

    Description

    Agama is a new Linux installer that will be very likely used for SLES 16.

    It offers an UI for configuring the target system (language, patterns, network, etc). One of the more complex sections is the storage configuration, which is going to be revamped. This project consists on exploring the possibility of having something similar to the YaST Expert Partitioner for Agama.

    Goals

    • Explore different approaches for the storage UI in Agama.


    Agama installer on-line demo by lslezak

    Description

    The Agama installer provides a quite complex user interface. We have some screenshots on the web page but as it is basically a web application it would be nice to have some on-line demo where users could click and check it live.

    The problem is that the Agama server directly accesses the hardware (storage probing) and loads installation repositories. We cannot easily mock this in the on-line demo so the easiest way is to have just a read-only demo. You could explore the configuration options but you could not change anything, all changes would be ignored.

    The read-only demo would be a bit limited but I still think it would be useful for potential users get the feeling of the new Agama installer and get familiar with it before using in a real installation.

    As a proof of concept I already created this on-line demo.

    The implementation basically builds Agama in two modes - recording mode where it saves all REST API responses and replay mode where it for the REST API requests returns the previously recorded responses. Recording in the browser is inconvenient and error prone, there should be some scripting instead (see below).

    Goals

    • Create an Agama on-line demo which can be easily tested by users
    • The Agama installer is still in alpha phase and in active development, the online demo needs to be easily rebuilt with the latest Agama version
    • Ideally there should be some automation so the demo page is rebuilt automatically without any developer interactions (once a day or week?)

    TODO

    • Use OpenAPI to get all Agama REST API endpoints, write a script which queries all the endpoints automatically and saves the collected data to a file (see this related PR).
    • Write a script for starting an Agama VM (use libvirt/qemu?), the script should ensure we always use the same virtual HW so if we need to dump the latest REST API state we get the same (or very similar data). This should ensure the demo page does not change much regarding the storage proposal etc...
    • Fix changing the product, currently it gets stuck after clicking the "Select" button.
    • Move the mocking data (the recorded REST API responses) outside the Agama sources, it's too big and will be probably often updated. To avoid messing the history keep it in a separate GitHub repository
    • Allow changing the UI language
    • Display some note (watermark) in the page so it is clear it is a read-only demo (probably with some version or build date to know how old it is)
    • Automation for building new demo page from the latest sources. There should be some check which ensures the recorded data still matches the OpenAPI specification.

    Changing the UI language

    This will be quite tricky because selecting the proper translation file is done on the server side. We would probably need to completely re-implement the logic in the browser side and adapt the server for that.

    Also some REST API responses contain translated texts (storage proposal, pattern names in software). We would need to query the respective endpoints in all supported languages and return the correct response in runtime according to the currently selected language.

    Resources


    Editor mode at Agama web interface by ancorgs

    Description

    Agama is a new Linux installer that will be very likely used for SLES 16.

    It takes a configuration (in JSON format) as input. And offers several interfaces to build that configuration in an easy and interactive way.

    I was considering the possibility to add to the web interface a "text editor" mode similar to the XML editor available at virt-manager. That could be used to see how the changes in the UI translate into changes on the configuration.

    Goals

    • Refresh my knowledge about UI development for Agama, since there was a major overhaul recently (adopting TanStack Query) and I need to learn the new way to do things.
    • Please hackers who always want to know how things work internally. :-)


    obs-service-vendor_node_modules by cdimonaco

    Description

    When building a javascript package for obs, one option is to use https://github.com/openSUSE/obs-service-node_modules as source service to get the project npm dependencies available for package bulding.

    obs-service-vendornodemodules aims to be a source service that vendors npm dependencies, installing them with npm install (optionally only production ones) and then creating a tar package of the installed dependencies.

    The tar will be used as source in the package building definitions.

    Goals

    • Create an obs service package that vendors the npm dependencies as tar archive.
    • Maybe add some macros to unpack the vendor package in the specfiles

    Resources