Merge inVerse into this repo
This commit is contained in:
parent
78c5139486
commit
b66ff721cd
1
.gitignore
vendored
1
.gitignore
vendored
|
@ -53,6 +53,7 @@ dist/converse-no-locales-no-otr.min.js
|
|||
dist/converse-no-otr.js
|
||||
dist/converse-no-otr.min.js
|
||||
dist/converse.min.js
|
||||
dist/inverse.min.js
|
||||
dist/converse-no-jquery.js
|
||||
dist/converse-no-jquery.min.js
|
||||
dist/converse-mobile.min.js
|
||||
|
|
15
Makefile
15
Makefile
|
@ -1,4 +1,5 @@
|
|||
# You can set these variables from the command line.
|
||||
BOURBON_TEMPLATES = ./node_modules/bourbon/app/assets/stylesheets/
|
||||
BUILDDIR = ./docs
|
||||
BUNDLE ?= ./.bundle/bin/bundle
|
||||
GRUNT ?= ./node_modules/.bin/grunt
|
||||
|
@ -116,18 +117,24 @@ dev: stamp-bundler stamp-npm
|
|||
## Builds
|
||||
|
||||
.PHONY: css
|
||||
css: sass/*.scss css/converse.css css/converse.min.css css/mobile.min.css css/theme.min.css css/converse-muc-embedded.min.css
|
||||
css: sass/*.scss css/converse.css css/converse.min.css css/mobile.min.css css/theme.min.css css/converse-muc-embedded.min.css css/inverse.css css/inverse.min.css
|
||||
|
||||
css/inverse.css:: stamp-bundler sass
|
||||
$(SASS) -I $(BOURBON_TEMPLATES) sass/inverse/inverse.scss css/inverse.css
|
||||
|
||||
css/inverse.min.css:: css/inverse.css
|
||||
$(CLEANCSS) css/inverse.css > css/inverse.min.css
|
||||
|
||||
css/converse-muc-embedded.css:: stamp-bundler sass
|
||||
$(SASS) -I ./node_modules/bourbon/app/assets/stylesheets/ sass/_muc_embedded.scss css/converse-muc-embedded.css
|
||||
$(SASS) -I $(BOURBON_TEMPLATES) sass/_muc_embedded.scss css/converse-muc-embedded.css
|
||||
|
||||
css/converse-muc-embedded.min.css:: stamp-bundler sass css/converse-muc-embedded.css
|
||||
$(CLEANCSS) css/converse-muc-embedded.css > css/converse-muc-embedded.min.css
|
||||
|
||||
css/converse.css:: stamp-bundler sass
|
||||
$(SASS) -I ./node_modules/bourbon/app/assets/stylesheets/ sass/converse.scss css/converse.css
|
||||
$(SASS) -I $(BOURBON_TEMPLATES) sass/converse.scss css/converse.css
|
||||
|
||||
css/converse.min.css:: stamp-npm sass
|
||||
css/converse.min.css:: css/converse.css
|
||||
$(CLEANCSS) css/converse.css > css/converse.min.css
|
||||
|
||||
css/theme.min.css:: stamp-npm css/theme.css
|
||||
|
|
2720
css/inverse.css
Normal file
2720
css/inverse.css
Normal file
File diff suppressed because it is too large
Load Diff
52
inverse.html
Normal file
52
inverse.html
Normal file
|
@ -0,0 +1,52 @@
|
|||
<!doctype html>
|
||||
<html class="no-js" lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8"/>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
|
||||
<title>inVerse</title>
|
||||
<link rel="shortcut icon" type="image/ico" href="css/images/favicon.ico"/>
|
||||
<link type="text/css" rel="stylesheet" media="screen" href="css/inverse.css" />
|
||||
<script src="node_modules/requirejs/require.js"></script>
|
||||
<script src="src/config.js"></script>
|
||||
<script src="inverse.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<div class="content">
|
||||
<div class="inner-content">
|
||||
<h1 class="brand-heading"><i class="icon-conversejs"></i> inVerse</h1>
|
||||
<p class="no-chats">
|
||||
You don't have any chats open.<br/></br/>
|
||||
Start a new conversation by clicking on a contact or a room in the left navigation.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<script>
|
||||
require(['inverse'], function (converse) {
|
||||
converse.initialize({
|
||||
auto_away: 300,
|
||||
i18n: 'en',
|
||||
notify_all_room_messages: [
|
||||
'discuss@conference.conversejs.org'
|
||||
],
|
||||
whitelisted_plugins: [
|
||||
'converse-inverse',
|
||||
'converse-roomslist',
|
||||
'converse-singleton',
|
||||
],
|
||||
hide_open_bookmarks: true,
|
||||
blacklisted_plugins: ['converse-minimize', 'converse-dragresize'],
|
||||
chatview_avatar_width: 42,
|
||||
chatview_avatar_height: 42,
|
||||
auto_reconnect: true,
|
||||
bosh_service_url: 'https://conversejs.org/http-bind/', // Please use this connection manager only for testing purposes
|
||||
message_carbons: true,
|
||||
message_archiving: 'always',
|
||||
sticky_controlbox: true,
|
||||
roster_groups: true,
|
||||
show_controlbox_by_default: true,
|
||||
debug: true
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
17
sass/inverse/_bookmarks.scss
Normal file
17
sass/inverse/_bookmarks.scss
Normal file
|
@ -0,0 +1,17 @@
|
|||
#conversejs {
|
||||
#controlbox {
|
||||
#chatrooms {
|
||||
.bookmarks-list {
|
||||
dl.rooms-list.bookmarks {
|
||||
dd.available-chatroom {
|
||||
a {
|
||||
&.open-room {
|
||||
width: 80%;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
55
sass/inverse/_chatbox.scss
Normal file
55
sass/inverse/_chatbox.scss
Normal file
|
@ -0,0 +1,55 @@
|
|||
#conversejs {
|
||||
.chatbox-btn {
|
||||
font-size: $font-size-large;
|
||||
}
|
||||
.flyout {
|
||||
border: 1em solid $chat-head-color;
|
||||
border-top: 0.8em solid $chat-head-color;
|
||||
border-radius: 0;
|
||||
bottom: 0;
|
||||
bottom: 0;
|
||||
}
|
||||
.chat-head {
|
||||
font-size: 20px;
|
||||
padding: 0;
|
||||
.user-custom-message {
|
||||
font-size: 66%;
|
||||
height: auto;
|
||||
line-height: $line-height;
|
||||
}
|
||||
.avatar {
|
||||
border-radius: 25%;
|
||||
}
|
||||
}
|
||||
.chatbox {
|
||||
height: 100%;
|
||||
margin: 0;
|
||||
@include calc(width, '100% - #{$controlbox-width}');
|
||||
margin: 0;
|
||||
.box-flyout {
|
||||
@include calc(width, '100% - #{$controlbox-width}');
|
||||
box-shadow: none;
|
||||
min-width: auto;
|
||||
}
|
||||
.chat-content {
|
||||
padding: 0 $padding $padding $padding;
|
||||
}
|
||||
.chat-title {
|
||||
line-height: 17px;
|
||||
}
|
||||
|
||||
form.sendXMPPMessage {
|
||||
ul {
|
||||
width: 100%;
|
||||
}
|
||||
.toggle-smiley {
|
||||
padding-left: 0.5em;
|
||||
ul {
|
||||
li {
|
||||
padding: 0.5em;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
75
sass/inverse/_chatrooms.scss
Normal file
75
sass/inverse/_chatrooms.scss
Normal file
|
@ -0,0 +1,75 @@
|
|||
#conversejs {
|
||||
.chat-head-chatroom {
|
||||
height: $chatroom-head-height;
|
||||
font-size: 20px;
|
||||
|
||||
.chatroom-description {
|
||||
font-size: 66%;
|
||||
margin-top: 3px;
|
||||
margin-top: 0.5em;
|
||||
}
|
||||
}
|
||||
|
||||
.chatroom {
|
||||
@include calc(width, '100% - #{$controlbox-width}');
|
||||
.box-flyout {
|
||||
background-color: $chatroom-head-color;
|
||||
border: 1em solid $chatroom-head-color;
|
||||
border-top: 0.8em solid $chatroom-head-color;
|
||||
@include calc(width, '100% - #{$controlbox-width}');
|
||||
.chatroom-body {
|
||||
@include border-top-radius($chatbox-border-radius);
|
||||
.chat-area {
|
||||
border-top-left-radius: $chatbox-border-radius;
|
||||
min-width: auto;
|
||||
.chat-content {
|
||||
border-top-left-radius: $chatbox-border-radius;
|
||||
padding: 0 $padding $padding $padding;
|
||||
}
|
||||
&.full {
|
||||
max-width: 100%;
|
||||
.new-msgs-indicator {
|
||||
max-width: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
.occupants {
|
||||
border-top-right-radius: $chatbox-border-radius;;
|
||||
padding: $padding;
|
||||
.occupants-heading {
|
||||
font-size: $font-size-large;
|
||||
}
|
||||
.chatroom-features {
|
||||
bottom: $padding;
|
||||
width: 25%;
|
||||
@include calc(width, '30% - 2em');
|
||||
}
|
||||
.awesomplete {
|
||||
ul {
|
||||
padding: 0.5em;
|
||||
li {
|
||||
padding: 0.3em 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
ul {
|
||||
&.occupant-list {
|
||||
@include calc(height, '100% - 212px');
|
||||
li {
|
||||
font-size: $font-size-small;
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.room-invite {
|
||||
span {
|
||||
.invited-contact {
|
||||
margin: 0 0 0.5em -1px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
68
sass/inverse/_controlbox.scss
Normal file
68
sass/inverse/_controlbox.scss
Normal file
|
@ -0,0 +1,68 @@
|
|||
#conversejs {
|
||||
#controlbox {
|
||||
min-width: $controlbox-width;
|
||||
width: 200px;
|
||||
float: left;
|
||||
margin: 0;
|
||||
|
||||
#login-dialog, #register {
|
||||
.brand-heading {
|
||||
margin: 10% 0 0 0;
|
||||
font-size: 600%;
|
||||
color: #577BDD;
|
||||
}
|
||||
.converse-form {
|
||||
margin-top: 4em;
|
||||
}
|
||||
}
|
||||
|
||||
&.fullscreen {
|
||||
width: 100%;
|
||||
.box-flyout {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
.box-flyout {
|
||||
border: 0;
|
||||
background-color: white;
|
||||
min-width: $controlbox-width;
|
||||
width: 200px;
|
||||
z-index: 1;
|
||||
background-color: $controlbox-head-color;
|
||||
}
|
||||
.controlbox-head {
|
||||
height: $controlbox-head-height;
|
||||
padding: 6px 0 6px 0;
|
||||
margin-top: 0.2em;
|
||||
}
|
||||
#converse-register, #converse-login {
|
||||
margin: 30%;
|
||||
margin-top: 15%;
|
||||
#available-chatrooms {
|
||||
padding: 0 1em 2em 1em;
|
||||
}
|
||||
input[type=submit] {
|
||||
width: auto;
|
||||
margin-top: 1.5em;
|
||||
}
|
||||
}
|
||||
#controlbox-tabs {
|
||||
/* single tab */
|
||||
li {
|
||||
width: 50%;
|
||||
a {
|
||||
height: $controlbox-head-height - 1px;
|
||||
line-height: $controlbox-head-height - 1px;
|
||||
&.current,
|
||||
&.current:hover {
|
||||
height: $controlbox-head-height;
|
||||
}
|
||||
font-size: $font-size-large;
|
||||
}
|
||||
}
|
||||
}
|
||||
.controlbox-pane {
|
||||
@include calc(height, '100% - #{$controlbox-head-height}');
|
||||
}
|
||||
}
|
||||
}
|
223
sass/inverse/_core.scss
Normal file
223
sass/inverse/_core.scss
Normal file
|
@ -0,0 +1,223 @@
|
|||
body {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
font-family: "Lora", "Helvetica Neue", Helvetica, Arial, sans-serif;
|
||||
color: #ffffff;
|
||||
background-color: $global-background-color;
|
||||
}
|
||||
|
||||
div.content {
|
||||
height: 100vh;
|
||||
width: 100vw;
|
||||
position: fixed;
|
||||
background-color: $global-background-color;
|
||||
|
||||
.inner-content {
|
||||
text-align: center;
|
||||
padding: 7%;
|
||||
@include calc(padding-left, '5% + #{$controlbox-width}');
|
||||
|
||||
.brand-heading {
|
||||
font-size: 600%;
|
||||
margin-left: -10%;
|
||||
}
|
||||
p.no-chats {
|
||||
padding-right: 10%;
|
||||
font-size: 120%;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
#conversejs {
|
||||
width: 100vw;
|
||||
height: 100vh;
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
color: $text-color;
|
||||
direction: ltr;
|
||||
display: block;
|
||||
font-size: $font-size;
|
||||
right: 0;
|
||||
z-index: 1031; // One more than bootstrap navbar
|
||||
@media screen and (max-height: $mobile-landscape-height) {
|
||||
width: 100%;
|
||||
width: 100vw;
|
||||
}
|
||||
@media screen and (max-width: $mobile-portrait-length) {
|
||||
width: 100%;
|
||||
width: 100vw;
|
||||
}
|
||||
|
||||
::selection {
|
||||
background-color: $highlight-color;
|
||||
}
|
||||
::-moz-selection {
|
||||
background-color: $highlight-color;
|
||||
}
|
||||
.circle {
|
||||
border-radius: 50%;
|
||||
}
|
||||
.no-text-select {
|
||||
-webkit-touch-callout: none;
|
||||
@include user-select(none);
|
||||
}
|
||||
.emoticon {
|
||||
font-size: $font-size;
|
||||
}
|
||||
.left {
|
||||
float: left;
|
||||
}
|
||||
.right {
|
||||
float: right;
|
||||
}
|
||||
.centered {
|
||||
text-align: center;
|
||||
display: block;
|
||||
margin: 5em auto;
|
||||
}
|
||||
.hor_centered {
|
||||
text-align: center;
|
||||
display: block;
|
||||
margin: 0 auto;
|
||||
clear: both;
|
||||
}
|
||||
.hidden {
|
||||
display: none;
|
||||
}
|
||||
.locked {
|
||||
padding-right: 22px;
|
||||
}
|
||||
|
||||
@include keyframes(spin) {
|
||||
from {
|
||||
@include transform(rotate(0deg));
|
||||
}
|
||||
to {
|
||||
@include transform(rotate(359deg));
|
||||
}
|
||||
}
|
||||
|
||||
.spinner {
|
||||
@include animation(spin 2s infinite, linear);
|
||||
display: block;
|
||||
text-align: center;
|
||||
margin: 5px;
|
||||
&:before {
|
||||
font-size: 24px;
|
||||
font-family: 'Converse-js' !important;
|
||||
content: "\231b";
|
||||
}
|
||||
}
|
||||
|
||||
.button-group,
|
||||
.input-button-group {
|
||||
display: table;
|
||||
}
|
||||
.button-group {
|
||||
width: 100%;
|
||||
}
|
||||
.input-button-group button,
|
||||
.input-button-group input {
|
||||
display: table-cell;
|
||||
}
|
||||
|
||||
.error {
|
||||
color: red;
|
||||
}
|
||||
.reg-feedback {
|
||||
font-size: 85%;
|
||||
}
|
||||
|
||||
.reg-feedback,
|
||||
#converse-login .conn-feedback {
|
||||
display: block;
|
||||
text-align: center;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
a.restore-chat {
|
||||
padding: 1px 0 1px 5px;
|
||||
color: $chat-head-text-color;
|
||||
line-height: 15px;
|
||||
display: block;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
a.restore-chat:visited {
|
||||
color: $chat-head-text-color;
|
||||
}
|
||||
|
||||
.activated {
|
||||
display: block !important;
|
||||
}
|
||||
.pure-button {
|
||||
border-radius: $button-border-radius;
|
||||
}
|
||||
.button-primary {
|
||||
color: white;
|
||||
background-color: $primary-color;
|
||||
}
|
||||
.button-secondary {
|
||||
color: white;
|
||||
background-color: $secondary-color;
|
||||
}
|
||||
.button-cancel {
|
||||
color: white;
|
||||
background-color: $warning-color;
|
||||
}
|
||||
|
||||
form {
|
||||
&.pure-form.converse-form {
|
||||
background: white;
|
||||
margin: 1em;
|
||||
legend {
|
||||
color: $text-color;
|
||||
}
|
||||
label {
|
||||
margin-top: 1em;
|
||||
}
|
||||
input[type=text],
|
||||
input[type=password],
|
||||
input[type=number],
|
||||
input[type=button],
|
||||
input[type=submit] {
|
||||
height: 2.2em;
|
||||
}
|
||||
input[type=button],
|
||||
input[type=submit] {
|
||||
padding-left: 1em;
|
||||
padding-right: 1em;
|
||||
margin-right: 1em;
|
||||
}
|
||||
input.error {
|
||||
border: 1px solid red;
|
||||
color: $text-color;
|
||||
}
|
||||
.form-help {
|
||||
color: gray;
|
||||
font-size: 85%;
|
||||
padding-top: 0.5em;
|
||||
&:hover {
|
||||
color: $text-color;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.chat-textarea-chatbox-selected {
|
||||
border: 1px solid #578308;
|
||||
margin: 0;
|
||||
}
|
||||
.chat-textarea-chatroom-selected {
|
||||
border: 2px solid $link-color;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.dropdown dt,
|
||||
.dropdown ul {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
}
|
14
sass/inverse/_headline.scss
Normal file
14
sass/inverse/_headline.scss
Normal file
|
@ -0,0 +1,14 @@
|
|||
#conversejs {
|
||||
.chatbox.headlines {
|
||||
.chat-head {
|
||||
&.chat-head-chatbox {
|
||||
background-color: $headline-head-color;
|
||||
}
|
||||
}
|
||||
.flyout {
|
||||
border: 1em solid $headline-head-color;
|
||||
border-top: 0.8em solid $headline-head-color;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
59
sass/inverse/_minimized_chats.scss
Normal file
59
sass/inverse/_minimized_chats.scss
Normal file
|
@ -0,0 +1,59 @@
|
|||
#conversejs {
|
||||
#minimized-chats {
|
||||
border-top-left-radius: $chatbox-border-radius;
|
||||
border-top-right-radius: $chatbox-border-radius;
|
||||
color: $inverse-link-color;
|
||||
display: none;
|
||||
float: right;
|
||||
font-weight: bold;
|
||||
height: 100%;
|
||||
margin: 0 $chat-gutter;
|
||||
padding: 0;
|
||||
width: 130px;
|
||||
|
||||
#toggle-minimized-chats {
|
||||
border-top-left-radius: $chatbox-border-radius;
|
||||
border-top-right-radius: $chatbox-border-radius;
|
||||
background-color: $link-color;
|
||||
color: white;
|
||||
position: relative;
|
||||
padding: 10px 0 0 0;
|
||||
display: block;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.minimized-chats-flyout {
|
||||
height: auto;
|
||||
bottom: $bottom-gutter-height;
|
||||
.chat-head {
|
||||
padding: 0.3em;
|
||||
border-radius: $chatbox-border-radius;
|
||||
width: $minimized-chats-width;
|
||||
height: 35px;
|
||||
margin-bottom: 0.2em;
|
||||
box-shadow: 1px 3px 5px 3px rgba(0, 0, 0, 0.4);
|
||||
}
|
||||
&.minimized {
|
||||
height: auto;
|
||||
}
|
||||
}
|
||||
|
||||
.unread-message-count,
|
||||
.chat-head-message-count {
|
||||
font-weight: bold;
|
||||
background-color: white;
|
||||
border: 1px solid;
|
||||
text-shadow: 1px 1px 0 $text-shadow-color;
|
||||
color: $warning-color;
|
||||
border-radius: 5px;
|
||||
padding: 2px 4px;
|
||||
font-size: 16px;
|
||||
text-align: center;
|
||||
position: absolute;
|
||||
right: 116px;
|
||||
bottom: 10px;
|
||||
}
|
||||
}
|
||||
}
|
69
sass/inverse/_normalize.scss
Normal file
69
sass/inverse/_normalize.scss
Normal file
|
@ -0,0 +1,69 @@
|
|||
#conversejs {
|
||||
@import "../pure/base";
|
||||
@import "../pure/forms";
|
||||
@import "../pure/buttons";
|
||||
|
||||
@include box-sizing(border-box);
|
||||
*, *:before, *:after {
|
||||
@include box-sizing(border-box);
|
||||
}
|
||||
|
||||
@media screen and (max-width: $mobile-portrait-length) {
|
||||
margin: 0;
|
||||
right: 10px;
|
||||
left: 10px;
|
||||
bottom: 5px;
|
||||
}
|
||||
@media screen and (max-height: $mobile-landscape-height) {
|
||||
margin: 0;
|
||||
right: 10px;
|
||||
left: 10px;
|
||||
bottom: 5px;
|
||||
}
|
||||
|
||||
ul li { height: auto; }
|
||||
div, span, h1, h2, h3, h4, h5, h6, p, blockquote,
|
||||
pre, a, em, img, strong, dl, dt, dd, ol, ul, li,
|
||||
fieldset, form, label, legend, table, caption, tbody,
|
||||
tfoot, thead, tr, th, td, article, aside, canvas, details,
|
||||
embed, figure, figcaption, footer, header, hgroup, menu,
|
||||
nav, output, ruby, section, summary, time, mark, audio, video {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
border: 0;
|
||||
font: inherit;
|
||||
vertical-align: baseline;
|
||||
}
|
||||
|
||||
textarea,
|
||||
input[type=submit], input[type=button],
|
||||
input[type=text], input[type=password],
|
||||
button {
|
||||
font-size: $font-size;
|
||||
padding: 0.25em;
|
||||
min-height: 0;
|
||||
}
|
||||
|
||||
strong {
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
ol, ul {
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
li {
|
||||
height: 10px;
|
||||
}
|
||||
|
||||
ul, ol, dl {
|
||||
font: inherit;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
a, a:visited {
|
||||
text-decoration: none;
|
||||
color: $link-color;
|
||||
text-shadow: none;
|
||||
}
|
||||
}
|
94
sass/inverse/_variables.scss
Normal file
94
sass/inverse/_variables.scss
Normal file
|
@ -0,0 +1,94 @@
|
|||
/*
|
||||
Color scheme helpers:
|
||||
https://coolors.co/app/264653-2a9d8f-e9c46a-f4a261-e76f51
|
||||
http://paletton.com/#uid=53f0u0knsvIdILAj5Cftgu3uBmZ
|
||||
*/
|
||||
$global-background-color: #17818B !default;
|
||||
|
||||
$link-color: #587BDD !default;
|
||||
$inverse-link-color: white !default;
|
||||
$link-shadow-color: #FAFAFA !default;
|
||||
$text-shadow-color: #FAFAFA !default;
|
||||
$text-color: #818479 !default;
|
||||
$light-text-color: #A8ABA1 !default;
|
||||
$border-color: #CCC !default;
|
||||
$icon-color: #114327 !default;
|
||||
$save-button-color: #436F64 !default;
|
||||
$chat-textarea-height: 70px !default;
|
||||
$send-button-height: 27px !default;
|
||||
$send-button-margin: 3px !default;
|
||||
$message-them-color: #1A9707 !default;
|
||||
$roster-height: 194px !default;
|
||||
$roster-item-height: 30px !default;
|
||||
|
||||
$chat-head-color: #F4A261 !default;
|
||||
$chat-head-text-color: white !default;
|
||||
$chat-head-inverse-text-color: white !default;
|
||||
$chat-head-height: 55px !default;
|
||||
$controlbox-head-height: 63px !default;
|
||||
$chatroom-head-height: 55px !default;
|
||||
|
||||
$input-focus-color: #1A9707 !default;
|
||||
$highlight-color: #DCF9F6 !default;
|
||||
|
||||
$controlbox-head-color: #577BDD !default;
|
||||
$controlbox-dropdown-height: 25px !default;
|
||||
|
||||
$primary-color: #2AC611 !default;
|
||||
$secondary-color: #83A0D6 !default;
|
||||
$warning-color: #D24E2B !default;
|
||||
|
||||
$light-background-border-color: #B1BFC4 !default;
|
||||
$light-background-color: #FCFDFD !default;
|
||||
|
||||
$toolbar-height: 25px !default;
|
||||
$toolbar-color: #FFF5EE !default;
|
||||
|
||||
$moderator-color: #D24E2B !default;
|
||||
$online-color: #1A9707 !default;
|
||||
$error-color: #D24E2B !default;
|
||||
$subdued-color: #BBB !default;
|
||||
|
||||
$button-border-radius: 4px !default;
|
||||
$chatbox-border-radius: 0 !default;
|
||||
$bottom-gutter-height: 35px !default;
|
||||
$chatbox-hover-height: 6px !default;
|
||||
|
||||
$mobile_landscape_height: 450px !default;
|
||||
$mobile_portrait_length: 480px !default;
|
||||
|
||||
$font-size-tiny: 10px !default;
|
||||
$font-size-small: 14px !default;
|
||||
$font-size: 15px !default;
|
||||
$font-size-large: 17px !default;
|
||||
$legend-font-size: 17px !default;
|
||||
|
||||
$line-height: 16px !default;
|
||||
|
||||
$controlbox-width: 250px !default;
|
||||
$chat-width: 100% !default;
|
||||
$chat-height: 100%;
|
||||
$chat-gutter: 0.5em !default;
|
||||
$minimized-chats-width: 130px !default;
|
||||
|
||||
$padding: 1em;
|
||||
|
||||
$mobile-chat-width: 100% !default;
|
||||
$mobile-chat-height: 400px !default;
|
||||
$small-mobile-chat-height: 300px !default;
|
||||
|
||||
/* $font-path: "../fonticons/fonts/" !default; */
|
||||
$font-path: "https://cdn.conversejs.org/fonticons/fonts/" !default;
|
||||
|
||||
$chatroom-width: 300px !default;
|
||||
$chatroom-head-color: #E76F51 !default;
|
||||
$chatroom-color-light: #FF977C !default;
|
||||
$chatroom-color-dark: #D24E2B !default;
|
||||
|
||||
$headline-head-color: #2A9D8F !default;
|
||||
|
||||
$box-close-button-padding-top: 4px !default;
|
||||
$box-close-button-padding-bottom: 4px !default;
|
||||
$box-close-button-padding-left: 4px !default;
|
||||
$box-close-button-padding-right: 4px !default;
|
||||
$box-close-font-size: 16px !default;
|
24
sass/inverse/inverse.scss
Normal file
24
sass/inverse/inverse.scss
Normal file
|
@ -0,0 +1,24 @@
|
|||
/*!
|
||||
* Converse.js (Web-based XMPP instant messaging client)
|
||||
* http://conversejs.org
|
||||
*
|
||||
* Copyright (c) 2012-2014, JC Brand <jc@opkode.com>
|
||||
* Licensed under the Mozilla Public License
|
||||
*/
|
||||
|
||||
@import "bourbon";
|
||||
@import "variables";
|
||||
@import "../fonts";
|
||||
@import "normalize";
|
||||
@import "core";
|
||||
@import "../chatbox";
|
||||
@import "chatbox";
|
||||
@import "../controlbox";
|
||||
@import "controlbox";
|
||||
@import "../roster";
|
||||
@import "../bookmarks";
|
||||
@import "bookmarks";
|
||||
@import "../chatrooms";
|
||||
@import "chatrooms";
|
||||
@import "headline";
|
||||
@import "../awesomplete"
|
|
@ -45,6 +45,7 @@ require.config({
|
|||
|
||||
// Converse
|
||||
"converse": "src/converse",
|
||||
"inverse": "src/inverse",
|
||||
|
||||
"converse-bookmarks": "src/converse-bookmarks",
|
||||
"converse-chatview": "src/converse-chatview",
|
||||
|
@ -52,6 +53,7 @@ require.config({
|
|||
"converse-core": "src/converse-core",
|
||||
"converse-dragresize": "src/converse-dragresize",
|
||||
"converse-headline": "src/converse-headline",
|
||||
"converse-inverse": "src/converse-inverse",
|
||||
"converse-mam": "src/converse-mam",
|
||||
"converse-minimize": "src/converse-minimize",
|
||||
"converse-muc": "src/converse-muc",
|
||||
|
|
122
src/converse-inverse.js
Normal file
122
src/converse-inverse.js
Normal file
|
@ -0,0 +1,122 @@
|
|||
// Converse.js (A browser based XMPP chat client)
|
||||
// http://conversejs.org
|
||||
//
|
||||
// Copyright (c) 2012-2016, Jan-Carel Brand <jc@opkode.com>
|
||||
// Licensed under the Mozilla Public License (MPLv2)
|
||||
//
|
||||
/*global Backbone, define, window */
|
||||
|
||||
(function (root, factory) {
|
||||
define(["converse-core",
|
||||
"converse-chatview",
|
||||
"converse-controlbox",
|
||||
"converse-muc",
|
||||
"converse-singleton"
|
||||
], factory);
|
||||
}(this, function (converse) {
|
||||
"use strict";
|
||||
var $ = converse.env.jQuery,
|
||||
Strophe = converse.env.Strophe,
|
||||
_ = converse.env._;
|
||||
|
||||
converse.plugins.add('converse-inverse', {
|
||||
|
||||
overrides: {
|
||||
// overrides mentioned here will be picked up by converse.js's
|
||||
// plugin architecture they will replace existing methods on the
|
||||
// relevant objects or classes.
|
||||
//
|
||||
// new functions which don't exist yet can also be added.
|
||||
|
||||
areDesktopNotificationsEnabled: function () {
|
||||
// Call with "ignore_hidden" as true, so that it doesn't check
|
||||
// if the windowState is hidden.
|
||||
return this.__super__.areDesktopNotificationsEnabled.call(this, true);
|
||||
},
|
||||
|
||||
shouldNotifyOfMessage: function (message) {
|
||||
var _converse = this.__super__._converse;
|
||||
var result = this.__super__.shouldNotifyOfMessage.apply(this, arguments);
|
||||
return result && _converse.isMessageToHiddenChat(message);
|
||||
},
|
||||
|
||||
ControlBoxView: {
|
||||
close: function (ev) {
|
||||
if (ev && ev.preventDefault) {
|
||||
ev.preventDefault();
|
||||
}
|
||||
// The controlbox cannot be closed.
|
||||
},
|
||||
|
||||
hide: function (ev) {
|
||||
if (ev && ev.preventDefault) {
|
||||
ev.preventDefault();
|
||||
}
|
||||
// The controlbox cannot be hidden
|
||||
},
|
||||
|
||||
renderContactsPanel: function () {
|
||||
this.__super__.renderContactsPanel.apply(this, arguments);
|
||||
this.el.classList.remove("fullscreen");
|
||||
return this;
|
||||
},
|
||||
|
||||
renderRegistrationPanel: function () {
|
||||
this.__super__.renderRegistrationPanel.apply(this, arguments);
|
||||
|
||||
// TODO: put into template
|
||||
var div = document.createElement('div');
|
||||
div.innerHTML = '<h1 class="brand-heading"><i class="icon-conversejs"></i> inVerse</h1>';
|
||||
var el = document.getElementById('converse-register');
|
||||
el.parentNode.insertBefore(div.firstChild, el);
|
||||
return this;
|
||||
},
|
||||
|
||||
renderLoginPanel: function () {
|
||||
this.__super__.renderLoginPanel.apply(this, arguments);
|
||||
this.el.classList.add("fullscreen");
|
||||
|
||||
// TODO: put into template
|
||||
var div = document.createElement('div');
|
||||
div.innerHTML = '<h1 class="brand-heading"><i class="icon-conversejs"></i> inVerse</h1>';
|
||||
var el = document.getElementById('converse-login');
|
||||
el.parentNode.insertBefore(div.firstChild, el);
|
||||
return this;
|
||||
}
|
||||
},
|
||||
|
||||
ChatRoomView: {
|
||||
afterShown: function (focus) {
|
||||
/* Make sure chat rooms are scrolled down when opened
|
||||
*/
|
||||
this.scrollDown();
|
||||
if (focus) {
|
||||
this.focus();
|
||||
}
|
||||
return this.__super__.afterShown.apply(this, arguments);
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
initialize: function () {
|
||||
var _converse = this._converse;
|
||||
|
||||
this.updateSettings({
|
||||
sticky_controlbox: true,
|
||||
sounds_path: '/node_modules/converse.js/sounds/', // New default
|
||||
notification_icon: '/node_modules/converse.js/logo/conversejs128.png', // New default
|
||||
});
|
||||
|
||||
_converse.isMessageToHiddenChat = function (message) {
|
||||
var jid = Strophe.getBareJidFromJid(message.getAttribute('from'));
|
||||
var model = _converse.chatboxes.get(jid);
|
||||
if (!_.isNil(model)) {
|
||||
return model.get('hidden');
|
||||
}
|
||||
// Not having a chat box is assume to be practically the same
|
||||
// as it being hidden.
|
||||
return true;
|
||||
}
|
||||
}
|
||||
});
|
||||
}));
|
36
src/inverse.js
Normal file
36
src/inverse.js
Normal file
|
@ -0,0 +1,36 @@
|
|||
/* Converse.js components configuration
|
||||
*
|
||||
* This file is used to tell require.js which components (or plugins) to load
|
||||
* when it generates a build.
|
||||
*/
|
||||
if (typeof define !== 'undefined') {
|
||||
/* When running tests, define is not defined. */
|
||||
define("inverse", [
|
||||
"converse-core",
|
||||
/* START: Removable components
|
||||
* --------------------
|
||||
* Any of the following components may be removed if they're not needed.
|
||||
*/
|
||||
"converse-chatview", // Renders standalone chat boxes for single user chat
|
||||
"converse-controlbox", // The control box
|
||||
"converse-bookmarks", // XEP-0048 Bookmarks
|
||||
"converse-roomslist", // Show currently open chat rooms
|
||||
"converse-mam", // XEP-0313 Message Archive Management
|
||||
"converse-muc", // XEP-0045 Multi-user chat
|
||||
"converse-vcard", // XEP-0054 VCard-temp
|
||||
"converse-otr", // Off-the-record encryption for one-on-one messages
|
||||
"converse-register", // XEP-0077 In-band registration
|
||||
"converse-ping", // XEP-0199 XMPP Ping
|
||||
"converse-notification",// HTML5 Notifications
|
||||
"converse-headline", // Support for headline messages
|
||||
|
||||
"converse-inverse", // Inverse plugin for converse.js
|
||||
/* END: Removable components */
|
||||
|
||||
], function(converse) {
|
||||
var $ = converse.env.jQuery;
|
||||
window.converse = converse;
|
||||
$(window).trigger('converse-loaded', converse);
|
||||
return converse;
|
||||
});
|
||||
}
|
Loading…
Reference in New Issue
Block a user