Skip to content

GitLab

Commit 4790a8a7 authored by Marc Duez's avatar Marc Duez
Browse files

com.js : auto-build flash/log/popup container

parent 08b281ed
Hide whitespace changes
Inline Side-by-side
browser/css/dark.css
View file @ 4790a8a7
......@@ -19,7 +19,7 @@ body {
}
/* texts that are not sequences nor identifiers */
#info,
#popup-msg,
.popup_msg,
.menu,
.menu a {
font-family: ubuntulight, Arial, Helvetica, Sans-serif;
......@@ -672,7 +672,7 @@ span .substitution {
cursor: pointer;
}
/* ////////////////////////////////////////////////////////////// */
#popup-container {
.popup_container {
z-index: 20;
border: solid;
position: fixed;
......@@ -687,12 +687,12 @@ span .substitution {
left: -webkit-calc(50% - 250px);
left: calc(50% - 250px);
}
#popup-container a {
.popup_container a {
text-decoration: none;
font-weight: bold;
color: #839496;
}
#popup-container a:hover {
.popup_container a:hover {
color: #fdf6e3;
}
#data-container {
......@@ -930,7 +930,7 @@ span.logo {
.list_clones,
.bot-bar,
#bot-container,
#popup-container,
.popup_container,
#file_menu,
#tagSelector,
.closeButton,
......@@ -1293,14 +1293,14 @@ text.alert {
background-position: 50px 50px;
}
}
#flash_container {
.flash_container {
position: absolute;
display: block;
bottom: 0px;
right: 0px;
z-index: 100;
}
#log_container {
.log_container {
height: 500px;
width: 400px;
position: absolute;
......
browser/css/light.css
View file @ 4790a8a7
......@@ -19,7 +19,7 @@ body {
}
/* texts that are not sequences nor identifiers */
#info,
#popup-msg,
.popup_msg,
.menu,
.menu a {
font-family: ubuntulight, Arial, Helvetica, Sans-serif;
......@@ -672,7 +672,7 @@ span .substitution {
cursor: pointer;
}
/* ////////////////////////////////////////////////////////////// */
#popup-container {
.popup_container {
z-index: 20;
border: solid;
position: fixed;
......@@ -687,12 +687,12 @@ span .substitution {
left: -webkit-calc(50% - 250px);
left: calc(50% - 250px);
}
#popup-container a {
.popup_container a {
text-decoration: none;
font-weight: bold;
color: #657b83;
}
#popup-container a:hover {
.popup_container a:hover {
color: #002b36;
}
#data-container {
......@@ -930,7 +930,7 @@ span.logo {
.list_clones,
.bot-bar,
#bot-container,
#popup-container,
.popup_container,
#file_menu,
#tagSelector,
.closeButton,
......@@ -1293,14 +1293,14 @@ text.alert {
background-position: 50px 50px;
}
}
#flash_container {
.flash_container {
position: absolute;
display: block;
bottom: 0px;
right: 0px;
z-index: 100;
}
#log_container {
.log_container {
height: 500px;
width: 400px;
position: absolute;
......
browser/css/vidjil.less
View file @ 4790a8a7
......@@ -34,7 +34,7 @@ body {
/* texts that are not sequences nor identifiers */
#info, #popup-msg, .menu, .menu a
#info, .popup_msg, .menu, .menu a
{
font-family: ubuntulight, Arial, Helvetica, Sans-serif;
}
......@@ -815,7 +815,7 @@ span .substitution{
/* ////////////////////////////////////////////////////////////// */
#popup-container{
.popup_container{
z-index:20;
border:solid;
position: fixed;
......@@ -831,13 +831,13 @@ span .substitution{
left: calc(~"50% - 250px");
}
#popup-container a {
.popup_container a {
text-decoration: none;
font-weight: bold;
color: @default ;
}
#popup-container a:hover{
.popup_container a:hover{
color : @select;
}
......@@ -1085,7 +1085,7 @@ span.logo
color: grey;
}
.selector, #list_menu, #top-container, .list_clones, .bot-bar, #bot-container, #popup-container, #file_menu, #tagSelector, .closeButton, #axis_choice
.selector, #list_menu, #top-container, .list_clones, .bot-bar, #bot-container, .popup_container, #file_menu, #tagSelector, .closeButton, #axis_choice
{
border-color: @border;
}
......@@ -1478,7 +1478,7 @@ text.alert { fill: red; }
to { background-position: 50px 50px; }
}
#flash_container {
.flash_container {
position : absolute;
display : block;
bottom : 0px;
......@@ -1486,7 +1486,7 @@ text.alert { fill: red; }
z-index: 100;
}
#log_container {
.log_container {
height : 500px;
width : 400px;
position : absolute;
......
browser/index.html
View file @ 4790a8a7
......@@ -37,19 +37,6 @@
<body>
<div id="popup-container">
<span class="closeButton" onclick="console.closePopupMsg()">X</span>
<div id="popup-msg">
<noscript>
<style type="text/css">
#popup-container { display:block; }
</style>
Your browser does not have Javascript enabled. <br />
<a href='http://www.vidjil.org'>Vidjil</a> needs a recent browser with Javascript enabled.
</noscript>
</div>
</div>
<div id="file_menu" >
<span class="closeButton" onclick="cancel();">X</span>
......@@ -323,12 +310,12 @@
<div id="flash_container"></div>
<div id="log_container"></div>
<form id="form"></form>
<div id="waiting_screen"> <div id="waiting_mes"></div></div>
<!-- </body> -->
</body>
</html>
......
browser/js/com.js
View file @ 4790a8a7
......@@ -24,16 +24,13 @@
/* Com object display/store system message
*
* */
function Com(flash_id, log_id, popup_id, data_id, default_console) {
this.flash_id = flash_id;
this.log_id = log_id;
this.popup_id = popup_id;
this.data_id = data_id;
function Com(default_console) {
this.data_id = "data-container"; //TODO
this.default = default_console;
this.min_priority = 1; // minimum required to display message
this.min_priority_console = 0;
this.log_container = document.getElementById(this.log_id);
this.build()
BUTTON_CLOSE_POPUP = "</br></br> <div class='center' > <button onclick='console.closePopupMsg()'>ok</button></div> ",
......@@ -96,6 +93,8 @@ function Com(flash_id, log_id, popup_id, data_id, default_console) {
Com.prototype = {
/*Parse log message and display it in a popup,flash or standard log
* */
log: function(obj){
if (typeof obj !== 'object'){
this.default.log(obj)
......@@ -117,6 +116,35 @@ Com.prototype = {
}
},
build: function(){
var self = this;
this.flash_container = document.createElement("div")
this.flash_container.className = "flash_container";
this.log_container = document.createElement("div")
this.log_container.className = "log_container";
this.popup_container = document.createElement("div")
this.popup_container.className = "popup_container";
var close_popup = document.createElement("span")
close_popup.onclick = function(){
self.closePopupMsg();
}
close_popup.className = "closeButton";
close_popup.appendChild(document.createTextNode("X"));
this.popup_msg = document.createElement("div")
this.popup_msg.className = "popup_msg";
this.popup_container.appendChild(close_popup)
this.popup_container.appendChild(this.popup_msg)
document.body.appendChild(this.flash_container);
document.body.appendChild(this.log_container);
document.body.appendChild(this.popup_container);
},
/* display a flash message if priority level is sufficient
* and print message in log
......@@ -130,7 +158,7 @@ Com.prototype = {
'style': 'display : none',
'class': 'flash_'+priority ,
'click': function(){$(this).fadeOut(25, function() { $(this).remove();} );}
}).appendTo("#"+this.flash_id)
}).appendTo(this.flash_container)
.slideDown(200);
if (priority !=2){
......@@ -160,7 +188,7 @@ Com.prototype = {
var div = jQuery('<div/>', {
'text': strDate+" | "+str,
'class': 'log_'+priority
}).appendTo("#"+this.log_id)
}).appendTo(this.log_container)
.slideDown(200, function(){
self.log_container.scrollTop = self.log_container.scrollHeight;
});
......@@ -173,24 +201,22 @@ Com.prototype = {
},
openLog: function () {
$("#"+this.log_id).fadeToggle(200);
$(this.log_container).fadeToggle(200);
},
closeLog: function () {
$("#"+this.log_id).fadeToggle(200);
$(this.log_container).fadeToggle(200);
},
popupMsg: function (msg) {
document.getElementById(this.popup_id)
.style.display = "block";
document.getElementById(this.popup_id).lastElementChild
this.popup_container.style.display = "block";
this.popup_container.lastElementChild
.innerHTML = msg;
},
closePopupMsg: function () {
document.getElementById(this.popup_id)
.style.display = "none";
document.getElementById(this.popup_id).lastElementChild
this.popup_container.style.display = "none";
this.popup_container.lastElementChild
.innerHTML = "";
},
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment