omegga 0.1.85 → 1.0.2

package/src/webserver/frontend/widgets/Chat.vue

@@ -1,124 +0,0 @@
-<style lang="scss">
-@import '../css/style';
-
-.chat-widget {
-  display: flex;
-  flex: 1;
-  flex-direction: column;
-  position: relative;
-  align-items: stretch;
-  max-width: 100%;
-
-  .messages {
-    flex: 1;
-    position: relative;
-    font-family: 'Roboto';
-
-    .messages-child {
-      @include column;
-      margin: 8px;
-    }
-  }
-
-  .input {
-    flex: 1;
-    width: calc(100% - 24px - 20px);
-  }
-}
-</style>
-
-<template>
-  <div class="chat-widget">
-    <br-scroll class="messages">
-      <div class="messages-child">
-        <div v-for="log in chats" :key="log._id" class="log-entry">
-          <div v-if="log.action === 'msg'" class="chat-message">
-            {{ log.user.web ? '[' : ''
-            }}<span class="user" :style="{ color: '#' + log.user.color }">{{
-              log.user.name
-            }}</span
-            >{{ log.user.web ? ']' : '' }}:
-            <span v-html="xss(log.message)" v-linkified />
-          </div>
-          <div v-if="log.action === 'leave'" class="join-message">
-            <span class="user">{{ log.user.name }}</span> left the game.
-          </div>
-          <div v-if="log.action === 'join'" class="join-message">
-            <span class="user">{{ log.user.name }}</span> joined the game{{
-              log.user.isFirst ? ' for the first time' : ''
-            }}.
-          </div>
-          <div v-if="log.action === 'server'" class="server-message">
-            {{ log.message }}
-          </div>
-        </div>
-      </div>
-    </br-scroll>
-    <form @submit="sendMessage">
-      <br-footer>
-        <br-input type="text" placeholder="Message" v-model="message" />
-        <br-button normal icon style="margin-left: 10px" @click="sendMessage">
-          <SendIcon />
-        </br-button>
-      </br-footer>
-    </form>
-  </div>
-</template>
-<script>
-import Vue from 'vue';
-import SendIcon from 'vue-tabler-icons/icons/SendIcon';
-
-export default Vue.component('br-chat-widget', {
-  components: { SendIcon },
-  sockets: {
-    chat(log) {
-      this.chats.push(log);
-
-      // if the log is too long - remove the excess messages (you should probably be in the history view)
-      if (this.chats.length > 50) this.chats.splice(0, 50 - this.chats.length);
-
-      this.scroll();
-    },
-    connect() {
-      this.getChats();
-    },
-  },
-  beforeDestroy() {
-    this.$$emit('unsubscribe', 'chat');
-  },
-  created() {
-    this.getChats();
-  },
-  methods: {
-    getChats() {
-      this.$$emit('subscribe', 'chat');
-      this.$$request('chat.recent').then(logs => {
-        this.chats = logs.reverse();
-        this.scroll();
-      });
-    },
-    scroll() {
-      // scroll to bottom of message log
-      window.requestAnimationFrame(() => {
-        const container = this.$el.querySelector('.scroll-scroller');
-        container.scrollTop = container.scrollHeight;
-      });
-    },
-    // send message from form
-    sendMessage(event) {
-      event.preventDefault();
-
-      if (this.message.length > 140 || this.message.length === 0) return;
-
-      this.$$notify('chat', this.message);
-      this.message = '';
-    },
-  },
-  data() {
-    return {
-      chats: [],
-      message: '',
-    };
-  },
-});
-</script>

package/src/webserver/frontend/widgets/Status.vue

@@ -1,91 +0,0 @@
-<style scoped lang="scss">
-@import '../css/style';
-
-.status-widget {
-  @include column-stretch;
-  flex: 1;
-  position: relative;
-  max-width: 100%;
-  background-color: $br-bg-secondary;
-
-  .players {
-    .players-child {
-      @include column;
-    }
-  }
-}
-</style>
-
-<template>
-  <div class="status-widget">
-    <br-scroll v-if="status.players" class="players">
-      <div class="players-child">
-        <div class="stats">
-          <div class="stat"><b>Name:</b> {{ status.serverName }}</div>
-          <div class="stat"><b>Uptime:</b> {{ duration(status.time) }}</div>
-          <div class="stat"><b>Bricks:</b> {{ status.bricks }}</div>
-          <div class="stat"><b>Players:</b> {{ status.players.length }}</div>
-        </div>
-        <table class="br-table">
-          <thead>
-            <tr>
-              <th style="text-align: left; width: 100%">Name</th>
-              <th>Time</th>
-              <th>Ping</th>
-            </tr>
-          </thead>
-          <tbody>
-            <tr v-for="(player, i) in status.players" :key="i">
-              <td>
-                <router-link class="user" :to="'/players/' + player.id">
-                  {{ player.name }}
-                </router-link>
-              </td>
-              <td style="text-align: right;">{{ duration(player.time) }}</td>
-              <td style="text-align: right;">{{ player.ping }}</td>
-            </tr>
-          </tbody>
-        </table>
-      </div>
-    </br-scroll>
-    <br-loader :active="!status.players" blur size="huge"
-      >Loading Status</br-loader
-    >
-  </div>
-</template>
-<script>
-import Vue from 'vue';
-
-export default Vue.component('br-status-widget', {
-  sockets: {
-    'server.status': function(status) {
-      this.status = status || {};
-      this.updated = Date.now();
-    },
-    connect() {
-      this.getStatus();
-    },
-  },
-  beforeDestroy() {
-    this.$$emit('unsubscribe', 'status');
-  },
-  methods: {
-    getStatus() {
-      this.$$emit('subscribe', 'status');
-      this.$$request('server.status').then(status => {
-        this.status = status || {};
-        this.updated = Date.now();
-      });
-    },
-  },
-  created() {
-    this.getStatus();
-  },
-  data() {
-    return {
-      status: {},
-      updated: 0,
-    };
-  },
-});
-</script>

package/src/webserver/frontend/widgets/index.js

@@ -1,2 +0,0 @@
-import './Chat.vue';
-import './Status.vue';

package/src/webserver/frontend/widgets/tooltip.js

@@ -1,108 +0,0 @@
-let mouseX = -1;
-let mouseY = -1;
-let tooltipVisible = false;
-let showTooltip, tooltipHideTimeout;
-
-// create the tooltip element
-const tooltipElem = document.createElement('div');
-Object.assign(tooltipElem.style, {
-  position: 'fixed',
-  left: '-1000px',
-  top: '-1000px',
-  border: '2px solid black',
-  background: 'white',
-  fontFamily: 'Glacial Indifference',
-  fontWeight: 'bold',
-  fontSize: '16px',
-  padding: '8px',
-  maxWidth: '300px',
-  zIndex: '100000',
-  pointerEvents: 'none',
-  opacity: 0,
-  transition: 'opacity .2s ease',
-});
-tooltipElem.innerText = '';
-
-// add it to the dom
-document.body.appendChild(tooltipElem);
-
-// update mouse position when mouse moves
-document.body.addEventListener('mousemove', e => {
-  mouseX = e.clientX;
-  mouseY = e.clientY;
-  if (showTooltip) updateTooltipPos();
-});
-
-// set the tooltip position to the last mouse position;
-function updateTooltipPos() {
-  const width = document.body.clientWidth;
-  const height = document.body.clientHeight;
-  Object.assign(tooltipElem.style, {
-    left:
-      mouseX + (mouseX < width / 2 ? 16 : -16 - tooltipElem.clientWidth) + 'px',
-    top:
-      mouseY +
-      (mouseY < height / 2 ? 16 : -16 - tooltipElem.clientHeight) +
-      'px',
-  });
-}
-
-// recurse up the doc tree to find a tooltip
-function getTooltipFromElem(e) {
-  if (!e || !e.getAttribute) return;
-  const tooltip = e.getAttribute('data-tooltip');
-  if (tooltip) return tooltip;
-  return getTooltipFromElem(e.parentNode);
-}
-
-function checkHoverElem() {
-  // find the element under the mouse
-  const elem = document.elementFromPoint(mouseX, mouseY);
-
-  // get the tooltip from it
-  const tooltip = getTooltipFromElem(elem);
-  const currText = tooltipElem.innerText;
-
-  // kill the tooltip cooldown if there's
-  if (!tooltip && tooltipVisible && !showTooltip) {
-    tooltipVisible = false;
-    clearTimeout(tooltipHideTimeout);
-  }
-
-  // if there's a tooltip - show the popup
-  if (tooltip && !tooltipVisible && !showTooltip) {
-    clearTimeout(tooltipHideTimeout);
-
-    tooltipVisible = true;
-
-    // wait a little before showing the tooltip
-    tooltipHideTimeout = setTimeout(() => {
-      tooltipElem.innerText = tooltip;
-      updateTooltipPos();
-      tooltipElem.style.opacity = 1;
-      showTooltip = true;
-    }, 400);
-
-    // otherwise, hide it
-  } else if (currText !== tooltip && showTooltip && tooltipVisible) {
-    clearTimeout(tooltipHideTimeout);
-    tooltipVisible = false;
-
-    // delay the hide by 300ms (longer than the transition)
-    tooltipHideTimeout = setTimeout(() => {
-      showTooltip = false;
-      Object.assign(tooltipElem.style, {
-        left: '-1000px',
-        top: '-1000px',
-      });
-    }, 300);
-
-    // start 0 opacity transition
-    tooltipElem.style.opacity = 0;
-  }
-}
-
-// repeatedly check tooltip
-setInterval(() => {
-  checkHoverElem();
-}, 100);

package/src/webserver/index.js

@@ -1,4 +0,0 @@
-module.exports = {
-  // export the webserver
-  Webserver: require('./backend/index.js'),
-};