1 | <html> |
2 | <head> |
3 | <title>Chat Popup Test</title> |
4 | <link href='https://botcompany.de/1014036/raw/1025925?contentType=text/css' rel='stylesheet'> |
5 | |
6 | <script type='text/javascript' src='//code.jquery.com/jquery-1.10.2.min.js'></script> |
7 | <script type='text/javascript' src='//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/js/bootstrap.min.js'></script> |
8 | |
9 | <script type='text/javascript'> $(function(){ |
10 | $("#addClass").click(function () { |
11 | console.log("Click!"); |
12 | $('#qnimate').addClass('popup-box-on'); |
13 | }); |
14 | |
15 | $("#removeClass").click(function () { |
16 | $('#qnimate').removeClass('popup-box-on'); |
17 | }); |
18 | }); |
19 | |
20 | var showActions = false; |
21 | |
22 | function showAction(action) { |
23 | if (showActions) { |
24 | $("#actionMsg").html(action); |
25 | $("#actionMsg").show(); |
26 | } |
27 | } |
28 | |
29 | function appendAction(action) { |
30 | if (showActions) { |
31 | $("#actionMsg").append(" | " + action); |
32 | $("#actionMsg").show(); |
33 | } |
34 | } |
35 | |
36 | function hideAction() { |
37 | $("#actionMsg").hide(); |
38 | $("#actionMsg").html(""); |
39 | } |
40 | |
41 | var n = #N#; |
42 | var interval = 1000; |
43 | nInitial = n; |
44 | |
45 | function start() { |
46 | url = "#INCREMENTALURL#"; |
47 | if (url != '' && url != ("#INC" + "REMENTALURL#")) { |
48 | showAction("Loading " + url + n); |
49 | $.get(url + n, function(src) { |
50 | showAction("Loaded"); |
51 | var match = src.match(/\d+/); |
52 | if (match != null) { |
53 | n = parseInt(match[0]); |
54 | $(".direct-chat-messages").append(src); |
55 | $("#scrollme").scrollTop(1E10); |
56 | showAction("Appended " + src.length); |
57 | } else |
58 | showAction("n=" + n + " (initial=" + nInitial + ")"); |
59 | appendAction("Rescheduling"); |
60 | setTimeout(start, interval); |
61 | appendAction("Rescheduled"); |
62 | }, 'text') |
63 | .fail(function() { |
64 | showAction("Rescheduling after fail"); |
65 | setTimeout(start, interval); |
66 | }); |
67 | } |
68 | } |
69 | </script> |
70 | </head> |
71 | <body onLoad='$("#scrollme").scrollTop(1E10); start();'> |
72 | <div id="actionMsg"></div> |
73 | <div class="container text-center"> |
74 | <div class="row"> |
75 | <div class="round hollow text-center"> |
76 | <a href="#" id="addClass"><span class="glyphicon glyphicon-comment"></span> Open chat </a> |
77 | </div> |
78 | </div> |
79 | </div> |
80 | |
81 | <form> |
82 | |
83 | <div class="popup-box chat-popup" id="qnimate"> |
84 | <div class="popup-head"> |
85 | <div onClick="$('#qnimate').removeClass('popup-box-on')" class="popup-head-left pull-left"><img src="http://eyeocr.sourceforge.net/filestore/filestore.php?cmd=serve&file=blob_1008323&contentType=image/png" alt="Bot Image"> $HEADING</div> |
86 | <div class="popup-head-right pull-right"> |
87 | <!-- |
88 | <div class="btn-group"> |
89 | <button class="chat-header-button" data-toggle="dropdown" type="button" aria-expanded="false"> |
90 | <i class="glyphicon glyphicon-cog"></i> </button> |
91 | <ul role="menu" class="dropdown-menu pull-right"> |
92 | <li><a href="#">Media</a></li> |
93 | <li><a href="#">Block</a></li> |
94 | <li><a href="#">Clear Chat</a></li> |
95 | <li><a href="#">Email Chat</a></li> |
96 | </ul> |
97 | </div> |
98 | --> |
99 | |
100 | <button data-widget="remove" id="removeClass" class="chat-header-button pull-right" type="button"><i class="glyphicon glyphicon-off"></i></button> |
101 | </div> |
102 | </div> |
103 | <div id="scrollme" class="popup-messages"> |
104 | |
105 | |
106 | |
107 | |
108 | <div class="direct-chat-messages"> |
109 | <!-- MSGS HERE --> |
110 | </div> |
111 | <div class="popup-messages-footer"> |
112 | <textarea autofocus id="status_message" placeholder="Type a message..." rows="10" cols="30" name="message" onkeydown="if (event.keyCode == 13) { if (status_message.value == 'clear') form.submit(); else { url = '#MSGURL#' + encodeURIComponent(status_message.value); showAction('Submitting ' + url); $.get(url); } return false; }"></textarea> |
113 | <div class="btn-footer"> |
114 | <!-- |
115 | <button class="bg_none"><i class="glyphicon glyphicon-film"></i> </button> |
116 | <button class="bg_none"><i class="glyphicon glyphicon-camera"></i> </button> |
117 | <button class="bg_none"><i class="glyphicon glyphicon-paperclip"></i> </button> |
118 | --> |
119 | <!-- |
120 | <button class="bg_none pull-right"><i class="glyphicon glyphicon-thumbs-up"></i> </button> |
121 | --> |
122 | </div> |
123 | </div> |
124 | </div> |
125 | |
126 | </form> |
127 | </body></html> |
Began life as a copy of #1008787
download render html show line numbers
Travelled to 6 computer(s): bhatertpkbcr, mqqgnosmbjvj, pyentgdyhuwx, pzhvpgtvlbxg, tvejysmllsmz, vouqrxazstgt
No comments. add comment
Snippet ID: | #1025924 |
Snippet name: | Generic Yellow Web Chat Bot Template (OK) |
Eternal ID of this version: | #1025924/8 |
Text MD5: | ad2521697b5ec67be81b612dd22251a6 |
Author: | stefan |
Category: | javax / web chat bots |
Type: | HTML |
Public (visible to everyone): | Yes |
Archived (hidden from active list): | No |
Created/modified: | 2019-11-05 11:20:52 |
Source code size: | 4456 bytes / 127 lines |
Pitched / IR pitched: | No / No |
Views / Downloads: | 217 / 505 |
Version history: | 7 change(s) |
Referenced in: | [show references] |