I was able to set it up and change the background color in the component css file to match the forums in seconds:
Code:
<template>
<div style="height: 600px; width: 300px;">
<VueSteamChat :messages="messages" @vue-steam-chat-on-message="onNewMessage"/>
</div>
</template>
<script>
import VueSteamChat from "vue-steam-chat";
// This is required for styling the component. You can also write your own stylesheet. You can find my styles inside the vue component
require("vue-steam-chat/dist/index.css");
export default {
name: "vue-steam-chat",
components: {
VueSteamChat
},
data() {
return {
messages: [
{
time: 1506117496,
username: "Gaben",
text: "I am really rich!!!"
},
{
time: 1506117500,
username: "Solo",
text: "But i am your employee"
},
{
time: 1506117530,
username: "Neo",
text: "Hmmm..."
}
]
};
},
methods: {
onNewMessage(message) {
alert(message);
}
}
};
</script>
Next, I need to decide if and where to integrate this into the forums and if I should change it to be a modal or leave it flat.
Ravinder wants me to integrate this type of commenting system into each discussion, right below the first post, so everyone, even unregistered users can comment on every discussion, which is an interested idea.
Hi,
I am trying to embed Skype or any other video chat/chat program into a webpage. Has anyone had success doing this? or know how?
Thanks
Phil (2 Replies)
Working on the badging system, Just found this old thread for 2006 and started reading it. ROTFL ... what a great discussion between forum members and our chat bot Gollum "back in the good old days"... You must check this out if you want a laugh and big smile:
... (1 Reply)
Vue Router has some quirks and on of the quirks is that it is not reliable when adding external links using the vue-router library.
After struggling with many solutions, I have found that creating a simple Vue.js component like this one seems to work the best (so far):
Component Example: ... (0 Replies)
A number of people have asked me how to get started with Vue.js and my reply before today was to Google "Vue.js". That has changed and my recommendation to anyone who wants to learn the fastest growing, easiest to learn and use Vue.js web dev framework is to watch this video tutorial series:
... (0 Replies)
NPM-RUN-SCRIPT(1)NPM-RUN-SCRIPT(1)NAME
npm-run-script - Run arbitrary package scripts
SYNOPSIS
npm run-script <command> [--silent] [-- <args>...]
alias: npm run
DESCRIPTION
This runs an arbitrary command from a package's "scripts" object. If no "command" is provided, it will list the available scripts.
run[-script] is used by the test, start, restart, and stop commands, but can be called directly, as well. When the scripts in the package
are printed out, they're separated into lifecycle (test, start, restart) and directly-run scripts.
As of ` https://blog.npmjs.org/post/98131109725/npm-2-0-0, you can use custom arguments when executing scripts. The special option -- is
used by getopt https://goo.gl/KxMmtG to delimit the end of the options. npm will pass all the arguments after the -- directly to your
script:
npm run test -- --grep="pattern"
The arguments will only be passed to the script specified after npm run and not to any pre or post script.
The env script is a special built-in command that can be used to list environment variables that will be available to the script at run-
time. If an "env" command is defined in your package, it will take precedence over the built-in.
In addition to the shell's pre-existing PATH, npm run adds node_modules/.bin to the PATH provided to scripts. Any binaries provided by
locally-installed dependencies can be used without the node_modules/.bin prefix. For example, if there is a devDependency on tap in your
package, you should write:
"scripts": {"test": "tap test/*.js"}
instead of
"scripts": {"test": "node_modules/.bin/tap test/*.js"}
to run your tests.
The actual shell your script is run within is platform dependent. By default, on Unix-like systems it is the /bin/sh command, on Windows it
is the cmd.exe. The actual shell referred to by /bin/sh also depends on the system. As of `
https://github.com/npm/npm/releases/tag/v5.1.0 you can customize the shell with the script-shell configuration.
Scripts are run from the root of the module, regardless of what your current working directory is when you call npm run. If you want your
script to use different behavior based on what subdirectory you're in, you can use the INIT_CWD environment variable, which holds the full
path you were in when you ran npm run.
npm run sets the NODE environment variable to the node executable with which npm is executed. Also, if the --scripts-prepend-node-path is
passed, the directory within which node resides is added to the PATH. If --scripts-prepend-node-path=auto is passed (which has been the
default in npm v3), this is only performed when that node executable is not found in the PATH.
If you try to run a script without having a node_modules directory and it fails, you will be given a warning to run npm install, just in
case you've forgotten.
You can use the --silent flag to prevent showing npm ERR! output on error.
You can use the --if-present flag to avoid exiting with a non-zero exit code when the script is undefined. This lets you run potentially
undefined scripts without breaking the execution chain.
SEE ALSO
o npm help 7 scripts
o npm help test
o npm help start
o npm help restart
o npm help stop
o npm help 7 config
January 2019 NPM-RUN-SCRIPT(1)
04-13-2019
