search

impactbyte-haku / projects

🌐 Projects
https://gitlab.com/impactbyte/learn/course-fullstackweb
9 stars 1 forks source link

Project JavaScript OOP #32

Open mhaidarhanif opened 5 years ago

mhaidarhanif commented 5 years ago

Submit here.

sarahgushef commented 5 years ago

https://github.com/sarahgushef/project-javascript-oop

nchristanto commented 5 years ago
yfrance commented 5 years ago

https://github.com/yfrance/project-javascript-oop

arifinoid commented 5 years ago

https://github.com/arifinoid/project-javascript-oop

BintangSaputra commented 5 years ago

https://github.com/BintangSaputra/project-oop-javascript

codedarlyn commented 5 years ago

https://github.com/codedarlyn/project-javascript-oop

zeinhm commented 5 years ago

https://github.com/Zaynhmad/project-javascript-oop

rizariza69 commented 5 years ago

https://github.com/rizariza69/project-javascript-oop

dickymr commented 5 years ago

https://github.com/dickymr/project-javascript-oop

mhaidarhanif commented 5 years ago 
class InstagramPost {
  constructor(imageURL) {
    this.imageURL = imageURL
    this.likes = []
  }

  likedByUser(id) {
    this.likes.concat(id)
  }
}

const jokePost = new InstagramPost('joke.jpg')

console.log(jokePost)

document.getElementById('post-1').setAttribute('src', jokePost.imageURL)
mhaidarhanif commented 5 years ago 
<!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>JavaScript</title>
  </head>
  <body>
    <img src="" alt="" id="post-1" height="200" />
    <p>
      <img id="post-1-heart" src="" alt="Like" height="10" />
      <span id="post-1-likes"></span>
      <span id="post-1-likes-text"></span>
    </p>

    <script src="index.js"></script>
  </body>
</html>
class InstagramPost {
  constructor(imageURL) {
    this.imageURL = imageURL
    this.likes = []
  }

  likedByUser(id) {
    this.likes.push(id)
  }

  getLikes() {
    return this.likes
  }

  render() {
    document.getElementById('post-1').setAttribute('src', jokePost.imageURL)
  }

  renderLikesCount(postId) {
    document.getElementById(`post-${postId}-likes`).innerHTML =
      this.likes.length > 0 ? this.likes.length : ''

    document.getElementById(`post-${postId}-likes-text`).innerHTML =
      this.likes.length > 1 ? 'likes' : 'like'

    document
      .getElementById(`post-${postId}-heart`)
      .setAttribute(
        'src',
        this.likes.length > 0 ? 'heart-red.png' : 'heart-grey.png'
      )
  }
}

const jokePost = new InstagramPost('joke.jpg')

jokePost.likedByUser(1)
jokePost.likedByUser(1)

jokePost.render()
jokePost.renderLikesCount(1)
yevgenysiregar commented 5 years ago

https://github.com/yevgenysiregar/project-javascript-oop