diff --git a/.vscode/settings.json b/.vscode/settings.json new file mode 100644 index 00000000..f673a71b --- /dev/null +++ b/.vscode/settings.json @@ -0,0 +1,3 @@ +{ + "liveServer.settings.port": 5502 +} \ No newline at end of file diff --git a/01/app.js b/01/app.js index 1c9992ed..7b310b02 100644 --- a/01/app.js +++ b/01/app.js @@ -1 +1,8 @@ -console.log('DOM'); \ No newline at end of file +console.log('DOM'); + +const commentsElements = document.querySelector('.comments__item.comments__item--newest'); +if(commentsElements) { + const dataInfoEl = commentsElements.querySelectorAll('[data-info]'); + console.log(dataInfoEl.length); +} + diff --git a/02/app.js b/02/app.js index 1c9992ed..440e9c1a 100644 --- a/02/app.js +++ b/02/app.js @@ -1 +1,7 @@ -console.log('DOM'); \ No newline at end of file +console.log('DOM'); + +const linksEl = document.querySelectorAll('a[data-url]'); +linksEl.forEach(function(link, index) { + const dataUrl = link.getAttribute('data-url'); + link.setAttribute('href', dataUrl) +}) \ No newline at end of file diff --git a/03/app.js b/03/app.js index c299ca32..8e08eff9 100644 --- a/03/app.js +++ b/03/app.js @@ -11,4 +11,36 @@ const buttonSettings = { color: '#444' }, text: 'Click me!', -} \ No newline at end of file +} + + +const buttonSection = document.querySelector('.parent-for-button') + + +// if(buttonSection) { +// const button = document.createElement('button'); + +// button.classList.add(buttonSettings.attr.className); +// button.title = buttonSettings.attr.title; +// button.style.border = buttonSettings.css.border; +// button.style.padding = buttonSettings.css.padding; +// button.style.color = buttonSettings.css.color; +// button.textContent = buttonSettings.text; + +// buttonSection.appendChild(button) +// } + + +const button = document.createElement('button'); + +for(let key in buttonSettings.attr) { + button.setAttribute(key, buttonSettings.attr[key]) +} +for(let key in buttonSettings.css) { + button.setAttribute(key, buttonSettings.css[key]) +} + +button.textContent = buttonSettings.text; + +buttonSection.appendChild(button) + diff --git a/04/app.js b/04/app.js index e6411e4e..610f48fc 100644 --- a/04/app.js +++ b/04/app.js @@ -5,4 +5,35 @@ const menuItems = [ {text: 'start', url: '/'}, {text: 'galeria', url: '/gallery'}, {text: 'kontakt', url: '/contact'}, -]; \ No newline at end of file +]; + + +const navElement = document.querySelector('nav'); +if(navElement) { + const ulElement = document.createElement('ul'); +if(ulElement) { + menuItems.forEach( function(item) { + const liElement = document.createElement('li') + const linkElement = document.createElement('a') + linkElement.setAttribute('href', item.url) + linkElement.innerText = item.text + liElement.appendChild(linkElement) + ulElement.appendChild(liElement) + + } ) + + + // for(let key in menuItems) { + // const liElement = document.createElement('li') + // const linkElement = document.createElement('a') + // linkElement.setAttribute('href', menuItems[key].url) + // linkElement.innerText = menuItems[key].text + // liElement.appendChild(linkElement) + // ulElement.appendChild(liElement) + + // } +} + + navElement.appendChild(ulElement) +} + diff --git a/05/app.js b/05/app.js index 39abe5d5..a36e7dd9 100644 --- a/05/app.js +++ b/05/app.js @@ -1,3 +1,36 @@ console.log('DOM'); const curr = document.querySelector('.js-curr'); +if(curr) { + const buttonsParent = curr.parentElement + const nextButton = document.createElement('button'); + + nextButton.innerText = 'UsuĊ„ z koszyka' + + buttonsParent.appendChild(nextButton); + + for(let i = 0; i < buttonsParent.children.length; i++) { + if(buttonsParent.children[i] !== curr) { + buttonsParent.children[i].classList.add('.siblings') + } + } + + buttonsParent.nextElementSibling.setAttribute('title', 'nextElementSibling') + + const buttonsParentParent = buttonsParent.parentElement + const lastArticle = buttonsParentParent.lastElementChild + const lastButton = lastArticle.querySelector('button') + const pEl = document.createElement('p') + + pEl.innerText = 'Paragraf przed buttonem' + lastArticle.insertBefore(pEl, lastButton) + + + const article = buttonsParentParent.querySelector('article') + const newArticle = article.cloneNode(true) + + buttonsParentParent.insertBefore(newArticle, buttonsParentParent.firstElementChild) + + + +}