Upgrade materialize

This commit is contained in:
Sebastien 2018-04-30 16:51:09 +02:00
parent f757d79020
commit 2eae639425
13 changed files with 12339 additions and 10449 deletions

File diff suppressed because it is too large Load Diff

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because it is too large Load Diff

File diff suppressed because one or more lines are too long

View File

@ -41,12 +41,6 @@ $(document).ready(function() {
dismissible: false dismissible: false
}); });
$('.button-collapse-1').sideNav({
menuWidth: 400, // Default is 300
edge: 'right', // Choose the horizontal origin
closeOnClick: false, // Closes side-nav on <a> clicks, useful for Angular/Meteor
draggable: true // Choose whether you can drag to open on touch screens,
});
$('.dropdown-button').dropdown({ $('.dropdown-button').dropdown({
inDuration: 300, inDuration: 300,
@ -202,6 +196,7 @@ function getPlayList() {
template.html(content); template.html(content);
$('#playlist_list').append(template); $('#playlist_list').append(template);
$('.collapsible').collapsible();
}); });
$(".btn_dell_playlist").click(function () { $(".btn_dell_playlist").click(function () {
@ -270,7 +265,8 @@ function updateModal(data){
$('#modal_title').text("Title: "+ data.info.audioTrackInfo.title); $('#modal_title').text("Title: "+ data.info.audioTrackInfo.title);
$('#modal_author').text("Author: "+ data.info.audioTrackInfo.author); $('#modal_author').text("Author: "+ data.info.audioTrackInfo.author);
$('#modal_lenght').text("Duration: "+ msToTime(data.info.audioTrackInfo.length)); $('#modal_lenght').text("Duration: "+ msToTime(data.info.audioTrackInfo.length));
$('#modal_url').text("URL: "+ data.info.audioTrackInfo.uri); $('#modal_url').html("<div>URL: <a target=\"_blank\" href=\""+ data.info.audioTrackInfo.uri + "\">" + data.info.audioTrackInfo.uri + "</a></div>");
//
$('#modal_submit').text("Submitted by: "+ data.info.user); $('#modal_submit').text("Submitted by: "+ data.info.user);

View File

@ -1,5 +1,5 @@
var nav_bar_account_link; var nav_bar_account_link;
var connected_link = "<a class=\"dropdown-account\" data-activates=\"dropdown_connected\"><i class=\"material-icons green-text\">account_box</i></a>"; var connected_link = "<a class=\"dropdown-account dropdown-trigger\" data-target=\"dropdown_connected\"><i class=\"material-icons green-text\">account_box</i></a>";
var disconnected_link = "<a class=\"waves-effect waves-light modal-trigger\" href=\"#modal_connection\"><i class=\"material-icons red-text\">account_box</i></a>"; var disconnected_link = "<a class=\"waves-effect waves-light modal-trigger\" href=\"#modal_connection\"><i class=\"material-icons red-text\">account_box</i></a>";
var input_name; var input_name;
var input_psw; var input_psw;
@ -8,8 +8,10 @@ var btn_disconnect;
var nav_name; var nav_name;
$(document).ready(function() { $(document).ready(function() {
$('.button-navbar-mobile').sideNav({ $('#nav-mobile').sidenav({
menuWidth: 400, // Default is 300 menuWidth: 400, // Default is 300
edge: 'right', // Choose the horizontal origin edge: 'right', // Choose the horizontal origin
closeOnClick: false, // Closes side-nav on <a> clicks, useful for Angular/Meteor closeOnClick: false, // Closes side-nav on <a> clicks, useful for Angular/Meteor
@ -27,7 +29,7 @@ $(document).ready(function() {
btn_submit = $("#btn-submit-connect"); btn_submit = $("#btn-submit-connect");
btn_disconnect = $(".nav-disconnect"); btn_disconnect = $(".nav-disconnect");
nav_name = $("#nav-name"); nav_name = $("#nav-name");
navListeners();
if(Cookies.get('token') === undefined){ if(Cookies.get('token') === undefined){
disconnected() disconnected()
} }
@ -35,7 +37,7 @@ $(document).ready(function() {
connected(); connected();
} }
navListeners();
}); });
@ -60,7 +62,7 @@ function connected(){
nav_bar_account_link.html(connected_link); nav_bar_account_link.html(connected_link);
$('.dropdown-account').dropdown({ $('.dropdown-account').dropdown({
constrainWidth: false, // Does not change width of dropdown to that of the activator constrainWidth: false, // Does not change width of dropdown to that of the activator
belowOrigin: true, // Displays dropdown below the button coverTrigger: false, // Displays dropdown below the button
alignment: 'left', // Displays dropdown with edge aligned to the left of button alignment: 'left', // Displays dropdown with edge aligned to the left of button
stopPropagation: false // Stops event propagation stopPropagation: false // Stops event propagation
} }

View File

@ -3,12 +3,6 @@ var ok_passwrd = false;
$(document).ready(function() { $(document).ready(function() {
var baseUrl = window.location.protocol + "//" +window.location.host + window.location.pathname; var baseUrl = window.location.protocol + "//" +window.location.host + window.location.pathname;
console.log(baseUrl); console.log(baseUrl);
$('.button-collapse-1').sideNav({
menuWidth: 400, // Default is 300
edge: 'right', // Choose the horizontal origin
closeOnClick: false, // Closes side-nav on <a> clicks, useful for Angular/Meteor
draggable: true // Choose whether you can drag to open on touch screens,
});
var sendBtn = $('#sendBtn'); var sendBtn = $('#sendBtn');

View File

@ -17,18 +17,23 @@
<ul class="right hide-on-med-and-down"> <ul class="right hide-on-med-and-down">
<li class="" th:classappend="(${page} == 'home')? 'active' : ''"> <li class="" th:classappend="(${page} == 'home')? 'active' : ''">
<a class="waves-effect waves-light sidenav-trigger" href="/" data-target="slide-out">Home</a> <a class="waves-effect waves-light" href="/">Home</a>
</li> </li>
<li class="" th:classappend="(${page} == 'music')? 'active' : ''"> <li class="" th:classappend="(${page} == 'music')? 'active' : ''">
<a class="waves-effect waves-light" href="/music">Music Control</a> <a class="waves-effect waves-light" href="/music">Music Control</a>
</li> </li>
<li id="nav-bar-account"> <li id="nav-bar-account">
<a class="dropdown-account" data-activates="dropdown1"><i class="material-icons">account_box</i></a> <a class="dropdown-account dropdown-trigger" data-target="dropdown_connected"><i class="material-icons">account_box</i></a>
</li> </li>
</ul> </ul>
<ul id="nav-mobile" class="side-nav">
<a href="#" data-target="nav-mobile" class="sidenav-trigger"><i class="material-icons">menu</i></a>
</div>
</nav>
<ul id="nav-mobile" class="sidenav">
<li class="center" th:classappend="(${page} == 'home')? 'active' : ''"> <li class="center" th:classappend="(${page} == 'home')? 'active' : ''">
<a class="waves-effect waves-light sidenav-trigger" href="/" data-target="slide-out">Home</a> <a class="waves-effect waves-light sidenav-trigger" href="/" data-target="slide-out">Home</a>
</li> </li>
@ -49,9 +54,11 @@
<li><a class="center red-text nav-disconnect" style="font-weight: bold">Disconnect</a></li> <li><a class="center red-text nav-disconnect" style="font-weight: bold">Disconnect</a></li>
</ul> </ul>
<a href="#" data-activates="nav-mobile" class="button-navbar-mobile button-collapse"><i class="material-icons">menu</i></a>
</div>
</nav>
<!-- Dropdown connected --> <!-- Dropdown connected -->
<ul id="dropdown_connected" class="dropdown-content "> <ul id="dropdown_connected" class="dropdown-content ">
@ -88,14 +95,16 @@
<div class="input-field col s6 offset-s3"> <div class="input-field col s6 offset-s3">
<i class="material-icons prefix">account_box</i> <i class="material-icons prefix">account_box</i>
<input name="username" id="user_input" type="text" class="validate"/> <input name="username" id="user_input" type="text" class="validate"/>
<label for="user_input" data-error="User not registered!">User Name</label> <label for="user_input" >User Name</label>
<span class="helper-text" data-error="User not registered!"></span>
</div> </div>
</div> </div>
<div class="row"> <div class="row">
<div class="input-field col s6 offset-s3"> <div class="input-field col s6 offset-s3">
<i class="material-icons prefix">security</i> <i class="material-icons prefix">security</i>
<input name="password" id="password_input" type="password" class="validate"/> <input name="password" id="password_input" type="password" class="validate"/>
<label for="password_input" data-error="Wrong password!">Password</label> <label for="password_input">Password</label>
<span class="helper-text" data-error="Wrong password!"></span>
</div> </div>
</div> </div>
<div class="row" style="margin-bottom: 10px"> <div class="row" style="margin-bottom: 10px">
@ -137,8 +146,10 @@
</div> </div>
<p id="radioTemplateGuild" class="" style="visibility: hidden; display: none "> <p id="radioTemplateGuild" class="" style="visibility: hidden; display: none ">
<label>
<input name="guildRadio" class="with-gap" type="radio" value="@id" id="@id"/> <input name="guildRadio" class="with-gap" type="radio" value="@id" id="@id"/>
<label for="@id">@name</label> <span>@name</span>
</label>
</p> </p>
<!--__________________________________________________________--> <!--__________________________________________________________-->

View File

@ -29,7 +29,7 @@
var needLogin = true; var needLogin = true;
</script> </script>
<!-- Scripts--> <!-- Scripts-->
<script src="https://code.jquery.com/jquery-3.3.1.js"></script> <script th:src="@{/js/jquery-3.3.1.min.js}"></script>
<script th:src="@{/js/materialize.js}"></script> <script th:src="@{/js/materialize.js}"></script>
<script th:src="@{/js/navabar.js}"></script> <script th:src="@{/js/navabar.js}"></script>
<script th:src="@{/js/js.cookie.js}"></script> <script th:src="@{/js/js.cookie.js}"></script>

View File

@ -67,7 +67,7 @@
</div> </div>
<!-- Scripts--> <!-- Scripts-->
<script src="https://code.jquery.com/jquery-3.3.1.js"></script> <script th:src="@{/js/jquery-3.3.1.min.js}"></script>
<script th:src="@{/js/materialize.js}"></script> <script th:src="@{/js/materialize.js}"></script>
<script th:src="@{/js/loading.js}"></script> <script th:src="@{/js/loading.js}"></script>

View File

@ -77,10 +77,10 @@
<th style="padding: 0px;"> <th style="padding: 0px;">
<div class="row center valign-wrapper" style="margin: 0px"> <div class="row center valign-wrapper" style="margin: 0px">
<div class="col s3 center blue-grey-text text-darken-3"><h5><b>Playlist</b></h5></div> <div class="col s3 center blue-grey-text text-darken-3"><h5><b>Playlist</b></h5></div>
<div class="col s3 center"> <div class="col s3 center" style="padding-right: 0px; padding-left: 0px">
<a class="waves-effect waves-light btn modal-trigger red darken-4" id="flush_btn"><i class="material-icons">delete_sweep</i></a> <a class="waves-effect waves-light btn modal-trigger red darken-4" id="flush_btn"><i class="material-icons">delete_sweep</i></a>
</div> </div>
<div class="col s3 center" style="padding-right: 0px"> <div class="col s3 center" style="padding-right: 0px; padding-left: 0px">
<!-- Modal Trigger --> <!-- Modal Trigger -->
<a class="waves-effect waves-light btn modal-trigger green darken-4" id="add_btn" href="#modalAdd"><i class="material-icons">add_circle_outline</i></a> <a class="waves-effect waves-light btn modal-trigger green darken-4" id="add_btn" href="#modalAdd"><i class="material-icons">add_circle_outline</i></a>
@ -195,7 +195,7 @@
<div class="row" style="margin-bottom: 0px"> <div class="row" style="margin-bottom: 0px">
<h3 class="col s12 center">Vocal Channels</h3> <h3 class="col s12 center">Vocal Channels</h3>
<div class="col offset-s4 s4 center"> <div class="col offset-s4 s4 center">
<form id="channelForm" action="#" class=""> <form id="channelForm" action="#" >
</form> </form>
</div> </div>
</div> </div>
@ -270,12 +270,15 @@
<p id="radioTemplate" class="" style="visibility: hidden"> <p id="radioTemplate" class="" style="visibility: hidden">
<label>
<input name="vocalRadio" class="with-gap" type="radio" value="@id" id="@id"/> <input name="vocalRadio" class="with-gap" type="radio" value="@id" id="@id"/>
<label for="@id">@name</label> <span for="@id">@name</span>
</label>
</p> </p>
<!-- Scripts--> <!-- Scripts-->
<script src="https://code.jquery.com/jquery-3.3.1.js"></script> <script th:src="@{/js/jquery-3.3.1.min.js}"></script>
<script> <script>
var needLogin = true; var needLogin = true;

View File

@ -93,13 +93,14 @@
<script src="https://code.jquery.com/jquery-3.3.1.js"></script> <script th:src="@{/js/jquery-3.3.1.min.js}"></script>
<script th:src="@{/js/materialize.js}"></script> <script th:src="@{/js/materialize.js}"></script>
<script th:src="@{/js/register.js}"></script> <script th:src="@{/js/register.js}"></script>
<script th:src="@{/js/navabar.js}"></script> <script th:src="@{/js/navabar.js}"></script>
<script th:src="@{/js/js.cookie.js}"></script> <script th:src="@{/js/js.cookie.js}"></script>
<script th:inline="javascript"> <script th:inline="javascript">
/*<![CDATA[*/ /*<![CDATA[*/