1<%@ page language="java" contentType="text/html; charset=utf-8" pageEncoding="iso-8859-1"%>
2<html>
3<head>
4    <%@ include file="head.jsp" %>
5    <%@ include file="jquery.jsp" %>
6    <link rel="alternate" type="application/rss+xml" title="Madsonic Podcast" href="podcast.view?suffix=.rss">
7
8    <script type="application/javascript">
9
10        function toggleLeftBar(show) {
11            var width = show ? 270 : 52;
12            $("#left").stop();
13            $("#left").animate({"width": width});
14        }
15
16        function toggleLeftPanel(show) {
17            var width = show ? ${model.leftframeSize} : 0;
18            $("#leftPanel").stop();
19            $("#leftPanel").animate({"width": width});
20        }
21
22        function setPlayQueueHeight(height) {
23            $("#playQueue").stop();
24            $("#playQueue").animate({"height": height}, {step: updateSize});
25        }
26
27        function setRightPanelWidth(width) {
28            $("#right").stop();
29            $("#right").animate({"width": width}, {step: updateSize});
30        }
31
32        function setSidePanelWidth(width) {
33            $("#sidePanel").stop();
34            $("#sidePanel").animate({"width": width}, {step: updateSize});
35        }
36
37        // Work-around for quirky iframe layout issue.
38        function updateSize(playQueueHeight) {
39            var w = $(window).width() - $("#left").width() - $("#leftPanel").width() - $("#right").width() - $("#sidePanel").width() - 1;
40            var h = $(window).height() - playQueueHeight - 1;
41            $("#main").width(w);
42        }
43
44        function init() {
45            updateSize($("#playQueue").height());
46            $(window).resize(function () {
47                updateSize($("#playQueue").height());
48            });
49        }
50
51    </script>
52
53    <style type="text/css">
54        #page {
55            display: -webkit-box;
56            display: -moz-box;
57            display: -ms-flexbox;
58            display: -webkit-flex;
59            display: flex;
60            flex-direction: column;
61            width: 100%;
62            height: 100%;
63        }
64
65        #content {
66            display: -webkit-box;
67            display: -moz-box;
68            display: -ms-flexbox;
69            display: -webkit-flex;
70            display:flex;
71            width: 100%;
72            height: 100%;
73            -webkit-box-flex: 1;
74            -moz-box-flex: 1;
75            -ms-flex: 1;
76            -webkit-flex: 1;
77            flex-grow: 1;
78        }
79
80        #left {
81            width: ${model.showLeftBar ? 270 : 52}px;
82            height: 100%;
83        }
84
85        #leftPanel {
86            width: 0px;
87            height: 100%;
88        }
89
90        #main {
91            -webkit-box-flex: 1;
92            -moz-box-flex: 1;
93            -ms-flex: 1;
94            -webkit-flex: 1;
95            display: flex;
96            flex-grow: 1;
97            min-height: 100%;
98        }
99
100        #right {
101            width: ${model.showRightPanel ? 300 : 0}px;
102            height: 100%;
103        }
104
105        #sidePanel {
106            width:  ${model.showSidePanel ? 300 : 0}px;
107            height: 100%;
108        }
109
110        #playQueue {
111            width:100%;
112            height: 95px;
113            z-index: 100;
114            border-top: 1px solid rgba(0, 0, 0, 0.1);
115        }
116    </style>
117</head>
118<body class="bgcolor2 nospace" onload="init()">
119<div class="page bgcolor2 nospace" id="page" name="page">
120    <div id="content" name="content">
121        <iframe src="left.view" id="left" name="left" class="bgcolor2 nospace"></iframe>
122        <iframe src="leftPanel.view" id="leftPanel" name="leftPanel" class="bgcolor2 nospace"></iframe>
123        <iframe src="home.view?listType=${model.listType}" id="main" name="main" allowfullscreen class="bgcolor1 nospace"></iframe>
124        <iframe src="right.view" id="right" name="right" class="bgcolor2 nospace"></iframe>
125        <iframe src="nowListening.view" id="sidePanel" name="sidePanel" class="bgcolor2 nospace"></iframe>
126    </div>
127    <iframe src="playQueue.view" id="playQueue" name="playQueue" class="bgcolor2 nospace"></iframe>
128</div>
129</body>
130</html>