Merge branch 'spinner' into 'master'
Implement a spinner See merge request pastebin.run/server!95
This commit is contained in:
commit
fd7e6186aa
|
@ -100,7 +100,8 @@ class Editor {
|
|||
}
|
||||
|
||||
changeToLookLikeNewPaste() {
|
||||
this.clearOutput()
|
||||
this.output.clear()
|
||||
this.editor.update()
|
||||
if (this.autodeleteText) {
|
||||
this.autodeleteText.style.display = 'none'
|
||||
}
|
||||
|
@ -142,7 +143,8 @@ class Editor {
|
|||
}
|
||||
|
||||
async run(wrapper, compilerOptions) {
|
||||
this.clearOutput()
|
||||
this.output.spin()
|
||||
this.editor.update()
|
||||
if (this.abortEval) {
|
||||
this.abortEval.abort()
|
||||
}
|
||||
|
@ -180,11 +182,6 @@ class Editor {
|
|||
this.output.display(wrapper, response)
|
||||
this.editor.update()
|
||||
}
|
||||
|
||||
clearOutput() {
|
||||
this.output.clear()
|
||||
this.editor.update()
|
||||
}
|
||||
}
|
||||
|
||||
export default function createEditor(form) {
|
||||
|
|
|
@ -1,5 +1,5 @@
|
|||
import './spinner.css'
|
||||
import { Wrapper } from './types'
|
||||
import { SplitChunksPlugin } from 'webpack'
|
||||
|
||||
const filterRegex = /(?:\t\.(?:text|file|section|globl|p2align|type|cfi_.*|size|section)\b|.Lfunc_end).*\n?/g
|
||||
|
||||
|
@ -46,6 +46,14 @@ export default class Output {
|
|||
this.update()
|
||||
}
|
||||
|
||||
spin() {
|
||||
this.output.textContent = ''
|
||||
const spinner = document.createElement('div')
|
||||
spinner.className = 'spinner'
|
||||
this.output.append(spinner)
|
||||
this.split.append(this.outputContainer)
|
||||
}
|
||||
|
||||
update() {
|
||||
const { stdout, stderr, status } = this.json
|
||||
this.clear()
|
||||
|
|
18
js/views/editor/spinner.css
Normal file
18
js/views/editor/spinner.css
Normal file
|
@ -0,0 +1,18 @@
|
|||
@keyframes spinner {
|
||||
0% {
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
|
||||
100% {
|
||||
transform: rotate(360deg);
|
||||
}
|
||||
}
|
||||
|
||||
.spinner {
|
||||
animation: 1s linear infinite spinner;
|
||||
border: solid 3px #f5f2f0;
|
||||
border-bottom-color: #c7c75c;
|
||||
border-radius: 50%;
|
||||
width: 50px;
|
||||
height: 50px;
|
||||
}
|
Loading…
Reference in New Issue
Block a user