Added ability to archive videos

Gemfile

@@ -7,6 +7,8 @@ gem 'puma', '~> 6.1'
 gem 'sequel', '~> 5.66'
 gem 'sqlite3', '~> 1.6'
 
+gem 'kramdown', '~> 2.4'
+
 # 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)
@@ -19,6 +21,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 +42,7 @@ PLATFORMS
   x86_64-linux
 
 DEPENDENCIES
+  kramdown (~> 2.4)
   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,26 @@
+$(document).ready(() ->
+  $('.video-status').click((e) ->
+    newStatus = prompt('New video status').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')
+    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,11 +1,11 @@
 $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{
@@ -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,16 +55,20 @@ 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;
+    }
   }
 }
 
@@ -61,8 +76,10 @@ hr{
   margin-bottom: 10px;
 }
 
-#channel-header{
-  .channel-name{
+#channel-header,
+#video-header{
+  .channel-name,
+  .video-name{
     margin-bottom: 5px;
   }
   .channel-created,
@@ -75,14 +92,16 @@ hr{
     font-style: italic;
   }
 
-  .channel-description{
+  .channel-description,
+  .video-description{
     margin-top: 10px;
     font-size: 1.75rem;
   }
 
   #sidebar{
-    background: #ddd;
+    background: #eee;
     border: 1px solid #666;
+    border-radius: 5px;
 
     div:not(:last-child){
       border-bottom: 1px solid #666;
@@ -98,7 +117,8 @@ hr{
       }
     }
 
-    .actions-bar{
+    .actions-bar,
+    .script-controls{
       padding: 0;
 
       span{
@@ -129,5 +149,43 @@ hr{
         }
       }
     }
+
+    .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/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)

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,24 @@
+require 'kramdown'
+
 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
+
 end

lib/routes/channel.rb

@@ -13,25 +13,64 @@ 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
+
 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,54 @@
+#!/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 = channel.directory_path
+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"
+    )
+
+    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

@@ -6,6 +6,8 @@
     <h4 class="channel-updated">Last updated at: <%= date_format(channel.updated_at) %></h4>
     <% end %>
 
+    <p><a href="/video/create?channel=<%= channel.id %>">Create video project</a></p>
+
     <p class="channel-description"><%= channel.description %></p>
   </div>
 
@@ -14,6 +16,9 @@
       <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>
@@ -27,7 +32,7 @@
 
 <div class="row">
   <div class="twelve columns">
-    <h3>Channel videos</h3>
+    <h3>Recently updated channel videos:</h3>
     <% if channel.videos.length > 0 %>
       <table class="u-full-width">
         <thead>
@@ -35,14 +40,16 @@
             <th>Video name</th>
             <th>Video serial</th>
             <th>Video description</th>
+            <th>Last updated</th>
           </tr>
         </thead>
         <tbody>
-          <% channel.videos.each do |v| %>
+          <% 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>

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,48 @@
 <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>
 
-<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="video-path">
+      <p><span><%= video.directory_path %></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 %>">