From ab9708eb3c64d52bc73287c37491b3855abced2c Mon Sep 17 00:00:00 2001 From: David Himmelstrup Date: Sun, 8 Sep 2019 16:17:39 +0800 Subject: [PATCH] Don't restart animations when all frames are rendered. --- reanimate.cabal | 2 +- viewer/build/asset-manifest.json | 6 +++--- viewer/build/index.html | 2 +- ...precache-manifest.2267f062fb7f449c2505790eb4da5a8a.js} | 8 ++++---- viewer/build/service-worker.js | 2 +- viewer/build/static/js/main.2d848b69.chunk.js | 2 -- viewer/build/static/js/main.2d848b69.chunk.js.map | 1 - viewer/build/static/js/main.c36ecb4a.chunk.js | 2 ++ viewer/build/static/js/main.c36ecb4a.chunk.js.map | 1 + viewer/src/App.jsx | 2 +- 10 files changed, 14 insertions(+), 14 deletions(-) rename viewer/build/{precache-manifest.ecac8766a6ef020d2fc520bbf4682e03.js => precache-manifest.2267f062fb7f449c2505790eb4da5a8a.js} (63%) delete mode 100644 viewer/build/static/js/main.2d848b69.chunk.js delete mode 100644 viewer/build/static/js/main.2d848b69.chunk.js.map create mode 100644 viewer/build/static/js/main.c36ecb4a.chunk.js create mode 100644 viewer/build/static/js/main.c36ecb4a.chunk.js.map diff --git a/reanimate.cabal b/reanimate.cabal index f09c4c2..4a7f883 100644 --- a/reanimate.cabal +++ b/reanimate.cabal @@ -24,7 +24,7 @@ description: data-files: viewer/build/*.js viewer/build/*.html viewer/build/static/js/2.772a56e7.chunk.js - viewer/build/static/js/main.2d848b69.chunk.js + viewer/build/static/js/main.c36ecb4a.chunk.js viewer/build/static/js/runtime~main.9eb600ee.js viewer/build/static/css/main.f7ad3e9b.chunk.css data/CIExyz.csv diff --git a/viewer/build/asset-manifest.json b/viewer/build/asset-manifest.json index 011e920..46609f2 100644 --- a/viewer/build/asset-manifest.json +++ b/viewer/build/asset-manifest.json @@ -1,13 +1,13 @@ { "main.css": "./static/css/main.f7ad3e9b.chunk.css", - "main.js": "./static/js/main.2d848b69.chunk.js", - "main.js.map": "./static/js/main.2d848b69.chunk.js.map", + "main.js": "./static/js/main.c36ecb4a.chunk.js", + "main.js.map": "./static/js/main.c36ecb4a.chunk.js.map", "runtime~main.js": "./static/js/runtime~main.9eb600ee.js", "runtime~main.js.map": "./static/js/runtime~main.9eb600ee.js.map", "static/js/2.772a56e7.chunk.js": "./static/js/2.772a56e7.chunk.js", "static/js/2.772a56e7.chunk.js.map": "./static/js/2.772a56e7.chunk.js.map", "index.html": "./index.html", - "precache-manifest.ecac8766a6ef020d2fc520bbf4682e03.js": "./precache-manifest.ecac8766a6ef020d2fc520bbf4682e03.js", + "precache-manifest.2267f062fb7f449c2505790eb4da5a8a.js": "./precache-manifest.2267f062fb7f449c2505790eb4da5a8a.js", "service-worker.js": "./service-worker.js", "static/css/main.f7ad3e9b.chunk.css.map": "./static/css/main.f7ad3e9b.chunk.css.map" } \ No newline at end of file diff --git a/viewer/build/index.html b/viewer/build/index.html index 788d452..34b5d20 100644 --- a/viewer/build/index.html +++ b/viewer/build/index.html @@ -1 +1 @@ -Reanimate Playground
\ No newline at end of file +Reanimate Playground
\ No newline at end of file diff --git a/viewer/build/precache-manifest.ecac8766a6ef020d2fc520bbf4682e03.js b/viewer/build/precache-manifest.2267f062fb7f449c2505790eb4da5a8a.js similarity index 63% rename from viewer/build/precache-manifest.ecac8766a6ef020d2fc520bbf4682e03.js rename to viewer/build/precache-manifest.2267f062fb7f449c2505790eb4da5a8a.js index bab2ff5..5d1ed97 100644 --- a/viewer/build/precache-manifest.ecac8766a6ef020d2fc520bbf4682e03.js +++ b/viewer/build/precache-manifest.2267f062fb7f449c2505790eb4da5a8a.js @@ -4,19 +4,19 @@ self.__precacheManifest = [ "url": "./static/js/runtime~main.9eb600ee.js" }, { - "revision": "2d848b69f66deb18ce2a", - "url": "./static/js/main.2d848b69.chunk.js" + "revision": "c36ecb4adbf262048a84", + "url": "./static/js/main.c36ecb4a.chunk.js" }, { "revision": "772a56e764e5091f7538", "url": "./static/js/2.772a56e7.chunk.js" }, { - "revision": "2d848b69f66deb18ce2a", + "revision": "c36ecb4adbf262048a84", "url": "./static/css/main.f7ad3e9b.chunk.css" }, { - "revision": "c119ec4d7ef35b6c6c46fd0e9dcca5ce", + "revision": "430dab2dbf19c65bee33ef88f2b90bd1", "url": "./index.html" } ]; \ No newline at end of file diff --git a/viewer/build/service-worker.js b/viewer/build/service-worker.js index a3227ba..343fa6e 100644 --- a/viewer/build/service-worker.js +++ b/viewer/build/service-worker.js @@ -14,7 +14,7 @@ importScripts("https://storage.googleapis.com/workbox-cdn/releases/3.6.3/workbox-sw.js"); importScripts( - "./precache-manifest.ecac8766a6ef020d2fc520bbf4682e03.js" + "./precache-manifest.2267f062fb7f449c2505790eb4da5a8a.js" ); workbox.clientsClaim(); diff --git a/viewer/build/static/js/main.2d848b69.chunk.js b/viewer/build/static/js/main.2d848b69.chunk.js deleted file mode 100644 index 1b6a3d0..0000000 --- a/viewer/build/static/js/main.2d848b69.chunk.js +++ /dev/null @@ -1,2 +0,0 @@ -(window.webpackJsonp=window.webpackJsonp||[]).push([[0],{10:function(e,t,n){e.exports=n(18)},16:function(e,t,n){},17:function(e,t,n){},18:function(e,t,n){"use strict";n.r(t);var a=n(0),s=n.n(a),o=n(4),r=n.n(o),c=(n(16),n(2)),i=n(5),u=n(6),m=n(9),l=n(7),f=n(1),g=n(8),d=(n(17),function(e){function t(e){var n;Object(i.a)(this,t),(n=Object(m.a)(this,Object(l.a)(t).call(this,e))).connect=function(){var e=new WebSocket("ws://localhost:9161");e.onopen=function(t){n.setState(function(e){return Object(c.a)({},e,{message:"Connected."})}),e.send("60")},e.onclose=function(e){n.setState(function(e){return Object(c.a)({},e,{message:"Disconnected."})}),setTimeout(n.connect,1e3)},e.onmessage=function(e){if("Success!"===e.data)console.log("Success");else if("Compiling"===e.data)n.setState({message:"Compiling..."}),n.status="compiling",n.svgs=[],n.frame_count=0,n.next_frame=0;else if("Done"===e.data)n.setState({message:""}),console.log("Done"),n.start=Date.now();else if(e.data.startsWith("Error"))console.log("Error",e.data.substring(5)),n.setState({message:e.data.substring(5)});else{var t=parseInt(e.data);if(isNaN(t)){var a=document.createElement("div");a.innerHTML=e.data,n.svgs[n.next_frame]=a;var s=0;n.svgs.forEach(function(e){return s++}),console.log("Received",n.next_frame,n.frame_count,s)}else"compiling"===n.status?(n.setState({message:"Rendering..."}),n.frame_count=t,n.status="rendering",n.start=Date.now(),n.svgs=[],n.svgs[n.frame_count-1]=void 0):"rendering"===n.status?n.next_frame=t:console.log("Bad state change: received number")}},n.setState(function(t){return Object(c.a)({},t,{socket:e,message:"Connecting..."})})},n.onLoad=function(e){setTimeout(function(){e.resize()},0)},n.state={},setTimeout(n.connect,0),n.svgs=[],n.start=Date.now(),n.status="",n.frame_count=0,n.next_frame=0;var a=Object(f.a)(n);return requestAnimationFrame(function e(){var t=Date.now(),s=a.frame_count,o=a.frame_count/60,r=Math.round((t-n.start)/1e3*60)%s,c=0;if(n.svgs.forEach(function(e){return c++}),s){if(a.svgs[r]){for(n.setState({message:r+"/"+a.frame_count+" "+Math.round(c/o)+" fps"});a.svg.firstChild;)a.svg.removeChild(a.svg.firstChild);a.svg.appendChild(a.svgs[r])}}else a.svg.innerText="";requestAnimationFrame(e)}),n}return Object(g.a)(t,e),Object(u.a)(t,[{key:"render",value:function(){var e=this,t=this.state.message;return s.a.createElement("div",{className:"App"},s.a.createElement("div",{className:"viewer"},s.a.createElement("div",{ref:function(t){return e.svg=t}}),s.a.createElement("div",{className:"messages"},s.a.createElement("pre",null,t))))}}]),t}(a.Component));Boolean("localhost"===window.location.hostname||"[::1]"===window.location.hostname||window.location.hostname.match(/^127(?:\.(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)){3}$/));r.a.render(s.a.createElement(d,null),document.getElementById("root")),"serviceWorker"in navigator&&navigator.serviceWorker.ready.then(function(e){e.unregister()})}},[[10,1,2]]]); -//# sourceMappingURL=main.2d848b69.chunk.js.map \ No newline at end of file diff --git a/viewer/build/static/js/main.2d848b69.chunk.js.map b/viewer/build/static/js/main.2d848b69.chunk.js.map deleted file mode 100644 index c97ae31..0000000 --- a/viewer/build/static/js/main.2d848b69.chunk.js.map +++ /dev/null @@ -1 +0,0 @@ -{"version":3,"sources":["App.jsx","serviceWorker.js","index.js"],"names":["App","props","_this","Object","classCallCheck","this","possibleConstructorReturn","getPrototypeOf","call","connect","ws","WebSocket","onopen","event","setState","state","objectSpread","message","send","onclose","setTimeout","onmessage","data","console","log","status","svgs","frame_count","next_frame","start","Date","now","startsWith","substring","num","parseInt","isNaN","div","document","createElement","innerHTML","count","forEach","_","undefined","socket","onLoad","ace","resize","self","assertThisInitialized","requestAnimationFrame","animate","nFrames","aniDuration","thisFrame","Math","round","svg","firstChild","removeChild","appendChild","innerText","_this2","react_default","a","className","ref","node","Component","Boolean","window","location","hostname","match","ReactDOM","render","src_App_0","getElementById","navigator","serviceWorker","ready","then","registration","unregister"],"mappings":"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","file":"static/js/main.2d848b69.chunk.js","sourcesContent":["import React, {Component} from 'react';\nimport './App.css';\n\nclass App extends Component {\n connect = () => {\n // const ws = new WebSocket(\"wss://reanimate.clozecards.com:9160\");\n const ws = new WebSocket(\"ws://localhost:9161\");\n\n ws.onopen = event => {\n this.setState(state => ({\n ...state,\n message: \"Connected.\"\n }));\n ws.send('60');\n }\n ws.onclose = event => {\n this.setState(state => ({\n ...state,\n message: \"Disconnected.\"\n }));\n setTimeout(this.connect, 1000);\n }\n ws.onmessage = event => {\n if (event.data === \"Success!\") {\n console.log(\"Success\");\n } else if (event.data === \"Compiling\") {\n this.setState({message: \"Compiling...\"});\n this.status = 'compiling';\n this.svgs = [];\n this.frame_count = 0;\n this.next_frame = 0;\n } else if (event.data === \"Done\") {\n this.setState({message: \"\"});\n console.log(\"Done\");\n this.start = Date.now();\n } else if (event.data.startsWith(\"Error\")) {\n console.log(\"Error\", event.data.substring(5));\n this.setState({message: event.data.substring(5)});\n } else {\n const num = parseInt(event.data);\n if(isNaN(num)) {\n // this.setState({message: `Rendering: ${this.nFrames_new}`});\n // this.nFrames_new++;\n // const div = document.createElement('div');\n // div.innerHTML = event.data;\n // this.svgs_new.push(div);\n const div = document.createElement('div');\n div.innerHTML = event.data;\n this.svgs[this.next_frame] = div;\n var count = 0;\n this.svgs.forEach(_ => count++);\n console.log('Received', this.next_frame, this.frame_count, count);\n } else {\n\n if( this.status === 'compiling' ) {\n this.setState({message: `Rendering...`});\n this.frame_count = num;\n this.status = 'rendering';\n this.start = Date.now();\n this.svgs = [];\n this.svgs[this.frame_count-1] = undefined;\n } else if( this.status === 'rendering' ) {\n this.next_frame = num;\n } else {\n console.log(\"Bad state change: received number\");\n }\n }\n }\n }\n this.setState(state => ({\n ...state,\n socket: ws,\n message: \"Connecting...\"\n }));\n }\n constructor(props) {\n super(props);\n\n this.state = {\n };\n setTimeout(this.connect, 0);\n this.svgs = [];\n this.start = Date.now();\n\n this.status = '';\n this.frame_count = 0;\n this.next_frame = 0;\n\n const self = this;\n const animate = () => {\n const now = Date.now();\n const nFrames = self.frame_count;\n const aniDuration = self.frame_count/60;\n const thisFrame = (Math.round((now - this.start) / 1000 * 60)) % nFrames\n // const thisFrame = 0; console.log('Animation frame:', thisFrame, nFrames);\n var count = 0;\n this.svgs.forEach(_ => count++);\n if (nFrames) {\n // self.svg.innerHTML = self.svgs[thisFrame];\n if(self.svgs[thisFrame]) {\n // self.hud.innerText = '' + thisFrame + '/' + self.frame_count;\n this.setState({message: '' + thisFrame + '/' + self.frame_count + ' ' + Math.round(count/aniDuration) + ' fps'});\n while (self.svg.firstChild)\n self.svg.removeChild(self.svg.firstChild);\n self.svg.appendChild(self.svgs[thisFrame]);\n }\n } else {\n self.svg.innerText = \"\";\n }\n requestAnimationFrame(animate);\n };\n requestAnimationFrame(animate);\n }\n onLoad = ace => {\n setTimeout(function() {\n ace.resize();\n }, 0);\n }\n render() {\n const {message} = this.state;\n return (\n
\n
\n
this.svg = node}/>\n
\n 
{message}
\n
\n
\n
\n );\n }\n}\n\nexport default App;\n","// This optional code is used to register a service worker.\n// register() is not called by default.\n\n// This lets the app load faster on subsequent visits in production, and gives\n// it offline capabilities. However, it also means that developers (and users)\n// will only see deployed updates on subsequent visits to a page, after all the\n// existing tabs open on the page have been closed, since previously cached\n// resources are updated in the background.\n\n// To learn more about the benefits of this model and instructions on how to\n// opt-in, read http://bit.ly/CRA-PWA\n\nconst isLocalhost = Boolean(\n window.location.hostname === 'localhost' ||\n // [::1] is the IPv6 localhost address.\n window.location.hostname === '[::1]' ||\n // 127.0.0.1/8 is considered localhost for IPv4.\n window.location.hostname.match(\n /^127(?:\\.(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)){3}$/\n )\n);\n\nexport function register(config) {\n if (process.env.NODE_ENV === 'production' && 'serviceWorker' in navigator) {\n // The URL constructor is available in all browsers that support SW.\n const publicUrl = new URL(process.env.PUBLIC_URL, window.location.href);\n if (publicUrl.origin !== window.location.origin) {\n // Our service worker won't work if PUBLIC_URL is on a different origin\n // from what our page is served on. This might happen if a CDN is used to\n // serve assets; see https://github.com/facebook/create-react-app/issues/2374\n return;\n }\n\n window.addEventListener('load', () => {\n const swUrl = `${process.env.PUBLIC_URL}/service-worker.js`;\n\n if (isLocalhost) {\n // This is running on localhost. Let's check if a service worker still exists or not.\n checkValidServiceWorker(swUrl, config);\n\n // Add some additional logging to localhost, pointing developers to the\n // service worker/PWA documentation.\n navigator.serviceWorker.ready.then(() => {\n console.log(\n 'This web app is being served cache-first by a service ' +\n 'worker. To learn more, visit http://bit.ly/CRA-PWA'\n );\n });\n } else {\n // Is not localhost. Just register service worker\n registerValidSW(swUrl, config);\n }\n });\n }\n}\n\nfunction registerValidSW(swUrl, config) {\n navigator.serviceWorker\n .register(swUrl)\n .then(registration => {\n registration.onupdatefound = () => {\n const installingWorker = registration.installing;\n if (installingWorker == null) {\n return;\n }\n installingWorker.onstatechange = () => {\n if (installingWorker.state === 'installed') {\n if (navigator.serviceWorker.controller) {\n // At this point, the updated precached content has been fetched,\n // but the previous service worker will still serve the older\n // content until all client tabs are closed.\n console.log(\n 'New content is available and will be used when all ' +\n 'tabs for this page are closed. See http://bit.ly/CRA-PWA.'\n );\n\n // Execute callback\n if (config && config.onUpdate) {\n config.onUpdate(registration);\n }\n } else {\n // At this point, everything has been precached.\n // It's the perfect time to display a\n // \"Content is cached for offline use.\" message.\n console.log('Content is cached for offline use.');\n\n // Execute callback\n if (config && config.onSuccess) {\n config.onSuccess(registration);\n }\n }\n }\n };\n };\n })\n .catch(error => {\n console.error('Error during service worker registration:', error);\n });\n}\n\nfunction checkValidServiceWorker(swUrl, config) {\n // Check if the service worker can be found. If it can't reload the page.\n fetch(swUrl)\n .then(response => {\n // Ensure service worker exists, and that we really are getting a JS file.\n const contentType = response.headers.get('content-type');\n if (\n response.status === 404 ||\n (contentType != null && contentType.indexOf('javascript') === -1)\n ) {\n // No service worker found. Probably a different app. Reload the page.\n navigator.serviceWorker.ready.then(registration => {\n registration.unregister().then(() => {\n window.location.reload();\n });\n });\n } else {\n // Service worker found. Proceed as normal.\n registerValidSW(swUrl, config);\n }\n })\n .catch(() => {\n console.log(\n 'No internet connection found. App is running in offline mode.'\n );\n });\n}\n\nexport function unregister() {\n if ('serviceWorker' in navigator) {\n navigator.serviceWorker.ready.then(registration => {\n registration.unregister();\n });\n }\n}\n","import React from 'react';\nimport ReactDOM from 'react-dom';\nimport './index.css';\nimport App from './App';\nimport * as serviceWorker from './serviceWorker';\n\nReactDOM.render(, document.getElementById('root'));\n\n// If you want your app to work offline and load faster, you can change\n// unregister() to register() below. Note this comes with some pitfalls.\n// Learn more about service workers: http://bit.ly/CRA-PWA\nserviceWorker.unregister();\n"],"sourceRoot":""} \ No newline at end of file diff --git a/viewer/build/static/js/main.c36ecb4a.chunk.js b/viewer/build/static/js/main.c36ecb4a.chunk.js new file mode 100644 index 0000000..e0b08c7 --- /dev/null +++ b/viewer/build/static/js/main.c36ecb4a.chunk.js @@ -0,0 +1,2 @@ +(window.webpackJsonp=window.webpackJsonp||[]).push([[0],{10:function(e,t,n){e.exports=n(18)},16:function(e,t,n){},17:function(e,t,n){},18:function(e,t,n){"use strict";n.r(t);var a=n(0),s=n.n(a),o=n(4),r=n.n(o),c=(n(16),n(2)),i=n(5),u=n(6),m=n(9),l=n(7),f=n(1),g=n(8),d=(n(17),function(e){function t(e){var n;Object(i.a)(this,t),(n=Object(m.a)(this,Object(l.a)(t).call(this,e))).connect=function(){var e=new WebSocket("ws://localhost:9161");e.onopen=function(t){n.setState(function(e){return Object(c.a)({},e,{message:"Connected."})}),e.send("60")},e.onclose=function(e){n.setState(function(e){return Object(c.a)({},e,{message:"Disconnected."})}),setTimeout(n.connect,1e3)},e.onmessage=function(e){if("Success!"===e.data)console.log("Success");else if("Compiling"===e.data)n.setState({message:"Compiling..."}),n.status="compiling",n.svgs=[],n.frame_count=0,n.next_frame=0;else if("Done"===e.data)n.setState({message:""}),console.log("Done"),n.status="done";else if(e.data.startsWith("Error"))console.log("Error",e.data.substring(5)),n.setState({message:e.data.substring(5)});else{var t=parseInt(e.data);if(isNaN(t)){var a=document.createElement("div");a.innerHTML=e.data,n.svgs[n.next_frame]=a;var s=0;n.svgs.forEach(function(e){return s++}),console.log("Received",n.next_frame,n.frame_count,s)}else"compiling"===n.status?(n.setState({message:"Rendering..."}),n.frame_count=t,n.status="rendering",n.start=Date.now(),n.svgs=[],n.svgs[n.frame_count-1]=void 0):"rendering"===n.status?n.next_frame=t:console.log("Bad state change: received number")}},n.setState(function(t){return Object(c.a)({},t,{socket:e,message:"Connecting..."})})},n.onLoad=function(e){setTimeout(function(){e.resize()},0)},n.state={},setTimeout(n.connect,0),n.svgs=[],n.start=Date.now(),n.status="",n.frame_count=0,n.next_frame=0;var a=Object(f.a)(n);return requestAnimationFrame(function e(){var t=Date.now(),s=a.frame_count,o=a.frame_count/60,r=Math.round((t-n.start)/1e3*60)%s,c=0;if(n.svgs.forEach(function(e){return c++}),s){if(a.svgs[r]){for(n.setState({message:r+"/"+a.frame_count+" "+Math.round(c/o)+" fps"});a.svg.firstChild;)a.svg.removeChild(a.svg.firstChild);a.svg.appendChild(a.svgs[r])}}else a.svg.innerText="";requestAnimationFrame(e)}),n}return Object(g.a)(t,e),Object(u.a)(t,[{key:"render",value:function(){var e=this,t=this.state.message;return s.a.createElement("div",{className:"App"},s.a.createElement("div",{className:"viewer"},s.a.createElement("div",{ref:function(t){return e.svg=t}}),s.a.createElement("div",{className:"messages"},s.a.createElement("pre",null,t))))}}]),t}(a.Component));Boolean("localhost"===window.location.hostname||"[::1]"===window.location.hostname||window.location.hostname.match(/^127(?:\.(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)){3}$/));r.a.render(s.a.createElement(d,null),document.getElementById("root")),"serviceWorker"in navigator&&navigator.serviceWorker.ready.then(function(e){e.unregister()})}},[[10,1,2]]]); +//# sourceMappingURL=main.c36ecb4a.chunk.js.map \ No newline at end of file diff --git a/viewer/build/static/js/main.c36ecb4a.chunk.js.map b/viewer/build/static/js/main.c36ecb4a.chunk.js.map new file mode 100644 index 0000000..3b10cf8 --- /dev/null +++ b/viewer/build/static/js/main.c36ecb4a.chunk.js.map @@ -0,0 +1 @@ +{"version":3,"sources":["App.jsx","serviceWorker.js","index.js"],"names":["App","props","_this","Object","classCallCheck","this","possibleConstructorReturn","getPrototypeOf","call","connect","ws","WebSocket","onopen","event","setState","state","objectSpread","message","send","onclose","setTimeout","onmessage","data","console","log","status","svgs","frame_count","next_frame","startsWith","substring","num","parseInt","isNaN","div","document","createElement","innerHTML","count","forEach","_","start","Date","now","undefined","socket","onLoad","ace","resize","self","assertThisInitialized","requestAnimationFrame","animate","nFrames","aniDuration","thisFrame","Math","round","svg","firstChild","removeChild","appendChild","innerText","_this2","react_default","a","className","ref","node","Component","Boolean","window","location","hostname","match","ReactDOM","render","src_App_0","getElementById","navigator","serviceWorker","ready","then","registration","unregister"],"mappings":"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","file":"static/js/main.c36ecb4a.chunk.js","sourcesContent":["import React, {Component} from 'react';\nimport './App.css';\n\nclass App extends Component {\n connect = () => {\n // const ws = new WebSocket(\"wss://reanimate.clozecards.com:9160\");\n const ws = new WebSocket(\"ws://localhost:9161\");\n\n ws.onopen = event => {\n this.setState(state => ({\n ...state,\n message: \"Connected.\"\n }));\n ws.send('60');\n }\n ws.onclose = event => {\n this.setState(state => ({\n ...state,\n message: \"Disconnected.\"\n }));\n setTimeout(this.connect, 1000);\n }\n ws.onmessage = event => {\n if (event.data === \"Success!\") {\n console.log(\"Success\");\n } else if (event.data === \"Compiling\") {\n this.setState({message: \"Compiling...\"});\n this.status = 'compiling';\n this.svgs = [];\n this.frame_count = 0;\n this.next_frame = 0;\n } else if (event.data === \"Done\") {\n this.setState({message: \"\"});\n console.log(\"Done\");\n this.status = 'done';\n } else if (event.data.startsWith(\"Error\")) {\n console.log(\"Error\", event.data.substring(5));\n this.setState({message: event.data.substring(5)});\n } else {\n const num = parseInt(event.data);\n if(isNaN(num)) {\n // this.setState({message: `Rendering: ${this.nFrames_new}`});\n // this.nFrames_new++;\n // const div = document.createElement('div');\n // div.innerHTML = event.data;\n // this.svgs_new.push(div);\n const div = document.createElement('div');\n div.innerHTML = event.data;\n this.svgs[this.next_frame] = div;\n var count = 0;\n this.svgs.forEach(_ => count++);\n console.log('Received', this.next_frame, this.frame_count, count);\n } else {\n\n if( this.status === 'compiling' ) {\n this.setState({message: `Rendering...`});\n this.frame_count = num;\n this.status = 'rendering';\n this.start = Date.now();\n this.svgs = [];\n this.svgs[this.frame_count-1] = undefined;\n } else if( this.status === 'rendering' ) {\n this.next_frame = num;\n } else {\n console.log(\"Bad state change: received number\");\n }\n }\n }\n }\n this.setState(state => ({\n ...state,\n socket: ws,\n message: \"Connecting...\"\n }));\n }\n constructor(props) {\n super(props);\n\n this.state = {\n };\n setTimeout(this.connect, 0);\n this.svgs = [];\n this.start = Date.now();\n\n this.status = '';\n this.frame_count = 0;\n this.next_frame = 0;\n\n const self = this;\n const animate = () => {\n const now = Date.now();\n const nFrames = self.frame_count;\n const aniDuration = self.frame_count/60;\n const thisFrame = (Math.round((now - this.start) / 1000 * 60)) % nFrames\n // const thisFrame = 0; console.log('Animation frame:', thisFrame, nFrames);\n var count = 0;\n this.svgs.forEach(_ => count++);\n if (nFrames) {\n // self.svg.innerHTML = self.svgs[thisFrame];\n if(self.svgs[thisFrame]) {\n // self.hud.innerText = '' + thisFrame + '/' + self.frame_count;\n this.setState({message: '' + thisFrame + '/' + self.frame_count + ' ' + Math.round(count/aniDuration) + ' fps'});\n while (self.svg.firstChild)\n self.svg.removeChild(self.svg.firstChild);\n self.svg.appendChild(self.svgs[thisFrame]);\n }\n } else {\n self.svg.innerText = \"\";\n }\n requestAnimationFrame(animate);\n };\n requestAnimationFrame(animate);\n }\n onLoad = ace => {\n setTimeout(function() {\n ace.resize();\n }, 0);\n }\n render() {\n const {message} = this.state;\n return (\n
\n
\n
this.svg = node}/>\n
\n 
{message}
\n
\n
\n
\n );\n }\n}\n\nexport default App;\n","// This optional code is used to register a service worker.\n// register() is not called by default.\n\n// This lets the app load faster on subsequent visits in production, and gives\n// it offline capabilities. However, it also means that developers (and users)\n// will only see deployed updates on subsequent visits to a page, after all the\n// existing tabs open on the page have been closed, since previously cached\n// resources are updated in the background.\n\n// To learn more about the benefits of this model and instructions on how to\n// opt-in, read http://bit.ly/CRA-PWA\n\nconst isLocalhost = Boolean(\n window.location.hostname === 'localhost' ||\n // [::1] is the IPv6 localhost address.\n window.location.hostname === '[::1]' ||\n // 127.0.0.1/8 is considered localhost for IPv4.\n window.location.hostname.match(\n /^127(?:\\.(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)){3}$/\n )\n);\n\nexport function register(config) {\n if (process.env.NODE_ENV === 'production' && 'serviceWorker' in navigator) {\n // The URL constructor is available in all browsers that support SW.\n const publicUrl = new URL(process.env.PUBLIC_URL, window.location.href);\n if (publicUrl.origin !== window.location.origin) {\n // Our service worker won't work if PUBLIC_URL is on a different origin\n // from what our page is served on. This might happen if a CDN is used to\n // serve assets; see https://github.com/facebook/create-react-app/issues/2374\n return;\n }\n\n window.addEventListener('load', () => {\n const swUrl = `${process.env.PUBLIC_URL}/service-worker.js`;\n\n if (isLocalhost) {\n // This is running on localhost. Let's check if a service worker still exists or not.\n checkValidServiceWorker(swUrl, config);\n\n // Add some additional logging to localhost, pointing developers to the\n // service worker/PWA documentation.\n navigator.serviceWorker.ready.then(() => {\n console.log(\n 'This web app is being served cache-first by a service ' +\n 'worker. To learn more, visit http://bit.ly/CRA-PWA'\n );\n });\n } else {\n // Is not localhost. Just register service worker\n registerValidSW(swUrl, config);\n }\n });\n }\n}\n\nfunction registerValidSW(swUrl, config) {\n navigator.serviceWorker\n .register(swUrl)\n .then(registration => {\n registration.onupdatefound = () => {\n const installingWorker = registration.installing;\n if (installingWorker == null) {\n return;\n }\n installingWorker.onstatechange = () => {\n if (installingWorker.state === 'installed') {\n if (navigator.serviceWorker.controller) {\n // At this point, the updated precached content has been fetched,\n // but the previous service worker will still serve the older\n // content until all client tabs are closed.\n console.log(\n 'New content is available and will be used when all ' +\n 'tabs for this page are closed. See http://bit.ly/CRA-PWA.'\n );\n\n // Execute callback\n if (config && config.onUpdate) {\n config.onUpdate(registration);\n }\n } else {\n // At this point, everything has been precached.\n // It's the perfect time to display a\n // \"Content is cached for offline use.\" message.\n console.log('Content is cached for offline use.');\n\n // Execute callback\n if (config && config.onSuccess) {\n config.onSuccess(registration);\n }\n }\n }\n };\n };\n })\n .catch(error => {\n console.error('Error during service worker registration:', error);\n });\n}\n\nfunction checkValidServiceWorker(swUrl, config) {\n // Check if the service worker can be found. If it can't reload the page.\n fetch(swUrl)\n .then(response => {\n // Ensure service worker exists, and that we really are getting a JS file.\n const contentType = response.headers.get('content-type');\n if (\n response.status === 404 ||\n (contentType != null && contentType.indexOf('javascript') === -1)\n ) {\n // No service worker found. Probably a different app. Reload the page.\n navigator.serviceWorker.ready.then(registration => {\n registration.unregister().then(() => {\n window.location.reload();\n });\n });\n } else {\n // Service worker found. Proceed as normal.\n registerValidSW(swUrl, config);\n }\n })\n .catch(() => {\n console.log(\n 'No internet connection found. App is running in offline mode.'\n );\n });\n}\n\nexport function unregister() {\n if ('serviceWorker' in navigator) {\n navigator.serviceWorker.ready.then(registration => {\n registration.unregister();\n });\n }\n}\n","import React from 'react';\nimport ReactDOM from 'react-dom';\nimport './index.css';\nimport App from './App';\nimport * as serviceWorker from './serviceWorker';\n\nReactDOM.render(, document.getElementById('root'));\n\n// If you want your app to work offline and load faster, you can change\n// unregister() to register() below. Note this comes with some pitfalls.\n// Learn more about service workers: http://bit.ly/CRA-PWA\nserviceWorker.unregister();\n"],"sourceRoot":""} \ No newline at end of file diff --git a/viewer/src/App.jsx b/viewer/src/App.jsx index 5cd1a42..b5da88f 100755 --- a/viewer/src/App.jsx +++ b/viewer/src/App.jsx @@ -32,7 +32,7 @@ class App extends Component { } else if (event.data === "Done") { this.setState({message: ""}); console.log("Done"); - this.start = Date.now(); + this.status = 'done'; } else if (event.data.startsWith("Error")) { console.log("Error", event.data.substring(5)); this.setState({message: event.data.substring(5)});