diff --git a/ffplayout/api/utils.py b/ffplayout/api/utils.py
index e9ab0fb1..bfe4dffc 100644
--- a/ffplayout/api/utils.py
+++ b/ffplayout/api/utils.py
@@ -37,6 +37,14 @@ def read_json(date):
             return json.load(playlist)
 
 
+def write_json(data):
+    config = read_yaml()['playlist']['path']
+    y, m, d = data['date'].split('-')
+    output = os.path.join(config, y, m, '{}.json'.format(data['date']))
+    with open(output, "w") as outfile:
+        json.dump(data, outfile, indent=4)
+
+
 def sizeof_fmt(num, suffix='B'):
     for unit in ['', 'Ki', 'Mi', 'Gi', 'Ti', 'Pi', 'Ei', 'Zi']:
         if abs(num) < 1024.0:
diff --git a/ffplayout/frontend/pages/control.vue b/ffplayout/frontend/pages/control.vue
index 23ba99ce..f4ce82eb 100644
--- a/ffplayout/frontend/pages/control.vue
+++ b/ffplayout/frontend/pages/control.vue
@@ -99,7 +99,6 @@
                         </div>
 
                         <perfect-scrollbar>
-                            <!-- class="browser-list" -->
                             <b-list-group>
                                 <b-list-group-item
                                     v-for="folder in folderTree.tree[1]"
@@ -397,10 +396,16 @@ export default {
         async resetPlaylist () {
             await this.$store.dispatch('playlist/getPlaylist', { dayStart: this.configPlayout.playlist.day_start, date: this.today })
         },
-        savePlaylist () {
-            console.log(this.playlist)
+        async savePlaylist () {
+            await this.$store.dispatch('auth/inspectToken')
             this.$store.commit('playlist/UPDATE_PLAYLIST', this.$processPlaylist(
                 this.configPlayout.playlist.day_start, this.playlist))
+
+            await this.$axios.post(
+                'api/playlist/',
+                { data: { channel: this.$store.state.playlist.playlistChannel, date: this.today, program: this.playlist } },
+                { headers: { Authorization: 'Bearer ' + this.$store.state.auth.jwtToken } }
+            )
         }
     }
 }
@@ -567,6 +572,10 @@ export default {
     max-height: 100%;
 }
 
+.browser-div .ps {
+    padding-left: .4em;
+}
+
 .date-div {
     width: 250px;
     float: right;
diff --git a/ffplayout/frontend/store/playlist.js b/ffplayout/frontend/store/playlist.js
index 9fb22301..c1ba8b20 100644
--- a/ffplayout/frontend/store/playlist.js
+++ b/ffplayout/frontend/store/playlist.js
@@ -26,8 +26,9 @@ const counte = (function main (counter) {
 */
 export const state = () => ({
     playlist: null,
+    playlistChannel: 'Channel 1',
     clockStart: true,
-    progressValue: 30,
+    progressValue: 0,
     currentClip: 'No clips is playing',
     timeStr: '00:00:00',
     timeLeft: '00:00:00'
@@ -37,6 +38,9 @@ export const mutations = {
     UPDATE_PLAYLIST (state, list) {
         state.playlist = list
     },
+    UPDATE_PLAYLIST_CHANNEL (state, channel) {
+        state.playlistChannel = channel
+    },
     SET_CLOCK_START (state, bol) {
         state.clockStart = bol
     },
@@ -62,12 +66,15 @@ export const actions = {
         const response = await this.$axios.get(`api/playlist/?date=${date}`, { headers: { Authorization: 'Bearer ' + rootState.auth.jwtToken } })
 
         if (response.data && response.data.program) {
+            commit('UPDATE_PLAYLIST_CHANNEL', response.data.channel)
             commit('UPDATE_PLAYLIST', this.$processPlaylist(dayStart, response.data.program))
 
             if (process.browser) {
                 // TODO: find a better way for non-blocking animation
                 // dispatch('animClock')
             }
+        } else {
+            commit('UPDATE_PLAYLIST', [])
         }
     },