init commit

libs/phantombot/web/panel/pages/extra/commercials.html

@@ -0,0 +1,80 @@
+<!--
+    Copyright (C) 2016-2020 phantombot.github.io/PhantomBot
+
+    This program is free software: you can redistribute it and/or modify
+    it under the terms of the GNU General Public License as published by
+    the Free Software Foundation, either version 3 of the License, or
+    (at your option) any later version.
+    This program is distributed in the hope that it will be useful,
+    but WITHOUT ANY WARRANTY; without even the implied warranty of
+    MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+    GNU General Public License for more details.
+    You should have received a copy of the GNU General Public License
+    along with this program.  If not, see <http://www.gnu.org/licenses/>.
+-->
+
+<main>
+    <!-- Header -->
+    <section class="content-header">
+        <h1>Automatic Commercials</h1>
+        <ol class="breadcrumb">
+            <li><a href="javascript:void(0);"><i class="fa fa-dashboard"></i> Home</a></li>
+            <li>Extra</li>
+            <li class="active">Automatic Commercials</li>
+        </ol>
+    </section>
+
+    <!-- Main content -->
+    <section class="content">
+    	<div class="box box-solid">
+            <div class="box-header with-border">
+            	<label class="switch" data-toggle="tooltip" title="Module toggle">
+  					<input type="checkbox" id="commercialsModuleToggle" checked>
+  					<span class="slider round"></span>
+				</label>
+
+                <h3 class="box-title">Automatic Commercials</h3>
+            </div>
+            <form role="form" id="commercialsModule">
+                <!-- Box content -->
+                <div class="box-body">
+                    <!-- Commercial Interval -->
+                    <div class="form-group">
+                        <label>Interval Between Automatic Commercials, in Minutes</label>
+                        <input type="number" class="form-control" id="commercial-interval" value="8" min="8" data-toggle="tooltip" title="Interval between commercials, minimum 8."/>
+                    </div>
+                    <!-- Commercial Length -->
+                    <div class="form-group">
+                        <label for="commercial-length">Commercial Length, in Seconds</label>
+                        <select class="form-control" id="commercial-length">
+                            <option selected="selected">30</option>
+                            <option>60</option>
+                            <option>90</option>
+                            <option>120</option>
+                            <option>150</option>
+                            <option>180</option>
+                        </select>
+                    </div>
+                    
+                    <!-- Optional Commercial Message -->
+                    <div class="form-group">
+                        <label>Optional Message Posted to Chat</label>
+                        <input type="text" class="form-control" id="commercial-message" placeholder="Optional message posted to chat"
+                            data-toggle="tooltip" title="Optional message posted to chat."/>
+                    </div>
+                </div>
+                
+                <!-- Footer with buttons -->
+                <div class="box-footer">
+                    <div class="btn-toolbar pull-right">
+                        <button class="btn btn-success" type="button" id="commercials-autotimer-on"><i class="fa fa-check"></i>&nbsp; Set Autotimer</button>
+                        <button class="btn btn-danger hidden" type="button" id="commercials-autotimer-off"><i class="fa fa-trash"></i>&nbsp; Disable Autotimer</button>
+                    </div>
+                </div>
+            </form>
+        </div>
+    </section>
+
+    <!-- commercials -->
+    <script src="/panel/js/pages/extra/commercials.js"></script>
+</main>