|
@@ -52,26 +52,48 @@ function createProgressButton( loader, adapterMock ) {
|
|
|
const container = document.createElement( 'div' );
|
|
const container = document.createElement( 'div' );
|
|
|
const progressInfo = document.createElement( 'span' );
|
|
const progressInfo = document.createElement( 'span' );
|
|
|
progressInfo.innerHTML = `File: ${ fileName }. Progress: 0%.`;
|
|
progressInfo.innerHTML = `File: ${ fileName }. Progress: 0%.`;
|
|
|
- const button = document.createElement( 'button' );
|
|
|
|
|
- button.innerHTML = 'Upload progress';
|
|
|
|
|
|
|
+ const progressButton = document.createElement( 'button' );
|
|
|
|
|
+ const errorButton = document.createElement( 'button' );
|
|
|
|
|
+ const abortButton = document.createElement( 'button' );
|
|
|
|
|
+ progressButton.innerHTML = 'Upload progress';
|
|
|
|
|
+ errorButton.innerHTML = 'Simulate error';
|
|
|
|
|
+ abortButton.innerHTML = 'Simulate aborting';
|
|
|
|
|
|
|
|
- container.appendChild( button );
|
|
|
|
|
|
|
+ container.appendChild( progressButton );
|
|
|
|
|
+ container.appendChild( errorButton );
|
|
|
|
|
+ container.appendChild( abortButton );
|
|
|
container.appendChild( progressInfo );
|
|
container.appendChild( progressInfo );
|
|
|
|
|
|
|
|
buttonContainer.appendChild( container );
|
|
buttonContainer.appendChild( container );
|
|
|
|
|
|
|
|
let progress = 0;
|
|
let progress = 0;
|
|
|
const total = 500;
|
|
const total = 500;
|
|
|
- button.addEventListener( 'click', () => {
|
|
|
|
|
|
|
+ progressButton.addEventListener( 'click', () => {
|
|
|
progress += 100;
|
|
progress += 100;
|
|
|
adapterMock.mockProgress( progress, total );
|
|
adapterMock.mockProgress( progress, total );
|
|
|
|
|
|
|
|
if ( progress == total ) {
|
|
if ( progress == total ) {
|
|
|
- button.setAttribute( 'disabled', 'true' );
|
|
|
|
|
|
|
+ disableButtons();
|
|
|
adapterMock.mockSuccess( { original: './sample.jpg' } );
|
|
adapterMock.mockSuccess( { original: './sample.jpg' } );
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
progressInfo.innerHTML = `File: ${ fileName }. Progress: ${ loader.uploadedPercent }%.`;
|
|
progressInfo.innerHTML = `File: ${ fileName }. Progress: ${ loader.uploadedPercent }%.`;
|
|
|
} );
|
|
} );
|
|
|
|
|
+
|
|
|
|
|
+ errorButton.addEventListener( 'click', () => {
|
|
|
|
|
+ adapterMock.mockError( 'Upload error!' );
|
|
|
|
|
+ disableButtons();
|
|
|
|
|
+ } );
|
|
|
|
|
+
|
|
|
|
|
+ abortButton.addEventListener( 'click', () => {
|
|
|
|
|
+ loader.abort();
|
|
|
|
|
+ disableButtons();
|
|
|
|
|
+ } );
|
|
|
|
|
+
|
|
|
|
|
+ function disableButtons() {
|
|
|
|
|
+ progressButton.setAttribute( 'disabled', 'true' );
|
|
|
|
|
+ errorButton.setAttribute( 'disabled', 'true' );
|
|
|
|
|
+ abortButton.setAttribute( 'disabled', 'true' );
|
|
|
|
|
+ }
|
|
|
}
|
|
}
|
|
|
|
|
|