Skip to content

Commit 9e34d96

Browse files
committedMar 19, 2018
add clipboard tooltips and balloon.css
1 parent 5ef604c commit 9e34d96

File tree

5 files changed

+78
-2
lines changed

5 files changed

+78
-2
lines changed
 

‎LICENSE-balloon-css

+21
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
The MIT License (MIT)
2+
3+
Copyright (c) 2016 Claudio Holanda
4+
5+
Permission is hereby granted, free of charge, to any person obtaining a copy
6+
of this software and associated documentation files (the "Software"), to deal
7+
in the Software without restriction, including without limitation the rights
8+
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9+
copies of the Software, and to permit persons to whom the Software is
10+
furnished to do so, subject to the following conditions:
11+
12+
The above copyright notice and this permission notice shall be included in all
13+
copies or substantial portions of the Software.
14+
15+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16+
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17+
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18+
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19+
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20+
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21+
SOFTWARE.

‎README.md

+4
Original file line numberDiff line numberDiff line change
@@ -515,6 +515,10 @@ This project includes a copy of Pixabay's "JavaScript-autoComplete" library
515515
is licensed under an MIT-style license. The license is available
516516
as LICENSE-autocomplete-js.
517517

518+
This project includes a copy of balloon.css (`static/css/balloon.css`),
519+
which is licensed under an MIT-style license. The balloon.css licence is
520+
available as LICENSE-balloon-css.
521+
518522
This project includes a copy of zenscroll (`static/js/zenscroll-min.js`), which
519523
is public-domain code. The license for zenscroll is availble as LICENSE-zenscroll.
520524

‎lib/multistreamer/views/layout.etlua

+1
Original file line numberDiff line numberDiff line change
@@ -7,6 +7,7 @@
77
<link rel="stylesheet" href="<%= url_for("site-root") %>static/css/pure-min.css">
88
<link rel="stylesheet" href="<%= url_for("site-root") %>static/css/multistreamer.css">
99
<link rel="stylesheet" href="<%= url_for("site-root") %>static/css/auto-complete.css">
10+
<link rel="stylesheet" href="<%= url_for("site-root") %>static/css/balloon.min.css">
1011
</head>
1112
<body>
1213
<div class="pure-g header">

‎lib/multistreamer/views/stream-dashboard.etlua

+51-2
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,62 @@
11
<script src="<%= url_for('site-root') %>static/js/hls.min.js"></script>
22
<script src="<%= url_for('site-root') %>static/js/auto-complete.min.js"></script>
33
<script src="<%= url_for('site-root') %>static/js/util.js"></script>
4+
<script src="<%= url_for('site-root') %>static/js/clipboard.min.js"></script>
5+
46
<h3><%= stream.name %></h3>
57

68
<% render('multistreamer.views.stream-menu', { active_submenu = 'dashboard' }) %>
79

810
<% if metadata_level == 2 then %>
9-
<p><strong>RTMP URL</strong> <code><%= public_rtmp_url %>/<%= rtmp_prefix %></code></p>
10-
<p><strong>Stream Key</strong> <button id="showBtn" type="button" class="pure-button">Show</button> <code id="stream-key"><%= stream.uuid %></code></p>
11+
<div class="pure-form-aligned">
12+
13+
<div class="pure-control-group">
14+
<label for="rtmp_url">RTMP URL</label>
15+
<button id="copyRTMPBtn" type="button" class="pure-button" data-clipboard-text="<%= public_rtmp_url %>">Copy</button>
16+
<input type="text" id="rtmp_url" name="rtmp_url" value="<%= public_rtmp_url %>" readonly />
17+
</div>
18+
19+
<div class="pure-control-group">
20+
<label for="stream_key">Stream Key</label>
21+
<button id="copyKeyBtn" type="button" class="pure-button" data-clipboard-text="<%= stream.uuid %>">Copy</button>
22+
<button id="showBtn" type="button" class="pure-button">Show</button>
23+
<input type="text" id="stream-key" value="<%= stream.uuid %>" readonly />
24+
</div>
25+
26+
<script>
27+
var copyRTMPBtn = document.getElementById('copyRTMPBtn');
28+
var copyKeyBtn = document.getElementById('copyKeyBtn');
29+
var copyRTMPClip = new ClipboardJS(copyRTMPBtn);
30+
var copyKeyClip = new ClipboardJS(copyKeyBtn);
31+
32+
copyRTMPClip.on('success',function(e) {
33+
copyRTMPBtn.setAttribute('data-balloon','Copied!');
34+
copyRTMPBtn.setAttribute('data-balloon-pos','up');
35+
copyRTMPBtn.setAttribute('data-ballon-visible',true);
36+
});
37+
38+
copyRTMPBtn.addEventListener('mouseleave',function() {
39+
copyRTMPBtn.removeAttribute('data-balloon');
40+
copyRTMPBtn.removeAttribute('data-balloon-pos');
41+
copyRTMPBtn.removeAttribute('data-ballon-visible');
42+
});
43+
44+
45+
copyKeyClip.on('success',function(e) {
46+
copyKeyBtn.setAttribute('data-balloon','Copied!');
47+
copyKeyBtn.setAttribute('data-balloon-pos','up');
48+
copyKeyBtn.setAttribute('data-ballon-visible',true);
49+
});
50+
51+
copyKeyBtn.addEventListener('mouseleave',function() {
52+
copyKeyBtn.removeAttribute('data-balloon');
53+
copyKeyBtn.removeAttribute('data-balloon-pos');
54+
copyKeyBtn.removeAttribute('data-ballon-visible');
55+
});
56+
57+
</script>
58+
59+
</div>
1160
<% end %>
1261
<% if metadata_level == 2 or chat_level > 0 then %>
1362
<p><a target="_blank" href="<%= url_for('stream-chat', { id = stream.id })%>?show_picture">Chat</a></p>

‎share/multistreamer/html/static/css/balloon.min.css

+1
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

0 commit comments

Comments
 (0)
Please sign in to comment.