deblan
/
remote-i3wm-ws
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Desktop pane: screenshot and live

This commit is contained in:
Simon Vieille 2018-02-09 16:10:10 +01:00
parent 4aa61beefb
commit c6514a0124
No known key found for this signature in database
GPG Key ID: 919533E2B946EA10
4 changed files with 69 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
client/assets/css/main.css
View File

@ -11,6 +11,10 @@ a {
background: #1e3650;
}
.nav-link {
font-size: 10px;
}
.legend {
color: #777;
margin: 3px 0;
@ -111,3 +115,8 @@ a {
padding: 5px;
display: none;
}
#screenshot img {
max-width: 100%;
margin-top: 10px;
}

30
client/assets/js/main.js
View File

@ -1,7 +1,8 @@
var ws;
var $pointer, $scroller, $response;
var $pointer, $scroller, $response, $screenshotImg;
var scrollLastTimestamp, scrollLastValue;
var mousePosX, mousePosY, mouseInitPosX, mouseInitPosY;
var isLive = false;
var createWebSocketConnection = function() {
ws = new WebSocket('ws://' + window.location.hostname + ':14598');
@ -26,6 +27,8 @@ var createWebSocketConnection = function() {
window.setTimeout(function() {
$response.fadeOut();
}, 2500);
} else if (data.type === 'screenshot') {
$screenshotImg.attr('src', 'data:image/png;base64, ' + data.value);
}
}
}
@ -180,6 +183,28 @@ var pointerTouchMoveHandler = function(e) {
ws.send(msg);
}
var liveClickHandler = function(e) {
if (isLive) {
isLive = false;
$(this).text('Live');
return;
}
isLive = true;
$(this).text('Stop live');
var doScreenshot = function() {
if (isLive) {
ws.send('{"type":"screenshot"}');
window.setTimeout(doScreenshot, 300);
}
}
doScreenshot();
}
var documentHashHandler = function() {
var hash = window.location.hash;
@ -213,6 +238,8 @@ var addListeners = function() {
.on('click', pointerClickHandler)
.on('touchstart', pointerTouchStartHandler)
.on('touchmove', pointerTouchMoveHandler);
$('#live').click(liveClickHandler);
}
var bootstrap = function() {
@ -226,6 +253,7 @@ $(function() {
$pointer = $('#pointer');
$scroller = $('#scrollbar');
$response = $('#response');
$screenshotImg = $('#screenshot img');
bootstrap();
});

15
client/index.html
View File

@ -25,6 +25,9 @@
<li class="nav-item">
<a class="nav-link no-radius" href="#pane-media">MEDIA</a>
</li>
<li class="nav-item">
<a class="nav-link no-radius" href="#pane-desktop">DESKTOP</a>
</li>
</ul>
</div>
</div>
@ -191,6 +194,18 @@
<button type="button" data-msg='{"type":"volume","value":"up"}' class="btn btn-secondary">+</button>
</div>
</div>
<div class="row pane" id="pane-desktop">
<div class="col-12">
<p class="legend">Desktop</p>
</div>
<div class="col-12">
<button type="button" data-msg='{"type":"screenshot"}' class="btn btn-secondary">Screenshot</button>
<button type="button" id="live" class="btn btn-secondary">Live</button>
<div id="screenshot"><img src="data:image/png; base64, iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAIAAACQd1PeAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAB3RJTUUH4gIJDjc3srQk8gAAAB1pVFh0Q29tbWVudAAAAAAAQ3JlYXRlZCB3aXRoIEdJTVBkLmUHAAAADElEQVQI12P48+cPAAXsAvVTWDc6AAAAAElFTkSuQmCC"></div>
</div>
<div class="col-12">
</div>
</div>
</div>
<div id="disconneced">

16
server/server
View File

@ -168,6 +168,22 @@ $server->addMessageHandler('text', function (ConnectionInterface $from, array $d
}
});
$server->addMessageHandler('screenshot', function (ConnectionInterface $from, array $data) use ($shell, $messageOutput) {
$tmpFilename = sprintf('%s.jpg', tempnam('/tmp', 'remote_i3wm_ws'));
$shell->exec('import -window root -quality 10 -display :0 %s', $tmpFilename);
if (file_exists($tmpFilename)) {
$base64 = base64_encode(file_get_contents($tmpFilename));
$from->send(json_encode([
'type' => 'screenshot',
'value' => $base64,
]));
unlink($tmpFilename);
}
});
$server->addMessageHandler('messages', function (ConnectionInterface $from, array $data) use ($server) {
$value = $data['value'] ?? [];