apitech
/
Rocket.Chat
mirror of https://github.com/RocketChat/Rocket.Chat
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

livechat popout support

Browse Source
pull/1636/head
Diego Sampaio 10 years ago
parent 7dee035bb8
commit 819783b14c
7 changed files with 668 additions and 107 deletions
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Show Stats Download Patch File Download Diff File
  1. 2
      packages/rocketchat-livechat/app/client/stylesheets/_variables.less
  2. 509
      packages/rocketchat-livechat/app/client/stylesheets/fontello.css
  3. 13
      packages/rocketchat-livechat/app/client/stylesheets/main.less
  4. 96
      packages/rocketchat-livechat/app/client/views/room.coffee
  5. 5
      packages/rocketchat-livechat/app/client/views/room.html
  6. 120
      packages/rocketchat-livechat/app/client/views/room.js
  7. 30
      packages/rocketchat-livechat/rocket-livechat.js

2
packages/rocketchat-livechat/app/client/stylesheets/_variables.less
Unescape View File

@ -1,5 +1,5 @@
@header-min-height: 30px;
@footer-min-height: 52px;
@footer-min-height: 42px;
@rooms-box-width: 260px;
@flex-tab-width: 400px;

509
packages/rocketchat-livechat/app/client/stylesheets/fontello.css vendored
Unescape View File

@ -0,0 +1,509 @@
@font-face {
font-family: 'fontello';
src: url('/fonts/fontello.eot?52343198');
src: url('/fonts/fontello.eot?52343198#iefix') format('embedded-opentype'),
url('/fonts/fontello.woff?52343198') format('woff'),
url('/fonts/fontello.ttf?52343198') format('truetype'),
url('/fonts/fontello.svg?52343198#fontello') format('svg');
font-weight: normal;
font-style: normal;
}
/* Chrome hack: SVG is rendered more smooth in Windozze. 100% magic, uncomment if you need it. */
/* Note, that will break hinting! In other OS-es font will be not as sharp as it could be */
/*
@media screen and (-webkit-min-device-pixel-ratio:0) {
@font-face {
font-family: 'fontello';
src: url('/fonts/fontello.svg?52343198#fontello') format('svg');
}
}
*/
[class^="icon-"]:before, [class*=" icon-"]:before {
font-family: "fontello";
font-style: normal;
font-weight: normal;
speak: none;
display: inline-block;
text-decoration: inherit;
width: 1em;
margin-right: .2em;
text-align: center;
/* opacity: .8; */
/* For safety - reset parent styles, that can break glyph codes*/
font-variant: normal;
text-transform: none;
/* fix buttons height, for twitter bootstrap */
line-height: 1em;
/* Animation center compensation - margins should be symmetric */
/* remove if not needed */
margin-left: .2em;
/* you can be more comfortable with increased icons size */
/* font-size: 120%; */
/* Font smoothing. That was taken from TWBS */
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
/* Uncomment for 3D effect */
/* text-shadow: 1px 1px 1px rgba(127, 127, 127, 0.3); */
}
.icon-religious-islam:before { content: '\21'; } /* '!' */
.icon-religious-jewish:before { content: '\22'; } /* '"' */
.icon-graduation-cap-1:before { content: '\23'; } /* '#' */
.icon-universal-access:before { content: '\24'; } /* '$' */
.icon-paper-plane:before { content: '\25'; } /* '%' */
.icon-paw:before { content: '\26'; } /* '&' */
.icon-spoon:before { content: '\27'; } /* ''' */
.icon-chrome:before { content: '\2a'; } /* '*' */
.icon-opera:before { content: '\2b'; } /* '+' */
.icon-crown:before { content: '\2c'; } /* ',' */
.icon-recycle:before { content: '\2d'; } /* '-' */
.icon-note-beamed:before { content: '\2e'; } /* '.' */
.icon-ie:before { content: '\2f'; } /* '/' */
.icon-note:before { content: '\30'; } /* '0' */
.icon-alert:before { content: '\31'; } /* '1' */
.icon-chat-1:before { content: '\32'; } /* '2' */
.icon-360:before { content: '\33'; } /* '3' */
.icon-cab:before { content: '\34'; } /* '4' */
.icon-share:before { content: '\35'; } /* '5' */
.icon-building-filled:before { content: '\36'; } /* '6' */
.icon-linux:before { content: '\37'; } /* '7' */
.icon-camera-tour:before { content: '\38'; } /* '8' */
.icon-spin1:before { content: '\39'; } /* '9' */
.icon-spin2:before { content: '\3a'; } /* ':' */
.icon-spin3:before { content: '\3b'; } /* ';' */
.icon-left-open:before { content: '\3c'; } /* '<' */
.icon-spin5:before { content: '\3d'; } /* '=' */
.icon-right-open:before { content: '\3e'; } /* '>' */
.icon-history:before { content: '\3f'; } /* '?' */
.icon-circle-notch:before { content: '\40'; } /* '@' */
.icon-marquee:before { content: '\41'; } /* 'A' */
.icon-eye:before { content: '\42'; } /* 'B' */
.icon-users:before { content: '\43'; } /* 'C' */
.icon-shower:before { content: '\44'; } /* 'D' */
.icon-swimming:before { content: '\45'; } /* 'E' */
.icon-chart-area:before { content: '\46'; } /* 'F' */
.icon-chart-pie:before { content: '\47'; } /* 'G' */
.icon-chart-line:before { content: '\48'; } /* 'H' */
.icon-bicycle:before { content: '\49'; } /* 'I' */
.icon-bus:before { content: '\4a'; } /* 'J' */
.icon-at:before { content: '\4b'; } /* 'K' */
.icon-infinity:before { content: '\4c'; } /* 'L' */
.icon-at-1:before { content: '\4d'; } /* 'M' */
.icon-child:before { content: '\4e'; } /* 'N' */
.icon-plus-squared-alt:before { content: '\4f'; } /* 'O' */
.icon-unlink:before { content: '\50'; } /* 'P' */
.icon-share-squared:before { content: '\51'; } /* 'Q' */
.icon-tree:before { content: '\52'; } /* 'R' */
.icon-database:before { content: '\53'; } /* 'S' */
.icon-lifebuoy:before { content: '\54'; } /* 'T' */
.icon-cubes:before { content: '\55'; } /* 'U' */
.icon-cube:before { content: '\56'; } /* 'V' */
.icon-bell-off:before { content: '\57'; } /* 'W' */
.icon-trash-1:before { content: '\58'; } /* 'X' */
.icon-toggle-off:before { content: '\59'; } /* 'Y' */
.icon-toggle-on:before { content: '\5a'; } /* 'Z' */
.icon-birthday:before { content: '\5b'; } /* '[' */
.icon-github-circled:before { content: '\5c'; } /* '\' */
.icon-google:before { content: '\5d'; } /* ']' */
.icon-pied-piper-squared:before { content: '\5e'; } /* '^' */
.icon-slideshare:before { content: '\5f'; } /* '_' */
.icon-wordpress:before { content: '\60'; } /* '`' */
.icon-digg:before { content: '\61'; } /* 'a' */
.icon-delicious:before { content: '\62'; } /* 'b' */
.icon-hash:before { content: '\63'; } /* 'c' */
.icon-hash-1:before { content: '\64'; } /* 'd' */
.icon-clock-1:before { content: '\65'; } /* 'e' */
.icon-asterisk-1:before { content: '\66'; } /* 'f' */
.icon-cancel-circled:before { content: '\67'; } /* 'g' */
.icon-bell-off-empty:before { content: '\68'; } /* 'h' */
.icon-meteor:before { content: '\69'; } /* 'i' */
.icon-git-squared:before { content: '\6a'; } /* 'j' */
.icon-angellist:before { content: '\6b'; } /* 'k' */
.icon-behance:before { content: '\6c'; } /* 'l' */
.icon-gitlab:before { content: '\6d'; } /* 'm' */
.icon-rocketchat:before { content: '\6e'; } /* 'n' */
.icon-spin4:before { content: '\6f'; } /* 'o' */
.icon-sliders:before { content: '\70'; } /* 'p' */
.icon-spin6:before { content: '\71'; } /* 'q' */
.icon-firefox:before { content: '\72'; } /* 'r' */
.icon-angle-double-left:before { content: '\ab'; } /* '«' */
.icon-angle-double-right:before { content: '\bb'; } /* '»' */
.icon-angle-left:before { content: '\2039'; } /* '‹' */
.icon-angle-right:before { content: '\203a'; } /* '›' */
.icon-left-open-small:before { content: '\276e'; } /* '❮' */
.icon-right-open-small:before { content: '\276f'; } /* '❯' */
.icon-camera:before { content: '\e800'; } /* '' */
.icon-videocam:before { content: '\e801'; } /* '' */
.icon-heart:before { content: '\e802'; } /* '' */
.icon-star:before { content: '\e803'; } /* '' */
.icon-star-empty:before { content: '\e804'; } /* '' */
.icon-star-half:before { content: '\e805'; } /* '' */
.icon-star-half-alt:before { content: '\e806'; } /* '' */
.icon-thumbs-up-alt:before { content: '\e807'; } /* '' */
.icon-thumbs-down-alt:before { content: '\e808'; } /* '' */
.icon-print:before { content: '\e809'; } /* '' */
.icon-user:before { content: '\e80a'; } /* '' */
.icon-ok:before { content: '\e80b'; } /* '' */
.icon-bell-alt:before { content: '\e80c'; } /* '' */
.icon-bell:before { content: '\e80d'; } /* '' */
.icon-direction:before { content: '\e80e'; } /* '' */
.icon-home:before { content: '\e80f'; } /* '' */
.icon-trash:before { content: '\e810'; } /* '' */
.icon-menu:before { content: '\e811'; } /* '' */
.icon-attach:before { content: '\e812'; } /* '' */
.icon-th-list:before { content: '\e813'; } /* '' */
.icon-th:before { content: '\e814'; } /* '' */
.icon-th-large:before { content: '\e815'; } /* '' */
.icon-ok-circled:before { content: '\e816'; } /* '' */
.icon-cancel:before { content: '\e818'; } /* '' */
.icon-attention:before { content: '\e819'; } /* '' */
.icon-attention-circled:before { content: '\e81a'; } /* '' */
.icon-location:before { content: '\e81b'; } /* '' */
.icon-pencil:before { content: '\e81c'; } /* '' */
.icon-glass:before { content: '\e81d'; } /* '' */
.icon-music:before { content: '\e81e'; } /* '' */
.icon-search:before { content: '\e81f'; } /* '' */
.icon-mail:before { content: '\e820'; } /* '' */
.icon-mail-alt:before { content: '\e821'; } /* '' */
.icon-heart-empty:before { content: '\e822'; } /* '' */
.icon-male:before { content: '\e824'; } /* '' */
.icon-female:before { content: '\e825'; } /* '' */
.icon-video:before { content: '\e826'; } /* '' */
.icon-picture:before { content: '\e827'; } /* '' */
.icon-ok-squared:before { content: '\e82a'; } /* '' */
.icon-plus:before { content: '\e82c'; } /* '' */
.icon-plus-circled:before { content: '\e82d'; } /* '' */
.icon-plus-squared:before { content: '\e82e'; } /* '' */
.icon-religious-christian:before { content: '\e82f'; } /* '' */
.icon-water:before { content: '\e830'; } /* '' */
.icon-toilet:before { content: '\e831'; } /* '' */
.icon-droplet:before { content: '\e832'; } /* '' */
.icon-minus:before { content: '\e833'; } /* '' */
.icon-minus-circled:before { content: '\e834'; } /* '' */
.icon-minus-squared:before { content: '\e835'; } /* '' */
.icon-airport:before { content: '\e836'; } /* '' */
.icon-help:before { content: '\e837'; } /* '' */
.icon-help-circled:before { content: '\e838'; } /* '' */
.icon-info-circled:before { content: '\e839'; } /* '' */
.icon-info:before { content: '\e83a'; } /* '' */
.icon-link:before { content: '\e83b'; } /* '' */
.icon-link-ext:before { content: '\e83d'; } /* '' */
.icon-link-ext-alt:before { content: '\e83e'; } /* '' */
.icon-thumbs-down:before { content: '\e83f'; } /* '' */
.icon-thumbs-up:before { content: '\e840'; } /* '' */
.icon-flag-checkered:before { content: '\e841'; } /* '' */
.icon-flag-empty:before { content: '\e842'; } /* '' */
.icon-flag:before { content: '\e843'; } /* '' */
.icon-bookmark-empty:before { content: '\e844'; } /* '' */
.icon-bookmark:before { content: '\e845'; } /* '' */
.icon-tags:before { content: '\e846'; } /* '' */
.icon-tag:before { content: '\e847'; } /* '' */
.icon-eye-off:before { content: '\e848'; } /* '' */
.icon-minus-squared-alt:before { content: '\e84a'; } /* '' */
.icon-pin:before { content: '\e84b'; } /* '' */
.icon-lock-open-alt:before { content: '\e84c'; } /* '' */
.icon-lock-open:before { content: '\e84d'; } /* '' */
.icon-lock:before { content: '\e84e'; } /* '' */
.icon-download:before { content: '\e84f'; } /* '' */
.icon-upload:before { content: '\e850'; } /* '' */
.icon-download-cloud:before { content: '\e851'; } /* '' */
.icon-upload-cloud:before { content: '\e852'; } /* '' */
.icon-reply:before { content: '\e853'; } /* '' */
.icon-edit:before { content: '\e854'; } /* '' */
.icon-compass:before { content: '\e855'; } /* '' */
.icon-retweet:before { content: '\e856'; } /* '' */
.icon-keyboard:before { content: '\e857'; } /* '' */
.icon-gamepad:before { content: '\e858'; } /* '' */
.icon-comment:before { content: '\e859'; } /* '' */
.icon-chat:before { content: '\e85a'; } /* '' */
.icon-comment-empty:before { content: '\e85b'; } /* '' */
.icon-chat-empty:before { content: '\e85c'; } /* '' */
.icon-reply-all:before { content: '\e85d'; } /* '' */
.icon-forward:before { content: '\e85e'; } /* '' */
.icon-quote-left:before { content: '\e85f'; } /* '' */
.icon-quote-right:before { content: '\e860'; } /* '' */
.icon-code:before { content: '\e861'; } /* '' */
.icon-export:before { content: '\e862'; } /* '' */
.icon-export-alt:before { content: '\e863'; } /* '' */
.icon-pencil-squared:before { content: '\e864'; } /* '' */
.icon-attention-alt:before { content: '\e865'; } /* '' */
.icon-doc:before { content: '\e866'; } /* '' */
.icon-docs:before { content: '\e867'; } /* '' */
.icon-doc-text:before { content: '\e868'; } /* '' */
.icon-doc-inv:before { content: '\e869'; } /* '' */
.icon-doc-text-inv:before { content: '\e86a'; } /* '' */
.icon-folder-open:before { content: '\e86b'; } /* '' */
.icon-folder-empty:before { content: '\e86c'; } /* '' */
.icon-folder:before { content: '\e86d'; } /* '' */
.icon-folder-open-empty:before { content: '\e86e'; } /* '' */
.icon-box:before { content: '\e86f'; } /* '' */
.icon-rss:before { content: '\e870'; } /* '' */
.icon-rss-squared:before { content: '\e871'; } /* '' */
.icon-phone:before { content: '\e872'; } /* '' */
.icon-phone-squared:before { content: '\e873'; } /* '' */
.icon-blank:before { content: '\e874'; } /* '' */
.icon-youtube-play:before { content: '\e875'; } /* '' */
.icon-youtube-squared:before { content: '\e876'; } /* '' */
.icon-youtube:before { content: '\e877'; } /* '' */
.icon-key-1:before { content: '\e878'; } /* '' */
.icon-foxter:before { content: '\e879'; } /* '' */
.icon-windows:before { content: '\e87a'; } /* '' */
.icon-kettle:before { content: '\e87b'; } /* '' */
.icon-graduation-cap:before { content: '\e87c'; } /* '' */
.icon-vimeo-squared:before { content: '\e87d'; } /* '' */
.icon-twitter:before { content: '\e87e'; } /* '' */
.icon-twitter-squared:before { content: '\e87f'; } /* '' */
.icon-tumblr-squared:before { content: '\e880'; } /* '' */
.icon-tumblr:before { content: '\e881'; } /* '' */
.icon-trello:before { content: '\e882'; } /* '' */
.icon-stackoverflow:before { content: '\e883'; } /* '' */
.icon-lemon:before { content: '\e884'; } /* '' */
.icon-parking:before { content: '\e885'; } /* '' */
.icon-gittip:before { content: '\e886'; } /* '' */
.icon-gplus:before { content: '\e887'; } /* '' */
.icon-html5:before { content: '\e888'; } /* '' */
.icon-gplus-squared:before { content: '\e889'; } /* '' */
.icon-instagramm:before { content: '\e88a'; } /* '' */
.icon-linkedin-squared:before { content: '\e88b'; } /* '' */
.icon-fuel:before { content: '\e88c'; } /* '' */
.icon-linkedin:before { content: '\e88d'; } /* '' */
.icon-money-1:before { content: '\e88e'; } /* '' */
.icon-pagelines:before { content: '\e88f'; } /* '' */
.icon-pinterest-circled:before { content: '\e890'; } /* '' */
.icon-pinterest-squared:before { content: '\e891'; } /* '' */
.icon-skype:before { content: '\e892'; } /* '' */
.icon-stackexchange:before { content: '\e893'; } /* '' */
.icon-renren:before { content: '\e894'; } /* '' */
.icon-bank:before { content: '\e895'; } /* '' */
.icon-school:before { content: '\e896'; } /* '' */
.icon-foursquare:before { content: '\e897'; } /* '' */
.icon-flickr:before { content: '\e898'; } /* '' */
.icon-facebook-squared:before { content: '\e899'; } /* '' */
.icon-facebook:before { content: '\e89a'; } /* '' */
.icon-dropbox:before { content: '\e89b'; } /* '' */
.icon-dribbble:before { content: '\e89c'; } /* '' */
.icon-css3:before { content: '\e89d'; } /* '' */
.icon-bitbucket-squared:before { content: '\e89e'; } /* '' */
.icon-bitbucket:before { content: '\e89f'; } /* '' */
.icon-apple:before { content: '\e8a0'; } /* '' */
.icon-android:before { content: '\e8a1'; } /* '' */
.icon-adn:before { content: '\e8a2'; } /* '' */
.icon-wheelchair:before { content: '\e8a3'; } /* '' */
.icon-bullseye:before { content: '\e8a4'; } /* '' */
.icon-user-md:before { content: '\e8a5'; } /* '' */
.icon-stethoscope:before { content: '\e8a6'; } /* '' */
.icon-ambulance:before { content: '\e8a7'; } /* '' */
.icon-medkit:before { content: '\e8a8'; } /* '' */
.icon-hospital:before { content: '\e8a9'; } /* '' */
.icon-h-sigh:before { content: '\e8aa'; } /* '' */
.icon-building:before { content: '\e8ab'; } /* '' */
.icon-smile:before { content: '\e8ac'; } /* '' */
.icon-frown:before { content: '\e8ad'; } /* '' */
.icon-meh:before { content: '\e8ae'; } /* '' */
.icon-anchor:before { content: '\e8af'; } /* '' */
.icon-terminal:before { content: '\e8b0'; } /* '' */
.icon-eraser:before { content: '\e8b1'; } /* '' */
.icon-puzzle:before { content: '\e8b2'; } /* '' */
.icon-shield:before { content: '\e8b3'; } /* '' */
.icon-extinguisher:before { content: '\e8b4'; } /* '' */
.icon-beer:before { content: '\e8b5'; } /* '' */
.icon-food:before { content: '\e8b6'; } /* '' */
.icon-coffee:before { content: '\e8b7'; } /* '' */
.icon-spinner:before { content: '\e8b8'; } /* '' */
.icon-sitemap:before { content: '\e8b9'; } /* '' */
.icon-gauge:before { content: '\e8ba'; } /* '' */
.icon-hammer:before { content: '\e8bb'; } /* '' */
.icon-sort-number-down:before { content: '\e8bc'; } /* '' */
.icon-sort-name-down:before { content: '\e8bd'; } /* '' */
.icon-sort-number-up:before { content: '\e8be'; } /* '' */
.icon-sort-name-up:before { content: '\e8bf'; } /* '' */
.icon-sort-alt-down:before { content: '\e8c0'; } /* '' */
.icon-sort-alt-up:before { content: '\e8c1'; } /* '' */
.icon-sort-up:before { content: '\e8c2'; } /* '' */
.icon-sort-down:before { content: '\e8c3'; } /* '' */
.icon-sort:before { content: '\e8c4'; } /* '' */
.icon-certificate:before { content: '\e8c5'; } /* '' */
.icon-tasks:before { content: '\e8c6'; } /* '' */
.icon-filter:before { content: '\e8c7'; } /* '' */
.icon-beaker:before { content: '\e8c8'; } /* '' */
.icon-magic:before { content: '\e8c9'; } /* '' */
.icon-truck:before { content: '\e8ca'; } /* '' */
.icon-money:before { content: '\e8cb'; } /* '' */
.icon-euro:before { content: '\e8cc'; } /* '' */
.icon-pound:before { content: '\e8cd'; } /* '' */
.icon-dollar:before { content: '\e8ce'; } /* '' */
.icon-bug:before { content: '\e8cf'; } /* '' */
.icon-rocket:before { content: '\e8d0'; } /* '' */
.icon-fork:before { content: '\e8d1'; } /* '' */
.icon-key:before { content: '\e8d2'; } /* '' */
.icon-hdd:before { content: '\e8d3'; } /* '' */
.icon-megaphone:before { content: '\e8d4'; } /* '' */
.icon-floppy:before { content: '\e8d5'; } /* '' */
.icon-credit-card:before { content: '\e8d6'; } /* '' */
.icon-ticket:before { content: '\e8d7'; } /* '' */
.icon-chart-bar:before { content: '\e8d8'; } /* '' */
.icon-magnet:before { content: '\e8d9'; } /* '' */
.icon-fire:before { content: '\e8da'; } /* '' */
.icon-gift:before { content: '\e8db'; } /* '' */
.icon-asterisk:before { content: '\e8dc'; } /* '' */
.icon-dot-circled:before { content: '\e8dd'; } /* '' */
.icon-circle-empty:before { content: '\e8de'; } /* '' */
.icon-paste:before { content: '\e8df'; } /* '' */
.icon-briefcase:before { content: '\e8e0'; } /* '' */
.icon-suitcase:before { content: '\e8e1'; } /* '' */
.icon-ellipsis:before { content: '\e8e2'; } /* '' */
.icon-ellipsis-vert:before { content: '\e8e3'; } /* '' */
.icon-off:before { content: '\e8e4'; } /* '' */
.icon-road:before { content: '\e8e5'; } /* '' */
.icon-qrcode:before { content: '\e8e6'; } /* '' */
.icon-barcode:before { content: '\e8e7'; } /* '' */
.icon-list-alt:before { content: '\e8e8'; } /* '' */
.icon-book:before { content: '\e8e9'; } /* '' */
.icon-ajust:before { content: '\e8ea'; } /* '' */
.icon-tint:before { content: '\e8eb'; } /* '' */
.icon-check:before { content: '\e8ec'; } /* '' */
.icon-check-empty:before { content: '\e8ed'; } /* '' */
.icon-circle:before { content: '\e8ee'; } /* '' */
.icon-cog:before { content: '\e8ef'; } /* '' */
.icon-cog-alt:before { content: '\e8f0'; } /* '' */
.icon-wrench:before { content: '\e8f1'; } /* '' */
.icon-basket:before { content: '\e8f2'; } /* '' */
.icon-calendar-empty:before { content: '\e8f3'; } /* '' */
.icon-calendar:before { content: '\e8f4'; } /* '' */
.icon-login:before { content: '\e8f5'; } /* '' */
.icon-logout:before { content: '\e8f6'; } /* '' */
.icon-mic:before { content: '\e8f7'; } /* '' */
.icon-mute:before { content: '\e8f8'; } /* '' */
.icon-volume-off:before { content: '\e8f9'; } /* '' */
.icon-volume-down:before { content: '\e8fa'; } /* '' */
.icon-volume-up:before { content: '\e8fb'; } /* '' */
.icon-headphones:before { content: '\e8fc'; } /* '' */
.icon-clock:before { content: '\e8fd'; } /* '' */
.icon-up-dir:before { content: '\e8fe'; } /* '' */
.icon-down-dir:before { content: '\e8ff'; } /* '' */
.icon-right-circled2:before { content: '\e900'; } /* '' */
.icon-left-circled2:before { content: '\e901'; } /* '' */
.icon-up-circled2:before { content: '\e902'; } /* '' */
.icon-down-circled2:before { content: '\e903'; } /* '' */
.icon-zoom-out:before { content: '\e904'; } /* '' */
.icon-zoom-in:before { content: '\e905'; } /* '' */
.icon-move:before { content: '\e906'; } /* '' */
.icon-resize-horizontal:before { content: '\e907'; } /* '' */
.icon-resize-vertical:before { content: '\e908'; } /* '' */
.icon-resize-small:before { content: '\e909'; } /* '' */
.icon-resize-full-alt:before { content: '\e90a'; } /* '' */
.icon-resize-full:before { content: '\e90b'; } /* '' */
.icon-block:before { content: '\e90c'; } /* '' */
.icon-lightbulb:before { content: '\e90d'; } /* '' */
.icon-left-dir:before { content: '\e90e'; } /* '' */
.icon-right-dir:before { content: '\e90f'; } /* '' */
.icon-down-open:before { content: '\e910'; } /* '' */
.icon-up-open:before { content: '\e913'; } /* '' */
.icon-angle-up:before { content: '\e916'; } /* '' */
.icon-angle-down:before { content: '\e917'; } /* '' */
.icon-angle-circled-left:before { content: '\e918'; } /* '' */
.icon-angle-circled-right:before { content: '\e919'; } /* '' */
.icon-angle-circled-down:before { content: '\e91a'; } /* '' */
.icon-angle-circled-up:before { content: '\e91d'; } /* '' */
.icon-scissors:before { content: '\e91e'; } /* '' */
.icon-align-left:before { content: '\e91f'; } /* '' */
.icon-mobile:before { content: '\e920'; } /* '' */
.icon-play-circled2:before { content: '\e921'; } /* '' */
.icon-right-circled:before { content: '\e922'; } /* '' */
.icon-left-circled:before { content: '\e923'; } /* '' */
.icon-play-circled:before { content: '\e924'; } /* '' */
.icon-tablet:before { content: '\e925'; } /* '' */
.icon-text-width:before { content: '\e926'; } /* '' */
.icon-crop:before { content: '\e927'; } /* '' */
.icon-columns:before { content: '\e928'; } /* '' */
.icon-text-height:before { content: '\e929'; } /* '' */
.icon-laptop:before { content: '\e92a'; } /* '' */
.icon-play:before { content: '\e92b'; } /* '' */
.icon-down-hand:before { content: '\e92c'; } /* '' */
.icon-up-hand:before { content: '\e92d'; } /* '' */
.icon-collapse-left:before { content: '\e92e'; } /* '' */
.icon-desktop:before { content: '\e92f'; } /* '' */
.icon-italic:before { content: '\e930'; } /* '' */
.icon-table:before { content: '\e931'; } /* '' */
.icon-subscript:before { content: '\e932'; } /* '' */
.icon-bold:before { content: '\e933'; } /* '' */
.icon-award:before { content: '\e934'; } /* '' */
.icon-expand-right:before { content: '\e935'; } /* '' */
.icon-left-hand:before { content: '\e936'; } /* '' */
.icon-right-hand:before { content: '\e937'; } /* '' */
.icon-signal:before { content: '\e938'; } /* '' */
.icon-collapse:before { content: '\e939'; } /* '' */
.icon-font:before { content: '\e93a'; } /* '' */
.icon-superscript:before { content: '\e93b'; } /* '' */
.icon-align-center:before { content: '\e93c'; } /* '' */
.icon-align-right:before { content: '\e93d'; } /* '' */
.icon-align-justify:before { content: '\e93e'; } /* '' */
.icon-indent-left:before { content: '\e93f'; } /* '' */
.icon-indent-right:before { content: '\e940'; } /* '' */
.icon-list:before { content: '\e941'; } /* '' */
.icon-list-bullet:before { content: '\e942'; } /* '' */
.icon-list-numbered:before { content: '\e943'; } /* '' */
.icon-strike:before { content: '\e944'; } /* '' */
.icon-underline:before { content: '\e945'; } /* '' */
.icon-leaf:before { content: '\e946'; } /* '' */
.icon-fighter-jet:before { content: '\e947'; } /* '' */
.icon-flight:before { content: '\e948'; } /* '' */
.icon-umbrella:before { content: '\e949'; } /* '' */
.icon-moon:before { content: '\e94a'; } /* '' */
.icon-flash:before { content: '\e94b'; } /* '' */
.icon-cloud:before { content: '\e94c'; } /* '' */
.icon-sun:before { content: '\e94d'; } /* '' */
.icon-globe:before { content: '\e94e'; } /* '' */
.icon-inbox:before { content: '\e94f'; } /* '' */
.icon-stop:before { content: '\e950'; } /* '' */
.icon-pause:before { content: '\e951'; } /* '' */
.icon-to-end:before { content: '\e952'; } /* '' */
.icon-to-end-alt:before { content: '\e953'; } /* '' */
.icon-to-start:before { content: '\e954'; } /* '' */
.icon-fast-fw:before { content: '\e955'; } /* '' */
.icon-to-start-alt:before { content: '\e956'; } /* '' */
.icon-fast-bw:before { content: '\e957'; } /* '' */
.icon-eject:before { content: '\e958'; } /* '' */
.icon-target:before { content: '\e959'; } /* '' */
.icon-expand:before { content: '\e95a'; } /* '' */
.icon-exchange:before { content: '\e95b'; } /* '' */
.icon-shuffle:before { content: '\e95c'; } /* '' */
.icon-level-down:before { content: '\e95d'; } /* '' */
.icon-arrows-cw:before { content: '\e95e'; } /* '' */
.icon-level-up:before { content: '\e95f'; } /* '' */
.icon-ccw:before { content: '\e960'; } /* '' */
.icon-cw:before { content: '\e961'; } /* '' */
.icon-down-circled:before { content: '\e962'; } /* '' */
.icon-up-circled:before { content: '\e963'; } /* '' */
.icon-angle-double-up:before { content: '\e964'; } /* '' */
.icon-angle-double-down:before { content: '\e965'; } /* '' */
.icon-down:before { content: '\e966'; } /* '' */
.icon-left:before { content: '\e967'; } /* '' */
.icon-right:before { content: '\e968'; } /* '' */
.icon-up:before { content: '\e969'; } /* '' */
.icon-down-big:before { content: '\e96a'; } /* '' */
.icon-left-big:before { content: '\e96b'; } /* '' */
.icon-right-big:before { content: '\e96c'; } /* '' */
.icon-up-big:before { content: '\e96d'; } /* '' */
.icon-bedroom:before { content: '\e96e'; } /* '' */
.icon-fast-food:before { content: '\e96f'; } /* '' */
.icon-police:before { content: '\e971'; } /* '' */
.icon-elevator:before { content: '\e972'; } /* '' */
.icon-food-1:before { content: '\e973'; } /* '' */
.icon-pan:before { content: '\e974'; } /* '' */
.icon-tap:before { content: '\e975'; } /* '' */
.icon-gym:before { content: '\e976'; } /* '' */
.icon-sports:before { content: '\e977'; } /* '' */
.icon-football:before { content: '\e978'; } /* '' */
.icon-tennis:before { content: '\e979'; } /* '' */
.icon-fax:before { content: '\e97a'; } /* '' */
.icon-taxi:before { content: '\e97b'; } /* '' */
.icon-paragraph:before { content: '\e97c'; } /* '' */

13
packages/rocketchat-livechat/app/client/stylesheets/main.less
Unescape View File

@ -49,7 +49,7 @@ input:focus {
height: 100%;
.title {
flex: 1 1 @header-min-height;
flex: 1 0 @header-min-height;
line-height: @header-min-height;
@ -62,8 +62,13 @@ input:focus {
margin: 0;
padding: 0 5px;
font-size: 9pt;
display: table-cell;
vertical-align: middle;
display: inline-block;
}
.toolbar {
display: inline-block;
float: right;
padding-right: 5px;
}
}
.messages {
@ -286,7 +291,7 @@ input:focus {
}
}
.footer {
flex: 1 1 @footer-min-height;
flex: 1 0 @footer-min-height;
z-index: 10;

96
packages/rocketchat-livechat/app/client/views/room.coffee
Unescape View File

@ -1,96 +0,0 @@
Template.room.helpers
messages: ->
return ChatMessage.find { rid: visitor.getRoom(), t: { '$ne': 't' } }, { sort: { ts: 1 } }
title: ->
return '' unless Template.instance().subscriptionsReady()
return Settings.findOne('Livechat_title')?.value or 'Rocket.Chat'
color: ->
return 'transparent' unless Template.instance().subscriptionsReady()
return Settings.findOne('Livechat_title_color')?.value or '#C1272D'
Template.room.events
'keyup .input-message': (event) ->
Template.instance().chatMessages.keyup(visitor.getRoom(), event, Template.instance())
# Inital height is 28. If the scrollHeight is greater than that( we have more text than area ),
# increase the size of the textarea. The max-height is set at 200
# even if the scrollHeight become bigger than that it should never exceed that.
# Account for no text in the textarea when increasing the height.
# If there is no text, reset the height.
inputScrollHeight = $(event.currentTarget).prop('scrollHeight')
if inputScrollHeight > 28
$(event.currentTarget).height( if $(event.currentTarget).val() == '' then '15px' else (if inputScrollHeight >= 200 then inputScrollHeight-50 else inputScrollHeight-20))
'keydown .input-message': (event) ->
Template.instance().chatMessages.keydown(visitor.getRoom(), event, Template.instance())
'click .new-message': (e) ->
Template.instance().atBottom = true
Template.instance().find('.input-message').focus()
'click .title': ->
parentCall 'toggleWindow'
'click .error': (e) ->
$(e.currentTarget).removeClass('show')
Template.room.onCreated ->
self = @
self.autorun ->
self.subscribe 'livechat:visitorRoom', visitor.getToken(), ->
room = ChatRoom.findOne()
if room?
visitor.setRoom room._id
RoomHistoryManager.getMoreIfIsEmpty room._id
self.subscribe 'settings', ['Livechat_title', 'Livechat_title_color']
self.atBottom = true
Template.room.onRendered ->
this.chatMessages = new ChatMessages
this.chatMessages.init(this.firstNode)
Template.room.onRendered ->
messages = this.find('.messages')
newMessage = this.find(".new-message")
template = this
onscroll = _.throttle ->
template.atBottom = messages.scrollTop >= messages.scrollHeight - messages.clientHeight
, 200
Meteor.setInterval ->
if template.atBottom
messages.scrollTop = messages.scrollHeight - messages.clientHeight
newMessage.className = "new-message not"
, 100
messages.addEventListener 'touchstart', ->
template.atBottom = false
messages.addEventListener 'touchend', ->
onscroll()
# readMessage.enable()
# readMessage.read()
messages.addEventListener 'scroll', ->
template.atBottom = false
onscroll()
messages.addEventListener 'mousewheel', ->
template.atBottom = false
onscroll()
# readMessage.enable()
# readMessage.read()
messages.addEventListener 'wheel', ->
template.atBottom = false
onscroll()
# readMessage.enable()
# readMessage.read()
# salva a data da renderização para exibir alertas de novas mensagens
# $.data(this.firstNode, 'renderedAt', new Date)

5
packages/rocketchat-livechat/app/client/views/room.html
Unescape View File

@ -1,6 +1,11 @@
<template name="room">
<div class="livechat-room">
<div class="title" style="background-color:{{color}}">
<div class="toolbar">
{{#unless popoutActive}}
<i class="popout icon-link-ext" title="Open in a new window"></i>
{{/unless}}
</div>
<h1>{{title}}</h1>
</div>
<div class="messages">

120
packages/rocketchat-livechat/app/client/views/room.js
Unescape View File

@ -0,0 +1,120 @@
Template.room.helpers({
messages: function() {
return ChatMessage.find({
rid: visitor.getRoom(),
t: {
'$ne': 't'
}
}, {
sort: {
ts: 1
}
});
},
title: function() {
var ref;
if (!Template.instance().subscriptionsReady()) {
return '';
}
return ((ref = Settings.findOne('Livechat_title')) != null ? ref.value : void 0) || 'Rocket.Chat';
},
color: function() {
var ref;
if (!Template.instance().subscriptionsReady()) {
return 'transparent';
}
return ((ref = Settings.findOne('Livechat_title_color')) != null ? ref.value : void 0) || '#C1272D';
},
popoutActive: function() {
return FlowRouter.getQueryParam('mode') === 'popout';
}
});
Template.room.events({
'keyup .input-message': function(event) {
// Inital height is 28. If the scrollHeight is greater than that( we have more text than area ),
// increase the size of the textarea. The max-height is set at 200
// even if the scrollHeight become bigger than that it should never exceed that.
// Account for no text in the textarea when increasing the height.
// If there is no text, reset the height.
var inputScrollHeight;
Template.instance().chatMessages.keyup(visitor.getRoom(), event, Template.instance());
inputScrollHeight = $(event.currentTarget).prop('scrollHeight');
if (inputScrollHeight > 28) {
return $(event.currentTarget).height($(event.currentTarget).val() === '' ? '15px' : (inputScrollHeight >= 200 ? inputScrollHeight - 50 : inputScrollHeight - 20));
}
},
'keydown .input-message': function(event) {
return Template.instance().chatMessages.keydown(visitor.getRoom(), event, Template.instance());
},
'click .new-message': function() {
Template.instance().atBottom = true;
return Template.instance().find('.input-message').focus();
},
'click .title': function() {
return parentCall('toggleWindow');
},
'click .error': function(event) {
return $(event.currentTarget).removeClass('show');
},
'click .popout': function(event) {
event.stopPropagation();
parentCall('openPopout');
}
});
Template.room.onCreated(function() {
var self;
self = this;
self.autorun(function() {
self.subscribe('livechat:visitorRoom', visitor.getToken(), function() {
var room;
room = ChatRoom.findOne();
if (room != null) {
visitor.setRoom(room._id);
RoomHistoryManager.getMoreIfIsEmpty(room._id);
}
});
});
self.subscribe('settings', ['Livechat_title', 'Livechat_title_color']);
self.atBottom = true;
});
Template.room.onRendered(function() {
this.chatMessages = new ChatMessages;
this.chatMessages.init(this.firstNode);
});
Template.room.onRendered(function() {
var messages, newMessage, onscroll, template;
messages = this.find('.messages');
newMessage = this.find(".new-message");
template = this;
onscroll = _.throttle(function() {
template.atBottom = messages.scrollTop >= messages.scrollHeight - messages.clientHeight;
}, 200);
Meteor.setInterval(function() {
if (template.atBottom) {
messages.scrollTop = messages.scrollHeight - messages.clientHeight;
newMessage.className = "new-message not";
}
}, 100);
messages.addEventListener('touchstart', function() {
template.atBottom = false;
});
messages.addEventListener('touchend', function() {
onscroll();
});
messages.addEventListener('scroll', function() {
template.atBottom = false;
onscroll();
});
messages.addEventListener('mousewheel', function() {
template.atBottom = false;
onscroll();
});
messages.addEventListener('wheel', function() {
template.atBottom = false;
onscroll();
});
});

30
packages/rocketchat-livechat/rocket-livechat.js
Unescape View File

@ -11,17 +11,31 @@
;(function(w) {
var exports = {};
var config = {};
var widget;
var closeWidget = () => {
widget.dataset.state = 'closed';
widget.style.height = '30px';
};
var openWidget = () => {
widget.dataset.state = 'opened';
widget.style.height = '300px';
};
var api = {
toggleWindow: function() {
var widget = document.querySelector('.rocketchat-widget');
toggleWindow: function(forceClose) {
if (widget.dataset.state === 'closed') {
widget.dataset.state = 'opened';
widget.style.height = '300px';
openWidget();
} else {
widget.dataset.state = 'closed';
widget.style.height = '30px';
closeWidget();
}
},
openPopout: function() {
closeWidget();
var popup = window.open(config.url + '?mode=popout', 'livechat-popout', 'width=400, height=450, toolbars=no');
popup.focus();
}
};
@ -30,6 +44,8 @@
return;
}
config.url = url;
var chatWidget = document.createElement('div');
chatWidget.dataset.state = 'closed';
chatWidget.className = 'rocketchat-widget';
@ -48,6 +64,8 @@
document.getElementsByTagName('body')[0].appendChild(chatWidget);
widget = document.querySelector('.rocketchat-widget');
w.addEventListener('message', function(msg) {
if (typeof msg.data === 'object' && msg.data.src !== undefined && msg.data.src === 'rocketchat') {
if (api[msg.data.fn] !== undefined && typeof api[msg.data.fn] === 'function') {

Write Preview
Loading…
Cancel
Save