@ -382,99 +382,3 @@ textarea:disabled{
background-color : # a1a1a1 ; background-color : # a1a1a1 ;
cursor : pointer ; cursor : pointer ;
} }
< hr / >
< script type = "text/javascript" >
function changeColor ( ) {
document . getElementById ( "submit" ) . style . borderColor = document . getElementById ( "msg" ) . style . borderColor = document . getElementById ( "name" ) . style . borderColor = document . getElementById ( "col" ) . style . borderColor = document . getElementById ( "col" ) . options [ document . getElementById ( "col" ) . selectedIndex ] . text
}
function submit ( ) {
document . getElementById ( "submit" ) . disabled =
document . getElementById ( "name" ) . disabled =
document . getElementById ( "col" ) . disabled =
document . getElementById ( "msg" ) . disabled = true ;
fetch ( "/COMMENTS?submit=true&article=sig.css.comment&message=" + encodeURIComponent ( document . getElementById ( "msg" ) . value ) + "&name="
+ encodeURIComponent ( document . getElementById ( "name" ) . value ) + "&color="
+ encodeURIComponent ( document . getElementById ( "col" ) . options [ document . getElementById ( "col" ) . selectedIndex ] . text )
) . then ( ( data ) = > data . text ( ) )
. then ( ( data ) = > {
document . getElementById ( "msg" ) . value = ""
document . getElementById ( "name" ) . value = ""
document . getElementById ( "submit" ) . disabled =
document . getElementById ( "name" ) . disabled =
document . getElementById ( "col" ) . disabled =
document . getElementById ( "msg" ) . disabled = false ;
fetchComments ( )
} )
}
function insert ( c1 , c2 ) {
if ( document . getElementById ( "msg" ) . selectionStart = = document . getElementById ( "msg" ) . selectionEnd ) {
/ / No highlighting . Insert here .
if ( c2 ! = undefined ) {
document . getElementById ( "msg" ) . value = document . getElementById ( "msg" ) . value . substring ( 0 , document . getElementById ( "msg" ) . selectionStart ) + c1 + c2 + document . getElementById ( "msg" ) . value . substring ( document . getElementById ( "msg" ) . selectionStart )
} else {
document . getElementById ( "msg" ) . value = document . getElementById ( "msg" ) . value . substring ( 0 , document . getElementById ( "msg" ) . selectionStart ) + c1 + document . getElementById ( "msg" ) . value . substring ( document . getElementById ( "msg" ) . selectionStart )
}
} else {
if ( c2 ! = undefined ) {
document . getElementById ( "msg" ) . value = document . getElementById ( "msg" ) . value . substring ( 0 , document . getElementById ( "msg" ) . selectionStart ) + c1 + document . getElementById ( "msg" ) . value . substring ( document . getElementById ( "msg" ) . selectionStart , document . getElementById ( "msg" ) . selectionEnd ) + c2 + document . getElementById ( "msg" ) . value . substring ( document . getElementById ( "msg" ) . selectionEnd )
} else {
document . getElementById ( "msg" ) . value = document . getElementById ( "msg" ) . value . substring ( 0 , document . getElementById ( "msg" ) . selectionStart ) + c1 + document . getElementById ( "msg" ) . value . substring ( document . getElementById ( "msg" ) . selectionStart )
}
}
}
< / script >
< div id = "commentForm" >
< b > Leave a comment ! < / b > < br / > < br / >
< label for = "name" > Display Name : < / label > < input id = "name" > < / input > < br / > < br / >
< label for = "col" > Display Color : < / label > < select id = "col" onchange = "changeColor()" >
< option value = "RED" > RED < / option >
< option value = "GREEN" selected > GREEN < / option >
< option value = "YELLOW" > YELLOW < / option >
< option value = "BLUE" > BLUE < / option >
< option value = "MAGENTA" > MAGENTA < / option >
< option value = "CYAN" > CYAN < / option >
< option value = "WHITE" > WHITE < / option >
< / select > < br / > < br / >
< label for = "msg" style = "vertical-align:top;display:inline;" > Message : < / label >
< div >
< div class = "toolbar" >
< span class = "toolbarItem" onclick = "insert('^^','^^')" title = "Bold" > & nbsp ; < b > B < / b > & nbsp ; < / span >
< span class = "toolbarItem" onclick = "insert('**','**')" title = "Italics" > & nbsp ; < i > I < / i > & nbsp ; < / span >
< span class = "toolbarItem" onclick = "insert('__','__')" title = "Underline" > & nbsp ; < u > U < / u > & nbsp ; < / span >
< span class = "toolbarItem" onclick = "insert('~~','~~')" title = "Code" > & nbsp ; & lt ; code & gt ; & nbsp ; < / span >
< span class = "toolbarItem" onclick = "insert('[[',']]')" title = "Link" > & nbsp ; & lt ; http : / / & gt ; & nbsp ; < / span >
< span class = "toolbarItem" onclick = "insert('😊')" title = "Smiley Face Emoji" > & nbsp ; 😊 & nbsp ; < / span >
< span class = "toolbarItem" onclick = "insert('😔')" title = "Sad Face Emoji" > & nbsp ; 😔 & nbsp ; < / span >
< span class = "toolbarItem" onclick = "insert('👍')" title = "Thumbs Up Emoji" > & nbsp ; 👍 & nbsp ; < / span >
< span class = "toolbarItem" onclick = "insert('❤️ title = "Heart Emoji" > & nbsp ; ❤ ️ & nbsp ; < / span >
< span class = "toolbarItem" onclick = "insert('😡')" title = "Pouting Emoji" > & nbsp ; 😡 & nbsp ; < / span >
< / div >
< textarea id = "msg" > < / textarea >
< / div > < br / > < br / >
< button id = "submit" onclick = "submit()" > POST < / button >
< / div > < br / > < br / >
< div id = "commentContainer" style = "visibility:hidden;" >
< h2 > Comments < sub > ( < span class = "commentCounter" id = "commentCounter" > 0 < / span > ) < / sub > < / h2 >
< div class = "comments" id = "comments" > < / div >
< / div >
< script type = "text/javascript" >
function fetchComments ( ) {
fetch ( "/COMMENTS?article=sig.css.comment" ) . then ( ( data ) = > data . text ( ) )
. then ( ( data ) = > {
data = data . split ( "\n" ) ;
document . getElementById ( "comments" ) . innerHTML = "" ;
document . getElementById ( "commentCounter" ) . innerText = data [ 0 ]
for ( var i = data . length-3 ; i > = 1 ; i- = 2 ) {
if ( data [ i ] . trim ( ) . length > 0 & & data [ i + 1 ] . trim ( ) . length > 0 ) {
document . getElementById ( "comments" ) . innerHTML + = "<div id=\"msg" + ( ( i + 1 ) / 2 ) + "\" class=\"commentDisplayer\"><div class=\"commentData\">" + decodeURIComponent ( data [ i ] ) + "</div><br>"
data2 = data [ i + 1 ] . split ( ";" ) ;
document . getElementById ( "msg" + ( ( i + 1 ) / 2 ) ) . style . borderColor = data2 [ 1 ]
document . getElementById ( "comments" ) . innerHTML + = "<div class=\"commentInfo\"><sup>- " + decodeURIComponent ( data2 [ 0 ] ) + "</sup></div></div><br>"
}
}
document . getElementById ( "commentContainer" ) . style . visibility = "visible"
} )
}
fetchComments ( )
changeColor ( )
< / script >
