bio-tarik/Promises.md

## index.html
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Promises</title>
</head>
<body>
    <script src="load-image.js"></script>
    <script src="script.js"></script>
</body>
</html>

## load-image.js
function loadImage(url) {
    return new Promise((resolve, reject) => {
        let image = new Image();

        image.onload = function (param) {
            resolve(image);
        }

        image.onerror = function () {
            let message = 'Could not load image at ' + url;
            reject(new Error(message));
        }

        image.src = url;
    });
}

## Promises.md

      
    Raw
  

              Promises.md
            
          
    #Promises
Files created along with this great promises tutorial
Ohh and I didn't upload the image files but you are able to get them from the original tutorial repository.

  
## script.js
let addImg = (src) => {
    let imgElement = document.createElement('img');
    imgElement.src = src;
    document.body.appendChild(imgElement);
}

Promise.all([
    loadImage('images/cat1.jpg'),
    loadImage('images/cat2.jpg'),
    loadImage('images/cat3.jpg'),
    loadImage('images/cat4.jpg')
]).then((images) => {
    images.forEach( img => addImg(img.src));
}).catch((error) => {
    console.log(error);
});
	<!DOCTYPE html>
	<html lang="en">
	<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<meta http-equiv="X-UA-Compatible" content="ie=edge">
	<title>Promises</title>
	</head>
	<body>
	<script src="load-image.js"></script>
	<script src="script.js"></script>
	</body>
	</html>
	function loadImage(url) {
	return new Promise((resolve, reject) => {
	let image = new Image();

	image.onload = function (param) {
	resolve(image);
	}

	image.onerror = function () {
	let message = 'Could not load image at ' + url;
	reject(new Error(message));
	}

	image.src = url;
	});
	}
	let addImg = (src) => {
	let imgElement = document.createElement('img');
	imgElement.src = src;
	document.body.appendChild(imgElement);
	}

	Promise.all([
	loadImage('images/cat1.jpg'),
	loadImage('images/cat2.jpg'),
	loadImage('images/cat3.jpg'),
	loadImage('images/cat4.jpg')
	]).then((images) => {
	images.forEach( img => addImg(img.src));
	}).catch((error) => {
	console.log(error);
	});