     end)
   end
 
+  defp playerconfig() do
+    %{version: 5,
+      activeTab: "chapters",
+      base: PanWeb.Endpoint.url <> "/web-player/"}
+    |> Jason.encode!
+  end
+
   defp escape_javascript(nil), do: ""
   defp escape_javascript(string), do: javascript_escape(string)
 
+  defp render_script(episode) do
+    """
+    <script>
+      window.podlovePlayer("#app", #{episode_config(episode)}, #{playerconfig()});
+    </script>
+    """
+    |> raw
+  end
+
   def render(assigns) do
     ~F"""
-    <div id="web-player"></div>
+    <div id="app" class="app"></div>
     <script src="/web-player/embed.js"></script>
-    <script>
-      podlovePlayer('#web-player', {@episodestruct})
-    </script>
+    {render_script(@episode)}
     """
   end
 end

      tabs: %{chapters: true},
      contributors: contributorlist(episode.gigs),
      chapters: chapterlist(episode.chapters),
      audio: audiolist(episode.enclosures),
      reference: %{base: PanWeb.Endpoint.url() <> "/web-player/"}
    }
    |> Jason.encode!()
    |> raw
  end

  defp contributorlist(gigs) do

  import PanWeb.Router.Helpers

  prop(episode, :map, required: true)

  defp episode_config(episode) do
    poster = Endpoint.url() <> "/images/missing-podcast.png"

    %{version: 5,
      show: %{
        title: episode.podcast.title,
        subtitle: episode.podcast.summary,
