Fixed default values for attribute editing

Gemfile

@@ -7,6 +7,10 @@ gem 'puma', '~> 6.1'
 gem 'sequel', '~> 5.66'
 gem 'sqlite3', '~> 1.6'
 
+gem 'kramdown', '~> 2.4'
+
+gem 'pandoc-ruby', '~> 2.1'
+
 # Use rerun gem to auto-reload app
 gem 'rerun'
 

Gemfile.lock

@@ -2,6 +2,8 @@ GEM
   remote: https://rubygems.org/
   specs:
     ffi (1.15.5)
+    kramdown (2.4.0)
+      rexml
     listen (3.8.0)
       rb-fsevent (~> 0.10, >= 0.10.3)
       rb-inotify (~> 0.9, >= 0.9.10)
@@ -9,6 +11,7 @@ GEM
     mustermann (3.0.0)
       ruby2_keywords (~> 0.0.1)
     nio4r (2.5.8)
+    pandoc-ruby (2.1.7)
     puma (6.1.1)
       nio4r (~> 2.0)
     rack (2.2.6.2)
@@ -19,6 +22,7 @@ GEM
       ffi (~> 1.0)
     rerun (0.14.0)
       listen (~> 3.0)
+    rexml (3.2.5)
     ruby2_keywords (0.0.5)
     sequel (5.66.0)
     sinatra (3.0.5)
@@ -39,6 +43,8 @@ PLATFORMS
   x86_64-linux
 
 DEPENDENCIES
+  kramdown (~> 2.4)
+  pandoc-ruby (~> 2.1)
   puma (~> 6.1)
   rerun
   sequel (~> 5.66)

Rakefile

@@ -7,6 +7,11 @@ namespace :db do
   task :migrate do
     %x{sequel -m 'db/migrations/' 'sqlite://data/stgm.db'}
   end
+
+  task :import do
+    channel = ENV['channel']
+    puts %x{ruby scan.rb "#{channel}"}
+  end
 end
 
 namespace :server do

assets/coffee/wyrm.coffee

@@ -0,0 +1,41 @@
+$(document).ready(() ->
+  $('.channel-path').click((e) ->
+    newPath = prompt('New channel directory path', $(this).find('span').text())
+    if newPath
+      payload =
+        directory_path: newPath
+      channelId = $('#channel-id').val()
+      $.post('/channel/' + channelId + '/edit/directory_path', payload, (data) ->
+        if data == 'success'
+          $('.channel-path span').text(newPath)
+      )
+  )
+
+  $('.video-status').click((e) ->
+    newStatus = prompt('New video status', $(this).find('span').text())
+    if newStatus
+      newStatus = newStatus.toLowerCase()
+      payload =
+        status: newStatus
+      videoId = $('#video-id').val()
+      $.post('/video/' + videoId + '/edit/status', payload, (data) ->
+        if data == 'success'
+          $('.video-status span').text(capitalizeWord(newStatus))
+      )
+  )
+
+  $('.video-serial').click((e) ->
+    newSerial = prompt('New video serial number', $(this).find('span').text())
+    if newSerial
+      payload =
+        serial: newSerial
+      videoId = $('#video-id').val()
+      $.post('/video/' + videoId + '/edit/serial', payload, (data) ->
+        if data == 'success'
+          $('.video-serial span').text(newSerial)
+      )
+  )
+)
+
+capitalizeWord = (str) ->
+  return str.charAt(0).toUpperCase() + str.slice(1)

assets/styles/drake.scss

@@ -1,16 +1,16 @@
 $navbar-height: 60px;
 
-$highlight-color: cornflowerblue;
-$highlight-color-dark: darken($highlight-color, 10%);
+$highlight-color: #2980b9;
+$highlight-color-dark: lighten($highlight-color, 10%);
 
 body{
   padding-top: calc($navbar-height + 15px);
-  background: white;
+  background: #eee;
 }
 
 a{
   color: $highlight-color;
-  transition: color 230ms ease-in-out;
+  transition: all 230ms ease-in-out;
   &:hover{
     color: $highlight-color-dark;
   }
@@ -21,13 +21,24 @@ hr{
   margin-bottom: 20px;
 }
 
+#main-wrapper{
+  max-width: 1120px;
+  padding: 15px 25px;
+  background: white;
+  border-radius: 8px;
+  box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.2);
+}
+
 #main-nav{
   position: fixed;
   top: 0;
   left: 0;
   width: 100%;
   height: $navbar-height;
+  background: $highlight-color;
   border-bottom: 1px solid #999;
+  box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.2);
+  z-index: 10;
 
   ul{
     display: inline-block;
@@ -44,19 +55,144 @@ hr{
   h3{
     display: inline-block;
     margin-top: 14px;
-    margin-left: 10px;
+    margin-left: 25px;
     margin-bottom: 0;
-    color: black;
+    color: white;
     font-size: 2.5rem;
   }
 
   li > a{
+    color: white;
     font-size: 2rem;
     font-weight: bold;
-    text-decoration: none;
+
+    &:hover{
+      color: #eee;
+    }
   }
 }
 
 #site-header{
   margin-bottom: 10px;
 }
+
+#channel-header,
+#video-header{
+  .channel-name,
+  .video-name{
+    margin-bottom: 5px;
+  }
+  .channel-created,
+  .channel-updated,
+  .video-created,
+  .video-updated{
+    margin-bottom: 5px;
+    color: #666;
+    font-size: 1.5rem;
+    font-style: italic;
+  }
+
+  .video-path{
+    margin-top: 10px;
+    font-size: 2rem;
+    text-decoration: underline;
+  }
+
+  .channel-description,
+  .video-description{
+    margin-top: 10px;
+    font-size: 1.75rem;
+  }
+
+  #sidebar{
+    background: #eee;
+    border: 1px solid #666;
+    border-radius: 5px;
+
+    div:not(:last-child){
+      border-bottom: 1px solid #666;
+    }
+
+    > div{
+      padding: 10px 15px 9px;
+
+      p{
+        margin: 0;
+        font-size: 2rem;
+        text-align: left;
+      }
+    }
+
+    .actions-bar,
+    .script-controls{
+      padding: 0;
+
+      span{
+        display: inline-block;
+        width: calc(50% - 1px);
+        height: 100%;
+        margin: 0;
+        padding: 0;
+      }
+      span:not(:last-child){
+        width: 50%;
+        border-right: 1px solid #666;
+      }
+
+      a{
+        display: block;
+        box-sizing: border-box;
+        width: 100%;
+        padding-top: 10px;
+        padding-bottom: 9px;
+        background: rgba(0, 0, 0, 0);
+        font-size: 2rem;
+        text-align: center;
+        text-decoration: none;
+
+        &:hover{
+          background: rgba(0, 0, 0, 0.1);
+        }
+      }
+    }
+
+    .channel-path,
+    .video-status,
+    .video-serial{
+      transition: background 230ms ease-in-out;
+
+      &:hover{
+        background: rgba(0, 0, 0, 0.1);
+        cursor: pointer;
+      }
+    }
+  }
+}
+
+#video_script{
+  max-width: 100%;
+  min-height: 250px;
+}
+
+#video-script{
+  .script{
+    h1{
+      font-size: 4rem;
+    }
+    h2{
+      font-size: 3.5rem;
+    }
+    h3{
+      font-size: 3rem;
+    }
+    h4{
+      font-size: 2.5rem;
+    }
+    h5{
+      font-size: 2.25rem;
+    }
+    h6{
+      font-size: 2rem;
+    }
+  }
+}

data/defaults.yaml

@@ -1,3 +1,6 @@
+stgm:
+  base_directory: '/srv/videos'
+
 database:
   adapter: 'sqlite'
   database: 'data/stgm.db'

db/migrations/0002_add_videos_table.rb

@@ -5,7 +5,7 @@ Sequel.migration do
       primary_key :id
       String :name, null: false
       String :description
-      Integer :serial, null: false, unique: true
+      String :serial, null: false, default: 'wxyz'
       DateTime :created_at, default: Sequel::CURRENT_TIMESTAMP
       DateTime :updated_at, default: Sequel::CURRENT_TIMESTAMP
     end

db/migrations/0003_add_directory_paths.rb

@@ -0,0 +1,13 @@
+Sequel.migration do
+
+  up do
+    add_column(:channels, :directory_path, String)
+    add_column(:videos, :directory_path, String)
+  end
+
+  down do
+    drop_column(:channels, :directory_path)
+    drop_column(:videos, :directory_path)
+  end
+
+end

db/migrations/0004_add_script_attribute.rb

@@ -0,0 +1,11 @@
+Sequel.migration do
+
+  up do
+    add_column(:videos, :script, String)
+  end
+
+  down do
+    drop_column(:videos, :script)
+  end
+
+end

db/migrations/0005_add_video_status.rb

@@ -0,0 +1,11 @@
+Sequel.migration do
+
+  up do
+    add_column(:videos, :status, String, default: 'backlog')
+  end
+
+  down do
+    drop_column(:videos, :status)
+  end
+
+end

db/migrations/0006_add_video_archive.rb

@@ -0,0 +1,11 @@
+Sequel.migration do
+
+  up do
+    add_column(:videos, :archived, TrueClass, default: false)
+  end
+
+  down do
+    drop_column(:videos, :archived)
+  end
+
+end

lib/helpers.rb

@@ -10,7 +10,7 @@ helpers do
 
   def date_format(date)
     dt = date.to_datetime
-    return dt.strftime('%B %d, %Y @ %I:%M:%S %p %Z')
+    return dt.strftime('%B %d, %Y, %I:%M:%S %p')
   end
 
   def date_format_input(date)
@@ -19,7 +19,7 @@ helpers do
   end
 
   def serialize(num)
-    return num
+    return num.to_s.rjust(4, '0')
   end
 
 end

lib/models/channel.rb

@@ -2,6 +2,19 @@ class Channel < Sequel::Model
 
   one_to_many :videos
 
+  def ensureDirectoryStructure()
+    sub_dirs = ['Archive', 'Channel Documents', 'Main', 'Shorts']
+    sub_dirs.each do |d|
+      sub_path = File.join(
+        @values[:directory_path],
+        d
+      )
+      unless Dir.exist?(sub_path)
+        Dir.mkdir(sub_path)
+      end
+    end
+  end
+
   def openProjects()
     return 0
   end

lib/models/video.rb

@@ -1,5 +1,32 @@
+require 'kramdown'
+require 'pandoc-ruby'
+
 class Video < Sequel::Model
 
   many_to_one :channel
 
+  def ensureDirectoryStructure()
+    sub_dirs = ['Audio', 'B-Roll', 'Clips', 'Images', 'Export']
+    sub_dirs.each do |d|
+      sub_path = File.join(
+        @values[:directory_path],
+        d
+      )
+      unless Dir.exist?(sub_path)
+        Dir.mkdir(sub_path)
+      end
+    end
+  end
+
+  def parseScript()
+    return Kramdown::Document.new(@values[:script]).to_html
+  end
+
+  def importScript()
+    scripts = Dir.glob("#{@values[:directory_path]}/*Script.docx")
+    script_content = PandocRuby.convert([scripts[0].dump()], from: :docx, to: :markdown)
+    @values[:script] = script_content
+    self.save()
+  end
+
 end

lib/routes/channel.rb

@@ -13,25 +13,83 @@ namespace '/channel' do
 
   get '/create' do
     erb :'channel/create', :locals => {
-      :title => 'Create new channel'
+      :title => 'Create new channel',
+      :base_directory => $conf.get('stgm.base_directory')
     }
   end
   post '/create' do
     channel = Channel.create(
       name: params[:channel_name],
+      directory_path: params[:channel_dir],
       description: params[:channel_description]
     )
-  
+
+    # create supporting directory structure
+    Dir.mkdir(channel.directory_path)
+    channel.ensureDirectoryStructure()
+
     redirect "/channel/#{channel.id}"
   end
 
   get '/:channel_id' do
     channel = Channel.where(id: params[:channel_id]).first()
-    puts "#{channel.name}"
+    channel_videos = channel.videos_dataset.reverse(:updated_at).limit(10).all()
     erb :'channel/view', :locals => {
       :title => channel.name,
-      :channel => channel
+      :channel => channel,
+      :channel_videos => channel_videos
     }
   end
 
+  get '/:channel_id/edit' do
+    channel = Channel.where(id: params[:channel_id]).first()
+    erb :'channel/edit', :locals => {
+      :title => "Editing: #{channel.name}",
+      :channel => channel
+    }
+  end
+  post '/:channel_id/edit' do
+    # get channel model and save old directory path
+    channel = Channel.where(id: params[:channel_id]).first()
+    old_path = channel.directory_path
+
+    # edit channel model
+    channel.update(
+      name: params[:channel_name],
+      directory_path: params[:channel_dir],
+      description: params[:channel_description]
+    )
+
+    # edit associate videos' directory paths
+    channel.videos.each do |v|
+      video_path = v.directory_path.sub(old_path, channel.directory_path)
+      v.update(directory_path: video_path)
+    end
+
+    # rename channel directory
+    File.rename(old_path, channel.directory_path)
+
+    # redirect user
+    redirect "/channel/#{channel.id}"
+  end
+
+  post '/:channel_id/edit/:attr' do
+    # find channel and temporarily save the old channel path
+    channel = Channel.where(id: params[:channel_id]).first()
+    attrToEdit = params[:attr]
+
+    if attrToEdit == 'directory_path'
+      File.rename(channel.directory_path, params[attrToEdit])
+      channel.videos.each do |v|
+        video_path = v.directory_path.sub(channel.directory_path, params[attrToEdit])
+        v.update(directory_path: video_path)
+      end
+    end
+
+    channel[attrToEdit.to_sym] = params[attrToEdit]
+    channel.save()
+
+    return "success"
+  end
+
 end

lib/routes/index.rb

@@ -2,9 +2,11 @@ namespace '/' do
 
   get '' do
     channels = Channel.reverse(:updated_at).limit(10).all()
+    videos = Video.reverse(:updated_at).limit(10).all()
     erb :index, :locals => {
       :title => 'Dashboard',
-      :channels => channels
+      :channels => channels,
+      :videos => videos
     }
   end
 

lib/routes/video.rb

@@ -1,3 +1,5 @@
+require 'fileutils'
+
 namespace '/video' do
 
   get '' do
@@ -12,30 +14,170 @@ namespace '/video' do
   end
 
   get '/create' do
+    # check if there's a channel specified
+    selected_channel = false
+    if params.has_key?(:channel)
+      selected_channel = params[:channel].to_i()
+    end
+
     channels = Channel.all()
     erb :'video/create', :locals => {
       :title => 'Create new video',
-      :channels => channels
+      :channels => channels,
+      :selected_channel => selected_channel
     }
   end
   post '/create' do
+    channel = Channel.where(id: params[:video_channel]).first()
+    video_serial = params[:video_serial].to_s.rjust(4, '0')
+    video_path = File.join(
+      channel.directory_path,
+      'Main',
+      "##{video_serial} - #{params[:video_name]}"
+    )
+
     video = Video.create(
       serial: params[:video_serial],
       name: params[:video_name],
       channel_id: params[:video_channel],
-      description: params[:video_description]
+      directory_path: video_path,
+      description: params[:video_description],
+      script: "# Introduction\n\n# Body\n\n# Conclusions"
     )
-  
+
+    # create supporting directory structure
+    Dir.mkdir(video_path)
+    video.ensureDirectoryStructure()
+
     redirect "/video/#{video.id}"
   end
 
   get '/:video_id' do
     video = Video.where(id: params[:video_id]).first()
-    puts "#{video.name}"
     erb :'video/view', :locals => {
       :title => video.name,
       :video => video
     }
   end
 
+  get '/:video_id/script' do
+    video = Video.where(id: params[:video_id]).first()
+    erb :'video/script', :locals => {
+      :title => "Script: #{video.name}",
+      :video => video
+    }
+  end
+
+  get '/:video_id/edit' do
+    video = Video.where(id: params[:video_id]).first()
+    channels = Channel.all()
+    erb :'video/edit', :locals => {
+      :title => "Editing: #{video.name}",
+      :video => video,
+      :channels => channels
+    }
+  end
+  post '/:video_id/edit' do
+    channel = Channel.where(id: params[:video_channel]).first()
+    video_serial = params[:video_serial].to_s.rjust(4, '0')
+    video_path = File.join(
+      channel.directory_path,
+      'Main',
+      "##{video_serial} - #{params[:video_name]}"
+    )
+
+    # find video and temporarily save the old video path
+    video = Video.where(id: params[:video_id]).first()
+    old_path = video.directory_path
+
+    # edit video attributes
+    video.update(
+      name: params[:video_name],
+      serial: params[:video_serial],
+      channel_id: params[:video_channel],
+      directory_path: video_path,
+      description: params[:video_description]
+    )
+
+    # rename the video project directory
+    File.rename(old_path, video_path)
+
+    # redirect the user
+    redirect "/video/#{video.id}"
+  end
+
+  post '/:video_id/edit/:attr' do
+    # find video and temporarily save the old video path
+    video = Video.where(id: params[:video_id]).first()
+    attrToEdit = params[:attr]
+
+    video[attrToEdit.to_sym] = params[attrToEdit]
+    video.save()
+
+    return "success"
+  end
+
+  get '/:video_id/archive' do
+    # find the video
+    video = Video.where(id: params[:video_id]).first()
+    video_base = File.basename(video.directory_path)
+
+    # move project to channel's archive
+    archive_dir = File.join(
+      video.channel.directory_path,
+      'Archive',
+      video_base
+    )
+    FileUtils.mv(video.directory_path, archive_dir)
+
+    # mark the video as archived and update directory
+    video.update(
+      directory_path: archive_dir,
+      archived: true
+    )
+
+    redirect '/video/' + video.id.to_s()
+  end
+  get '/:video_id/unarchive' do
+    # find the video
+    video = Video.where(id: params[:video_id]).first()
+    video_base = File.basename(video.directory_path)
+
+    # move project to channel's archive
+    active_dir = File.join(
+      video.channel.directory_path,
+      'Main',
+      video_base
+    )
+    FileUtils.mv(video.directory_path, active_dir)
+
+    # mark the video as archived and update directory
+    video.update(
+      directory_path: active_dir,
+      archived: false
+    )
+
+    redirect '/video/' + video.id.to_s()
+  end
+
+  get '/:video_id/edit/script' do
+    video = Video.where(id: params[:video_id]).first()
+    erb :'video/edit-script', :locals => {
+      :title => "Editing script: #{video.name}",
+      :video => video
+    }
+  end
+  post '/:video_id/edit/script' do
+    # find video and temporarily save the old video path
+    video = Video.where(id: params[:video_id]).first()
+
+    # edit video attributes
+    video.update(
+      script: params[:video_script]
+    )
+
+    # redirect the user
+    redirect "/video/#{video.id}"
+  end
+
 end

scan.rb

@@ -0,0 +1,56 @@
+#!/usr/bin/env ruby
+
+require 'pathname'
+require 'sequel'
+
+require_relative 'lib/config.rb'
+
+# Load configuration file
+$conf = Config.new(File.join(__dir__, 'data/defaults.yaml'))
+
+# Load the Sequel timestamps plugin
+Sequel::Model.plugin :timestamps
+# Initialize Sequel gem for database actions
+DB = Sequel.connect(adapter: $conf.get('database.adapter'), database: $conf.get('database.database'))
+# Load models
+require_relative 'lib/models/channel.rb'
+require_relative 'lib/models/video.rb'
+
+unless ARGV.length == 1
+  abort 'You must supply a channel name!'
+end
+
+channel = Channel.where(name: ARGV[0]).first()
+channel_dir = File.join(channel.directory_path, 'Main')
+subs = Dir["#{channel_dir}/*"]
+
+subs.each do |d|
+  # get folder basename
+  dir_name = File.basename(d)
+
+  # parse video serial from folder name
+  serial_raw = dir_name[0..5].strip()
+  video_serial = serial_raw[1..-1]
+
+  # parse video name from folder name
+  video_name = dir_name.split(' - ')[1]
+
+  # check if a video by the same serial number exists for the channel
+  db_results = Video.where(serial: video_serial, channel_id: channel.id).all()
+
+  # add video project to DB if there's no existing project
+  if db_results.length == 0
+    video = Video.create(
+      serial: video_serial,
+      name: video_name,
+      channel_id: channel.id,
+      directory_path: d,
+      description: 'TODO - imported from storage.',
+      script: "# Introduction\n\n# Body\n\n# Conclusions"
+    )
+
+    video.importScript()
+
+    puts "Successfully added video ##{video.serial} - #{video.name} for channel '#{channel.name}' to the database."
+  end
+end

server.rb

@@ -11,7 +11,7 @@ set :public_folder, __dir__ + '/public'
 set :views, settings.root + '/views'
 
 # Load configuration file
-conf = Config.new(File.join(__dir__, 'data/defaults.yaml'))
+$conf = Config.new(File.join(__dir__, 'data/defaults.yaml'))
 
 # Initialize logging
 logger = Logger.new(STDOUT)
@@ -20,7 +20,7 @@ logger.level = Logger::INFO
 # Load the Sequel timestamps plugin
 Sequel::Model.plugin :timestamps
 # Initialize Sequel gem for database actions
-DB = Sequel.connect(adapter: conf.get('database.adapter'), database: conf.get('database.database'))
+DB = Sequel.connect(adapter: $conf.get('database.adapter'), database: $conf.get('database.database'))
 # Load models
 require_relative 'lib/models/channel.rb'
 require_relative 'lib/models/video.rb'

views/channel/create.erb

@@ -14,6 +14,13 @@
         </div>
       </div>
 
+      <div class="row">
+        <div class="columns twelve">
+          <label for="channel_dir">Channel directory:</label>
+          <input class="u-full-width" type="text" id="channel_dir" name="channel_dir" required value="<%= base_directory %>">
+        </div>
+      </div>
+
       <div class="row">
         <div class="twelve columns">
           <label for="channel_description">Channel description:</label>

views/channel/edit.erb

@@ -0,0 +1,34 @@
+<div class="row">
+  <div class="twelve columns">
+    <h1>Editing: <%= channel.name %></h1>
+  </div>
+</div>
+
+<div class="row">
+  <div class="twelve columns">
+    <form action="/channel/<%= channel.id %>/edit" method="POST" class="u-full-width">
+      <div class="row">
+        <div class="columns twelve">
+          <label for="channel_name">Channel name:</label>
+          <input class="u-full-width" type="text" placeholder="My new channel" id="channel_name" name="channel_name" required value="<%= channel.name %>">
+        </div>
+      </div>
+
+      <div class="row">
+        <div class="columns twelve">
+          <label for="channel_dir">Channel directory:</label>
+          <input class="u-full-width" type="text" id="channel_dir" name="channel_dir" required value="<%= channel.directory_path %>">
+        </div>
+      </div>
+
+      <div class="row">
+        <div class="twelve columns">
+          <label for="channel_description">Channel description:</label>
+          <textarea class="u-full-width" type="text" placeholder="Description of the channel" id="channel_description" name="channel_description"><%= channel.description %></textarea>
+        </div>
+      </div>
+
+      <input class="button-primary u-full-width" type="submit" value="Submit">
+    </form>
+  </div>
+</div>

views/channel/list.erb

@@ -1,6 +1,6 @@
 <div class="row">
   <div class="twelve columns">
-    <h1>Hardware Inventory List</h1>
+    <h1>Channel List</h1>
   </div>
 </div>
 

views/channel/view.erb

@@ -1,18 +1,63 @@
 <div id="channel-header" class="row">
-  <div class="twelve columns">
+  <div class="eight columns">
     <h1 class="channel-name"><%= channel.name %></h1>
     <h4 class="channel-created">Item added at: <%= date_format(channel.created_at) %></h4>
     <% if channel.updated_at %>
     <h4 class="channel-updated">Last updated at: <%= date_format(channel.updated_at) %></h4>
     <% end %>
-  </div>  
+
+    <p><a href="/video/create?channel=<%= channel.id %>">Create video project</a></p>
+
+    <p class="channel-description"><%= channel.description %></p>
+  </div>
+
+  <div id="sidebar" class="four columns">
+    <div class="actions-bar">
+      <span><a href="/channel/<%= channel.id %>/edit">Edit <i class="fa-solid fa-pen-to-square"></i></a></span><span>
+        <a href="/channel/<%= channel.id %>/delete">Delete <i class="fa-solid fa-trash"></i></a></span>
+    </div>
+    <div class="channel-path">
+      <p><span><%= channel.directory_path %></span></p>
+    </div>
+    <div class="channel-open">
+      <p>Open projects: <span><%= channel.openProjects() %></span></p>
+    </div>
+    <div class="channel-videos">
+      <p>Total videos: <span><%= channel.videos.length %></span></p>
+    </div>
+  </div>
 </div>
 
+<hr>
+
 <div class="row">
   <div class="twelve columns">
-    <p class="inventory-actions">
-      <a href="/channel/<%= channel.id %>/edit"><i class="fa-solid fa-pen-to-square"></i></a>
-      <a href="/channel/<%= channel.id %>/delete"><i class="fa-solid fa-trash"></i></a>
-    </p>
+    <h3>Recently updated channel videos:</h3>
+    <% if channel.videos.length > 0 %>
+      <table class="u-full-width">
+        <thead>
+          <tr>
+            <th>Video name</th>
+            <th>Video serial</th>
+            <th>Video description</th>
+            <th>Last updated</th>
+          </tr>
+        </thead>
+        <tbody>
+          <% channel_videos.each do |v| %>
+            <tr>
+              <td><a href="/video/<%= v.id %>"><%= v.name %></a></td>
+              <td><%= serialize(v.serial) %></td>
+              <td><%= v.description %></td>
+              <td><%= date_format(v.updated_at) %></td>
+            </tr>
+          <% end %>
+        </tbody>
+      </table>
+    <% else %>
+      <p>There are no videos associated with this project yet.</p>
+    <% end %>
   </div>
 </div>
+
+<input type="hidden" id="channel-id" value="<%= channel.id %>">

views/index.erb

@@ -8,6 +8,27 @@
 
 <div class="row">
   <div class="twelve columns">
+    <table class="u-full-width">
+      <thead>
+        <tr>
+          <th>Video name</th>
+          <th>Video serial</th>
+          <th>Video channel</th>
+          <th>Last updated</th>
+        </tr>
+      </thead>
+      <tbody>
+        <% videos.each do |v| %>
+          <tr>
+            <td><a href="/video/<%= v.id %>"><%= v.name %></a></td>
+            <td><%= serialize(v.serial) %></td>
+            <td><%= v.channel.name %></td>
+            <td><%= date_format(v.updated_at) %></td>
+          </tr>
+        <% end %>
+      </tbody>
+    </table>
+
     <table class="u-full-width">
       <thead>
         <tr>

views/video/create.erb

@@ -24,7 +24,7 @@
           <label for="video_channel">Associated channel:</label>
           <select class="u-full-width" id="video_channel" name="video_channel" required>
             <% channels.each do |c| %>
-              <option value="<%= c.id %>"><%= c.name %></option>
+              <option value="<%= c.id %>" <%= 'selected' if c.id == selected_channel %>><%= c.name %></option>
             <% end %>
           </select>
         </div>

views/video/edit-script.erb

@@ -0,0 +1,20 @@
+<div class="row">
+  <div class="twelve columns">
+    <h1>Editing script for: <%= video.name %></h1>
+  </div>
+</div>
+
+<div class="row">
+  <div class="twelve columns">
+    <form action="/video/<%= video.id %>/edit/script" method="POST" class="u-full-width">
+      <div class="row">
+        <div class="twelve columns">
+          <label for="video_script">Video script:</label>
+          <textarea class="u-full-width" type="text" placeholder="Description of the video" id="video_script" name="video_script" rows="30"><%= video.script %></textarea>
+        </div>
+      </div>
+
+      <input class="button-primary u-full-width" type="submit" value="Submit">
+    </form>
+  </div>
+</div>

views/video/edit.erb

@@ -0,0 +1,43 @@
+<div class="row">
+  <div class="twelve columns">
+    <h1>Editing: <%= video.name %></h1>
+  </div>
+</div>
+
+<div class="row">
+  <div class="twelve columns">
+    <form action="/video/<%= video.id %>/edit" method="POST" class="u-full-width">
+      <div class="row">
+        <div class="columns twelve">
+          <label for="video_name">Video name:</label>
+          <input class="u-full-width" type="text" placeholder="My new video" id="video_name" name="video_name" required value="<%= video.name %>">
+        </div>
+      </div>
+
+      <div class="row">
+        <div class="columns three">
+          <label for="video_serial">Video serial:</label>
+          <input class="u-full-width" type="number" placeholder="0001" id="video_serial" name="video_serial" required value="<%= video.serial %>">
+        </div>
+
+        <div class="columns nine">
+          <label for="video_channel">Associated channel:</label>
+          <select class="u-full-width" id="video_channel" name="video_channel" required>
+            <% channels.each do |c| %>
+              <option value="<%= c.id %>"<% if c.id == video.channel_id %> selected<% end %>><%= c.name %></option>
+            <% end %>
+          </select>
+        </div>
+      </div>
+
+      <div class="row">
+        <div class="twelve columns">
+          <label for="video_description">Video description:</label>
+          <textarea class="u-full-width" type="text" placeholder="Description of the video" id="video_description" name="video_description"><%= video.description %></textarea>
+        </div>
+      </div>
+
+      <input class="button-primary u-full-width" type="submit" value="Submit">
+    </form>
+  </div>
+</div>

views/video/list.erb

@@ -1,6 +1,6 @@
 <div class="row">
   <div class="twelve columns">
-    <h1>Hardware Inventory List</h1>
+    <h1>Video List</h1>
   </div>
 </div>
 

views/video/script.erb

@@ -0,0 +1,9 @@
+<div id="video-script" class="row">
+  <div class="twelve columns">
+    <h1>Script: <%= video.name %></h1>
+
+    <hr>
+
+    <%= video.parseScript() %>
+  </div>
+</div>

views/video/view.erb

@@ -1,19 +1,46 @@
 <div id="video-header" class="row">
-  <div class="twelve columns">
-    <h1 class="video-name"><%= video.name %></h1>
-    <h3 class="video-serial"><%= video.channel.name %> - <%= serialize(video.serial) %></h3>
+  <div class="eight columns">
+    <h1 class="video-name"><%= video.name %></h1><%= '<h4>(archived)</h4>' if video.archived %>
     <h4 class="video-created">Item added at: <%= date_format(video.created_at) %></h4>
     <% if video.updated_at %>
     <h4 class="video-updated">Last updated at: <%= date_format(video.updated_at) %></h4>
     <% end %>
-  </div>  
-</div>
+    <h4 class="video-path"><%= video.directory_path %></h4>
 
-<div class="row">
-  <div class="twelve columns">
-    <p class="inventory-actions">
-      <a href="/video/<%= video.id %>/edit"><i class="fa-solid fa-pen-to-square"></i></a>
-      <a href="/video/<%= video.id %>/delete"><i class="fa-solid fa-trash"></i></a>
-    </p>
+    <p class="video-description"><%= video.description %></p>
+  </div>
+
+  <div id="sidebar" class="four columns">
+    <div class="actions-bar">
+      <span><a href="/video/<%= video.id %>/edit">Edit <i class="fa-solid fa-pen-to-square"></i></a></span><% unless video.archived %><span><a href="/video/<%= video.id %>/archive">Archive <i class="fa-solid fa-box-archive"></i></a></span><% else %><span><a href="/video/<%= video.id %>/unarchive">Unarchive <i class="fa-solid fa-box-archive"></i></a></span>
+      <% end %>
+    </div>
+    <div class="video-channel">
+      <p>Channel: <a href="/channel/<%= video.channel.id %>"><span><%= video.channel.name %></span></a></p>
+    </div>
+    <div class="video-serial">
+      <p>Serial: <span><%= serialize(video.serial) %></span></p>
+    </div>
+    <div class="video-status">
+      <p>Status: <span><%= video.status.capitalize() %></span></p>
+    </div>
+    <div class="script-controls">
+      <span><a href="/video/<%= video.id %>/script">View script <i class="fa-solid fa-scroll"></i></a></span><span>
+        <a href="/video/<%= video.id %>/edit/script">Edit script <i class="fa-solid fa-pen-to-square"></i></a></span>
+    </div>
   </div>
 </div>
+
+<div id="video-script" class="row">
+  <div class="twelve columns">
+    <h2>Video script</h2>
+
+    <hr>
+
+    <div class="script">
+      <%= video.parseScript() %>
+    </div>
+  </div>
+</div>
+
+<input type="hidden" id="video-id" value="<%= video.id %>">