Skip to content
GitLab
Menu
Projects
Groups
Snippets
Help
Help
Support
Community forum
Keyboard shortcuts
?
Submit feedback
Contribute to GitLab
Sign in / Register
Toggle navigation
Menu
Open sidebar
AURA
dashboard
Commits
56491736
Commit
56491736
authored
Feb 14, 2018
by
Andrea Ida Malkah Klaura
Browse files
modal for notes & prettyDate mixins
parent
10a74dcb
Changes
3
Hide whitespace changes
Inline
Side-by-side
src/components/ShowManager.vue
View file @
56491736
...
...
@@ -36,6 +36,8 @@
</b-row>
</div>
<div
v-else
>
<app-modalNotes
ref=
"appModalNotes"
v-bind:note=
"current.note"
></app-modalNotes>
<p
align=
"left"
>
Die nächsten
<select
v-model=
"numUpcoming"
>
<option>
8
</option>
<option>
16
</option>
...
...
@@ -50,7 +52,7 @@
{{ prettyDate(timeslot.start) }} ({{ prettyDuration(timeslot.start, timeslot.end) }})
<span
v-if=
"loaded.notes"
>
{{ prettyTimeslotNote(timeslot.id) }}
</span>
<span
v-else
style=
"background: ../assets/radio.gif"
></span>
<img
src=
"../assets/16x16/emblem-system.png"
alt=
"edit"
v-on:click=
"
notYetImplemented
"
/>
<img
src=
"../assets/16x16/emblem-system.png"
alt=
"edit
note
"
v-on:click=
"
editNote(timeslot.id)
"
/>
</div>
</b-col>
</b-row>
...
...
@@ -256,15 +258,15 @@
</template>
<
script
>
import
modalNotes
from
'
./ShowManagerModalNotes.vue
'
import
timeslotSort
from
'
../mixins/timeslotSort
'
import
prettyDate
from
'
../mixins/prettyDate
'
import
axios
from
'
axios
'
function
leadingZero
(
num
)
{
if
(
num
<
10
)
return
'
0
'
+
num
else
return
num
.
toString
()
}
export
default
{
components
:
{
'
app-modalNotes
'
:
modalNotes
},
data
()
{
return
{
shows
:
[],
// an array of objects describing our shows (empty at load, will be populated on created())
...
...
@@ -293,11 +295,12 @@ export default {
topics
:
[],
musicfocus
:
[],
rtrcategory
:
[],
type
:
[]
type
:
[],
note
:
{}
}
}
},
mixins
:
[
timeslotSort
],
mixins
:
[
timeslotSort
,
prettyDate
],
computed
:
{
timeslotsFutureShow
:
function
()
{
if
(
this
.
numUpcoming
===
'
all
'
)
return
this
.
timeslotsFuture
...
...
@@ -335,14 +338,14 @@ export default {
this
.
getRTRCategory
()
this
.
getType
()
// now fetch the single timeslots for a given show from PV backend
axios
.
get
(
process
.
env
.
API_STEERING_SHOWS
+
this
.
currentShowID
+
'
/timeslots/
'
).
then
(
response
=>
{
axios
.
get
(
process
.
env
.
API_STEERING_SHOWS
+
this
.
currentShowID
+
'
/timeslots/
'
,
{
withCredentials
:
true
}
).
then
(
response
=>
{
this
.
timeslots
=
response
.
data
this
.
loaded
.
timeslots
=
true
// now that we have the timeslots we can fetch notes for all those timeslots
// TODO: curently we are fetching all notes for the show into a single array
// for bigger data sets it might be preferable to fetch only the notes for those
// timeslots that are also visible to the user
axios
.
get
(
process
.
env
.
API_STEERING_SHOWS
+
this
.
currentShowID
+
'
/notes/
'
).
then
(
response
=>
{
axios
.
get
(
process
.
env
.
API_STEERING_SHOWS
+
this
.
currentShowID
+
'
/notes/
'
,
{
withCredentials
:
true
}
).
then
(
response
=>
{
this
.
notes
=
response
.
data
this
.
loaded
.
notes
=
true
}).
catch
(
error
=>
{
...
...
@@ -354,6 +357,15 @@ export default {
})
// done fetching timeslots
},
editNote
:
function
(
timeslotID
)
{
for
(
var
n
in
this
.
notes
)
{
if
(
this
.
notes
[
n
].
timeslot
===
timeslotID
)
{
this
.
current
.
note
=
this
.
notes
[
n
]
break
}
}
this
.
$refs
.
appModalNotes
.
$refs
.
modalNote
.
show
()
},
getTimeslotNote
:
function
(
timeslotID
)
{
for
(
var
n
in
this
.
notes
)
{
if
(
this
.
notes
[
n
].
timeslot
===
timeslotID
&&
this
.
notes
[
n
].
title
!==
undefined
)
{
...
...
@@ -362,17 +374,6 @@ export default {
}
return
null
},
prettyDate
:
function
(
date
)
{
var
d
=
new
Date
(
date
)
// note: Date.getMonth() returns the month as an index from 0 to 11
return
leadingZero
(
d
.
getDate
())
+
'
.
'
+
leadingZero
(
d
.
getMonth
()
+
1
)
+
'
.
'
+
d
.
getFullYear
()
+
'
'
+
leadingZero
(
d
.
getHours
())
+
'
:
'
+
leadingZero
(
d
.
getMinutes
())
},
prettyDuration
:
function
(
start
,
end
)
{
var
duration
=
(
new
Date
(
end
).
getTime
()
-
new
Date
(
start
).
getTime
())
/
1000
var
hours
=
Math
.
floor
(
duration
/
60
/
60
)
var
minutes
=
(
duration
/
60
)
%
60
return
leadingZero
(
hours
)
+
'
:
'
+
leadingZero
(
minutes
)
},
prettyTimeslotNote
:
function
(
timeslotID
)
{
var
note
=
this
.
getTimeslotNote
(
timeslotID
)
if
(
note
!==
null
)
{
...
...
@@ -396,7 +397,7 @@ export default {
this
.
loaded
.
categories
=
true
}
else
{
for
(
var
i
in
this
.
shows
[
this
.
currentShow
].
category
)
{
axios
.
get
(
process
.
env
.
API_STEERING
+
'
categories/
'
+
this
.
shows
[
this
.
currentShow
].
category
[
i
]).
then
(
response
=>
{
axios
.
get
(
process
.
env
.
API_STEERING
+
'
categories/
'
+
this
.
shows
[
this
.
currentShow
].
category
[
i
]
,
{
withCredentials
:
true
}
).
then
(
response
=>
{
this
.
current
.
categories
.
push
(
response
.
data
)
}).
catch
(
error
=>
{
loadingError
=
true
...
...
@@ -413,7 +414,7 @@ export default {
this
.
loaded
.
hosts
=
true
}
else
{
for
(
var
i
in
this
.
shows
[
this
.
currentShow
].
hosts
)
{
axios
.
get
(
process
.
env
.
API_STEERING
+
'
hosts/
'
+
this
.
shows
[
this
.
currentShow
].
hosts
[
i
]
+
'
/
'
).
then
(
response
=>
{
axios
.
get
(
process
.
env
.
API_STEERING
+
'
hosts/
'
+
this
.
shows
[
this
.
currentShow
].
hosts
[
i
]
+
'
/
'
,
{
withCredentials
:
true
}
).
then
(
response
=>
{
this
.
current
.
hosts
.
push
(
response
.
data
)
}).
catch
(
error
=>
{
loadingError
=
true
...
...
@@ -430,7 +431,7 @@ export default {
this
.
loaded
.
categories
=
true
}
else
{
for
(
var
i
in
this
.
shows
[
this
.
currentShow
].
language
)
{
axios
.
get
(
process
.
env
.
API_STEERING
+
'
languages/
'
+
this
.
shows
[
this
.
currentShow
].
language
[
i
]).
then
(
response
=>
{
axios
.
get
(
process
.
env
.
API_STEERING
+
'
languages/
'
+
this
.
shows
[
this
.
currentShow
].
language
[
i
]
,
{
withCredentials
:
true
}
).
then
(
response
=>
{
this
.
current
.
languages
.
push
(
response
.
data
)
}).
catch
(
error
=>
{
loadingError
=
true
...
...
@@ -447,7 +448,7 @@ export default {
this
.
loaded
.
topics
=
true
}
else
{
for
(
var
i
in
this
.
shows
[
this
.
currentShow
].
topic
)
{
axios
.
get
(
process
.
env
.
API_STEERING
+
'
topics/
'
+
this
.
shows
[
this
.
currentShow
].
topic
[
i
]).
then
(
response
=>
{
axios
.
get
(
process
.
env
.
API_STEERING
+
'
topics/
'
+
this
.
shows
[
this
.
currentShow
].
topic
[
i
]
,
{
withCredentials
:
true
}
).
then
(
response
=>
{
this
.
current
.
topics
.
push
(
response
.
data
)
}).
catch
(
error
=>
{
loadingError
=
true
...
...
@@ -464,7 +465,7 @@ export default {
this
.
loaded
.
musicfocus
=
true
}
else
{
for
(
var
i
in
this
.
shows
[
this
.
currentShow
].
musicfocus
)
{
axios
.
get
(
process
.
env
.
API_STEERING
+
'
musicfocus/
'
+
this
.
shows
[
this
.
currentShow
].
musicfocus
[
i
]).
then
(
response
=>
{
axios
.
get
(
process
.
env
.
API_STEERING
+
'
musicfocus/
'
+
this
.
shows
[
this
.
currentShow
].
musicfocus
[
i
]
,
{
withCredentials
:
true
}
).
then
(
response
=>
{
this
.
current
.
musicfocus
.
push
(
response
.
data
)
}).
catch
(
error
=>
{
loadingError
=
true
...
...
@@ -480,7 +481,7 @@ export default {
if
(
typeof
this
.
shows
[
this
.
currentShow
].
rtrcategory
!==
'
number
'
)
{
this
.
loaded
.
rtrcategory
=
true
}
else
{
axios
.
get
(
process
.
env
.
API_STEERING
+
'
rtrcategories/
'
+
this
.
shows
[
this
.
currentShow
].
rtrcategory
).
then
(
response
=>
{
axios
.
get
(
process
.
env
.
API_STEERING
+
'
rtrcategories/
'
+
this
.
shows
[
this
.
currentShow
].
rtrcategory
,
{
withCredentials
:
true
}
).
then
(
response
=>
{
this
.
current
.
rtrcategory
.
push
(
response
.
data
)
}).
catch
(
error
=>
{
loadingError
=
true
...
...
@@ -492,13 +493,10 @@ export default {
getType
:
function
()
{
this
.
current
.
type
=
[]
var
loadingError
=
false
console
.
log
(
this
.
shows
[
this
.
currentShow
])
console
.
log
(
typeof
this
.
shows
[
this
.
currentShow
].
type
)
if
(
typeof
this
.
shows
[
this
.
currentShow
].
type
!==
'
number
'
)
{
this
.
loaded
.
type
=
true
}
else
{
axios
.
get
(
process
.
env
.
API_STEERING
+
'
types/
'
+
this
.
shows
[
this
.
currentShow
].
type
).
then
(
response
=>
{
console
.
log
(
response
.
data
)
axios
.
get
(
process
.
env
.
API_STEERING
+
'
types/
'
+
this
.
shows
[
this
.
currentShow
].
type
,
{
withCredentials
:
true
}).
then
(
response
=>
{
this
.
current
.
type
.
push
(
response
.
data
)
}).
catch
(
error
=>
{
loadingError
=
true
...
...
@@ -512,7 +510,7 @@ export default {
}
},
created
()
{
axios
.
get
(
process
.
env
.
API_STEERING_SHOWS
).
then
(
response
=>
{
axios
.
get
(
process
.
env
.
API_STEERING_SHOWS
,
{
withCredentials
:
true
}
).
then
(
response
=>
{
this
.
shows
=
response
.
data
this
.
currentShowID
=
this
.
shows
[
0
].
id
this
.
currentShow
=
0
...
...
src/components/ShowManagerModalNotes.vue
0 → 100644
View file @
56491736
<
template
>
<b-modal
ref=
"modalNote"
title=
"Editing a note"
size=
"lg"
>
<b-container
fluid
>
<p>
This is the note for the timeslot on
{{
prettyDate
(
note
.
start
)
}}
.)
</p>
<b-row>
<b-col
cols=
"2"
>
Title:
</b-col>
<b-col
cols=
"10"
><b-form-input
v-model=
"note.title"
type=
"text"
placeholder=
"Enter a title"
></b-form-input></b-col>
</b-row>
<b-row>
<b-col
cols=
"2"
>
Summary:
</b-col>
<b-col
cols=
"10"
><b-form-textarea
v-model=
"note.summary"
:rows=
"4"
placeholder=
"Enter a summary"
></b-form-textarea></b-col>
</b-row>
<b-row>
<b-col
cols=
"2"
>
Content:
</b-col>
<b-col
cols=
"10"
><b-form-textarea
v-model=
"note.content"
:rows=
"8"
placeholder=
"Enter a text describing this timeslot"
></b-form-textarea></b-col>
</b-row>
</b-container>
</b-modal>
</
template
>
<
script
>
import
prettyDate
from
'
../mixins/prettyDate
'
// import axios from 'axios'
export
default
{
props
:
{
note
:
{
type
:
Object
,
required
:
true
}
},
mixins
:
[
prettyDate
],
data
()
{
return
{
}
},
methods
:
{
save
:
function
()
{
}
}
}
</
script
>
<
style
scoped
>
div
.recenttimeslots
{
margin-top
:
2em
;
}
.showsettings
,
.recenttimeslots
,
.nexttimeslots
{
text-align
:
left
;
}
</
style
>
src/mixins/prettyDate.js
0 → 100644
View file @
56491736
function
leadingZero
(
num
)
{
if
(
num
<
10
)
return
'
0
'
+
num
else
return
num
.
toString
()
}
export
default
{
methods
:
{
prettyDate
:
function
(
date
)
{
var
d
=
new
Date
(
date
)
// note: Date.getMonth() returns the month as an index from 0 to 11
return
leadingZero
(
d
.
getDate
())
+
'
.
'
+
leadingZero
(
d
.
getMonth
()
+
1
)
+
'
.
'
+
d
.
getFullYear
()
+
'
'
+
leadingZero
(
d
.
getHours
())
+
'
:
'
+
leadingZero
(
d
.
getMinutes
())
},
prettyDuration
:
function
(
start
,
end
)
{
var
duration
=
(
new
Date
(
end
).
getTime
()
-
new
Date
(
start
).
getTime
())
/
1000
var
hours
=
Math
.
floor
(
duration
/
60
/
60
)
var
minutes
=
(
duration
/
60
)
%
60
return
leadingZero
(
hours
)
+
'
:
'
+
leadingZero
(
minutes
)
}
}
}
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
.
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment