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-CONFIG(1)NPM-CONFIG(1)NAME
npm-config - Manage the npm configuration files
SYNOPSIS
npm config set <key> <value> [-g|--global]
npm config get <key>
npm config delete <key>
npm config list [-l] [--json]
npm config edit
npm get <key>
npm set <key> <value> [-g|--global]
aliases: c
DESCRIPTION
npm gets its config settings from the command line, environment variables, npmrc files, and in some cases, the package.json file.
See npm help 5 npmrc for more information about the npmrc files.
See npm help 7 npm-config for a more thorough discussion of the mechanisms involved.
The npm config command can be used to update and edit the contents of the user and global npmrc files.
Sub-commands
Config supports the following sub-commands:
set
npm config set key value
Sets the config key to the value.
If value is omitted, then it sets it to "true".
get
npm config get key
Echo the config value to stdout.
list
npm config list
Show all the config settings. Use -l to also show defaults. Use --json to show the settings in json format.
delete
npm config delete key
Deletes the key from all configuration files.
edit
npm config edit
Opens the config file in an editor. Use the --global flag to edit the global config.
SEE ALSO
o npm help 5 folders
o npm help 7 config
o npm help 5 package.json
o npm help 5 npmrc
o npm help npm
January 2019 NPM-CONFIG(1)
04-13-2019
