diff --git a/app.js b/app.js
new file mode 100644
index 0000000..b9c0668
--- /dev/null
+++ b/app.js
@@ -0,0 +1,313 @@
+const slide=[
+{img: "back2.jpg" } ,
+{img: "images (2).jpg" } ,
+{img: "images (3).jpg"},
+{img: "images (4).jpg" }
+];
+let elem=document.getElementById('slideshow-container')
+let dot = document.getElementById("dot")
+const a=slide.map(value =>{
+ return`
+
+
+
+ `;
+})
+const b=slide.map((vL,index)=>{
+ return`
+
+ `;
+})
+elem.innerHTML= a.join("");
+dot.innerHTML= b.join("");
+let n=0;
+ let slideIndex = 1;
+ function showSlides(n) {
+ let i;
+ let slides = document.getElementsByClassName("mySlides");
+ let dots = document.getElementsByClassName("dot");
+ if (n > slides.length) {
+ slideIndex = 1
+ }
+ if (n < 1) {
+ slideIndex = slides.length
+ }
+ for (i = 0; i < slides.length; i++) {
+ slides[i].style.display = "none";
+ }
+ for (i = 0; i < dots.length; i++) {
+ dots[i].className = dots[i].className.replace(" active", "");
+ }
+ slides[slideIndex - 1].style.display = "block";
+ dots[slideIndex - 1].className += " active";
+ }
+ showSlides(slideIndex);
+
+ function plusSlides(n) {
+ showSlides(slideIndex += n);
+ }
+
+ function currentSlide(n) {
+ showSlides(slideIndex = n);
+ }
+setInterval(function(){
+ n++;
+ if(n>slide.length-1){
+ n=0;
+ }
+ showSlides(slideIndex = n);
+ },3000);
+ const infoUser=[
+ {img:"images (6).jpg",des:"Lorem ipsuLoremssekx eld elk ke dwefnkwfkjn wifh iowf h ouwaofuupowa hfdhfihedfohiohd fohawih f hbewfoihawfiwehfiyweghfi f iuhe fuh weiu f hip uwe hfiuhwefphiuawfi kem l mecddddd dddddd ddddddd dddddd dddddde ce cec",name:"KEN BILLE",id:"@sajad001184",twitter:"twitter.png"},
+ {img:"images (6).jpg",des:"Lorem ipsuLoremssekx eld elk ke d kem l mece ce cec",name:"KEN BILLE",id:"@sajad001184"},
+ {img:"images (6).jpg",des:"Lorem ipsuLoremssekx eld elk ke d kem l mee ce cec",name:"KEN BILLE",id:"@sajad001184"}
+ ];
+
+
+
+
+
+ let para1=document.getElementById("lorem1");
+ let title=document.getElementById("title");
+ let title1=document.getElementById("title1");
+ let subtitle=document.getElementById("subtitle");
+ let subtitle1=document.getElementById("subtitle1");
+ let twitter=document.getElementById("twitter");
+ let twitter1=document.getElementById("twitter1");
+ let lorem=document.getElementById("lorem");
+ let imgclient1=document.getElementById("imgclient1");
+ let imgclient=document.getElementById("imgclient");
+ const username = document.getElementById("username");
+ lorem.innerHTML=infoUser[0].des;
+ lorem1.innerHTML=infoUser[0].des;
+ title.innerHTML=infoUser[0].name;
+ title1.innerHTML=infoUser[0].name;
+ subtitle.innerHTML=infoUser[0].id;
+ subtitle1.innerHTML=infoUser[0].id;
+ imgclient.setAttribute("src",infoUser[0].img);
+ imgclient1.setAttribute("src",infoUser[0].img);
+ twitter.setAttribute("src",infoUser[0].twitter);
+ twitter1.setAttribute("src",infoUser[0].twitter);
+
+ let title1_box=document.getElementById("title1-box");
+
+ let user_box=document.getElementById("user-box");
+let edit_button = document.getElementById("edit-button");
+const end_button = document.getElementById("end-editing");
+ const modal = document.getElementById("myModal");
+let text_box=document.getElementById("text-box");
+
+const btn = document.getElementById("myBtn");
+const close_btn = document.getElementById("close-btn");
+const span = document.getElementById("close");
+const close_buttom = document.getElementById("close-button");
+let myfile=document.getElementById("myfile");
+
+imgclient1.onclick=function(){
+
+}
+
+
+
+
+
+btn.onclick = function() {
+ modal.style.display = "block";
+}
+
+
+span.onclick = function() {
+edit_button.style.display="block";
+end_button.style.display="none";
+close_btn.style.display="none";
+modal.style.display = "none";
+}
+
+
+window.onclick = function(event) {
+ if (event.target == modal) {
+ modal.style.display = "none";
+ }
+}
+
+
+
+edit_button.addEventListener("click", function() {
+subtitle1.style.display="none";
+title1_box.style.display="block";
+title1_box.value=subtitle1.textContent;
+subtitle1.textContent="";
+
+
+title1.style.display="none";
+user_box.style.display="block";
+user_box.value=title1.textContent;
+title1.textContent="";
+
+para1.style.display="none";
+text_box.style.display="block";
+text_box.value=para1.textContent;
+para1.textContent="";
+edit_button.style.display="none";
+end_button.style.display="block";
+close_btn.style.display="block";
+} );
+end_button.addEventListener("click", function() {
+subtitle1.textContent=title1_box.value;
+subtitle1.style.display="block";
+title1_box.style.display="none";
+
+title1.textContent=user_box.value;
+title1.style.display="block";
+user_box.style.display="none";
+
+para1.textContent=text_box.value;
+para1.style.display="block";
+text_box.style.display="none";
+ edit_button.style.display="block";
+end_button.style.display="none";
+close_btn.style.display="none";
+title1.style.backgroundColor="pink";
+
+} )
+close_btn.onclick=function(){
+subtitle1.style.display="block";
+title1_box.style.display="none";
+subtitle1.textContent=infoUser[0].id;
+
+title1.style.display="block";
+user_box.style.display="none";
+title1.textContent=infoUser[0].title;
+
+para1.style.display="block";
+text_box.style.display="none";
+para1.textContent=infoUser[0].des;
+edit_button.style.display="block";
+end_button.style.display="none";
+close_btn.style.display="none";
+
+}
+close_buttom.onclick=function(){
+modal.style.display = "none";
+edit_button.style.display="block";
+end_button.style.display="none";
+close_btn.style.display="none";
+
+
+}
+
+
+
+
+
+
+
+ let para2=document.getElementById("lorem3");
+ let title2=document.getElementById("title2");
+ let title3=document.getElementById("title3");
+ let subtitle2=document.getElementById("subtitle2");
+ let subtitle3=document.getElementById("subtitle3");
+ let twitter2=document.getElementById("twitter2");
+ let twitter3=document.getElementById("twitter3");
+ let lorem2=document.getElementById("lorem2");
+ let imgclient2=document.getElementById("imgclient2");
+ let imgclient3=document.getElementById("imgclient3");
+ lorem2.innerHTML=infoUser[1].des;
+ lorem3.innerHTML=infoUser[1].des;
+ title2.innerHTML=infoUser[1].name;
+ title3.innerHTML=infoUser[1].name;
+ subtitle2.innerHTML=infoUser[1].id;
+ subtitle3.innerHTML=infoUser[1].id;
+ imgclient2.setAttribute("src",infoUser[1].img);
+ imgclient3.setAttribute("src",infoUser[1].img);
+ twitter2.setAttribute("src",infoUser[1].twitter);
+ twitter3.setAttribute("src",infoUser[1].twitter);
+
+ let title1_box2=document.getElementById("title1-box2");
+
+ let user_box2=document.getElementById("user-box2");
+let edit_button2 = document.getElementById("edit-button2");
+const end_button2 = document.getElementById("end-editing2");
+ const modal2 = document.getElementById("myModal2");
+let text_box2=document.getElementById("text-box2");
+
+const btn2 = document.getElementById("myBtn2");
+const close_btn2 = document.getElementById("close-btn2");
+const span2 = document.getElementById("close2");
+const close_buttom2 = document.getElementById("close-button2");
+
+
+btn2.onclick = function() {
+ modal2.style.display = "block";
+}
+
+
+
+
+
+
+
+
+edit_button2.addEventListener("click", function() {
+subtitle2.style.display="none";
+title1_box2.style.display="block";
+title1_box2.value=subtitle2.textContent;
+subtitle2.textContent="";
+
+
+title2.style.display="none";
+user_box2.style.display="block";
+user_box2.value=title2.textContent;
+title2.textContent="";
+
+para2.style.display="none";
+text_box2.style.display="block";
+text_box2.value=para2.textContent;
+para2.textContent="";
+edit_button2.style.display="none";
+end_button2.style.display="block";
+close_btn2.style.display="block";
+} );
+end_button2.addEventListener("click", function() {
+subtitle2.textContent=title1_box2.value;
+subtitle2.style.display="block";
+title1_box2.style.display="none";
+
+title2.textContent=user_box2.value;
+title2.style.display="block";
+user_box2.style.display="none";
+
+para2.textContent=text_box2.value;
+para2.style.display="block";
+text_box2.style.display="none";
+ edit_button2.style.display="block";
+end_button2.style.display="none";
+close_btn2.style.display="none";
+title2.style.backgroundColor="pink";
+
+} )
+close_btn2.onclick=function(){
+subtitle2.style.display="block";
+title1_box2.style.display="none";
+subtitle2.textContent=infoUser[1].id;
+
+title2.style.display="block";
+user_box2.style.display="none";
+title2.textContent=infoUser[1].title;
+
+para2.style.display="block";
+text_box2.style.display="none";
+para2.textContent=infoUser[1].des;
+edit_button2.style.display="block";
+end_button2.style.display="none";
+close_btn2.style.display="none";
+
+}
+close_buttom2.onclick=function(){
+modal2.style.display = "none";
+edit_button2.style.display="block";
+end_button2.style.display="none";
+close_btn2.style.display="none";
+
+
+}
\ No newline at end of file