Skip to content
Snippets Groups Projects
Commit e562b772 authored by Sacha LEPAGE's avatar Sacha LEPAGE
Browse files

tp1

parent 8cd29c1a
Branches master
No related tags found
No related merge requests found
Expand all Show whitespace changes
Inline Side-by-side
build/main.js 0 → 100644
+ 109
− 0
View file @ e562b772
"use strict";
//PARTIE D
//const pizzName = 'Regina';
//const url =`images/${pizzName.toLowerCase()}.jpg`;
//console.log(url);
//const html = `<article class="pizzaThumbnail"><a href=\"${url}\"><img src=\"${url}\"/><section>Regina</section></a></article>
//`;
//console.log(html);
//document.querySelector('.pageContent').innerHTML = html;
//PARTIE E.1
//const data = ['Regina', 'Napolitaine', 'Spicy'];
//let html ="";
//for(let i=0;i<data.length;i++){
//let url =`images/${data[i].toLowerCase()}.jpg`;
// html += `<article class="pizzaThumbnail"> <a href="${url}"> <img src="${url}"/> <section>${data[i]}</section> </a> </article>`;
//console.log(html);
//}
//document.querySelector('.pageContent').innerHTML = html;
/*data.forEach(e => {
let url =`images/${e.toLowerCase()}.jpg`;
html += `<article class="pizzaThumbnail">
<a href="${url}"> <img src="${url}"/>
<section>${e}</section>
</a>
</article>`;
});
document.querySelector('.pageContent').innerHTML = html;*/
//PARTIE E.2
var data = [{
name: 'Regina',
base: 'tomate',
price_small: 6.5,
price_large: 9.95,
image: 'https://images.unsplash.com/photo-1532246420286-127bcd803104?fit=crop&w=500&h=300'
}, {
name: 'Napolitaine',
base: 'tomate',
price_small: 6.5,
price_large: 8.95,
image: 'https://images.unsplash.com/photo-1562707666-0ef112b353e0?&fit=crop&w=500&h=300'
}, {
name: 'Spicy',
base: 'crème',
price_small: 5.5,
price_large: 8,
image: 'https://images.unsplash.com/photo-1458642849426-cfb724f15ef7?fit=crop&w=500&h=300'
}]; // trier par nom
/*data=data.sort(function(a,b){
if ( a.name < b.name)
return -1;
if (a.name > b.name)
return 1;
return 0;
}
);*/
//trier par prix petit format croissant
/*data=data.sort(function(a,b){
if ( a.price_small < b.price_small)
return -1;
if (a.price_small > b.price_small)
return 1;
if(a.price_small == b.price_small){
if ( a.price_large < b.price_large)
return -1;
if (a.price_large > b.price_large)
return 1;
}
return 0;
}
);*/
//filtrer par tomate
/*data = data.filter(function(e){
if (e.base == 'tomate')
return e;
});*/
//filtrer prix < 6
/*data = data.filter(function(e){
if (e.price_small < 6)
return e;
});*/
//filtrer le nom contient 2 fois i
/*function nbre_caracteres(lettre,mot)
{
mot2 = mot.split(lettre);
nbre_de_fois_trouve = mot2.length-1;
return nbre_de_fois_trouve;
}
data = data.filter(function(e){
if (nbre_caracteres('i',e.name)==2)
return e;
});*/
var html = "";
data.forEach(function (e) {
var url = "images/".concat(e.name.toLowerCase(), ".jpg");
html += "<article class=\"pizzaThumbnail\">\n\t<a href=".concat(url, ">\n\t\t<img src=\"").concat(url, "\"/>\n <section>\n <h4>").concat(e.name, "</h4>\n <ul>\n\t\t\t\t<li>Prix petit format : ").concat(e.price_small, " \u20AC</li>\n\t\t\t\t<li>Prix grand format : ").concat(e.price_large, " \u20AC</li>\n\t\t\t</ul>\n\n </section>\n\t</a>\n</article>");
});
document.querySelector('.pageContent').innerHTML = html;
//# sourceMappingURL=main.js.map
\ No newline at end of file
build/main.js.map 0 → 100644
+ 1
− 0
View file @ e562b772
{"version":3,"sources":["../src/main.js"],"names":["data","name","base","price_small","price_large","image","html","forEach","e","url","toLowerCase","document","querySelector","innerHTML"],"mappings":";;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA,IAAIA,IAAI,GAAG,CACV;AACCC,EAAAA,IAAI,EAAE,QADP;AAECC,EAAAA,IAAI,EAAE,QAFP;AAGCC,EAAAA,WAAW,EAAE,GAHd;AAICC,EAAAA,WAAW,EAAE,IAJd;AAKCC,EAAAA,KAAK,EAAE;AALR,CADU,EAQV;AACCJ,EAAAA,IAAI,EAAE,aADP;AAECC,EAAAA,IAAI,EAAE,QAFP;AAGCC,EAAAA,WAAW,EAAE,GAHd;AAICC,EAAAA,WAAW,EAAE,IAJd;AAKCC,EAAAA,KAAK,EAAE;AALR,CARU,EAeV;AACCJ,EAAAA,IAAI,EAAE,OADP;AAECC,EAAAA,IAAI,EAAE,OAFP;AAGCC,EAAAA,WAAW,EAAE,GAHd;AAICC,EAAAA,WAAW,EAAE,CAJd;AAKCC,EAAAA,KAAK,EAAE;AALR,CAfU,CAAX,C,CAwBA;;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;;AACA;AACA;AACA;AACA;AAEA;;AACA;AACA;AACA;AACA;AAEA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA,IAAIC,IAAI,GAAE,EAAV;AACAN,IAAI,CAACO,OAAL,CAAa,UAAAC,CAAC,EAAI;AACd,MAAIC,GAAG,oBAAYD,CAAC,CAACP,IAAF,CAAOS,WAAP,EAAZ,SAAP;AACAJ,EAAAA,IAAI,4DACGG,GADH,+BAEMA,GAFN,sDAIUD,CAAC,CAACP,IAJZ,sEAMsBO,CAAC,CAACL,WANxB,2DAOsBK,CAAC,CAACJ,WAPxB,wEAAJ;AAaH,CAfD;AAgBAO,QAAQ,CAACC,aAAT,CAAuB,cAAvB,EAAuCC,SAAvC,GAAmDP,IAAnD","sourcesContent":["//PARTIE D\n\n//const pizzName = 'Regina';\n//const url =`images/${pizzName.toLowerCase()}.jpg`;\n//console.log(url);\n//const html = `<article class=\"pizzaThumbnail\"><a href=\\\"${url}\\\"><img src=\\\"${url}\\\"/><section>Regina</section></a></article>\n//`;\n//console.log(html);\n//document.querySelector('.pageContent').innerHTML = html;\n\n//PARTIE E.1\n\n//const data = ['Regina', 'Napolitaine', 'Spicy'];\n//let html =\"\";\n//for(let i=0;i<data.length;i++){\n//let url =`images/${data[i].toLowerCase()}.jpg`;\n// html += `<article class=\"pizzaThumbnail\"> <a href=\"${url}\"> <img src=\"${url}\"/> <section>${data[i]}</section> </a> </article>`;\n//console.log(html);\n//}\n//document.querySelector('.pageContent').innerHTML = html;\n\n/*data.forEach(e => {\n let url =`images/${e.toLowerCase()}.jpg`; \n html += `<article class=\"pizzaThumbnail\">\n <a href=\"${url}\"> <img src=\"${url}\"/> \n <section>${e}</section> \n </a>\n </article>`; \n});\ndocument.querySelector('.pageContent').innerHTML = html;*/\n\n//PARTIE E.2\nlet data = [\n\t{\n\t\tname: 'Regina',\n\t\tbase: 'tomate',\n\t\tprice_small: 6.5,\n\t\tprice_large: 9.95,\n\t\timage: 'https://images.unsplash.com/photo-1532246420286-127bcd803104?fit=crop&w=500&h=300'\n\t},\n\t{\n\t\tname: 'Napolitaine',\n\t\tbase: 'tomate',\n\t\tprice_small: 6.5,\n\t\tprice_large: 8.95,\n\t\timage: 'https://images.unsplash.com/photo-1562707666-0ef112b353e0?&fit=crop&w=500&h=300'\n\t},\n\t{\n\t\tname: 'Spicy',\n\t\tbase: 'crème',\n\t\tprice_small: 5.5,\n\t\tprice_large: 8,\n\t\timage: 'https://images.unsplash.com/photo-1458642849426-cfb724f15ef7?fit=crop&w=500&h=300',\n\t}\n];\n\n// trier par nom\n/*data=data.sort(function(a,b){\n if ( a.name < b.name)\n return -1;\n if (a.name > b.name)\n return 1;\n\n return 0;\n} \n);*/\n\n//trier par prix petit format croissant\n/*data=data.sort(function(a,b){\n if ( a.price_small < b.price_small)\n return -1;\n if (a.price_small > b.price_small)\n return 1;\n if(a.price_small == b.price_small){\n if ( a.price_large < b.price_large)\n return -1;\n if (a.price_large > b.price_large)\n return 1;\n }\n\n return 0;\n} \n);*/\n\n//filtrer par tomate\n/*data = data.filter(function(e){\n if (e.base == 'tomate')\n return e;\n});*/\n\n//filtrer prix < 6\n/*data = data.filter(function(e){\n if (e.price_small < 6)\n return e;\n});*/\n\n//filtrer le nom contient 2 fois i\n\n/*function nbre_caracteres(lettre,mot)\n {\n mot2 = mot.split(lettre);\n nbre_de_fois_trouve = mot2.length-1;\n return nbre_de_fois_trouve;\n }\n\ndata = data.filter(function(e){\n if (nbre_caracteres('i',e.name)==2)\n return e;\n});*/\n\nlet html =\"\";\ndata.forEach(e => {\n let url =`images/${e.name.toLowerCase()}.jpg`;\n html+=`<article class=\"pizzaThumbnail\">\n\t<a href=${url}>\n\t\t<img src=\"${url}\"/>\n <section>\n <h4>${e.name}</h4>\n <ul>\n\t\t\t\t<li>Prix petit format : ${e.price_small} €</li>\n\t\t\t\t<li>Prix grand format : ${e.price_large} €</li>\n\t\t\t</ul>\n\n </section>\n\t</a>\n</article>`\n});\ndocument.querySelector('.pageContent').innerHTML = html;\n"],"file":"main.js"}
\ No newline at end of file
index.html
+ 1
− 0
View file @ e562b772
...@@ -13,6 +13,7 @@ ...@@ -13,6 +13,7 @@
<link rel="stylesheet" href="css/news.css"> <link rel="stylesheet" href="css/news.css">
<link rel="stylesheet" href="css/pizzaList.css"> <link rel="stylesheet" href="css/pizzaList.css">
<link rel="stylesheet" href="css/footer.css"> <link rel="stylesheet" href="css/footer.css">
<script src="build/main.js" defer></script>
</head> </head>
<body> <body>
<header> <header>
......
package-lock.json 0 → 100644
+ 3005
− 0
View file @ e562b772
This diff is collapsed.
package.json 0 → 100644
+ 21
− 0
View file @ e562b772
{
"name": "tp1",
"version": "1.0.0",
"description": "<img src=\"images/readme/header.jpg\">",
"main": "index.js",
"dependencies": {},
"devDependencies": {
"@babel/cli": "^7.12.10",
"@babel/core": "^7.12.10",
"@babel/preset-env": "^7.12.11"
},
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"repository": {
"type": "git",
"url": "https://gitlab.univ-lille.fr/sacha.lepage.etu/tp1.git"
},
"author": "",
"license": "ISC"
}
src/main.js
+ 128
− 1
View file @ e562b772
console.log('Welcome to PizzaLand 🍕 !'); //PARTIE D
\ No newline at end of file
//const pizzName = 'Regina';
//const url =`images/${pizzName.toLowerCase()}.jpg`;
//console.log(url);
//const html = `<article class="pizzaThumbnail"><a href=\"${url}\"><img src=\"${url}\"/><section>Regina</section></a></article>
//`;
//console.log(html);
//document.querySelector('.pageContent').innerHTML = html;
//PARTIE E.1
//const data = ['Regina', 'Napolitaine', 'Spicy'];
//let html ="";
//for(let i=0;i<data.length;i++){
//let url =`images/${data[i].toLowerCase()}.jpg`;
// html += `<article class="pizzaThumbnail"> <a href="${url}"> <img src="${url}"/> <section>${data[i]}</section> </a> </article>`;
//console.log(html);
//}
//document.querySelector('.pageContent').innerHTML = html;
/*data.forEach(e => {
let url =`images/${e.toLowerCase()}.jpg`;
html += `<article class="pizzaThumbnail">
<a href="${url}"> <img src="${url}"/>
<section>${e}</section>
</a>
</article>`;
});
document.querySelector('.pageContent').innerHTML = html;*/
//PARTIE E.2
let data = [
{
name: 'Regina',
base: 'tomate',
price_small: 6.5,
price_large: 9.95,
image: 'https://images.unsplash.com/photo-1532246420286-127bcd803104?fit=crop&w=500&h=300'
},
{
name: 'Napolitaine',
base: 'tomate',
price_small: 6.5,
price_large: 8.95,
image: 'https://images.unsplash.com/photo-1562707666-0ef112b353e0?&fit=crop&w=500&h=300'
},
{
name: 'Spicy',
base: 'crème',
price_small: 5.5,
price_large: 8,
image: 'https://images.unsplash.com/photo-1458642849426-cfb724f15ef7?fit=crop&w=500&h=300',
}
];
// trier par nom
/*data=data.sort(function(a,b){
if ( a.name < b.name)
return -1;
if (a.name > b.name)
return 1;
return 0;
}
);*/
//trier par prix petit format croissant
/*data=data.sort(function(a,b){
if ( a.price_small < b.price_small)
return -1;
if (a.price_small > b.price_small)
return 1;
if(a.price_small == b.price_small){
if ( a.price_large < b.price_large)
return -1;
if (a.price_large > b.price_large)
return 1;
}
return 0;
}
);*/
//filtrer par tomate
/*data = data.filter(function(e){
if (e.base == 'tomate')
return e;
});*/
//filtrer prix < 6
/*data = data.filter(function(e){
if (e.price_small < 6)
return e;
});*/
//filtrer le nom contient 2 fois i
/*function nbre_caracteres(lettre,mot)
{
mot2 = mot.split(lettre);
nbre_de_fois_trouve = mot2.length-1;
return nbre_de_fois_trouve;
}
data = data.filter(function(e){
if (nbre_caracteres('i',e.name)==2)
return e;
});*/
let html ="";
data.forEach(e => {
let url =`images/${e.name.toLowerCase()}.jpg`;
html+=`<article class="pizzaThumbnail">
<a href=${url}>
<img src="${url}"/>
<section>
<h4>${e.name}</h4>
<ul>
<li>Prix petit format : ${e.price_small} €</li>
<li>Prix grand format : ${e.price_large} €</li>
</ul>
</section>
</a>
</article>`
});
document.querySelector('.pageContent').innerHTML = html;
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment