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
7481359b
Commit
7481359b
authored
Nov 16, 2017
by
Andrea Ida Malkah Klaura
Browse files
header, showmanager, icons
parent
193a55d2
Changes
5
Hide whitespace changes
Inline
Side-by-side
src/App.vue
View file @
7481359b
...
...
@@ -23,8 +23,7 @@ export default {
'
modules
'
:
[
{
slug
:
''
,
title
:
'
Home
'
},
{
slug
:
'
shows
'
,
title
:
'
Sendungen verwalten
'
},
{
slug
:
'
files
'
,
title
:
'
Dateien und Playlists
'
},
{
slug
:
'
vue-intro
'
,
title
:
'
Vue.js Intro Page
'
}
{
slug
:
'
files
'
,
title
:
'
Dateien und Playlists
'
}
],
'
activeModule
'
:
{
route
:
'
/
'
...
...
src/components/Header.vue
View file @
7481359b
...
...
@@ -50,7 +50,13 @@ export default {
<
style
>
header
{
background-color
:
#ad7fa8
;
background
:
#ad7fa8
;
/* for browsers that don't support gradients */
/* background: linear-gradient(#ad7fa8, #888a85); /* light magenta to light alu */
/* background: linear-gradient(#ad7fa8, #555753); /* light magenta to medium alu */
/* background: linear-gradient(#ad7fa8, #5c3566); /* light magenta to dark magenta */
/* background: linear-gradient(#ad7fa8, #75507b); /* light magenta to medium magenta */
/* background: linear-gradient(#5c3566, #555753); /* dark magenta to light alu */
background
:
linear-gradient
(
#5c3566
,
#ad7fa8
);
/* dark magenta to light magenta */
border-bottom
:
1px
solid
#5c3566
;
}
nav
{
...
...
src/components/Home.vue
View file @
7481359b
...
...
@@ -4,13 +4,13 @@
<p>
Here are some infos for you on how to use this interface...
</p>
<div
class=
"section group"
>
<div
class=
"col span_1_of_4"
>
<router-link
to=
"s
endungen
"
>
<router-link
to=
"s
hows
"
>
<img
src=
"../assets/applications-multimedia.png"
>
<p>
Schedule your shows
</p>
</router-link>
</div>
<div
class=
"col span_1_of_4"
>
<router-link
to=
"file
manager
"
>
<router-link
to=
"file
s
"
>
<img
src=
"../assets/audio-x-generic.png"
>
<p>
Manage files and playlists
</p>
</router-link>
...
...
src/components/ShowManager.vue
View file @
7481359b
...
...
@@ -11,38 +11,58 @@
</div>
</div>
<p
align=
"left"
>
Die nächsten
<select
v-model=
"numUpcoming"
>
<option>
8
</option>
<option>
16
</option>
<option
value=
"all"
>
alle
</option>
</select>
Sendungen:
</p>
<div
class=
"section group"
>
<div
class=
"col span_2_of_4"
>
<div
v-for=
"episode in this.episodesFutureShowFirstHalf"
>
{{
prettyDate
(
episode
.
start
)
}}
<div
class=
"nextepisodes"
>
<p
align=
"left"
>
Die nächsten
<select
v-model=
"numUpcoming"
>
<option>
8
</option>
<option>
16
</option>
<option
value=
"all"
>
alle
</option>
</select>
Sendungen:
</p>
<div
class=
"section group"
>
<div
class=
"col span_2_of_4"
>
<div
align=
"left"
v-for=
"episode in this.episodesFutureShowFirstHalf"
>
<img
v-if=
"episode.source === ''"
src=
"../assets/16x16/go-top.png"
alt=
"choose a playlist for this episode"
v-on:click=
"setPlaylist"
/>
<img
v-else
src=
"../assets/16x16/media-playback-start.png"
alt=
"play"
v-on:click=
"playPlaylist"
/>
{{
prettyDate
(
episode
.
start
)
}}
(
{{
prettyDuration
(
episode
.
start
,
episode
.
end
)
}}
)
<span
:title=
"episode.title"
>
{{
prettyTitle
(
episode
.
title
)
}}
</span>
<img
src=
"../assets/16x16/emblem-system.png"
alt=
"edit"
v-on:click=
"setPlaylist"
/>
</div>
</div>
</div>
<div
class=
"col span_2_of_4"
>
<div
v-for=
"episode in this.episodesFutureShowSecondHalf"
>
{{
episode
.
start
}}
<div
align=
"left"
class=
"col span_2_of_4"
>
<div
v-for=
"episode in this.episodesFutureShowSecondHalf"
>
<img
v-if=
"episode.source === ''"
src=
"../assets/16x16/go-top.png"
alt=
"choose a playlist for this episode"
v-on:click=
"setPlaylist"
/>
<img
v-else
src=
"../assets/16x16/media-playback-start.png"
alt=
"play"
v-on:click=
"playPlaylist"
/>
{{
prettyDate
(
episode
.
start
)
}}
(
{{
prettyDuration
(
episode
.
start
,
episode
.
end
)
}}
)
<span
:title=
"episode.title"
>
{{
prettyTitle
(
episode
.
title
)
}}
</span>
<img
src=
"../assets/16x16/emblem-system.png"
alt=
"edit"
v-on:click=
"setPlaylist"
/>
</div>
</div>
</div>
</div>
<p
align=
"left"
>
Die letzten
<select
v-model=
"numRecent"
>
<option>
8
</option>
<option>
16
</option>
<option>
alle
</option>
</select>
Sendungen:
</p>
<div
class=
"section group"
>
<div
class=
"col span_2_of_4"
>
<div
v-for=
"episode in this.episodesPastShowFirstHalf"
>
{{
episode
.
start
}}
<div
class=
"recentepisodes"
>
<p
align=
"left"
>
Die letzten
<select
v-model=
"numRecent"
>
<option>
8
</option>
<option>
16
</option>
<option
value=
"all"
>
alle
</option>
</select>
Sendungen:
</p>
<div
class=
"section group"
>
<div
class=
"col span_2_of_4"
>
<div
align=
"left"
v-for=
"episode in this.episodesPastShowFirstHalf"
>
<img
v-if=
"episode.source === ''"
src=
"../assets/16x16/go-top.png"
alt=
"choose a playlist for this episode"
v-on:click=
"setPlaylist"
/>
<img
v-else
src=
"../assets/16x16/media-playback-start.png"
alt=
"play"
v-on:click=
"playPlaylist"
/>
{{
prettyDate
(
episode
.
start
)
}}
(
{{
prettyDuration
(
episode
.
start
,
episode
.
end
)
}}
)
<span
:title=
"episode.title"
>
{{
prettyTitle
(
episode
.
title
)
}}
</span>
<img
src=
"../assets/16x16/emblem-system.png"
alt=
"edit"
v-on:click=
"setPlaylist"
/>
</div>
</div>
</div>
<div
class=
"col span_2_of_4"
>
<div
v-for=
"episode in this.episodesPastShowSecondHalf"
>
{{
episode
.
start
}}
<div
class=
"col span_2_of_4"
>
<div
align=
"left"
v-for=
"episode in this.episodesPastShowSecondHalf"
>
<img
v-if=
"episode.source === ''"
src=
"../assets/16x16/go-top.png"
alt=
"choose a playlist for this episode"
v-on:click=
"setPlaylist"
/>
<img
v-else
src=
"../assets/16x16/media-playback-start.png"
alt=
"play"
v-on:click=
"playPlaylist"
/>
{{
prettyDate
(
episode
.
start
)
}}
(
{{
prettyDuration
(
episode
.
start
,
episode
.
end
)
}}
)
<span
:title=
"episode.title"
>
{{
prettyTitle
(
episode
.
title
)
}}
</span>
<img
src=
"../assets/16x16/emblem-system.png"
alt=
"edit"
v-on:click=
"editEpisode"
/>
</div>
</div>
</div>
</div>
...
...
@@ -123,10 +143,27 @@ export default {
},
prettyDate
:
function
(
date
)
{
var
d
=
new
Date
(
date
)
return
leadingZero
(
d
.
getDate
())
+
'
.
'
+
leadingZero
(
d
.
getMonth
())
+
'
.
'
+
d
.
getFullYear
()
+
'
'
+
leadingZero
(
d
.
getHours
())
+
'
:
'
+
leadingZero
(
d
.
getMinutes
())
return
leadingZero
(
d
.
getDate
())
+
'
.
'
+
leadingZero
(
d
.
getMonth
())
+
'
.
'
+
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
)
},
prettyTitle
:
function
(
title
)
{
if
(
title
===
''
)
return
'
...
'
else
if
(
title
.
length
>
25
)
return
title
.
slice
(
0
,
25
)
+
'
...
'
else
return
title
},
editEpisode
:
function
()
{
alert
(
'
By the mighty witchcraftry of the mother of time!
\n\n
This feature is not implemented yet.
'
)
},
setPlaylist
:
function
()
{
alert
(
'
By the mighty witchcraftry of the mother of time!
\n\n
This feature is not implemented yet.
'
)
},
playPlaylist
:
function
()
{
alert
(
'
By the mighty witchcraftry of the mother of time!
\n\n
This feature is not implemented yet.
'
)
}
},
created
()
{
...
...
@@ -149,6 +186,8 @@ export default {
}
</
script
>
<
style
>
<
style
scoped
>
div
.recentepisodes
{
margin-top
:
2em
;
}
</
style
>
src/router/index.js
View file @
7481359b
import
Vue
from
'
vue
'
import
Router
from
'
vue-router
'
import
VueIntroPage
from
'
@/components/VueIntroPage
'
import
Home
from
'
@/components/Home
'
import
LogIn
from
'
@/components/LogIn
'
import
ShowManager
from
'
@/components/ShowManager
'
...
...
@@ -13,7 +12,6 @@ export default new Router({
{
path
:
'
/
'
,
name
:
'
home
'
,
component
:
Home
},
{
path
:
'
/shows
'
,
name
:
'
shows
'
,
component
:
ShowManager
},
{
path
:
'
/files
'
,
name
:
'
files
'
,
component
:
FileManager
},
{
path
:
'
/login
'
,
name
:
'
login
'
,
component
:
LogIn
},
{
path
:
'
/vue-intro
'
,
name
:
'
VueIntroPage
'
,
component
:
VueIntroPage
}
{
path
:
'
/login
'
,
name
:
'
login
'
,
component
:
LogIn
}
]
})
Write
Preview
Supports
Markdown
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