diff --git a/doc/photoshop_sources/editbar-sprite.psd b/doc/photoshop_sources/editbar-sprite.psd new file mode 100644 index 000000000..8b10fcb3f Binary files /dev/null and b/doc/photoshop_sources/editbar-sprite.psd differ diff --git a/doc/photoshop_sources/timeslider-sprite.psd b/doc/photoshop_sources/timeslider-sprite.psd new file mode 100644 index 000000000..e50f4905c Binary files /dev/null and b/doc/photoshop_sources/timeslider-sprite.psd differ diff --git a/static/css/pad.css b/static/css/pad.css index e12738b50..b6a6c1902 100644 --- a/static/css/pad.css +++ b/static/css/pad.css @@ -1,1298 +1,630 @@ -*,html,body,p{ margin: 0; padding: 0; } -.clear { clear: both; } -html { font-size: 62.5%; width: 100%; } -body, textarea { font-family: Helvetica, Arial, sans-serif; } -iframe {position:absolute;} +*, HTML, BODY, P {margin:0; padding:0;} +HTML {font-size:62.5%; width:100%;} +BODY, TEXTAREA {font-family:Arial, Helvetica, sans-serif;} +IFRAME {position:absolute;} -#users -{ - position: absolute; - z-index:500; - background-color: #000; - background-color: rgba(0,0,0,0.7); - width: 160px; - right: 20px; - top: 40px; - color: #fff; - padding: 5px; - border-radius: 6px; -} +.clear {clear:both;} +.left {float:left;} +.right {float:right;} +.rtl {direction:RTL;} +.inactive {opacity:.2;} -a img -{ - border: 0; -} +A {text-decoration:none;} +A:hover {color:#00b7ed;} +A:focus {outline:none;} -/* menu */ -#editbar ul -{ - position: relative; - list-style: none; - padding-right: 3px; - padding-left: 1px; - z-index: 2; - overflow: hidden; - -} - -#editbar -{ - background: #f7f7f7; - background: linear-gradient(#f7f7f7, #f1f1f1 80%); - border-bottom: 1px solid #ccc; - height: 32px; - overflow: hidden; - padding-top: 3px; - width: 100%; -} - -#editbar ul li -{ - background: #fff; - background: linear-gradient(#fff, #f0f0f0); - border: 1px solid #ccc; - border-radius: 4px; - cursor: pointer; - float: left; - height: 18px; - margin-left: 2px; - overflow: hidden; - padding: 4px 5px; - width: 18px; -} - -#editbar ul li a -{ - text-decoration: none; - color: #ccc; -} - -#editbar ul li a span -{ - position: relative; - top:-2px -} - -#editbar ul li:hover { - background: #fff; -} - -#editbar ul li:active { - background: #eee; - background: linear-gradient(#ddd, #fff); -} - -#editbar ul li.separator -{ - border: inherit; - background: inherit; - visibility:hidden; - width: 0px; -} -#editbar ul li a -{ - display: block; -} -#editbar ul li a img -{ - padding: 1px; -} - - -#editbar ul -{ - float: left; -} -#editbar ul#menu_right -{ - float: right; -} - -#users -{ - display: none; -} - -#editorcontainer -{ - position: absolute; - - width: 100%; - - top: 36px; - left: 0px; - bottom: 0px; - - z-index: 1; -} - -#editorcontainer iframe { - height: 100%; - width: 100%; - padding: 0; - margin: 0; -} - -#editorloadingbox { padding-top: 100px; padding-bottom: 100px; font-size: 2.5em; color: #aaa; - text-align: center; position: absolute; width: 100%; height: 30px; z-index: 100; } - -#editorcontainerbox{ - position:absolute; - bottom:0; - top:0; - width:100%; -} - - -#padpage { - position: absolute; - top: 0px; - bottom: 0px; - width: 100%; -} - -.maximized #padpage { - left: 8px; - right: 8px; - width: auto; - margin-left: 0; -} - -body.fullwidth #padpage { width: auto; margin-left: 6px; margin-right: 6px; } -body.squish1width #padpage { width: 800px; } -body.squish2width #padpage { width: 700px; } - -a#backtoprosite, #accountnav { - display: block; position: absolute; height: 15px; line-height: 15px; - width: auto; top: 5px; font-size: 1.2em; display:none; -} -a#backtoprosite, #accountnav a { color: #cde7ff; text-decoration: underline; } - -a#backtoprosite { padding-left: 20px; left: 6px; - background: url(static/img/protop.gif) no-repeat -5px -6px; } -#accountnav { right: 30px; color: #fff; } - -.propad a#topbaretherpad { background: url(static/img/protop.gif) no-repeat -397px -3px; } - -#specialkeyarea { top: 5px; left: 250px; color: yellow; font-weight: bold; - font-size: 1.5em; position: absolute; } - -#alertbar { - margin-top: 6px; - opacity: 0; - display: none; - position:absolute; - left:0; - right:0; - z-index:53; -} - -#servermsg { position: relative; zoom: 1; border: 1px solid #992; - background: #ffc; padding: 0.8em; font-size: 1.2em; } -#servermsg h3 { font-weight: bold; margin-right: 10px; - margin-bottom: 1em; float: left; width: auto; } -#servermsg #servermsgdate { font-style: italic; font-weight: normal; color: #666; } -a#hidetopmsg { position: absolute; right: 5px; bottom: 5px; } - -#shuttingdown { position: relative; zoom: 1; border: 1px solid #992; - background: #ffc; padding: 0.6em; font-size: 1.2em; margin-top: 6px; } - -#docbar { margin-top: 6px; height: 25px; position: relative; zoom: 1; - background: #fbfbfb url(static/img/padtopback2.gif) repeat-x 0 -31px; } - -.docbarbutton -{ - padding-top: 2px; - padding-bottom: 2px; - padding-left: 4px; - padding-right: 4px; - border-left: 1px solid #CCC; - white-space: nowrap; -} - -.docbarbutton img -{ - border: 0px; - width: 13px; - margin-right: 2px; - vertical-align: middle; - margin-top: 3px; - margin-bottom: 2px; -} - -.menu, -.menu ul { - font-size: 10pt; - list-style-type: none; -} - -.menu ul { - padding-left: 20px; -} - -.menu a { - font-size: 10px; - line-height: 18px; - text-decoration: none; - color: #444; - font-weight: bold; -} - -.docbarbutton.highlight -{ - background-color: #fef2bd; - border: 1px solid #CCC; - border-right: 0px; -} - -#docbarleft { position: absolute; left: 0; top: 0; height: 100%; - overflow: hidden; - background: url(static/img/padtop5.gif) no-repeat left -31px; width: 7px; } - - - -#docbarpadtitle { position: absolute; height: auto; left: 9px; - width: 280px; font-size: 1.6em; color: #444; font-weight: normal; - line-height: 22px; margin-left: 2px; height: 22px; top: 2px; - overflow: hidden; text-overflow: ellipsis /*not supported in FF*/; - white-space:nowrap; } -.docbar-public #docbarpadtitle { padding-left: 22px; - background: url(static/img/public.gif) no-repeat left center; } - -#docbarrenamelink { position: absolute; top: 6px; - font-size: 1.1em; display: none; } -#docbarrenamelink a { color: #999; } -#docbarrenamelink a:hover { color: #48d; } -#padtitlebuttons { position: absolute; width: 74px; zoom: 1; - height: 17px; top: 4px; left: 170px; display: none; - background: url(static/img/ok_or_cancel.gif) 0px 0px; } -#padtitlesave { position: absolute; display: block; - height: 0; padding-top: 17px; overflow: hidden; - width: 23px; left: 0; top: 0; } -#padtitlecancel { position: absolute; display: block; - height: 0; padding-top: 17px; overflow: hidden; - width: 35px; right: 0; top: 0; } -#padtitleedit { position: absolute; top: 2px; left: 5px; - height: 15px; padding: 2px; font-size: 1.4em; - background: white; border-left: 1px solid #c3c3c3; - border-top: 1px solid #c3c3c3; - border-right: 1px solid #e6e6e6; border-bottom: 1px solid #e6e6e6; - width: 150px; display: none; -} - -#padmain { - margin-top: 0px; - position: absolute; - top: 63px !important; - left: 0px; - right: 0px; - bottom: 0px; - zoom: 1; -} - -#padeditor { - bottom:0px; - left:0; - position:absolute; - right:0px; - top:0; - zoom: 1; -} -.hidesidebar #padeditor { right: 0; } - -#vdraggie { -/* background: url(static/img/vdraggie.gif) no-repeat top center;*/ - width:16px; - height:16px; - background-image:url('../../static/img/etherpad_lite_icons.png'); - background-repeat: no-repeat; - background-position: 0px -300px; - - cursor: W-resize; - bottom:0; - position:absolute; - right:268px; - top:0; - width:56px; - z-index: 10; -} - -#editbarsavetable -{ - position:absolute; - top: 6px; - right: 8px; - height: 24px; -} - -#editbarsavetable td, #editbartable td -{ - white-space: nowrap; -} - -#myswatchbox { - position: absolute; - left: 5px; - top: 5px; - width: 24px; - height: 24px; - border: 1px solid #000; - background: transparent; - cursor: pointer; -} - -#myswatch { width: 100%; height: 100%; background: transparent;/*...initially*/ } - -#mycolorpicker { - width: 232px; height: 265px; - position: absolute; - left: -250px; top: 0px; z-index: 101; - display: none; - border-radius: 5px; - background: rgba(0, 0, 0, 0.7); - padding-left:10px; - padding-top:10px; -} -/* -#mycolorpicker ul li -{ - float: left; -} -#mycolorpicker .picked { border: 1px solid #000 !important; } - -#mycolorpicker .picked .pickerswatch { border: 1px solid #fff; } -*/ -#mycolorpickersave { - left: 10px; - font-weight: bold; -} - -#mycolorpickercancel { - left: 85px; -} - -#mycolorpickersave, #mycolorpickercancel { - background: #fff; - background: linear-gradient(#fff, #ccc); - border: 1px solid #ccc; - border-radius: 4px; - font-size:12px; - cursor: pointer; - color:#000; - overflow: hidden; - padding: 4px; - top: 240px; +INPUT[type=text] {border:2px solid #eaeaea; border-radius:5px; padding:3px 4px;} +INPUT[type=text]:focus {border-color:#00b7ed; outline:none;} +BUTTON {background:none; border:0 none; color:#999; cursor:pointer; font-size:12px; margin-right:5px;} +BUTTON:hover, .button:hover {color:#00b7ed;} +.button { + background:linear-gradient(#eee, #c5c5c5); + border:1px solid #d5d5d5; + border-radius:3px; + color:#888; + cursor:pointer; + font-weight:700; + overflow:hidden; + padding:4px; text-align:center; - position: absolute; - width: 60px; + text-shadow:0 1px 0 #f5f5f5; } -#mycolorpickerpreview { - position: absolute; - left: 207px; - top: 240px; - width:16px; - height:16px; - padding:4px; - overflow: hidden; - color: #fff; - border-radius:5px; +/* editor toolbar */ +#editbar { + background:#f5f5f5; + background:linear-gradient(#f5f5f5, #eee 80%); + border-bottom:1px solid #d5d5d5; + overflow:hidden; + padding:3px 0 2px; + position:absolute; + width:100%; + z-index:2; +} +#editbar UL {list-style:none; overflow:hidden; padding:1px 3px 1px 2px; position:relative; z-index:2;} +#editbar .left {margin-left:22px;} +#editbar LI { + background:url(../../static/img/editbar-sprite.png) 0 0 no-repeat; + border-radius:3px; + border:1px solid #d5d5d5; + box-shadow:0 1px 0 #fff; + color:#999; + cursor:pointer; + display:block; + float:left; + height:20px; + margin-left:2px; + overflow:hidden; + padding:2px; + width:20px; +} +#editbar .group-start {border-radius:3px 0 0 3px; border-width:1px 0 1px 1px;} +#editbar .group-mid {border-radius:0; border-width:1px 0 1px 1px; margin-left:0;} +#editbar .group-end {border-radius:0 3px 3px 0; margin:0 1em 0 0;} + +/* editbar icons */ +LI#bold {background-position:2px 2px;} +LI#italic {background-position:2px -18px;} +LI#underline {background-position:2px -38px;} +LI#strikethrough {background-position:2px -58px;} +LI#unorderedlist {background-position:2px -78px;} +LI#orderedlist {background-position:2px -98px;} +LI#indent {background-position:2px -118px;} +LI#outdent {background-position:2px -138px;} +LI#undo {background-position:2px -158px;} +LI#redo {background-position:2px -178px;} +LI#clearauthorship {background-position:2px -198px;} +LI#settings {background-position:2px -258px;} +LI#importexport {background-position:2px -278px;} +LI#history {background-position:2px -298px;} +LI#users {background-position:2px -318px; font-size:12px; text-align:right; width:32px;} +LI#embed {background-position:2px -338px;} +LI#bold:hover {background-position:-38px 2px;} +LI#italic:hover {background-position:-38px -18px;} +LI#underline:hover {background-position:-38px -38px;} +LI#strikethrough:hover {background-position:-38px -58px;} +LI#unorderedlist:hover {background-position:-38px -78px;} +LI#orderedlist:hover {background-position:-38px -98px;} +LI#indent:hover {background-position:-38px -118px;} +LI#outdent:hover {background-position:-38px -138px;} +LI#undo:hover {background-position:-38px -158px;} +LI#redo:hover {background-position:-38px -178px;} +LI#clearauthorship:hover {background-position:-38px -198px;} +LI#settings:hover, +#settings.selected {background-position:-38px -258px;} +LI#importexport:hover, +#importexport.selected {background-position:-38px -278px;} +LI#history:hover, +#history.selected {background-position:-38px -298px;} +LI#users:hover, +#users.selected {background-position:-38px -318px; color:#00b7ed;} +LI#embed:hover, +#embed.selected {background-position:-38px -338px;} + +#editorcontainer {bottom:0; left:0; position:absolute; top:34px; width:100%; z-index:1;} +.chat-visible #editorcontainer {right:192px; width:auto;} +#editorcontainer IFRAME {height:100%; margin:0; padding:0; width:100%;} +#editorloadingbox { + background:url(../../static/img/ajax-loader.gif) 50% 0 no-repeat; + color:#aaa; + font-size:24px; + height:64px; + margin:200px auto 0; + padding-top:48px; + position:absolute; + text-align:center; + width:100%; + z-index:100; +} +#editorcontainerbox {bottom:0; position:absolute; top:0; width:100%;} + +#padpage.full-width {width:100%;} +.full-width #revision {position:absolute; right:20px; top:20px;} +.full-width #padmain {left:0; right:197px; width:auto;} +.full-width #rightbars {margin-right:0; right:7px;} +.full-width #timeslider {width:auto;} + +#padcontent {font-size:12px; padding:10px;} + +#padpage {bottom:0; position:absolute; top:0; width:100%;} +.maximized #padpage {left:8px; margin-left:0; right:8px; width:auto;} +.fullwidth #padpage {margin-left:6px; margin-right:6px; width:auto;} +.squish1width #padpage {width:800px;} +.squish2width #padpage {width:700px;} + +#padmain {bottom:0; left:0; margin-top:0; position:absolute; right:0; top:30px; zoom:1;} +#padeditor {bottom:0; left:0; position:absolute; right:0; top:0; zoom:1;} +.hidesidebar #padeditor {right:0;} + +#specialkeyarea {color:yellow; font-size:1.5em; font-weight:700; left:250px; position:absolute; top:5px;} + +#alertbar {display:none; left:0; margin-top:6px; opacity:0; position:absolute; right:0; z-index:53;} + +#servermsg {background:#ffc; border:1px solid #992; font-size:1.2em; padding:.8em; position:relative; zoom:1;} +#servermsg H3 {float:left; font-weight:700; margin-bottom:1em; margin-right:10px; width:auto;} +#servermsg #servermsgdate {color:#666; font-style:italic; font-weight:400;} +#hidetopmsg {bottom:5px; position:absolute; right:5px;} +#shuttingdown {background:#ffc; border:1px solid #992; font-size:1.2em; margin-top:6px; padding:.6em; position:relative; zoom:1;} + +#editbarsavetable {height:24px; position:absolute; right:8px; top:6px;} +#editbarsavetable TD, #editbartable TD {white-space:nowrap;} + +/* modal windows for settings ################################################# */ +.popup { + background:#222; + background:rgba(0,0,0,.6); + border-radius:0 0 5px 5px; + box-shadow:0 0 8px #999; + color:#ddd; + display:none; + font-size:12px; + padding:6px 10px; + position:absolute; + right:3px; + top:34px; + width:450px; + z-index:2; +} +.popup H2, .popup H3 {font-size:14px; margin:.5em 0 2px;} +.popup INPUT[type=text] {box-sizing:border-box; display:block; width:100px;} +.popup INPUT[type=checkbox] {margin-right:2px;} +.popup A {text-decoration:none;} +.popup P {margin:4px 0 0 0;} +.left_popup {float:left; width:50%;} +.right_popup {box-sizing:border-box; float:left; width:50%;} + +/* users modal */ +#usersmenu {width:120px; z-index:500;} + +#myswatchbox {cursor:pointer; height:24px; left:6px; position:absolute; width:24px;} +#myswatch {background:transparent; border-radius:3px; height:100%; width:100%;} + +#myusernameform {margin-left:25px;} +#myusernameedit {background:transparent; color:#fff; margin:0; padding:3px 4px;} + +#mystatusform {margin-left:35px; margin-top:5px;} +#mystatusedit {background:transparent; border:1px solid #bbb; color:#777; display:none; height:14px; margin:0; padding:2px; width:199px;} + +#otheruserstable {display:none;} +#otheruserstable TD {border-top:1px solid #555; color:#fff; height:26px; padding:0 2px; vertical-align:middle;} +#otheruserstable .swatch {border:1px solid #000; height:13px; margin:0 4px; overflow:hidden; width:13px;} +.usertdswatch {width:1%;} +.usertdname {font-size:1.3em; color:#444;} +.usertdname .editempty {color:#888; font-style:italic;} +.usertdstatus {font-size:1.1em; font-style:italic; color:#999;} +.usertdactivity {font-size:1.1em; color:#777;} + +#nootherusers {color:#eee; font-size:1.2em; font-weight:700; padding:10px;} +#nootherusers A {color:#3c88ff;} + +/* colorpicker and swatches modal */ +#mycolorpicker {background:rgba(0, 0, 0, 0.7); border-radius:0 0 5px 5px; display:none; left:-250px; padding:10px; position:absolute; top:0; z-index:101;} +#colorpicker {margin-bottom:10px;} +#mycolorpickerpreview {display:none;} /*#mycolorpickerpreview {border-radius:3px; display:block; float:right; height:24px; width:24px;}*/ +#colorpickerswatches {padding-left:3px; padding-top:5px;} +#colorpickerswatches LI {border:1px solid #ccc; height:14px; margin:3px 6px; overflow:hidden; padding:0; width:14px;} +#colorpickerswatches LI:hover {border:1px solid #000; cursor:pointer;} + +/* export formats */ +.exporttype {background:url(../../static/img/editbar-sprite.png) 0 0 no-repeat; color:#fff; margin-top:2px; padding-left:25px; text-decoration:none;} +#exporthtml {background-position:-40px -484px} +#exportplain {background-position:-40px -564px} +#exportword {background-position:-40px -464px} +#exportpdf {background-position:-40px -544px} +#exportopen {background-position:-40px -524px} +#exportwordle {background-position:-40px -564px} +#exportdokuwiki {background-position:-40px -504px} + +#importexportline {border-left:1px solid #fff; height:190px; left:260px; opacity:.8; position:absolute; width:0;} +.impexpbutton {background-image:linear-gradient(50% top, #ddd, #fff 20%, #fff 20%); padding:3px;} +#importmessagesuccess {display:none;} +#importsubmitinput {margin-top:12px;} + +#focusprotector {background-color:#fff; bottom:0; display:none; left:0; opacity:0.01; position:absolute; right:0; top:0; z-index:100;} + +/* embed / share pad */ +#embedmenu INPUT[type=text] {width:100%;} +#embedreadonly {margin-top:9px;} +#qr_center {margin:10px 10px auto 0; text-align:center;} +#embedreadonlyqr {box-shadow:0 0 10px #000; transition:all .2s ease-in-out;} +#embedreadonlyqr:hover {cursor:none; transform:scale(1.5);} + + +/* chat ####################################################################### */ +#chaticon { + background-color:#eee; + border-radius:3px 3px 0 0; + bottom:0; + color:#999; + cursor:pointer; + font-size:12px; + padding:6px 5px 3px 4px; + position:fixed; + right:4px; + text-shadow:0 1px 0 #fff; + z-index:1; +} +#chaticon A, #chatlabel {padding:3px 0 0;} +#chaticon A {background:url(../../static/img/editbar-sprite.png) -40px -381px no-repeat; margin-right:5px; padding-left:22px; text-decoration:none;} +#chaticon:hover A, #chaticon:hover SPAN {color:#00b7ed;} +#chaticon:hover A {background-position:-40px -401px;} +#chaticon SPAN {font-weight:700;} + +#chatbox { + background-color:#eee; + border:2px solid #eee; + border-bottom-width:0; + border-radius:3px 3px 0 0; + bottom:0; + display:none; + height:300px; + padding-bottom:10px; + padding:3px; + position:absolute; + right:3px; + width:260px; + z-index:1; +} +.chat-visible #chatbox {border-color:#d5d5d5; border-radius:0; border-width:0 0 0 1px; height:auto; right:0; top:34px;} +#titlebar {bottom:2px; color:#999; font-size:12px; font-weight:700; padding:2px 1px; position:relative; text-shadow:0 1px 0 #fff;} +#titlelabel {position:absolute;} +#titlecross {background:url(../../static/img/editbar-sprite.png) 0 -440px; cursor:pointer; float:right; height:16px; margin:-1px -4px 0 0; width:16px;} +#titlecross:hover {background-position:-40px -440px;} +#chattext { + background-color:#fff; + bottom:30px; + font-size:12px; + left:0; + overflow-y:scroll; + position:absolute; + right:0; + top:20px; + z-index:1002; +} +.chat-visible #chattext {top:0;} +#chattext P {overflow-x:hidden; padding:3px; word-wrap:break-word;} +.time {color:#eee; float:right; margin:0 1px;} +#chatinputbox {bottom:0; left:0; padding:2px 1px; position:absolute; right:0;} +#chatinputbox INPUT {font-size:12px; width:94%;} + +#chatthrob { + background-color:#000; + background-color:rgb(0,0,0); + background-color:rgba(0,0,0,0.7); + border-radius:6px; + bottom:40px; + color:#fff; + display:none; + font-size:14px; + height:40px; + opacity:.8; + padding:10px; + position:absolute; + right:20px; + width:150px; + z-index:200; } -#myusernameform { margin-left: 35px; } -#myusernameedit { font-size: 1.3em; color: #fff; - padding: 3px; height: 18px; margin: 0; border: 0; - width: 117px; background: transparent; } -#myusernameform input.editable { border: 1px solid #444; } -#myuser .myusernameedithoverable:hover { background: white; color: black} -#mystatusform { margin-left: 35px; margin-top: 5px; } -#mystatusedit { font-size: 1.2em; color: #777; - font-style: italic; display: none; - padding: 2px; height: 14px; margin: 0; border: 1px solid #bbb; - width: 199px; background: transparent; } -#myusernameform .editactive, #myusernameform .editempty { - background: white; border-left: 1px solid #c3c3c3; - border-top: 1px solid #c3c3c3; - border-right: 1px solid #e6e6e6; border-bottom: 1px solid #e6e6e6; - color: #000 -} -#myusernameform .editempty { color: #333; } - -table#otheruserstable { display: none; } -#nootherusers { padding: 10px; font-size: 1.2em; color: #eee; font-weight: bold;} -#nootherusers a { color: #3C88FF; } +/* pad content styles ######################################################### */ +/* lists */ +.list-bullet2, .list-indent2, .list-number2 {margin-left:3em;} +.list-bullet3, .list-indent3, .list-number3 {margin-left:4.5em;} +.list-bullet4, .list-indent4, .list-number4 {margin-left:6em;} +.list-bullet5, .list-indent5, .list-number5 {margin-left:7.5em;} +.list-bullet6, .list-indent6, .list-number6 {margin-left:9em;} +.list-bullet7, .list-indent7, .list-number7 {margin-left:10.5em;} +.list-bullet8, .list-indent8, .list-number8 {margin-left:12em;} -#otheruserstable td { - border-top: 1px solid #555; - height: 26px; - vertical-align: middle; - padding: 0 2px; - color: #fff; +/* unordered lists */ +UL {list-style-type:disc; margin-left:1.5em;} +UL UL {margin-left:0 !important;} + +.list-bullet2, .list-bullet5, .list-bullet8 {list-style-type:circle;} +.list-bullet3, .list-bullet6 {list-style-type:square;} + +.list-indent1, .list-indent2, .list-indent3, .list-indent5, .list-indent5, .list-indent6, .list-indent7, .list-indent8 {list-style-type:none;} + +/* ordered lists */ +OL {list-style-type:decimal; margin-left:1.5em;} +.list-number2, .list-number5, .list-number8 {list-style-type:lower-latin;} +.list-number3, .list-number6 {list-style-type:lower-roman;} + + +/* media-specific styles ###################################################### */ +@media screen and (max-width:960px) { + .modaldialog {left:0; margin:0 auto; position:relative; top:40px; width:80%;} } -#otheruserstable .swatch { - border: 1px solid #000; width: 13px; height: 13px; overflow: hidden; - margin: 0 4px; +@media only screen and (min-device-width:320px) and (max-device-width:720px) { + #editbar UL LI {padding:4px 3px;} + #editbar #menu_right > LI {padding:4px 8px;margin-top:2px; padding:4px 8px;} + #editbar #menu_right { + background:#f7f7f7; + background:linear-gradient(#f7f7f7, #f1f1f1 80%); + border-top:1px solid #ccc; + bottom:0; + height:32px; + overflow:hidden; + position:fixed; + width:100%; + } + #editbar #menu_right LI:not(:last-child) {display:none;} + #editbar #menu_right LI:last-child {border-radius:0; border:0; float:right; height:24px; margin-top:0;} + #chaticon {opacity:.8;} + #users {right:4px;} + #mycolorpicker {left:-72px;} /* #mycolorpicker:width - #users:width */ + #editorcontainer {margin-bottom:33px;} + #chaticon { + background:#f7f7f7; + background:linear-gradient(#f7f7f7, #f1f1f1 80%); + border:0; + border-radius:0; + border-right:none; + bottom:0; + right:55px; + } + #chatbox {bottom:32px; right:0;} + #editbar UL LI A SPAN {top:-3px;} + #usericonback {margin-top:4px;} } -.usertdswatch { width: 1%; } -.usertdname { font-size: 1.3em; color: #444; } -.usertdstatus { font-size: 1.1em; font-style: italic; color: #999; } -.usertdactivity { font-size: 1.1em; color: #777; } -.usertdname input { border: 1px solid #bbb; width: 80px; padding: 2px; } -.usertdname input.editactive, .usertdname input.editempty { - background: white; border-left: 1px solid #c3c3c3; - border-top: 1px solid #c3c3c3; - border-right: 1px solid #e6e6e6; border-bottom: 1px solid #e6e6e6; +/* IE fixes ################################################################### */ +* HTML #modaloverlay {/* for IE 6+ */ + background-image:none; + background-repeat:no-repeat; + opacity:1; /* in case this is looked at */ } -.usertdname input.editempty { color: #888; font-style: italic;} - -.modaldialog.cboxreconnecting .modaldialog-inner, -.modaldialog.cboxconnecting .modaldialog-inner { - background: url(../../static/img/connectingbar.gif) no-repeat center 60px; - height: 100px; -} -.modaldialog.cboxreconnecting, -.modaldialog.cboxconnecting, -.modaldialog.cboxdisconnected { - background: #8FCDE0; -} -.cboxdisconnected #connectionboxinner div { display: none; } -.cboxdisconnected_userdup #connectionboxinner #disconnected_userdup { display: block; } -.cboxdisconnected_deleted #connectionboxinner #disconnected_deleted { display: block; } -.cboxdisconnected_initsocketfail #connectionboxinner #disconnected_initsocketfail { display: block; } -.cboxdisconnected_looping #connectionboxinner #disconnected_looping { display: block; } -.cboxdisconnected_slowcommit #connectionboxinner #disconnected_slowcommit { display: block; } -.cboxdisconnected_unauth #connectionboxinner #disconnected_unauth { display: block; } -.cboxdisconnected_unknown #connectionboxinner #disconnected_unknown { display: block; } -.cboxdisconnected_initsocketfail #connectionboxinner #reconnect_advise, -.cboxdisconnected_looping #connectionboxinner #reconnect_advise, -.cboxdisconnected_slowcommit #connectionboxinner #reconnect_advise, -.cboxdisconnected_unknown #connectionboxinner #reconnect_advise { display: block; } -.cboxdisconnected div#reconnect_form { display: block; } -.cboxdisconnected .disconnected h2 { display: none; } -.cboxdisconnected .disconnected .h2_disconnect { display: block; } -.cboxdisconnected_userdup .disconnected h2.h2_disconnect { display: none; } -.cboxdisconnected_userdup .disconnected h2.h2_userdup { display: block; } -.cboxdisconnected_unauth .disconnected h2.h2_disconnect { display: none; } -.cboxdisconnected_unauth .disconnected h2.h2_unauth { display: block; } -#connectionstatus { - position: absolute; width: 37px; height: 41px; overflow: hidden; - right: 0; - z-index: 11; -} -#connectionboxinner .connecting { - margin-top: 20px; - font-size: 2.0em; color: #555; - text-align: center; display: none; -} -.cboxconnecting #connectionboxinner .connecting { display: block; } - -#connectionboxinner .disconnected h2 { - font-size: 1.8em; color: #333; - text-align: left; - margin-top: 10px; margin-left: 10px; margin-right: 10px; - margin-bottom: 10px; -} -#connectionboxinner .disconnected p { - margin: 10px 10px; - font-size: 1.2em; - line-height: 1.1; - color: #333; -} -#connectionboxinner .disconnected { display: none; } -.cboxdisconnected #connectionboxinner .disconnected { display: block; } - -#connectionboxinner .reconnecting { - margin-top: 20px; - font-size: 1.6em; color: #555; - text-align: center; display: none; -} -.cboxreconnecting #connectionboxinner .reconnecting { display: block; } - -#reconnect_form button { - font-size: 12pt; - padding: 5px; -} /* We give docbar a higher z-index than its descendant impexp-wrapper in order to allow the Import/Export panel to be on top of stuff lower down on the page in IE. Strange but it works! */ -#docbar { z-index: 52; } +#docbar {z-index:52;} -#impexp-wrapper { width: 650px; right: 10px; } -#impexp-panel { height: 160px; } -.docbarimpexp-closing #impexp-wrapper { z-index: 50; } +#impexp-wrapper {right:10px; width:650px;} +#impexp-panel {height:160px;} +.docbarimpexp-closing #impexp-wrapper {z-index:50;} -#savedrevs-wrapper { width: 100%; left: 0; } -#savedrevs-panel { height: 79px; } -.docbarsavedrevs-closing #savedrevs-wrapper { z-index: 50; } -#savedrevs-wrapper .dbpanel-rightedge { background-position: 0 -10px; } +#savedrevs-wrapper {left:0; width:100%;} +#savedrevs-panel {height:79px;} +.docbarsavedrevs-closing #savedrevs-wrapper {z-index:50;} +#savedrevs-wrapper .dbpanel-rightedge {background-position:0 -10px;} -#options-wrapper { width: 340px; right: 200px; } -#options-panel { height: 114px; } -.docbaroptions-closing #options-wrapper { z-index: 50; } +#options-wrapper {right:200px; width:340px;} +#options-panel {height:114px;} +.docbaroptions-closing #options-wrapper {z-index:50;} -#security-wrapper { width: 320px; right: 300px; } -#security-panel { height: 130px; } -.docbarsecurity-closing #security-wrapper { z-index: 50; } +#security-wrapper {right:300px; width:320px;} +#security-panel {height:130px;} +.docbarsecurity-closing #security-wrapper {z-index:50;} -#revision-notifier { position: absolute; right: 8px; top: 25px; - width: auto; height: auto; font-size: 1.2em; background: #ffc; - border: 1px solid #aaa; color: #444; padding: 3px 5px; - display: none; z-index: 55; } -#revision-notifier .label { color: #777; font-weight: bold; } +#revision-notifier {position:absolute; right:8px; top:25px; + width:auto; height:auto; font-size:1.2em; background:#ffc; + border:1px solid #aaa; color:#444; padding:3px 5px; + display:none; z-index:55;} +#revision-notifier .label {color:#777; font-weight:700;} -#mainmodals { z-index: 600; /* higher than the modals themselves - so that modals are on top in IE */ } -.modalfield { font-size: 1.2em; padding: 1px; border: 1px solid #bbb;} -#mainmodals .editempty { color: #aaa; } - -.expand-collapse { - height: 22px; - background-image: url(static/img/sharedistri.gif); - background-repeat: no-repeat; - background-position: 0 3px; - padding-left: 17px; - text-decoration: none; -} -.expand-collapse.expanded { - background-position: 0 -31px; -} +#mainmodals {z-index:600;} /* higher than the modals themselves so that modals are on top in IE */ +.modalfield {border:1px solid #bbb; font-size:1.2em; padding:1px;} +#mainmodals .editempty {color:#aaa;} +.expand-collapse {background:url(static/img/sharedistri.gif) 0 3px no-repeat; height:22px; padding-left:17px; text-decoration:none;} +.expand-collapse.expanded {background-position:0 -31px;} .modaldialog { - position: absolute; - top: 100px; + background:#fff1a8 none; + border:2px solid #fde97f; + border-radius:5px; + color:#666; + display:none; + height:auto; left:50%; - margin-left:-243px; - width: 485px; - display: none; - z-index: 501; - zoom: 1; - overflow: hidden; - background: white; - border: 1px solid #999; + margin:5em auto 2em; + overflow:hidden; + padding:10px 16px; + position:absolute; + text-align:center; + top:100px; + width:485px; + z-index:501; + zoom:1; } -.modaldialog .modaldialog-inner { padding: 10pt; } +.modaldialog .modaldialog-inner {padding:10px;} .modaldialog .modaldialog-hide { - float: right; - background-repeat: no-repeat; - background-image: url(static/img/sharebox4.gif); - display: block; - width: 22px; height: 22px; - background-position: -454px -6px; + background:url(static/img/sharebox4.gif) -454px -6px no-repeat; + display:block; + float:right; + height:22px; margin-right:-5px; margin-top:-5px; + width:22px; } -.modaldialog label, -.modaldialog h1 { - color:#222222; - font-size:125%; - font-weight:bold; -} +.modaldialog LABEL, .modaldialog H1 {color:#222; font-size:125%; font-weight:700;} -.modaldialog th { - vertical-align: top; - text-align: left; -} +.modaldialog TH {text-align:left; vertical-align:top;} -.nonprouser #sharebox-stripe { display: none; } +.modaldialog.cboxreconnecting .modaldialog-inner, +.modaldialog.cboxconnecting .modaldialog-inner + {background:url(../../static/img/ajax-loader.gif) no-repeat 50% 0; height:100px;} -.sharebox-url { - width: 440px; height: 18px; - text-align: left; - font-size: 1.3em; - line-height: 18px; - padding: 2px; -} +.cboxdisconnected #connectionboxinner DIV, +.cboxdisconnected .disconnected H2, +.cboxdisconnected_userdup .disconnected .h2_disconnect, +.cboxdisconnected_unauth .disconnected .h2_disconnect + {display:none;} -#sharebox-send { - float: right; - background-repeat: no-repeat; - background-image: url(static/img/sharebox4.gif); - display: block; - width: 87px; height: 22px; - background-position: -383px -289px; +.cboxdisconnected_userdup #connectionboxinner #disconnected_userdup, +.cboxdisconnected_deleted #connectionboxinner #disconnected_deleted, +.cboxdisconnected_initsocketfail #connectionboxinner #disconnected_initsocketfail, +.cboxdisconnected_looping #connectionboxinner #disconnected_looping, +.cboxdisconnected_slowcommit #connectionboxinner #disconnected_slowcommit, +.cboxdisconnected_unauth #connectionboxinner #disconnected_unauth, +.cboxdisconnected_unknown #connectionboxinner #disconnected_unknown, +.cboxdisconnected_initsocketfail #connectionboxinner #reconnect_advise, +.cboxdisconnected_looping #connectionboxinner #reconnect_advise, +.cboxdisconnected_slowcommit #connectionboxinner #reconnect_advise, +.cboxdisconnected_unknown #connectionboxinner #reconnect_advise, +.cboxdisconnected #reconnect_form, +.cboxdisconnected .disconnected .h2_disconnect, +.cboxdisconnected_userdup .disconnected .h2_userdup, +.cboxdisconnected_unauth .disconnected .h2_unauth + {display:block;} + +#connectionstatus {height:41px; overflow:hidden; position:absolute; right:0; width:37px; z-index:11;} +#connectionboxinner .connecting { + margin-top:20px; + font-size:2em; + color:#555; + text-align:center; + display:none; } +.cboxconnecting #connectionboxinner .connecting {display:block;} + +#connectionboxinner .disconnected h2 { + font-size:1.8em; color:#333; + text-align:left; + margin-top:10px; margin-left:10px; margin-right:10px; + margin-bottom:10px; +} +#connectionboxinner .disconnected p { + margin:10px 10px; + font-size:1.2em; + line-height:1.1; + color:#333; +} +#connectionboxinner .disconnected {display:none;} +.cboxdisconnected #connectionboxinner .disconnected {display:block;} + +#connectionboxinner .reconnecting {color:#555; display:none; font-size:1.6em; margin-top:20px; text-align:center;} +.cboxreconnecting #connectionboxinner .reconnecting {display:block;} -#viewbarcontents { display: none; } -#viewzoomtitle { - position: absolute; left: 10px; top: 4px; height: 20px; line-height: 20px; - width: auto; -} -#viewzoommenu { - width: 65px; -} + + +.sharebox-url {height:18px; font-size:1.3em; line-height:18px; padding:2px; text-align:left; width:440px;} +#sharebox-send {background:url(static/img/sharebox4.gif) -383px -289px no-repeat; display:block; float:right; height:22px; width:87px;} + +#viewbarcontents {display:none;} #bottomarea { - height: 28px; - overflow: hidden; - position: absolute; - height: 28px; - bottom: 0px; - left: 0px; - right: 0px; - font-size: 1.2em; - color: #444; + height:28px; + overflow:hidden; + position:absolute; + height:28px; + bottom:0; + left:0; + right:0; + font-size:1.2em; + color:#444; } -#widthprefcheck { position: absolute; - background-image: url(static/img/layoutbuttons.gif); - background-repeat: no-repeat; cursor: pointer; - width: 86px; height: 20px; top: 4px; right: 2px; } -.widthprefunchecked { background-position: -1px -1px; } -.widthprefchecked { background-position: -1px -23px; } -#sidebarcheck { position: absolute; - background-image: url(static/img/layoutbuttons.gif); - background-repeat: no-repeat; cursor: pointer; - width: 86px; height: 20px; top: 4px; right: 90px; } -.sidebarunchecked { background-position: -1px -45px; } -.sidebarchecked { background-position: -1px -67px; } -#feedbackbutton { display: block; position: absolute; width: 68px; - height: 0; padding-top: 17px; overflow: hidden; - background: url(static/img/bottomareagfx.gif); - top: 5px; right: 220px; +#widthprefcheck { + background-image:url(static/img/layoutbuttons.gif); + background-repeat:no-repeat; + cursor:pointer; + height:20px; + position:absolute; + right:2px; + top:4px; + width:86px; } +.widthprefunchecked {background-position:-1px -1px;} +.widthprefchecked {background-position:-1px -23px;} +#sidebarcheck { + background-image:url(static/img/layoutbuttons.gif); + background-repeat:no-repeat; + cursor:pointer; + height:20px; + position:absolute; + right:90px; + top:4px; + width:86px; +} +.sidebarunchecked {background-position:-1px -45px;} +.sidebarchecked {background-position:-1px -67px;} #modaloverlay { - z-index: 500; display: none; - background-repeat: repeat-both; - width: 100%; position: absolute; - height: 100%; left: 0; top: 0; -} - -* html #modaloverlay { /* for IE 6+ */ - opacity: 1; /* in case this is looked at */ - background-image: none; - background-repeat: no-repeat; - /* scale the image */ -} - -a#topbarmaximize { - float: right; - width: 16px; - height: 16px; - margin-right:-143px; - margin-top:4px; - background: url(static/img/maximize_normal.png); -} - -.maximized a#topbarmaximize { - background: url(static/img/maximize_maximized.png); -} - -#editbarinner h1 { - line-height: 29px; - font-size: 16px; - padding-left: 6pt; - margin-top: 0; -} - -#editbarinner h1 a { - font-size: 12px; -} - -.bigbutton { - display: block; - background-color: #a3bde0; - color: #555555; - border-style: solid; - border-width: 2px; - border-left-color: #d6e2f1; - border-right-color: #86aee1; - border-top-color: #d6e2f1; - border-bottom-color: #86aee1; - margin: 10pt; - text-align: center; - text-decoration: none; - padding: 50pt; - font-size: 20pt; - border-radius: 3pt; -} - -.modaldialog .bigbutton { - padding-left: 0; - padding-right: 0; - width: 100%; -} - -} - - -ul#colorpickerswatches -{ - padding-left: 3px; - padding-top: 5px; -} - -ul#colorpickerswatches li -{ - border: 1px solid #ccc; - width: 14px; - height: 14px; - overflow: hidden; - margin: 3px 6px; - padding: 0px; -} - -ul#colorpickerswatches li:hover -{ - border: 1px solid #000; - cursor: pointer; -} - - - -#chatbox -{ + background-repeat:repeat; + display:none; + height:100%; + left:0; position:absolute; - bottom:0px; - right: 20px; - width: 180px; - height: 200px; - z-index: 400; - background-color:#f7f7f7; - border-left: 1px solid #999; - border-right: 1px solid #999; - border-top: 1px solid #999; - padding: 3px; - padding-bottom: 10px; - border-top-left-radius: 5px; - border-top-right-radius: 5px; - display:none; + top:0; + width:100%; + z-index:500; } -#chattext -{ - background-color: white; - border: 1px solid white; - overflow-y:scroll; - font-size: 12px; + +/* to be removed ############################################################## */ +/*// the top bar is currently hidden! +#docbar {background-color:#fbfbfb; height:25px; margin-top:6px; position:relative; zoom:1;} +.docbarbutton {border-left:1px solid #ccc; padding-top:2px 4px; white-space:nowrap;} +.docbarbutton.highlight {background-color:#fef2bd; border:1px solid #ccc; border-right:0;} + +#docbarpadtitle { + color:#444; + font-size:1.6em; + font-weight:400; + height:22px; + left:9px; + line-height:22px; + margin-left:2px; + overflow:hidden; position:absolute; - right:0px; - left:0px; - top:25px; - bottom:25px; - z-index:1002; + text-overflow:ellipsis; + top:2px; + white-space:nowrap; + width:280px; } +.docbar-public #docbarpadtitle {background:url(static/img/public.gif) 0 50% no-repeat; padding-left:22px;} -#chattext p -{ - padding: 3px; - overflow-x: hidden; -} - -#chatinputbox -{ - padding: 3px 2px; - position: absolute; - bottom:0px; - right:0px; - left:3px; -} - -#chatlabel -{ - font-size:13px; - line-height:16px; - font-weight:bold; - color:#555; - text-decoration: none; - position: relative; - bottom: 3px; -} - -#chatinput -{ - border: 1px solid #BBBBBB; - width: 100%; - float:right; -} - -#chaticon -{ - z-index: 400; - position: fixed; - bottom: 0px; - right: 20px; - padding: 5px; - border-left: 1px solid #999; - border-right: 1px solid #999; - border-top: 1px solid #999; - border-top-left-radius: 5px; - border-top-right-radius: 5px; - background-color:#fff; - cursor: pointer; -} - -#chaticon a -{ - text-decoration: none; -} - -#chatcounter -{ - color:#555; - font-size:9px; - position:relative; - bottom: 2px; -} - -#titlebar -{ - line-height:16px; - font-weight:bold; - color:#555; - position: relative; - bottom: 2px; -} - -#titlelabel -{ - font-size:13px; - margin:4px 0 0 4px; +#docbarrenamelink {display:none; font-size:1.1em; position:absolute; top:6px;} +#docbarrenamelink A {color:#999;} +#docbarrenamelink A:hover {color:#48d;} +#padtitlebuttons { + background:url(static/img/ok_or_cancel.gif) 0 0 no-repeat; + display:none; + height:17px; + left:170px; position:absolute; -} - -#titlecross -{ - font-size:25px; - float:right; - text-align: right; - text-decoration: none; - cursor: pointer; - color:#555; + top:4px; + width:74px; + zoom:1; } - -.time -{ - float:right; - color:#333; - font-style:italic; - font-size: 10px; - margin-left: 3px; - margin-right: 3px; - margin-top:2px; -} - - -/* resizable stuff for chat */ -.ui-resizable { -position: relative; -} -.ui-resizable-handle { - position: absolute; - font-size: 0.1px; - z-index: 99999; - display: block; - -} - -.ui-resizable-nw { - background-image: url("../../static/img/etherpad_lite_icons.png"); - background-position: 0 -416px; - background-repeat: no-repeat; - background-size: 100% auto; - cursor: nw-resize; - height: 17px; - left: 3px; - top: 3px; - width: 17px; -} - -.ui-resizable-ne -{ - cursor: ne-resize; - width: 9px; - height: 9px; - right: -5px; - top: -5px; -} - -.exporttype{ - margin-top: 2px; - background-repeat:no-repeat; - padding-left:25px; - background-image: url("../../static/img/etherpad_lite_icons.png"); - color:#fff; - text-decoration:none; -} - -#importexportline{ - border-left: 1px solid #fff; - height: 190px; +#padtitlesave { + display:block; + height:0; + left:0; + overflow:hidden; + padding-top:17px; position:absolute; - width:0px; - left:260px; - opacity:.8; + top:0; + width:23px; } - -.impexpbutton{ - background-image: linear-gradient(center top , #EEEEEE, white 20%, white 20%); - padding:3px; +#padtitlecancel { + display:block; + height:0; + overflow:hidden; + padding-top:17px; + position:absolute; + right:0; + top:0; + width:35px; } - -#exporthtml{ - background-position: 0px -299px; -} - -#exportplain{ - background-position: 0px -395px; -} - -#exportword{ - background-position: 0px -275px; -} - -#exportpdf{ - background-position: 0px -371px; -} - -#exportopen{ - background-position: 0px -347px; -} - -#exportwordle{ - background-position: 0px -323px; -} - -#exportdokuwiki{ - background-position: 0px -459px; -} - -#importstatusball{ +#padtitleedit { + background:#fff; + border: 1px solid #c3c3c3; + border-color:#c3c3c3 #e6e6e6 #e6e6e6 #c3c3c3; display:none; + font-size:1.4em; + height:15px; + left:5px; + padding:2px; + position:absolute; + top:2px; + width:150px; } - -#importarrow{ - display:none; -} - -#importmessagesuccess{ - display:none; -} - -#importsubmitinput{ - height:25px; - width:85px; - margin-top:12px; -} - -#importstatusball{ - height:50px; -} - -#chatthrob{ -display:none; -position:absolute; -bottom:40px; -font-size:14px; -width:150px; -height:40px; -right: 20px; -z-index: 200; -background-color: #000; -color: white; -background-color: rgb(0,0,0); -background-color: rgba(0,0,0,0.7); -padding: 10px; -border-radius: 6px; -opacity:.8; -} - -.buttonicon{ -width:16px; -height:16px; -background-image:url('../../static/img/etherpad_lite_icons.png'); -background-repeat: no-repeat; -margin-left: 1px; -margin-top: 1px; -} -.buttonicon-bold { - background-position: 0px -116px; -} -.buttonicon-italic { - background-position: 0px 0px; -} -.buttonicon-underline { - background-position: 0px -236px; -} -.buttonicon-strikethrough { - background-position: 0px -200px; -} -.buttonicon-insertorderedlist { - background-position: 0px -477px -} -.buttonicon-insertunorderedlist { - background-position: 0px -34px; -} -.buttonicon-indent { - background-position: 0px -52px; -} -.buttonicon-outdent { - background-position: 0px -134px; -} -.buttonicon-undo { - background-position: 0px -255px; -} -.buttonicon-redo { - background-position :0px -166px; -} -.buttonicon-clearauthorship { - background-position: 0px -86px; -} -.buttonicon-settings { - background-position: 0px -436px; -} -.buttonicon-import_export { - background-position: 0px -68px; -} -.buttonicon-embed { - background-position: 0px -18px; -} -.buttonicon-history { - background-position: 0px -218px; -} -.buttonicon-chat { - background-position: 0px -102px; - display: inline-block; -} -.buttonicon-showusers { - background-position: 0px -183px; - display: inline-block; -} - -#usericon -{ -width:33px !important; -} - -#focusprotector -{ - z-index: 100; - position: absolute; - bottom: 0px; - top: 0px; - left: 0px; - right: 0px; - background-color: white; - opacity:0.01; - display:none; -} - -#online_count{ - color: #999; -} - -#qr_center { - margin: 10px 10px auto 0; - text-align: center; -} - -#embedreadonlyqr { - box-shadow: 0 0 10px #000; - border-radius: 3px; - transition: all .2s ease-in-out; -} - -#embedreadonlyqr:hover { - cursor: none; - transform: scale(1.5); -} - -.rtl{ - direction:RTL; -} - -#chattext p { - word-wrap: break-word; -} - -/* fix for misaligned labels */ -label { - position: relative; - bottom: 1px; -} - -.right { - float:right; -} - -.popup { - font-size: 14px; - width: 450px; - z-index: 500; - padding: 10px; - border-radius: 6px; - background: #222; - background: rgba(0,0,0,.7); - background: linear-gradient(rgba(0,0,0,.6), rgba(0,0,0,.7) 35px, rgba(0,0,0,.6)); - box-shadow: 0 0 8px #888; - color: #fff; -} - -.popup input[type=text] { - width: 100%; - padding: 5px; - box-sizing: border-box; - display:block; - margin-top: 10px; -} - -.popup a { - text-decoration: none; -} - -.popup h1 { - font-size: 18px; -} -.popup h2 { - font-size: 15px; -} -.popup p { - margin: 5px 0; -} - -.left_popup { - float: left; - width: 50%; -} - -.right_popup { - float: left; - width: 50%; -} - -#settingsmenu, #importexport, #embed { - position: absolute; - top: 55px; - right: 20px; - display: none; -} - -.note { - color: #ddd; - font-size: 11px; - font-weight: bold; -} - -.selected { - background: #eee !important; - background: linear-gradient(#EEE, #F0F0F0) !important; -} - -.stickyChat { - background-color: #f1f1f1 !important; - right: 0px !important; - top: 36px; - border-radius: 0px !important; - height: auto !important; - border: none !important; - border-left: 1px solid #ccc !important; - width: 185px !important; -} - -@media screen and (max-width: 960px) { - .modaldialog { - position: relative; - margin: 0 auto; - width: 80%; - top: 40px; - left: 0; - } -} - -@media screen and (max-width: 600px) { - #editbar ul li { - padding: 4px 1px; - } -} - -@media only screen and (min-device-width: 320px) and (max-device-width: 720px) { - #editbar ul li { - padding: 4px 3px; - } - #users { - right: 4px; - } - #mycolorpicker { - left: -72px; /* #mycolorpicker:width - #users:width */ - } - #editorcontainer { - margin-bottom: 33px; - } - #editbar ul#menu_right { - background: #f7f7f7; - background: linear-gradient(#f7f7f7, #f1f1f1 80%); - width: 100%; - overflow: hidden; - height: 32px; - position: fixed; - bottom: 0; - border-top: 1px solid #ccc; - } - #editbar ul#menu_right li:last-child { - height: 24px; - border-radius: 0; - margin-top: 0; - border: 0; - float: right; - } - #chaticon { - bottom: 0; - right: 55px; - border-right: none; - border-radius: 0; - background: #f7f7f7; - background: linear-gradient(#f7f7f7, #f1f1f1 80%); - border: 0; - } - #chatbox { - bottom: 32px; - right: 0; - border-top-right-radius: 0; - border-right: none; - } - #editbar ul li a span { - top: -3px; - } - #usericonback { - margin-top: 4px; - } - #qrcode { - display: none; - } - #editbar ul#menu_right li:not(:last-child) { - display: block; - } - #editbar ul#menu_right > li { - background: none; - border: none; - margin-top: 4px; - padding: 4px 8px; - } - .selected { - background: none !important; - } - #timesliderlink { - display: none !important; - } - .popup { - border-radius: 0; - box-sizing: border-box; - width: 100%; - } - #settingsmenu, #importexport, #embed { - left: 0; - top: 0; - bottom: 33px; - right: 0; - } - .separator { - display: none; - } -} +#topbarmaximize {background:url(../../static/img/editbar-sprite.png) 0 -420px no-repeat; float:right; height:20; margin-right:-143px; margin-top:4px; width:20px;} +.maximized #topbarmaximize {background-position:-40px -420px;} +*/ \ No newline at end of file diff --git a/static/css/timeslider.css b/static/css/timeslider.css index 926c80123..4b1a1c655 100644 --- a/static/css/timeslider.css +++ b/static/css/timeslider.css @@ -1,106 +1,51 @@ -#editorcontainerbox {overflow:auto; top:40px;} +/* adjust page layout to show timeslider */ +.maximized #padpage {left:8px; margin-left:0; right:8px; width:auto;} +.fullwidth #padpage {margin-left:6px; margin-right:6px; width:auto;} +.squish1width #padpage {width:800px;} +.squish2width #padpage {width:700px;} -#padcontent {font-size:12px; padding:10px;} +#padmain {top:59px;} +#editorcontainerbox {overflow:auto; top:34px;} /* #FIXME: the HTML structure is totally destroyed! */ -#timeslider-wrapper {left:0; position:relative; right:0; top:0;} -#timeslider-left {background-image:url(../../static/img/timeslider_left.png); height:63px; left:0; position:absolute; width:134px;} -#timeslider-right {background-image:url(../../static/img/timeslider_right.png); height:63px; position:absolute; right:0; top:0; width:155px;} -#timeslider {background-image:url(../../static/img/timeslider_background.png); height:63px; margin:0 9px;} -#timeslider #timeslider-slider {height:61px; left:0; position:absolute; top:1px; width:100%;} -#ui-slider-handle { - -khtml-user-select:none; - -moz-user-select:none; - -ms-user-select:none; - -webkit-user-select:none; - background-image:url(../../static/img/crushed_current_location.png); - cursor:pointer; - height:61px; - left:0; - position:absolute; - top:0; - user-select:none; - width:13px; -} -#ui-slider-bar { - -khtml-user-select:none; - -moz-user-select:none; - -ms-user-select:none; - -webkit-user-select:none; - cursor:pointer; - height:35px; - margin-left:5px; - margin-right:148px; - position:relative; - top:20px; - user-select:none; -} +/* timeslider sprite */ +#ui-slider-handle, #playpause_button, #steppers A, #timeslider .star {background:url(../../static/img/timeslider-sprite.png) 0 0 no-repeat;} -#playpause_button, #playpause_button_icon {height:47px; position:absolute; width:47px;} -#playpause_button {background-image:url(../../static/img/crushed_button_undepressed.png); right:77px; top:9px;} -#playpause_button_icon {background-image:url(../../static/img/play.png); left:0; top:0;} -.pause#playpause_button_icon {background-image:url(../../static/img/pause.png);} +#timeslider {background:#f5f5f5; border-bottom:1px solid #d5d5d5; padding:6px 0; position:absolute; top:0; width:100%;} +#timer {background-color:#aaa; border-radius:3px; color:#fff; font-family:Arial, sans-serif; font-size:11px; left:6px; min-width:101px; padding:2px 4px 1px; position:absolute; top:7px;} +#timeslider-wrapper {float:left; width:100%;} +#timeslider-slider {margin:0 164px 0 6px;} +#timeslider-slider DIV {cursor:pointer;} +#ui-slider-handle {background-position:-142px 0; height:22px; left:0; position:absolute; top:30px; width:13px;} +#ui-slider-bar {background-color:#ddd; height:6px; margin-top:40px;} +#ui-slider-bar:hover {background-color:#00b7ed;} +#timeslider .star {background-position:-80px 0; cursor:pointer; height:16px; position:absolute; top:40px; width:16px;} +#timeslider .star:hover {background-position:-100px 0;} -#leftstar, #rightstar, #leftstep, #rightstep - {background:url(../../static/img/stepper_buttons.png) 0 0 no-repeat; height:21px; overflow:hidden; position:absolute;} -#leftstar {background-position:0 44px; right:34px; top:8px; width:30px;} -#rightstar {background-position:29px 44px; right:5px; top:8px; width:29px;} -#leftstep {background-position:0 22px; right:34px; top:20px; width:30px;} -#rightstep {background-position:29px 22px; right:5px; top:20px; width:29px;} +#playpause_button {background-color:#ddd; background-position:-60px 0; border-radius:30px; float:right; height:46px; width:46px;} +#playpause_button:hover {background-position:-60px -40px;} +#playpause_button.pause {background-position:-100px 0;} +#playpause_button.pause:hover {background-position:-100px -40px;} -#timeslider .star { - background-image:url(../../static/img/star.png); - cursor:pointer; - height:16px; - position:absolute; - top:40px; - width:15px; -} +#steppers {float:right; margin:0 35px 0 10px; width:60px;} +#steppers A {border:1px solid #d5d5d5; box-shadow:0 1px 0 #fff; float:left; height:20px; margin:0 0 4px; width:28px;} +#steppers .group-start {border-radius:3px 0 0 3px;} +#steppers .group-end {border-radius:0 3px 3px 0; border-width:1px 1px 1px 0; width:29px;} -#timeslider #timer { - color:#fff; - font-family:Arial, sans-serif; - font-size:11px; - left:7px; - position:absolute; - text-align:center; - top:9px; - width:122px; -} +A#leftstar, #leftstar.inactive:hover {background-position:0 0;} +A#rightstar, #rightstar.inactive:hover {background-position:-30px 0;} +A#leftstep, #leftstep.inactive:hover {background-position:0 -20px;} +A#rightstep, #rightstep.inactive:hover {background-position:-30px -20px;} +A#leftstar:hover {background-position:0 -40px;} +A#rightstar:hover {background-position:-30px -40px;} +A#leftstep:hover {background-position:0 -60px;} +A#rightstep:hover {background-position:-30px -60px;} -.topbarcenter, #docbar {display:none;} -#padmain {top:30px;} -#editbarright {float:right;} -#returnbutton {color:#222; font-size:16px; line-height:29px; margin-top:0; padding-right:6px;} -#importexport {top:118px;} -#importexport .popup {width:185px;} +.topbarcenter, #docbar {display:none;} /* hide document title etc. */ +#editbarinner H1 {color:#999; font-size:16px; line-height:29px; margin-top:0; padding-left:6px;} +#editbarinner H1 A {font-size:12px;} +#revision_label {background-color:#aaa; border-radius:3px; color:#fff; padding:2px 5px;} -/* lists */ -.list-bullet2, .list-indent2, .list-number2 {margin-left:3em;} -.list-bullet3, .list-indent3, .list-number3 {margin-left:4.5em;} -.list-bullet4, .list-indent4, .list-number4 {margin-left:6em;} -.list-bullet5, .list-indent5, .list-number5 {margin-left:7.5em;} -.list-bullet6, .list-indent6, .list-number6 {margin-left:9em;} -.list-bullet7, .list-indent7, .list-number7 {margin-left:10.5em;} -.list-bullet8, .list-indent8, .list-number8 {margin-left:12em;} +#editbarright #returnbutton {background:0 none; border:0 none; box-shadow:none; padding:4px 6px; width:auto;} +#returnbutton A {color:#999; font-size:12px; line-height:20px;} -/* unordered lists */ -UL {list-style-type:disc; margin-left:1.5em;} -UL UL {margin-left:0 !important;} - -.list-bullet2, .list-bullet5, .list-bullet8 {list-style-type:circle;} -.list-bullet3, .list-bullet6 {list-style-type:square;} - -.list-indent1, .list-indent2, .list-indent3, .list-indent5, .list-indent5, .list-indent6, .list-indent7, .list-indent8 {list-style-type:none;} - -/* ordered lists */ -OL {list-style-type:decimal; margin-left:1.5em;} -.list-number2, .list-number5, .list-number8 {list-style-type:lower-latin;} -.list-number3, .list-number6 {list-style-type:lower-roman;} - - - -/* IE 6/7 fixes ################################################################ */ -* HTML #ui-slider-handle {background-image:url(../../static/img/current_location.gif);} -* HTML #timeslider .star {background-image:url(../../static/img/star.gif);} -* HTML #playpause_button_icon {background-image:url(../../static/img/play.gif);} -* HTML .pause#playpause_button_icon {background-image:url(../../static/img/pause.gif);} \ No newline at end of file +#importexport.popup {top:95px; width:140px;} \ No newline at end of file diff --git a/static/img/ajax-loader.gif b/static/img/ajax-loader.gif new file mode 100644 index 000000000..fe2cd23b3 Binary files /dev/null and b/static/img/ajax-loader.gif differ diff --git a/static/img/backgrad.gif b/static/img/backgrad.gif deleted file mode 100644 index 8fee1a5b7..000000000 Binary files a/static/img/backgrad.gif and /dev/null differ diff --git a/static/img/crushed_button_depressed.png b/static/img/crushed_button_depressed.png deleted file mode 100644 index d75dcce28..000000000 Binary files a/static/img/crushed_button_depressed.png and /dev/null differ diff --git a/static/img/crushed_button_undepressed.png b/static/img/crushed_button_undepressed.png deleted file mode 100644 index d86e3f397..000000000 Binary files a/static/img/crushed_button_undepressed.png and /dev/null differ diff --git a/static/img/crushed_current_location.png b/static/img/crushed_current_location.png deleted file mode 100644 index 76e08359e..000000000 Binary files a/static/img/crushed_current_location.png and /dev/null differ diff --git a/static/img/editbar-sprite.png b/static/img/editbar-sprite.png new file mode 100644 index 000000000..0e3972267 Binary files /dev/null and b/static/img/editbar-sprite.png differ diff --git a/static/img/etherpad_lite_icons.png b/static/img/etherpad_lite_icons.png deleted file mode 100644 index cadf5ed2b..000000000 Binary files a/static/img/etherpad_lite_icons.png and /dev/null differ diff --git a/static/img/fileicons.gif b/static/img/fileicons.gif deleted file mode 100644 index c03b6031a..000000000 Binary files a/static/img/fileicons.gif and /dev/null differ diff --git a/static/img/leftarrow.png b/static/img/leftarrow.png deleted file mode 100644 index 1bec12882..000000000 Binary files a/static/img/leftarrow.png and /dev/null differ diff --git a/static/img/pause.png b/static/img/pause.png deleted file mode 100644 index 657782c0f..000000000 Binary files a/static/img/pause.png and /dev/null differ diff --git a/static/img/play.png b/static/img/play.png deleted file mode 100644 index 19afe034f..000000000 Binary files a/static/img/play.png and /dev/null differ diff --git a/static/img/roundcorner_left.gif b/static/img/roundcorner_left.gif deleted file mode 100644 index 000de7525..000000000 Binary files a/static/img/roundcorner_left.gif and /dev/null differ diff --git a/static/img/roundcorner_right.gif b/static/img/roundcorner_right.gif deleted file mode 100644 index 97acfbf2e..000000000 Binary files a/static/img/roundcorner_right.gif and /dev/null differ diff --git a/static/img/stepper_buttons.png b/static/img/stepper_buttons.png deleted file mode 100644 index e011a4516..000000000 Binary files a/static/img/stepper_buttons.png and /dev/null differ diff --git a/static/img/timeslider-sprite.png b/static/img/timeslider-sprite.png new file mode 100644 index 000000000..e0d0819b1 Binary files /dev/null and b/static/img/timeslider-sprite.png differ diff --git a/static/img/timeslider_background.png b/static/img/timeslider_background.png deleted file mode 100644 index 851af4e80..000000000 Binary files a/static/img/timeslider_background.png and /dev/null differ diff --git a/static/img/timeslider_left.png b/static/img/timeslider_left.png deleted file mode 100644 index 48a9b0e17..000000000 Binary files a/static/img/timeslider_left.png and /dev/null differ diff --git a/static/img/timeslider_right.png b/static/img/timeslider_right.png deleted file mode 100644 index 1a1b2685b..000000000 Binary files a/static/img/timeslider_right.png and /dev/null differ diff --git a/static/js/broadcast_revisions.js b/static/js/broadcast_revisions.js index 19f3f5ff7..b24d27747 100644 --- a/static/js/broadcast_revisions.js +++ b/static/js/broadcast_revisions.js @@ -1,5 +1,5 @@ /** - * This code is mostly from the old Etherpad. Please help us to comment this code. + * This code is mostly from the old Etherpad. Please help us to comment this code. * This helps other people to understand this code better and helps them to improve it. * TL;DR COMMENTS ON THIS FILE ARE HIGHLY APPRECIATED */ @@ -23,64 +23,51 @@ // of the document. These revisions are connected together by various // changesets, or deltas, between any two revisions. -function loadBroadcastRevisionsJS() -{ - function Revision(revNum) - { +function loadBroadcastRevisionsJS() { + + function Revision(revNum) { this.rev = revNum; this.changesets = []; } - Revision.prototype.addChangeset = function(destIndex, changeset, timeDelta) - { + Revision.prototype.addChangeset = function(destIndex, changeset, timeDelta) { var changesetWrapper = { - deltaRev: destIndex - this.rev, - deltaTime: timeDelta, - getValue: function() - { - return changeset; - } + deltaRev : destIndex - this.rev, + deltaTime : timeDelta, + getValue : function() {return changeset;} }; this.changesets.push(changesetWrapper); - this.changesets.sort(function(a, b) - { - return (b.deltaRev - a.deltaRev) + this.changesets.sort(function(a, b) { + return (b.deltaRev - a.deltaRev); }); - } + }; revisionInfo = {}; - revisionInfo.addChangeset = function(fromIndex, toIndex, changeset, backChangeset, timeDelta) - { - var startRevision = revisionInfo[fromIndex] || revisionInfo.createNew(fromIndex); - var endRevision = revisionInfo[toIndex] || revisionInfo.createNew(toIndex); + revisionInfo.addChangeset = function(fromIndex, toIndex, changeset, backChangeset, timeDelta) { + var startRevision = revisionInfo[fromIndex] || revisionInfo.createNew(fromIndex), + endRevision = revisionInfo[toIndex] || revisionInfo.createNew(toIndex); startRevision.addChangeset(toIndex, changeset, timeDelta); endRevision.addChangeset(fromIndex, backChangeset, -1 * timeDelta); - } + }; revisionInfo.latest = clientVars.totalRevs || -1; - revisionInfo.createNew = function(index) - { + revisionInfo.createNew = function(index) { revisionInfo[index] = new Revision(index); if (index > revisionInfo.latest) - { revisionInfo.latest = index; - } - return revisionInfo[index]; - } + }; // assuming that there is a path from fromIndex to toIndex, and that the links // are laid out in a skip-list format - revisionInfo.getPath = function(fromIndex, toIndex) - { - var changesets = []; - var spans = []; - var times = []; - var elem = revisionInfo[fromIndex] || revisionInfo.createNew(fromIndex); - if (elem.changesets.length != 0 && fromIndex != toIndex) - { - var reverse = !(fromIndex < toIndex) + revisionInfo.getPath = function(fromIndex, toIndex) { + var changesets = [], + spans = [], + times = [], + elem = revisionInfo[fromIndex] || revisionInfo.createNew(fromIndex); + if (elem.changesets.length != 0 && fromIndex != toIndex) { + var reverse = !(fromIndex < toIndex); while (((elem.rev < toIndex) && !reverse) || ((elem.rev > toIndex) && reverse)) { var couldNotContinue = false; @@ -107,22 +94,24 @@ function loadBroadcastRevisionsJS() } } - if (couldNotContinue || oldRev == elem.rev) break; + if (couldNotContinue || oldRev == elem.rev) + break; } } var status = 'partial'; - if (elem.rev == toIndex) status = 'complete'; + if (elem.rev == toIndex) + status = 'complete'; return { - 'fromRev': fromIndex, - 'rev': elem.rev, - 'status': status, - 'changesets': changesets, - 'spans': spans, - 'times': times + 'fromRev' : fromIndex, + 'rev' : elem.rev, + 'status' : status, + 'changesets' : changesets, + 'spans' : spans, + 'times' : times }; - } + }; } exports.loadBroadcastRevisionsJS = loadBroadcastRevisionsJS; diff --git a/static/js/broadcast_slider.js b/static/js/broadcast_slider.js index 0bdc2cabc..3ae3bfc8f 100644 --- a/static/js/broadcast_slider.js +++ b/static/js/broadcast_slider.js @@ -1,5 +1,5 @@ /** - * This code is mostly from the old Etherpad. Please help us to comment this code. + * This code is mostly from the old Etherpad. Please help us to comment this code. * This helps other people to understand this code better and helps them to improve it. * TL;DR COMMENTS ON THIS FILE ARE HIGHLY APPRECIATED */ @@ -20,471 +20,367 @@ * limitations under the License. */ - // These parameters were global, now they are injected. A reference to the - // Timeslider controller would probably be more appropriate. -function loadBroadcastSliderJS(fireWhenAllScriptsAreLoaded) -{ +// These parameters were global, now they are injected. A reference to the +// Timeslider controller would probably be more appropriate. +function loadBroadcastSliderJS(fireWhenAllScriptsAreLoaded) { var BroadcastSlider; - (function() - { // wrap this code in its own namespace - var sliderLength = 1000; - var sliderPos = 0; - var sliderActive = false; - var slidercallbacks = []; - var savedRevisions = []; - var sliderPlaying = false; + (function() { // wrap this code in its own namespace + var sliderLength = 1000, + sliderPos = 0, + sliderActive = false, + slidercallbacks = [], + savedRevisions = [], + sliderPlaying = false; - function disableSelection(element) - { - element.onselectstart = function() - { + function disableSelection(element) { + element.onselectstart = function() { return false; }; - element.unselectable = "on"; + element.unselectable = "on"; element.style.MozUserSelect = "none"; - element.style.cursor = "default"; } - var _callSliderCallbacks = function(newval) - { - sliderPos = newval; - for (var i = 0; i < slidercallbacks.length; i++) - { - slidercallbacks[i](newval); - } - } - - - - - - var updateSliderElements = function() - { - for (var i = 0; i < savedRevisions.length; i++) - { - var position = parseInt(savedRevisions[i].attr('pos')); - savedRevisions[i].css('left', (position * ($("#ui-slider-bar").width() - 2) / (sliderLength * 1.0)) - 1); - } - $("#ui-slider-handle").css('left', sliderPos * ($("#ui-slider-bar").width() - 2) / (sliderLength * 1.0)); - } - - - - - - var addSavedRevision = function(position, info) - { - var newSavedRevision = $('
'); - newSavedRevision.addClass("star"); + var _callSliderCallbacks = function(newval) { + sliderPos = newval; + for (var i=0, l=slidercallbacks.length; i < l; i++) { + slidercallbacks[i](newval); + } + }; + var updateSliderElements = function() { + for (var i=0, l=savedRevisions.length; i < l; i++) { + var position = parseInt(savedRevisions[i].attr('pos'), 10); + savedRevisions[i].css('left', (position * ($('#ui-slider-bar').width() - 2) / (sliderLength * 1.0)) - 1); + } + $('#ui-slider-handle').css('left', sliderPos * ($('#ui-slider-bar').width() - 2) / (sliderLength * 1.0)); + }; + var addSavedRevision = function(position, info) { + var newSavedRevision = $('
'); + newSavedRevision + .addClass('star') + .attr('pos', position) + .css('position', 'absolute') + .css('left', (position * ($('#ui-slider-bar').width() - 2) / (sliderLength * 1.0)) - 1); + $('#timeslider-slider').append(newSavedRevision); + newSavedRevision.mouseup(function(evt) { + BroadcastSlider.setSliderPosition(position); + }); + savedRevisions.push(newSavedRevision); + }; - newSavedRevision.attr('pos', position); - newSavedRevision.css('position', 'absolute'); - newSavedRevision.css('left', (position * ($("#ui-slider-bar").width() - 2) / (sliderLength * 1.0)) - 1); - $("#timeslider-slider").append(newSavedRevision); - newSavedRevision.mouseup(function(evt) - { - BroadcastSlider.setSliderPosition(position); - }); - savedRevisions.push(newSavedRevision); - }; + var removeSavedRevision = function(position) { + var element = $('.star [pos=' + position + ']'); + savedRevisions.remove(element); + element.remove(); + return element; + }; - var removeSavedRevision = function(position) - { - var element = $("div.star [pos=" + position + "]"); - savedRevisions.remove(element); - element.remove(); - return element; - }; - - /* Begin small 'API' */ - - function onSlider(callback) - { + /* small 'API' START */ + function onSlider(callback) { slidercallbacks.push(callback); } - function getSliderPosition() - { + function getSliderPosition() { return sliderPos; } - function setSliderPosition(newpos) - { + function setSliderPosition(newpos) { newpos = Number(newpos); - if (newpos < 0 || newpos > sliderLength) return; - $("#ui-slider-handle").css('left', newpos * ($("#ui-slider-bar").width() - 2) / (sliderLength * 1.0)); - $("a.tlink").map(function() - { - $(this).attr('href', $(this).attr('thref').replace("%revision%", newpos)); + if (newpos < 0 || newpos > sliderLength) + return; + $('#ui-slider-handle').css('left', newpos * ($('#ui-slider-bar').width() - 2) / (sliderLength * 1.0)); + $('.tlink').map(function() { + $(this).attr('href', $(this).attr('thref').replace('%revision%', newpos)); }); - $("#revision_label").html("Version " + newpos); + $('#revision_label').html('Version ' + newpos); if (newpos == 0) - { - $("#leftstar").css('opacity', .5); - $("#leftstep").css('opacity', .5); - } + $('#leftstar, #leftstep').addClass('inactive'); else - { - $("#leftstar").css('opacity', 1); - $("#leftstep").css('opacity', 1); - } + $('#leftstar, #leftstep').removeClass('inactive'); if (newpos == sliderLength) - { - $("#rightstar").css('opacity', .5); - $("#rightstep").css('opacity', .5); - } + $('#rightstar, #rightstep').addClass('inactive'); else - { - $("#rightstar").css('opacity', 1); - $("#rightstep").css('opacity', 1); - } + $('#rightstar, #rightstep').removeClass('inactive'); sliderPos = newpos; _callSliderCallbacks(newpos); } - function getSliderLength() - { + function getSliderLength() { return sliderLength; } - function setSliderLength(newlength) - { + function setSliderLength(newlength) { sliderLength = newlength; updateSliderElements(); } - // just take over the whole slider screen with a reconnect message - - function showReconnectUI() - { - if (!clientVars.sliderEnabled || !clientVars.supportsSlider) - { - $("#padmain, #rightbars").css('top', "130px"); - $("#timeslider").show(); - } + // take over the whole slider screen with a reconnect message + function showReconnectUI() { $('#error').show(); } - function setAuthors(authors) - { - $("#authorstable").empty(); - var numAnonymous = 0; - var numNamed = 0; - authors.forEach(function(author) - { - if (author.name) - { + function setAuthors(authors) { + $('#authorstable').empty(); + var numAnonymous = 0, + numNamed = 0, + html; + authors.forEach(function(author) { + if (author.name) { numNamed++; - var tr = $(''); - var swatchtd = $(''); - var swatch = $('
'); + var tr = $(''), + swatchtd = $(''), + swatch = $('
'), + nametd = $(''); swatch.css('background-color', clientVars.colorPalette[author.colorId]); swatchtd.append(swatch); tr.append(swatchtd); - var nametd = $(''); - nametd.text(author.name || "unnamed"); + nametd.text(author.name || 'unnamed'); tr.append(nametd); - $("#authorstable").append(tr); - } - else - { + $('#authorstable').append(tr); + } else { numAnonymous++; } }); - if (numAnonymous > 0) - { - var html = "" + (numNamed > 0 ? "...and " : "") + numAnonymous + " unnamed author" + (numAnonymous > 1 ? "s" : "") + ""; - $("#authorstable").append($(html)); + if (numAnonymous > 0) { + html = '' + + (numNamed > 0 ? '...and ' : '') + numAnonymous + ' unnamed author' + + (numAnonymous > 1 ? 's' : '') + ''; + $('#authorstable').append($(html)); } - if (authors.length == 0) - { - $("#authorstable").append($("No Authors")) + if (authors.length == 0) { + html = 'No Authors'; + $('#authorstable').append($(html)); } } BroadcastSlider = { - onSlider: onSlider, - getSliderPosition: getSliderPosition, - setSliderPosition: setSliderPosition, - getSliderLength: getSliderLength, - setSliderLength: setSliderLength, - isSliderActive: function() - { + onSlider : onSlider, + getSliderPosition : getSliderPosition, + setSliderPosition : setSliderPosition, + getSliderLength : getSliderLength, + setSliderLength : setSliderLength, + isSliderActive : function() { return sliderActive; }, - playpause: playpause, - addSavedRevision: addSavedRevision, - showReconnectUI: showReconnectUI, - setAuthors: setAuthors - } + playpause : playpause, + addSavedRevision : addSavedRevision, + showReconnectUI : showReconnectUI, + setAuthors : setAuthors + }; - function playButtonUpdater() - { - if (sliderPlaying) - { - if (getSliderPosition() + 1 > sliderLength) - { - $("#playpause_button_icon").toggleClass('pause'); + function playButtonUpdater() { + if (sliderPlaying) { + if (getSliderPosition() + 1 > sliderLength) { + $('#playpause_button').toggleClass('pause'); sliderPlaying = false; return; } setSliderPosition(getSliderPosition() + 1); - setTimeout(playButtonUpdater, 100); } } - function playpause() - { - $("#playpause_button_icon").toggleClass('pause'); - - if (!sliderPlaying) - { + function playpause() { + $('#playpause_button').toggleClass('pause'); + if (!sliderPlaying) { if (getSliderPosition() == sliderLength) setSliderPosition(0); sliderPlaying = true; playButtonUpdater(); - } - else - { + } else { sliderPlaying = false; } } // assign event handlers to html UI elements after page load - //$(window).load(function () - fireWhenAllScriptsAreLoaded.push(function() - { + fireWhenAllScriptsAreLoaded.push(function() { disableSelection($("#playpause_button")[0]); disableSelection($("#timeslider")[0]); - if (clientVars.sliderEnabled && clientVars.supportsSlider) - { - $(document).keyup(function(e) - { - var code = -1; - if (!e) var e = window.event; - if (e.keyCode) code = e.keyCode; - else if (e.which) code = e.which; + if (clientVars.sliderEnabled && clientVars.supportsSlider) { + $(document).keyup(function(e) { + var code = -1, + i, l, nextStar, pos; + if (!e) + var e = window.event; + code = (e.keyCode) ? e.keyCode : e.which; - if (code == 37) - { // left - if (!e.shiftKey) - { - setSliderPosition(getSliderPosition() - 1); - } - else - { - var nextStar = 0; // default to first revision in document - for (var i = 0; i < savedRevisions.length; i++) - { - var pos = parseInt(savedRevisions[i].attr('pos')); - if (pos < getSliderPosition() && nextStar < pos) nextStar = pos; + switch (code) { + case 37: // left + if (!e.shiftKey) { + setSliderPosition(getSliderPosition() - 1); + } else { + nextStar = 0; // default to first revision in document + for (i=0, l=savedRevisions.length; i < l; i++) { + pos = parseInt(savedRevisions[i].attr('pos'), 10); + if (pos < getSliderPosition() && nextStar < pos) + nextStar = pos; + } + setSliderPosition(nextStar); } - setSliderPosition(nextStar); - } - } - else if (code == 39) - { - if (!e.shiftKey) - { - setSliderPosition(getSliderPosition() + 1); - } - else - { - var nextStar = sliderLength; // default to last revision in document - for (var i = 0; i < savedRevisions.length; i++) - { - var pos = parseInt(savedRevisions[i].attr('pos')); - if (pos > getSliderPosition() && nextStar > pos) nextStar = pos; + break; + case 39: + if (!e.shiftKey) { + setSliderPosition(getSliderPosition() + 1); + } else { + nextStar = sliderLength; // default to last revision in document + for (i=0, l=savedRevisions.length; i < l; i++) { + pos = parseInt(savedRevisions[i].attr('pos'), 10); + if (pos > getSliderPosition() && nextStar > pos) + nextStar = pos; + } + setSliderPosition(nextStar); } - setSliderPosition(nextStar); - } + break; + case 32: + playpause(); + break; } - else if (code == 32) playpause(); - }); } - $(window).resize(function() - { + $(window).resize(function() { updateSliderElements(); }); - $("#ui-slider-bar").mousedown(function(evt) - { - setSliderPosition(Math.floor((evt.clientX - $("#ui-slider-bar").offset().left) * sliderLength / 742)); - $("#ui-slider-handle").css('left', (evt.clientX - $("#ui-slider-bar").offset().left)); - $("#ui-slider-handle").trigger(evt); + $('#ui-slider-bar') + .mousedown(function(evt) { + setSliderPosition(Math.floor((evt.clientX - $('#ui-slider-bar').offset().left) * sliderLength / 742)); + $('#ui-slider-handle') + .css('left', (evt.clientX - $('#ui-slider-bar').offset().left)) + .trigger(evt); }); - // Slider dragging - $("#ui-slider-handle").mousedown(function(evt) - { - this.startLoc = evt.clientX; - this.currentLoc = parseInt($(this).css('left')); + // slider dragging + $('#ui-slider-handle') + .mousedown(function(evt) { + this.startLoc = evt.clientX; + this.currentLoc = parseInt($(this).css('left'), 10); var self = this; sliderActive = true; - $(document).mousemove(function(evt2) - { - $(self).css('pointer', 'move') - var newloc = self.currentLoc + (evt2.clientX - self.startLoc); - if (newloc < 0) newloc = 0; - if (newloc > ($("#ui-slider-bar").width() - 2)) newloc = ($("#ui-slider-bar").width() - 2); - $("#revision_label").html("Version " + Math.floor(newloc * sliderLength / ($("#ui-slider-bar").width() - 2))); + $(document).mousemove(function(evt2) { + var newloc = self.currentLoc + (evt2.clientX - self.startLoc), + adjustedWidth = $('#ui-slider-bar').width() - 2, + pos; + if (newloc < 0) + newloc = 0; + if (newloc > adjustedWidth) + newloc = adjustedWidth; + $('#revision_label').html('Version ' + Math.floor(newloc * sliderLength / adjustedWidth)); $(self).css('left', newloc); - if (getSliderPosition() != Math.floor(newloc * sliderLength / ($("#ui-slider-bar").width() - 2))) _callSliderCallbacks(Math.floor(newloc * sliderLength / ($("#ui-slider-bar").width() - 2))) + pos = Math.floor(newloc * sliderLength / adjustedWidth); + if (getSliderPosition() != pos) + _callSliderCallbacks(pos); }); - $(document).mouseup(function(evt2) - { - $(document).unbind('mousemove'); - $(document).unbind('mouseup'); + $(document).mouseup(function(evt2) { + $(document) + .unbind('mousemove') + .unbind('mouseup'); sliderActive = false; var newloc = self.currentLoc + (evt2.clientX - self.startLoc); - if (newloc < 0) newloc = 0; - if (newloc > ($("#ui-slider-bar").width() - 2)) newloc = ($("#ui-slider-bar").width() - 2); + if (newloc < 0) + newloc = 0; + if (newloc > ($("#ui-slider-bar").width() - 2)) + newloc = ($("#ui-slider-bar").width() - 2); $(self).css('left', newloc); - // if(getSliderPosition() != Math.floor(newloc * sliderLength / ($("#ui-slider-bar").width()-2))) - setSliderPosition(Math.floor(newloc * sliderLength / ($("#ui-slider-bar").width() - 2))) - self.currentLoc = parseInt($(self).css('left')); + setSliderPosition(Math.floor(newloc * sliderLength / ($("#ui-slider-bar").width() - 2))); + self.currentLoc = parseInt($(self).css('left'), 10); }); - }) + }); - // play/pause toggling - $("#playpause_button").mousedown(function(evt) - { + // toggle play / pause + $('#playpause_button').mousedown(function(evt) { var self = this; - - $(self).css('background-image', 'url(/static/img/crushed_button_depressed.png)'); - $(self).mouseup(function(evt2) - { - $(self).css('background-image', 'url(/static/img/crushed_button_undepressed.png)'); + $(self) + .addClass('pressed') + .mouseup(function(evt2) { + $(self).removeClass('pressed'); $(self).unbind('mouseup'); BroadcastSlider.playpause(); }); - $(document).mouseup(function(evt2) - { - $(self).css('background-image', 'url(/static/img/crushed_button_undepressed.png)'); + $(document).mouseup(function(evt2) { + $(self).removeClass('pressed'); $(document).unbind('mouseup'); }); }); - // next/prev saved revision and changeset - $('.stepper').mousedown(function(evt) - { + // next / prev saved revision and changeset + $('#steppers A').mousedown(function(evt) { var self = this; - var origcss = $(self).css('background-position'); - if (!origcss) - { - origcss = $(self).css('background-position-x') + " " + $(self).css('background-position-y'); - } - var origpos = parseInt(origcss.split(" ")[1]); - var newpos = (origpos - 43); - if (newpos < 0) newpos += 87; - - var newcss = (origcss.split(" ")[0] + " " + newpos + "px"); - if ($(self).css('opacity') != 1.0) newcss = origcss; - - $(self).css('background-position', newcss) - - $(self).mouseup(function(evt2) - { - $(self).css('background-position', origcss); - $(self).unbind('mouseup'); + $(self) + .addClass('clicked') + .mouseup(function(evt2) { + $(self) + .removeClass('clicked') + .unbind('mouseup'); $(document).unbind('mouseup'); - if ($(self).attr("id") == ("leftstep")) - { - setSliderPosition(getSliderPosition() - 1); - } - else if ($(self).attr("id") == ("rightstep")) - { - setSliderPosition(getSliderPosition() + 1); - } - else if ($(self).attr("id") == ("leftstar")) - { - var nextStar = 0; // default to first revision in document - for (var i = 0; i < savedRevisions.length; i++) - { - var pos = parseInt(savedRevisions[i].attr('pos')); - if (pos < getSliderPosition() && nextStar < pos) nextStar = pos; - } - setSliderPosition(nextStar); - } - else if ($(self).attr("id") == ("rightstar")) - { - var nextStar = sliderLength; // default to last revision in document - for (var i = 0; i < savedRevisions.length; i++) - { - var pos = parseInt(savedRevisions[i].attr('pos')); - if (pos > getSliderPosition() && nextStar > pos) nextStar = pos; - } - setSliderPosition(nextStar); + var id = $(self).attr('id'), + i, l, nextStar, pos; + switch (id) { + case 'leftstep': + setSliderPosition(getSliderPosition() - 1); + break; + case 'rightstep': + setSliderPosition(getSliderPosition() + 1); + break; + case 'leftstar': + nextStar = 0; // default to first revision in document + for (i=0, l=savedRevisions.length; i < l; i++) { + pos = parseInt(savedRevisions[i].attr('pos'), 10); + if (pos < getSliderPosition() && nextStar < pos) + nextStar = pos; + } + setSliderPosition(nextStar); + break; + case 'rightstar': + nextStar = sliderLength; // default to last revision in document + for (i=0, l=savedRevisions.length; i < l; i++) { + pos = parseInt(savedRevisions[i].attr('pos'), 10); + if (pos > getSliderPosition() && nextStar > pos) + nextStar = pos; + } + setSliderPosition(nextStar); + break; } }); - $(document).mouseup(function(evt2) - { - $(self).css('background-position', origcss); - $(self).unbind('mouseup'); + $(document).mouseup(function(evt2) { + $(self) + .removeClass('clicked') + .unbind('mouseup'); $(document).unbind('mouseup'); }); - }) + }); - if (clientVars) - { + if (clientVars) { if (clientVars.fullWidth) - { - $("#padpage").css('width', '100%'); - $("#revision").css('position', "absolute") - $("#revision").css('right', "20px") - $("#revision").css('top', "20px") - $("#padmain").css('left', '0px'); - $("#padmain").css('right', '197px'); - $("#padmain").css('width', 'auto'); - $("#rightbars").css('right', '7px'); - $("#rightbars").css('margin-right', '0px'); - $("#timeslider").css('width', 'auto'); - } - - if (clientVars.disableRightBar) - { - $("#rightbars").css('display', 'none'); + $('#padpage').addClass('full-width'); + if (clientVars.disableRightBar) { + $('#rightbars').css('display', 'none'); $('#padmain').css('width', 'auto'); - if (clientVars.fullWidth) $("#padmain").css('right', '7px'); - else $("#padmain").css('width', '860px'); - $("#revision").css('position', "absolute"); - $("#revision").css('right', "20px"); - $("#revision").css('top', "20px"); + if (clientVars.fullWidth) + $('#padmain').css({right: 7}); + else + $('#padmain').css('width', '860px'); + $('#revision').css({ + position: 'absolute', + right : 20, + top : 20 + }); } - - - if (clientVars.sliderEnabled) - { - if (clientVars.supportsSlider) - { - $("#padmain, #rightbars").css('top', "130px"); - $("#timeslider").show(); + if (clientVars.sliderEnabled) { + if (clientVars.supportsSlider) { setSliderLength(clientVars.totalRevs); setSliderPosition(clientVars.revNum); - clientVars.savedRevisions.forEach(function(revision) - { + clientVars.savedRevisions.forEach(function(revision) { addSavedRevision(revision.revNum, revision); - }) - } - else - { + }); + } else { // slider is not supported - $("#padmain, #rightbars").css('top', "130px"); - $("#timeslider").show(); - $("#error").html("The timeslider feature is not supported on this pad. Why not?"); - $("#error").show(); + $('#error').html('The timeslider feature is not supported on this pad. Why not?').show(); } - } - else - { - if (clientVars.supportsSlider) - { + } else { + if (clientVars.supportsSlider) { setSliderLength(clientVars.totalRevs); setSliderPosition(clientVars.revNum); } @@ -493,10 +389,9 @@ function loadBroadcastSliderJS(fireWhenAllScriptsAreLoaded) }); })(); - BroadcastSlider.onSlider(function(loc) - { - $("#viewlatest").html(loc == BroadcastSlider.getSliderLength() ? "Viewing latest content" : "View latest content"); - }) + BroadcastSlider.onSlider(function(loc) { + $('#viewlatest').html(loc == BroadcastSlider.getSliderLength() ? 'Viewing latest content' : 'View latest content'); + }); return BroadcastSlider; } diff --git a/static/js/chat.js b/static/js/chat.js index 8f076af6a..61ca9fa23 100644 --- a/static/js/chat.js +++ b/static/js/chat.js @@ -20,143 +20,119 @@ * limitations under the License. */ -var padutils = require('/pad_utils').padutils; -var padcookie = require('/pad_cookie').padcookie; +var padutils = require('/pad_utils').padutils, + padcookie = require('/pad_cookie').padcookie; -var chat = (function() -{ - var isStuck = false; - var chatMentions = 0; - var title = document.title; +var chat = (function() { + var isStuck = false, + chatMentions = 0, + title = document.title; var self = { - show: function () - { - $("#chaticon").hide(); - $("#chatbox").show(); + show: function() { + $('#chaticon').hide(); + $('#chatbox').show(); self.scrollDown(); chatMentions = 0; document.title = title; }, - stickToScreen: function(fromInitialCall) // Make chat stick to right hand side of screen - { + stickToScreen: function(fromInitialCall) { // make chat stick to right hand side of screen chat.show(); - if(!isStuck || fromInitialCall) { // Stick it to - padcookie.setPref("chatAlwaysVisible", true); - $('#chatbox').addClass("stickyChat"); - $('#chattext').css({"top":"0px"}); - $('#editorcontainer').css({"right":"192px", "width":"auto"}); + if (!isStuck || fromInitialCall) { // do stick it + padcookie.setPref('chatAlwaysVisible', true); + $('BODY').addClass('chat-visible'); isStuck = true; - } else { // Unstick it - padcookie.setPref("chatAlwaysVisible", false); - $('#chatbox').removeClass("stickyChat"); - $('#chattext').css({"top":"25px"}); - $('#editorcontainer').css({"right":"0px", "width":"100%"}); + } else { // unstick it + padcookie.setPref('chatAlwaysVisible', false); + $('BODY').removeClass('chat-visible'); isStuck = false; } }, - hide: function () - { - $("#chatcounter").text("0"); - $("#chaticon").show(); - $("#chatbox").hide(); + hide: function() { + $('#chatcounter').text('0'); + $('#chaticon').show(); + $('#chatbox').hide(); }, - scrollDown: function() - { - if($('#chatbox').css("display") != "none") - $('#chattext').animate({scrollTop: $('#chattext')[0].scrollHeight}, "slow"); + scrollDown: function() { + if ($('#chatbox').is(':visible')) + $('#chattext').animate({scrollTop: $('#chattext')[0].scrollHeight}, 600); }, - send: function() - { - var text = $("#chatinput").val(); - this._pad.collabClient.sendMessage({"type": "CHAT_MESSAGE", "text": text}); - $("#chatinput").val(""); + send: function() { + var text = $('#chatinput').val(); + this._pad.collabClient.sendMessage({ + 'type': 'CHAT_MESSAGE', + 'text': text + }); + $('#chatinput').val(''); }, - addMessage: function(msg, increment) - { - //correct the time + addMessage: function(msg, increment) { + // correct the time msg.time += this._pad.clientTimeOffset; - //create the time string - var minutes = "" + new Date(msg.time).getMinutes(); - var hours = "" + new Date(msg.time).getHours(); - if(minutes.length == 1) - minutes = "0" + minutes ; - if(hours.length == 1) - hours = "0" + hours ; - var timeStr = hours + ":" + minutes; + // create the time string + var minutes = '' + new Date(msg.time).getMinutes(), + hours = '' + new Date(msg.time).getHours(), + timeStr; + if (minutes.length == 1) + minutes = '0' + minutes; + if (hours.length == 1) + hours = '0' + hours; + timeStr = hours + ':' + minutes; - //create the authorclass - var authorClass = "author-" + msg.userId.replace(/[^a-y0-9]/g, function(c) - { - if (c == ".") return "-"; + // create the authorclass + var authorClass = 'author-' + msg.userId.replace(/[^a-y0-9]/g, function(c) { + if (c == '.') + return '-'; return 'z' + c.charCodeAt(0) + 'z'; }); - var text = padutils.escapeHtmlWithClickableLinks(msg.text, "_blank"); + var text = padutils.escapeHtmlWithClickableLinks(padutils.escapeHtml(msg.text), '_blank'); - /* Performs an action if your name is mentioned */ - var myName = $('#myusernameedit').val(); - myName = myName.toLowerCase(); - var chatText = text.toLowerCase(); - var wasMentioned = false; - if (chatText.indexOf(myName) !== -1 && myName != "undefined"){ + // do something when your name is mentioned + var myName = $('#myusernameedit').val().toLowerCase(), + chatText = text.toLowerCase(), + wasMentioned = false; + if (chatText.indexOf(myName) !== -1 && myName != 'undefined') wasMentioned = true; - } - /* End of new action */ + // end of action - var authorName = msg.userName == null ? "unnamed" : padutils.escapeHtml(msg.userName); + var authorName = msg.userName == null ? 'unnamed' : padutils.escapeHtml(msg.userName), + html = '

' + authorName + ':' + timeStr + '' + text + '

'; + $('#chattext').append(html); - var html = "

" + authorName + ":" + timeStr + " " + text + "

"; - $("#chattext").append(html); - - //should we increment the counter?? - if(increment) - { - var count = Number($("#chatcounter").text()); + // should we increment the counter?? + if (increment) { + var count = Number($('#chatcounter').text()); count++; - $("#chatcounter").text(count); + $('#chatcounter').text(count); // chat throb stuff -- Just make it throw for twice as long - if(wasMentioned) - { // If the user was mentioned show for twice as long and flash the browser window - if (chatMentions == 0){ + if (wasMentioned) { // If the user was mentioned, show twice as long and flash the browser window + if (chatMentions == 0) title = document.title; - } - $('#chatthrob').html(""+authorName+"" + ": " + text).show().delay(4000).hide(400); + $('#chatthrob').html('' + authorName + '' + ': ' + text).show().delay(4000).hide(400); chatMentions++; - document.title = "("+chatMentions+") " + title; - } - else - { - $('#chatthrob').html(""+authorName+"" + ": " + text).show().delay(2000).hide(400); + document.title = '(' + chatMentions + ') ' + title; + } else { + $('#chatthrob').html('' + authorName + '' + ': ' + text).show().delay(2000).hide(400); } } - self.scrollDown(); - }, - init: function(pad) - { + init: function(pad) { this._pad = pad; - $("#chatinput").keypress(function(evt) - { - //if the user typed enter, fire the send - if(evt.which == 13) - { + $('#chatinput').keypress(function(evt) { + if (evt.which == 13) { // send on enter evt.preventDefault(); self.send(); } }); - - for(var i in clientVars.chatHistory) - { + for (var i in clientVars.chatHistory) { this.addMessage(clientVars.chatHistory[i], false); } - $("#chatcounter").text(clientVars.chatHistory.length); + $('#chatcounter').text(clientVars.chatHistory.length); } - } + }; return self; }()); -exports.chat = chat; - +exports.chat = chat; \ No newline at end of file diff --git a/static/js/pad_editbar.js b/static/js/pad_editbar.js index 236926310..774059f9d 100644 --- a/static/js/pad_editbar.js +++ b/static/js/pad_editbar.js @@ -20,74 +20,56 @@ * limitations under the License. */ -var padutils = require('/pad_utils').padutils; -var padeditor = require('/pad_editor').padeditor; -var padsavedrevs = require('/pad_savedrevs').padsavedrevs; +var padutils = require('/pad_utils').padutils, + padeditor = require('/pad_editor').padeditor, + padsavedrevs = require('/pad_savedrevs').padsavedrevs; function indexOf(array, value) { - for (var i = 0, ii = array.length; i < ii; i++) { - if (array[i] == value) { + for (var i=0, ii=array.length; i < ii; i++) { + if (array[i] == value) return i; - } } return -1; } -var padeditbar = (function() -{ - - var syncAnimation = (function() - { - var SYNCING = -100; - var DONE = 100; - var state = DONE; - var fps = 25; - var step = 1 / fps; - var T_START = -0.5; - var T_FADE = 1.0; - var T_GONE = 1.5; - var animator = padutils.makeAnimationScheduler(function() - { +var padeditbar = (function() { + var syncAnimation = (function() { + var SYNCING = -100, + DONE = 100, + state = DONE, + fps = 25, + step = 1 / fps, + T_START = -0.5, + T_FADE = 1.0, + T_GONE = 1.5; + var animator = padutils.makeAnimationScheduler(function() { if (state == SYNCING || state == DONE) - { return false; - } - else if (state >= T_GONE) - { + else if (state >= T_GONE) { state = DONE; - $("#syncstatussyncing").css('display', 'none'); - $("#syncstatusdone").css('display', 'none'); + $('#syncstatussyncing, #syncstatusdone').hide(); return false; - } - else if (state < 0) - { + } else if (state < 0) { state += step; - if (state >= 0) - { - $("#syncstatussyncing").css('display', 'none'); - $("#syncstatusdone").css('display', 'block').css('opacity', 1); + if (state >= 0) { + $('#syncstatussyncing').hide(); + $('#syncstatusdone').show().css({opacity: 1}); } return true; - } - else - { + } else { state += step; if (state >= T_FADE) - { - $("#syncstatusdone").css('opacity', (T_GONE - state) / (T_GONE - T_FADE)); - } + $('#syncstatusdone').css('opacity', (T_GONE - state) / (T_GONE - T_FADE)); return true; } }, step * 1000); return { - syncing: function() - { + syncing: function() { state = SYNCING; - $("#syncstatussyncing").css('display', 'block'); - $("#syncstatusdone").css('display', 'none'); + $('#syncstatussyncing').show(); + $('#syncstatusdone').hide(); }, - done: function() - { + done: function() { state = T_START; animator.scheduleAnimation(); } @@ -95,162 +77,117 @@ var padeditbar = (function() }()); var self = { - init: function() - { - $("#editbar .editbarbutton").attr("unselectable", "on"); // for IE - $("#editbar").removeClass("disabledtoolbar").addClass("enabledtoolbar"); + init: function() { + $('#editbar A').attr('unselectable', 'on'); // for IE + $('#editbar').removeClass('disabledtoolbar').addClass('enabledtoolbar'); }, - isEnabled: function() - { + isEnabled: function() { // return !$("#editbar").hasClass('disabledtoolbar'); return true; }, - disable: function() - { - $("#editbar").addClass('disabledtoolbar').removeClass("enabledtoolbar"); + disable: function() { + $('#editbar').addClass('disabledtoolbar').removeClass('enabledtoolbar'); }, - toolbarClick: function(cmd) - { - if (self.isEnabled()) - { - if(cmd == "showusers") - { - self.toogleDropDown("users"); - } - else if (cmd == 'settings') - { - self.toogleDropDown("settingsmenu"); - } - else if (cmd == 'embed') - { - self.setEmbedLinks(); - $('#linkinput').focus().select(); - self.toogleDropDown("embed"); - } - else if (cmd == 'import_export') - { - self.toogleDropDown("importexport"); - } - else if (cmd == 'save') - { - padsavedrevs.saveNow(); - } - else - { - padeditor.ace.callWithAce(function(ace) - { - if (cmd == 'bold' || cmd == 'italic' || cmd == 'underline' || cmd == 'strikethrough') ace.ace_toggleAttributeOnSelection(cmd); - else if (cmd == 'undo' || cmd == 'redo') ace.ace_doUndoRedo(cmd); - else if (cmd == 'insertunorderedlist') ace.ace_doInsertUnorderedList(); - else if (cmd == 'insertorderedlist') ace.ace_doInsertOrderedList(); - else if (cmd == 'indent') - { - if (!ace.ace_doIndentOutdent(false)) - { + toolbarClick: function(cmd) { + if (self.isEnabled()) { + switch(cmd) { + case 'users': + self.toggleDropDown('users'); + break; + case 'settings': + self.toggleDropDown('settings'); + break; + case 'embed': + self.setEmbedLinks(); + self.toggleDropDown('embed'); + break; + case 'importexport': + self.toggleDropDown('importexport'); + break; + case 'save': + padsavedrevs.saveNow(); + break; + default: + padeditor.ace.callWithAce(function(ace) { + if (cmd == 'bold' || cmd == 'italic' || cmd == 'underline' || cmd == 'strikethrough') + ace.ace_toggleAttributeOnSelection(cmd); + else if (cmd == 'undo' || cmd == 'redo') + ace.ace_doUndoRedo(cmd); + else if (cmd == 'insertunorderedlist') ace.ace_doInsertUnorderedList(); - } - } - else if (cmd == 'outdent') - { - ace.ace_doIndentOutdent(true); - } - else if (cmd == 'clearauthorship') - { - if ((!(ace.ace_getRep().selStart && ace.ace_getRep().selEnd)) || ace.ace_isCaret()) - { - if (window.confirm("Clear authorship colors on entire document?")) - { - ace.ace_performDocumentApplyAttributesToCharRange(0, ace.ace_getRep().alltext.length, [ - ['author', ''] - ]); + else if (cmd == 'insertorderedlist') + ace.ace_doInsertOrderedList(); + else if (cmd == 'indent') { + if (!ace.ace_doIndentOutdent(false)) + ace.ace_doInsertUnorderedList(); + } else if (cmd == 'outdent') + ace.ace_doIndentOutdent(true); + else if (cmd == 'clearauthorship') { + if ((!(ace.ace_getRep().selStart && ace.ace_getRep().selEnd)) || ace.ace_isCaret()) { + if (window.confirm("Clear authorship colors on entire document?")) { + ace.ace_performDocumentApplyAttributesToCharRange(0, ace.ace_getRep().alltext.length, [ + ['author', ''] + ]); + } + } else { + ace.ace_setAttributeOnSelection('author', ''); } } - else - { - ace.ace_setAttributeOnSelection('author', ''); - } - } - }, cmd, true); + }, cmd, true); } } - if(padeditor.ace) padeditor.ace.focus(); + if (padeditor.ace) + padeditor.ace.focus(); }, - toogleDropDown: function(moduleName) - { - var modules = ["settingsmenu", "importexport", "embed", "users"]; - - //hide all modules - if(moduleName == "none") - { - $("#editbar ul#menu_right > li").removeClass("selected"); - for(var i=0;i 0 && nth_child <= 3) { - $("#editbar ul#menu_right li:not(:nth-child(" + nth_child + "))").removeClass("selected"); - $("#editbar ul#menu_right li:nth-child(" + nth_child + ")").toggleClass("selected"); - } - //hide all modules that are not selected and show the selected one - for(var i=0;i"); $('#linkinput').val(readonlyLink); - $('#embedreadonlyqr').attr("src","https://chart.googleapis.com/chart?chs=200x200&cht=qr&chld=|0&chl=" + readonlyLink); - } - else - { - var padurl = window.location.href.split("?")[0]; + $('#embedreadonlyqr').attr('src', 'https://chart.googleapis.com/chart?chs=200x200&cht=qr&chld=H|0&chl=' + readonlyLink); + } else { + var padurl = window.location.href.split('?')[0]; $('#embedinput').val("