package reading.component.index

import rx._

import scalatags.JsDom.all._
import scalacss.Defaults._
import scalacss.ScalatagsCss._

import reading.component.index.style.{ Books => BooksStyle }
import reading.models.{ Book, Program }
import reading.utils.RxTag

object Books {
  def apply(books: Rx[Seq[Book]]): Frag =
    div(
      BooksStyle.render,

      RxTag { implicit context =>
        div(
          div(
            BooksStyle.count,
            s"${books().length} livres"
          ),

          div(
            BooksStyle.books,

            books().sorted.map { book =>
              div(
                BooksStyle.book,
                div(BooksStyle.title, book.title),
                div(BooksStyle.author, s", ${book.author}"),
                div(
                  BooksStyle.detail,
                  img(
                    BooksStyle.cover,
                    src := s"cover/${book.title}.jpg"
                  ),
                  div(
                    if (book.programs.nonEmpty) {
                      div(
                        item("classe", book.programs.map(Program.grade(_).prettyPrint).distinct.sorted.mkString(", ")),
                        item("programme", book.programs.map(p => "« " ++ p.prettyPrint ++ " »").sorted.mkString(", "))
                      )
                    },
                    if (book.themes.nonEmpty) {
                      item("thème", book.themes.sorted.map(_.prettyPrint).mkString(", "))
                    },
                    if (book.genres.nonEmpty) {
                      item("genre", book.genres.sorted.map(_.prettyPrint).mkString(", "))
                    },
                    book.period.map { period =>
                      item("période", period.prettyPrint)
                    }
                  )
                )
              )
            }
          )
        )
      }
    )

  def item(key: String, value: String): Frag =
    div(
      BooksStyle.item,
      span(BooksStyle.itemKey, key),
      span(BooksStyle.itemValue, value)
    )
}