175 lines
6.9 KiB
JavaScript
Vendored
175 lines
6.9 KiB
JavaScript
Vendored
import m from "mithril"
|
|
import { RaisedButton, Card, Button } from "polythene-mithril"
|
|
import { nav } from "./nav"
|
|
import { editButton, seeButton } from "./buttons"
|
|
import Section from "../models/Section"
|
|
let sId = require("../../json/section/id/example")
|
|
let sList = require("../../json/questionnaire/id/sections/example")
|
|
|
|
var pagination = {
|
|
oncreate: function() {
|
|
for (var i = 0; i < document.getElementsByClassName("flex-single").length; i++) {
|
|
document.getElementsByClassName("flex-single")[i].style.flexGrow = 1
|
|
}
|
|
},
|
|
view: function() {
|
|
return m(".flex", {
|
|
style: {
|
|
backgroundColor: "#fff",
|
|
position: "fixed",
|
|
bottom: "0",
|
|
width: "100%",
|
|
padding: "1em"
|
|
}
|
|
}, [
|
|
m(".flex-single"),
|
|
m(RaisedButton, {
|
|
className: "flex-single",
|
|
label: m("i.fa.fa-arrow-left.fa-fw", {
|
|
style: {
|
|
margin: "1em 0",
|
|
}
|
|
}),
|
|
events: {
|
|
onclick: function() {
|
|
// var prev = _.find(sModel.list, function(o) { return o.id == parseInt(sModel.current.id) - 1 })
|
|
var prev = _.find(Section.list, function(o) { return o.id == parseInt(Section.current.id) - 1 })
|
|
if (prev != undefined) {
|
|
/* Request pake url yang tersedia */
|
|
// qModel.fetch(prev.url)
|
|
m.route.set("/sections/" + prev.id)
|
|
}
|
|
}
|
|
}
|
|
}),
|
|
m(".flex-single"),
|
|
m(RaisedButton, {
|
|
className: "flex-single",
|
|
label: m("i.fa.fa-arrow-right.fa-fw", {
|
|
style: {
|
|
margin: "1em 0",
|
|
}
|
|
}),
|
|
events: {
|
|
onclick: function() {
|
|
// var next = _.find(sModel.list, function(o) { return o.id == parseInt(sModel.current.id) + 1 })
|
|
var next = _.find(Section.list, function(o) { return o.id == parseInt(Section.current.id) + 1 })
|
|
if (next != undefined) {
|
|
/* Request pake url yang tersedia */
|
|
// sModel.fetch(next.url)
|
|
m.route.set("/sections/" + next.id)
|
|
}
|
|
}
|
|
}
|
|
}),
|
|
m(".flex-single")
|
|
])
|
|
}
|
|
}
|
|
|
|
var sCard = {
|
|
view: function() {
|
|
return m(".flex", m(Card, {
|
|
style: {
|
|
flexGrow: "1",
|
|
marginBottom: "14vh",
|
|
// marginTop: "11vh"
|
|
},
|
|
content: [
|
|
{
|
|
primary: {
|
|
title: [
|
|
m(editButton, { redirectURL: "/user/sections/" + Section.current.id + "/edit" }),
|
|
m("#title", Section.current.title)
|
|
],
|
|
subtitle: Section.current.description
|
|
}
|
|
},
|
|
{
|
|
text: {
|
|
content: [
|
|
m("div", {
|
|
style: {
|
|
marginBottom: "1em"
|
|
}
|
|
}, [
|
|
m("div.info", {
|
|
style: {
|
|
color: "#999"
|
|
}
|
|
}, "Dibuat: " + Section.current.createdAt),
|
|
m("div.info", {
|
|
style: {
|
|
color: "#999"
|
|
}
|
|
}, "Pembuat: " + Section.current.creator.name),
|
|
m("div.info", {
|
|
style: {
|
|
color: "#999"
|
|
}
|
|
}, "Diubah: " + Section.current.updatedAt)
|
|
]),
|
|
m("p", {
|
|
style: {
|
|
fontSize: "large"
|
|
}
|
|
}, "Pertanyaan"),
|
|
m(".flex", {
|
|
style: {
|
|
flexFlow: "row wrap"
|
|
}
|
|
}, _.sortBy(Section.current.questions, [function(o) {
|
|
return o.number
|
|
}]).map(function(sq) {
|
|
return m("#drag-wrapper-" + sq.id, {
|
|
style: {
|
|
flexGrow: "1",
|
|
flexBasis: "100%",
|
|
minHeight: "94px",
|
|
margin: ".5em 0"
|
|
}
|
|
}, m(Card, {
|
|
style: {width: "100%", margin: "0", padding: "0"},
|
|
id: sq.id,
|
|
className: "draggable",
|
|
content: [
|
|
{
|
|
primary: {
|
|
title: m("a", {
|
|
style: {
|
|
cursor: "pointer"
|
|
},
|
|
onclick: function() {
|
|
m.route.set("/user/questions/" + sq.id)
|
|
}
|
|
}, sq.text),
|
|
subtitle: sq.description
|
|
}
|
|
}
|
|
]
|
|
}))
|
|
}))
|
|
]
|
|
}
|
|
}
|
|
]
|
|
}))
|
|
}
|
|
}
|
|
|
|
export const section = {
|
|
oninit: function() {
|
|
if (_.isNil(Section.current) || _.isEmpty(Section.current)) Section.fetchCurrent()
|
|
},
|
|
view: function() {
|
|
return [
|
|
m(nav, {
|
|
title: "Seksi #" + Section.current.id,
|
|
back: "/user/questionnaires/" + Section.current.questionnaire.id
|
|
}),
|
|
m(sCard),
|
|
m(pagination)
|
|
]
|
|
}
|
|
}
|