Script 'mail_helper' called by obssrc Hello community, here is the log from the commit of package spice-html5 for openSUSE:Factory checked in at 2022-12-06 14:23:49 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ Comparing /work/SRC/openSUSE:Factory/spice-html5 (Old) and /work/SRC/openSUSE:Factory/.spice-html5.new.1835 (New) ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
Package is "spice-html5" Tue Dec 6 14:23:49 2022 rev:3 rq:1040456 version:0.3.0 Changes: -------- --- /work/SRC/openSUSE:Factory/spice-html5/spice-html5.changes 2020-03-11 18:51:43.667577804 +0100 +++ /work/SRC/openSUSE:Factory/.spice-html5.new.1835/spice-html5.changes 2022-12-06 14:24:07.234008012 +0100 @@ -1,0 +2,9 @@ +Mon Dec 5 22:05:58 UTC 2022 - Dirk Müller <[email protected]> + +- update to 0.3.0: + * A new visual layout by Jonathan Race + * More visible support for ctrl-alt-delete + * Tuning of behavior of streaming videos + * A fix for an unresponsive GDM + +------------------------------------------------------------------- Old: ---- spice-html5-spice-html5-0.2.2.tar.gz New: ---- spice-html5-spice-html5-0.3.0.tar.gz ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ Other differences: ------------------ ++++++ spice-html5.spec ++++++ --- /var/tmp/diff_new_pack.IDuO9L/_old 2022-12-06 14:24:08.774021142 +0100 +++ /var/tmp/diff_new_pack.IDuO9L/_new 2022-12-06 14:24:08.782021211 +0100 @@ -1,7 +1,7 @@ # # spec file for package spice-html5 # -# Copyright (c) 2020 SUSE LLC +# Copyright (c) 2022 SUSE LLC # # All modifications and additions to the file contributed by third parties # remain the property of their copyright owners, unless otherwise agreed @@ -17,16 +17,14 @@ Name: spice-html5 -Version: 0.2.2 +Version: 0.3.0 Release: 0 Summary: Pure Javascript SPICE client License: LGPL-3.0-only Group: Productivity/Other - URL: https://www.spice-space.org Source0: https://gitlab.freedesktop.org/spice/%{name}/-/archive/%{name}-%{version}/%{name}-%{name}-%{version}.tar.gz BuildArch: noarch -BuildRoot: %{_tmppath}/%{name}-%{version}-build %description %{name} is a Javascript SPICE client. This includes a simple HTML ++++++ spice-html5-spice-html5-0.2.2.tar.gz -> spice-html5-spice-html5-0.3.0.tar.gz ++++++ diff -urN '--exclude=CVS' '--exclude=.cvsignore' '--exclude=.svn' '--exclude=.svnignore' old/spice-html5-spice-html5-0.2.2/spice.css new/spice-html5-spice-html5-0.3.0/spice.css --- old/spice-html5-spice-html5-0.2.2/spice.css 2019-08-06 13:45:18.000000000 +0200 +++ new/spice-html5-spice-html5-0.3.0/spice.css 2020-09-04 21:37:00.000000000 +0200 @@ -1,110 +1,160 @@ body { - background-color: #999999; - color: #000000; margin: 0; padding: 0; - font-family: "Lucida Grande", "Lucida Sans Unicode", "Helvetica Neue", Helvetica, Arial, Verdana, sans-serif; - font-size: 12pt; - line-height: 1.5em; + background-color: #999999; + color: #000000; + margin: 0; + padding: 0; + font-family: "Lucida Grande", "Lucida Sans Unicode", "Helvetica Neue", Helvetica, Arial, Verdana, sans-serif; + font-size: 12pt; + line-height: 1.5em; } * { margin: 0; } -#login +button { - width: 95%; - margin-left: auto; - margin-right: auto; - border: 1px solid #999999; + cursor: pointer; + color: #000000; + background-color: #999999; + border: 1px solid #4a4a4a; + min-width: 150px; + border-radius: 10px; background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#24414e)); - background: -moz-linear-gradient(top, #fff, #24414e); + background: -moz-linear-gradient(top, #fff, #24414e); + -ms-transform: translate(15%, -8%); + transform: translate(15%, -8%); + font-size: .90em; + font-weight: bolder; + padding: 0px 0px 3px 0px; + margin-top: 5px; +} +button:focus +{ + outline: none; +} +button:hover +{ + background-color: #24414e +} +button:active +{ background-color: #24414e; - -moz-border-radius: 10px; - -webkit-border-radius: 10px; - border-radius: 10px; + transform: translate(14.85%, -7%); } -#login span.logo + +.SidenavClosed { - display: inline-block; - margin-right: 5px; - padding: 2px 10px 2px 20px; - border-right: 1px solid #999999; - font-size: 20px; - font-weight: bolder; - text-shadow: #efefef 1px 1px 0px; + height: 100%; + width: 0; + position: fixed; + z-index: 1; + top: 0; + left: 0; + background-color: #bbbbbb; + box-shadow: 1px 0px #00000040; + overflow-x: hidden; + transition: 0.5s; + padding-top: 60px; } -#login label { color: #ffffff; text-shadow: 1px 1px 0px rgba(175, 210, 220, 0.8); } -#login input +.SidenavOpen { - padding: 5px; + height: 100%; + width: 200px !important; + position: fixed; + z-index: 1; + top: 0; + left: 0; + background-color: #bbbbbb; + box-shadow: 1px 0px #00000040; + overflow-x: hidden; + transition: 0.5s; + padding-top: 60px; +} +#Sidenav label +{ + color: #000000; + margin-left: 3%; + text-shadow: 1px 1px 0px rgba(175, 210, 220, 0.8); + position: absolute; + font-size: .9em; +} +#Sidenav input +{ + padding: 3px; + background-color: #fAfAfA; border: 1px inset #999999; outline: none; + float: right; + margin-right: 3%; -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; + position: relative; + max-width: 110px; } -#login input#host { width: 200px; } -#login input#port { width: 75px; } -#login input#password { width: 100px; } -#login button -{ - padding: 5px 10px 5px 10px; - margin-left: 5px; - text-shadow: #efefef 1px 1px 0px; - border: 1px outset #999999; +#Sidenav .closebtn +{ + position: absolute; + top: 10px; + right: 10px; + font-size: 25px; + margin-left: 50px; cursor: pointer; - -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; + color: #000000; +} + +canvas +{ + border: 1px solid #000000; } -#login button:hover + +#login { - background-color: #666666; - color: #ffffff; + background: #bbbbbb; + z-index: 1; + padding-top: 2px; + border-bottom: 2px solid #00000040; +} +#login p +{ + margin-left: 27%; + display: inline; + font-size: large; } #spice-area { height: 100%; - width: 95%; - padding: 0; + width: 100%; margin-left: auto; margin-right: auto; - border: solid #222222 1px; - -webkit-box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.2); - -moz-box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.2); - box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.2); - -moz-border-radius: 10px; - -webkit-border-radius: 10px; - border-radius: 10px; } .spice-screen { min-height: 600px; height: 100%; - margin: 10px; + text-align: center; padding: 0; - background-color: #333333; + background-color: #999999; } -.spice-message { - width: 700px; - height: 50px; +.spice-message +{ + width: 90%; + height: 40%; overflow: auto; - margin-top: 5px; margin-left: auto; margin-right: auto; padding: 10px; - background-color: #efefef; - border: solid #c3c3c3 2px; font-size: 8pt; line-height: 1.1em; font-family: 'Andale Mono', monospace; - -moz-border-radius: 10px; - -webkit-border-radius: 10px; - border-radius: 10px; - -webkit-box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.2); - -moz-box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.2); - box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.2); - /* We default the message box to hidden. */ - display: none; + background-color: #fAfAfA; + border: 1px inset #999999; + border-radius: 3px; + box-sizing: border-box; + -moz-box-sizing: border-box; + -webkit-box-sizing: border-box; } .spice-message p { margin-bottom: 0em; @@ -115,4 +165,4 @@ } .spice-message-error { color: red; -} +} \ No newline at end of file diff -urN '--exclude=CVS' '--exclude=.cvsignore' '--exclude=.svn' '--exclude=.svnignore' old/spice-html5-spice-html5-0.2.2/spice.html new/spice-html5-spice-html5-0.3.0/spice.html --- old/spice-html5-spice-html5-0.2.2/spice.html 2019-08-06 13:45:18.000000000 +0200 +++ new/spice-html5-spice-html5-0.3.0/spice.html 2020-09-04 21:37:00.000000000 +0200 @@ -75,7 +75,7 @@ uri = scheme + host + ":" + port; - document.getElementById('connectButton').innerHTML = "Stop"; + document.getElementById('connectButton').innerHTML = "Stop Connection"; document.getElementById('connectButton').onclick = disconnect; try @@ -97,7 +97,7 @@ if (sc) { sc.stop(); } - document.getElementById('connectButton').innerHTML = "Start"; + document.getElementById('connectButton').innerHTML = "Start Connection"; document.getElementById('connectButton').onclick = connect; if (window.File && window.FileReader && window.FileList && window.Blob) { @@ -131,26 +131,6 @@ console.log("File API is not supported"); } } - - function toggle_console() - { - var checkbox = document.getElementById('show_console'); - var m = document.getElementById('message-div'); - - if (checkbox.checked) - { - m.style.display = 'block'; - } - else - { - m.style.display = 'none'; - } - - window.addEventListener('resize', SpiceHtml5.handle_resize); - if (sc) { - SpiceHtml5.resize_helper(sc); - } - } /* SPICE port event listeners window.addEventListener('spice-port-data', function(event) { // Here we convert data to text, but really we can obtain binary data also @@ -164,7 +144,7 @@ */ document.getElementById('connectButton').onclick = connect; - document.getElementById('show_console').onchange = toggle_console; + document.getElementById('sendCtrlAltDel').addEventListener('click', function(){ SpiceHtml5.sendCtrlAltDel(sc); }); </script> </head> @@ -172,23 +152,56 @@ <body> <div id="login"> - <span class="logo">SPICE</span> - <label for="host">Host:</label> <input type='text' id='host' value='localhost'> <!-- localhost --> - <label for="port">Port:</label> <input type='text' id='port' value='5959'> - <label for="password">Password:</label> <input type='password' id='password' value=''> - <label for="show_console">Show console </label><input type="checkbox" id="show_console" value="1"> - <button id="connectButton">Start</button> + <button onclick="open_nav()">☰ SPICE</button> + <p id="hostname">Host Console</p> + </div> + + <div id="Sidenav" class="SidenavClosed" style="width: 0;"> + <p class="closebtn" onclick="close_nav()">✖</p> + <label for="host">Host:</label> <input type='text' id='host' value='localhost'> <!-- localhost --><br> + <label for="port">Port:</label> <input type='text' id='port' value='5959'><br> + <label for="password">Password:</label> <input type='password' id='password' value=''><br> + <button id="connectButton">Start Connection</button><br> + <button id="sendCtrlAltDel">Send Ctrl-Alt-Delete</button> + <button id="debugLogs">Toggle Debug Logs</button> + <div id="message-div" class="spice-message" style="display: none;"></div> + + <div id="debug-div"> + <!-- If DUMPXXX is turned on, dumped images will go here --> + </div> </div> <div id="spice-area"> <div id="spice-screen" class="spice-screen"></div> </div> - <div id="message-div" class="spice-message"></div> + <script> + function show_debug_Logs() { + var content = document.getElementById('message-div') + if (content.style.display === 'block') { + content.style.display = 'none'; + } else { + content.style.display = 'block'; + } + } - <div id="debug-div"> - <!-- If DUMPXXX is turned on, dumped images will go here --> - </div> + function display_hostname() { + var title = new URLSearchParams(window.location.search); + name = title.getAll('title'); + name = name.split('(')[0]; + document.getElementById('hostname').innerHTML = (name); + } + + function open_nav() { + document.getElementById('Sidenav').className = 'SidenavOpen'; + } + function close_nav() { + document.getElementById('Sidenav').className = 'SidenavClosed'; + } + + document.getElementById('debugLogs').addEventListener('click', function() { show_debug_Logs(); }); + display_hostname() + </script> </body> </html> diff -urN '--exclude=CVS' '--exclude=.cvsignore' '--exclude=.svn' '--exclude=.svnignore' old/spice-html5-spice-html5-0.2.2/spice_auto.html new/spice-html5-spice-html5-0.3.0/spice_auto.html --- old/spice-html5-spice-html5-0.2.2/spice_auto.html 2019-08-06 13:45:18.000000000 +0200 +++ new/spice-html5-spice-html5-0.3.0/spice_auto.html 2020-09-04 21:37:00.000000000 +0200 @@ -191,6 +191,7 @@ */ connect(undefined); + document.getElementById('sendCtrlAltDel').addEventListener('click', function(){ SpiceHtml5.sendCtrlAltDel(sc); }); </script> </head> @@ -198,18 +199,52 @@ <body> <div id="login"> - <span class="logo">SPICE</span> + <button onclick="open_nav()">☰ SPICE</button> + <p id="hostname">Host Console</p> + </div> + + <div id="Sidenav" class="SidenavClosed" style="width: 0;"> + <p class="closebtn" onclick="close_nav()">✖</p> + <button id="sendCtrlAltDel">Send Ctrl-Alt-Delete</button> + <button id="debugLogs">Toggle Debug Logs</button> + <div id="message-div" class="spice-message" style="display: none;"></div> + + <div id="debug-div"> + <!-- If DUMPXXX is turned on, dumped images will go here --> + </div> </div> <div id="spice-area"> <div id="spice-screen" class="spice-screen"></div> </div> - <div id="message-div" class="spice-message"></div> - - <div id="debug-div"> - <!-- If DUMPXXX is turned on, dumped images will go here --> - </div> + <script> + function show_debug_Logs() { + var content = document.getElementById('message-div') + if (content.style.display === 'block') { + content.style.display = 'none'; + } else { + content.style.display = 'block'; + } + } + + function display_hostname() { + var title = new URLSearchParams(window.location.search); + name = title.getAll('title'); + name = name.split('(')[0]; + document.getElementById('hostname').innerHTML = (name); + } + + function open_nav() { + document.getElementById('Sidenav').className = 'SidenavOpen'; + } + + function close_nav() { + document.getElementById('Sidenav').className = 'SidenavClosed'; + } + document.getElementById('debugLogs').addEventListener('click', function() { show_debug_Logs(); }); + display_hostname() + </script> </body> -</html> +</html> \ No newline at end of file diff -urN '--exclude=CVS' '--exclude=.cvsignore' '--exclude=.svn' '--exclude=.svnignore' old/spice-html5-spice-html5-0.2.2/src/cursor.js new/spice-html5-spice-html5-0.3.0/src/cursor.js --- old/spice-html5-spice-html5-0.2.2/src/cursor.js 2019-08-06 13:45:18.000000000 +0200 +++ new/spice-html5-spice-html5-0.3.0/src/cursor.js 2020-09-04 21:37:00.000000000 +0200 @@ -126,7 +126,7 @@ SpiceCursorConn.prototype.set_cursor = function(cursor) { - var pngstr = create_rgba_png(cursor.header.height, cursor.header.width, cursor.data); + var pngstr = create_rgba_png(cursor.header.width, cursor.header.height, cursor.data); var curstr = 'url(data:image/png,' + pngstr + ') ' + cursor.header.hot_spot_x + ' ' + cursor.header.hot_spot_y + ", default"; var screen = document.getElementById(this.parent.screen_id); diff -urN '--exclude=CVS' '--exclude=.cvsignore' '--exclude=.svn' '--exclude=.svnignore' old/spice-html5-spice-html5-0.2.2/src/display.js new/spice-html5-spice-html5-0.3.0/src/display.js --- old/spice-html5-spice-html5-0.2.2/src/display.js 2019-08-06 13:45:18.000000000 +0200 +++ new/spice-html5-spice-html5-0.3.0/src/display.js 2020-09-04 21:37:00.000000000 +0200 @@ -559,6 +559,7 @@ var v = document.createElement("video"); v.src = window.URL.createObjectURL(media); + v.setAttribute('muted', true); v.setAttribute('autoplay', true); v.setAttribute('width', m.stream_width); v.setAttribute('height', m.stream_height); @@ -571,7 +572,7 @@ top += this.surfaces[m.surface_id].canvas.offsetTop; } document.getElementById(this.parent.screen_id).appendChild(v); - v.setAttribute('style', "position: absolute; top:" + top + "px; left:" + left + "px;"); + v.setAttribute('style', "pointer-events:none; position: absolute; top:" + top + "px; left:" + left + "px;"); media.addEventListener('sourceopen', handle_video_source_open, false); media.addEventListener('sourceended', handle_video_source_ended, false); @@ -899,7 +900,7 @@ var temp_canvas = null; var context; - if (this.o.sc.streams[this.o.id]) + if ("streams" in this.o.sc && this.o.sc.streams[this.o.id]) this.o.sc.streams[this.o.id].frames_loading--; /*------------------------------------------------------------ @@ -1146,6 +1147,10 @@ stream.video.currentTime = stream.video.buffered.start(stream.video.buffered.length - 1); } + /* Modern browsers try not to auto play video. */ + if (this.stream.video.paused && this.stream.video.readyState >= 2) + var promise = this.stream.video.play(); + if (Utils.STREAM_DEBUG > 1) console.log(stream.video.currentTime + ":id " + stream.id + " updateend " + Utils.dump_media_element(stream.video)); } diff -urN '--exclude=CVS' '--exclude=.cvsignore' '--exclude=.svn' '--exclude=.svnignore' old/spice-html5-spice-html5-0.2.2/src/inputs.js new/spice-html5-spice-html5-0.3.0/src/inputs.js --- old/spice-html5-spice-html5-0.2.2/src/inputs.js 2019-08-06 13:45:18.000000000 +0200 +++ new/spice-html5-spice-html5-0.3.0/src/inputs.js 2020-09-04 21:37:00.000000000 +0200 @@ -190,7 +190,7 @@ e.preventDefault(); } -function sendCtrlAltDel() +function sendCtrlAltDel(sc) { if (sc && sc.inputs && sc.inputs.state === "ready"){ var key = new Messages.SpiceMsgcKeyDown(); diff -urN '--exclude=CVS' '--exclude=.cvsignore' '--exclude=.svn' '--exclude=.svnignore' old/spice-html5-spice-html5-0.2.2/src/port.js new/spice-html5-spice-html5-0.3.0/src/port.js --- old/spice-html5-spice-html5-0.2.2/src/port.js 2019-08-06 13:45:18.000000000 +0200 +++ new/spice-html5-spice-html5-0.3.0/src/port.js 2020-09-04 21:37:00.000000000 +0200 @@ -20,7 +20,7 @@ */ import { Constants } from './enums.js'; -import { DEBUG } from './utils.js'; +import { DEBUG, arraybuffer_to_str } from './utils.js'; import { SpiceConn } from './spiceconn.js'; import { SpiceMsgPortInit } from './spicemsg.js'; diff -urN '--exclude=CVS' '--exclude=.cvsignore' '--exclude=.svn' '--exclude=.svnignore' old/spice-html5-spice-html5-0.2.2/src/webm.js new/spice-html5-spice-html5-0.3.0/src/webm.js --- old/spice-html5-spice-html5-0.2.2/src/webm.js 2019-08-06 13:45:18.000000000 +0200 +++ new/spice-html5-spice-html5-0.3.0/src/webm.js 2020-09-04 21:37:00.000000000 +0200 @@ -62,6 +62,7 @@ var WEBM_CODEC_ID = [ 0x86 ]; var WEBM_VIDEO = [ 0xE0 ] ; +var WEBM_FLAG_INTERLACED = [ 0x9A ] ; var WEBM_PIXEL_WIDTH = [ 0xB0 ] ; var WEBM_PIXEL_HEIGHT = [ 0xBA ] ; @@ -303,6 +304,7 @@ function webm_Video(width, height) { this.id = WEBM_VIDEO; + this.flag_interlaced = 0; this.width = width; this.height = height; } @@ -315,6 +317,7 @@ var dv = new DataView(a); at = EBML_write_array(this.id, dv, at); at = EBML_write_u64_data_len(this.buffer_size() - 8 - this.id.length, dv, at); + at = EBML_write_u8_value(WEBM_FLAG_INTERLACED, this.flag_interlaced, dv, at); at = EBML_write_u16_value(WEBM_PIXEL_WIDTH, this.width, dv, at) at = EBML_write_u16_value(WEBM_PIXEL_HEIGHT, this.height, dv, at) return at; @@ -322,6 +325,7 @@ buffer_size: function() { return this.id.length + 8 + + WEBM_FLAG_INTERLACED.length + 1 + 1 + WEBM_PIXEL_WIDTH.length + 1 + 2 + WEBM_PIXEL_HEIGHT.length + 1 + 2; }, @@ -397,7 +401,7 @@ { this.id = WEBM_TRACK_ENTRY; this.number = 1; - this.uid = 1; + this.uid = 2; // Arbitrary id; most likely makes no difference this.type = 2; // Audio this.flag_enabled = 1; this.flag_default = 1; @@ -471,20 +475,30 @@ function webm_VideoTrackEntry(width, height) { + /* + ** In general, we follow specifications found by looking here: + ** https://www.webmproject.org/docs/container/ + ** which points here: + ** https://www.matroska.org/technical/specs/index.html + ** and here: + ** https://datatracker.ietf.org/doc/draft-ietf-cellar-matroska/ + ** Our goal is to supply mandatory values, and note where we differ + ** from the default. + */ this.id = WEBM_TRACK_ENTRY; this.number = 1; this.uid = 1; this.type = 1; // Video this.flag_enabled = 1; this.flag_default = 1; - this.flag_forced = 1; - this.flag_lacing = 0; - this.min_cache = 0; // fixme - check + this.flag_forced = 1; // Different than default; we wish to force + this.flag_lacing = 1; + this.min_cache = 0; this.max_block_addition_id = 0; - this.codec_decode_all = 0; // fixme - check - this.seek_pre_roll = 0; // 80000000; // fixme - check - this.codec_delay = 80000000; // Must match codec_private.preskip this.codec_id = "V_VP8"; + this.codec_decode_all = 1; + this.seek_pre_roll = 0; + this.video = new webm_Video(width, height); } @@ -506,7 +520,6 @@ at = EBML_write_u8_value(WEBM_MIN_CACHE, this.min_cache, dv, at); at = EBML_write_u8_value(WEBM_MAX_BLOCK_ADDITION_ID, this.max_block_addition_id, dv, at); at = EBML_write_u8_value(WEBM_CODEC_DECODE_ALL, this.codec_decode_all, dv, at); - at = EBML_write_u32_value(WEBM_CODEC_DELAY, this.codec_delay, dv, at); at = EBML_write_u32_value(WEBM_SEEK_PRE_ROLL, this.seek_pre_roll, dv, at); at = EBML_write_u8_value(WEBM_TRACK_TYPE, this.type, dv, at); at = this.video.to_buffer(a, at); @@ -525,7 +538,6 @@ WEBM_MIN_CACHE.length + 1 + 1 + WEBM_MAX_BLOCK_ADDITION_ID.length + 1 + 1 + WEBM_CODEC_DECODE_ALL.length + 1 + 1 + - WEBM_CODEC_DELAY.length + 1 + 4 + WEBM_SEEK_PRE_ROLL.length + 1 + 4 + WEBM_TRACK_TYPE.length + 1 + 1 + this.video.buffer_size();
