Close all tabs function added

Close button added to left of tabs as close all button. Simple styling
added to match tabs. closeAllTabs function added to close all tabs from
last back to first.
This commit is contained in:
Matt Pass
2013-01-18 12:13:09 +00:00
parent 685116c555
commit 27da7ed0fe
3 changed files with 345 additions and 335 deletions

379
index.php
View File

@@ -1,190 +1,191 @@
<?php include("lib/settings.php");
// Check IP permissions
if (!in_array($_SERVER["REMOTE_ADDR"], $_SESSION['allowedIPs']) && !in_array("*", $_SESSION['allowedIPs'])) {
header('Location: /');
};
$updateMsg = '';
// Check for updates
if ($ICEcoder["checkUpdates"]) {
$icv = json_encode(file_get_contents("http://icecoder.net/latest-version.txt"));
$icv = rtrim(ltrim($icv,'"'),'"\\n');
if ($ICEcoder["versionNo"]<$icv) {
$updateMsg = ';top.ICEcoder.message(\'ICEcoder '.$icv.' now released\n\nPlease upgrade\')';
}
}
?>
<!DOCTYPE html>
<html onMouseDown="top.ICEcoder.mouseDown=true" onMouseUp="top.ICEcoder.mouseDown=false" onMouseMove="if(top.ICEcoder) {top.ICEcoder.getMouseXY(event,'top');top.ICEcoder.canResizeFilesW()}">
<head>
<title>ICEcoder v <?php echo $ICEcoder["versionNo"];?></title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="robots" content="noindex, nofollow">
<link rel="stylesheet" type="text/css" href="lib/ice-coder.css">
<link rel="icon" type="image/png" href="favicon.png">
<script>
iceRoot = "<?php echo $ICEcoder["root"]; ?>";
window.onbeforeunload = function() {
if (top.ICEcoder.changedContent.indexOf(1)>-1) {
return "You have some unsaved changes.";
}
}
</script>
<script language="JavaScript" src="lib/ice-coder.js"></script>
<?php
if (file_exists(dirname(__FILE__)."/plugins/jshint/jshint.js")) {
echo '<script src="plugins/jshint/jshint.js"></script>';
}
?>
</head>
<body onLoad="<?php
echo 'top.ICEcoder.previousFiles = [';
if ($ICEcoder["previousFiles"]!="") {
$openFilesArray = explode(",",$ICEcoder["previousFiles"]);
echo "'".implode("','",$openFilesArray)."'";
}
echo "];top.ICEcoder.theme = '";
echo $ICEcoder["theme"]=="default" ? 'icecoder' : $ICEcoder["theme"];
echo "'";
echo ';top.ICEcoder.tabsIndent = ';
echo $ICEcoder["tabsIndent"] ? 'true' : 'false';
echo ';top.ICEcoder.openLastFiles = ';
echo $ICEcoder["openLastFiles"] ? 'true' : 'false';
echo ';top.ICEcoder.lineWrapping = ';
echo $ICEcoder["lineWrapping"] ? 'true' : 'false';
echo ';top.ICEcoder.tabWidth = ';
echo $ICEcoder["tabWidth"];
?>;ICEcoder.init()<?php echo $updateMsg.$onLoadExtras;?>" onResize="ICEcoder.setLayout()" onKeyDown="return ICEcoder.interceptKeys('coder',event);" onKeyUp="parent.ICEcoder.resetKeys(event);">
<div id="blackMask" class="blackMask" onClick="ICEcoder.showHide('hide',this)" onContextMenu="return false">
<div class="popupVCenter">
<div class="popup" id="mediaContainer"></div>
</div>
</div>
<div id="loadingMask" class="blackMask" style="visibility: visible" onContextMenu="return false">
<span class="progressBar" id="progressBar" style="-webkit-animation:fullexpand 10s ease-out; -moz-animation:fullexpand 10s ease-out"></span>
<div class="popupVCenter">
<div class="popup">
<div class="circleOutside"></div>
<div class="circleInside"></div>
&nbsp;&nbsp;&nbsp;working...
</div>
</div>
</div>
<div id="fileMenu" class="fileMenu" onMouseOver="ICEcoder.changeFilesW('expand')" onMouseOut="ICEcoder.changeFilesW('contract');this.style.display='none'" onContextMenu="return false">
<span id="folderMenuItems">
<a href="javascript:top.ICEcoder.newFile()" onMouseOver="ICEcoder.showFileMenu()">New File</a>
<a href="javascript:top.ICEcoder.newFolder()" onMouseOver="ICEcoder.showFileMenu()">New Folder</a>
<a href="javascript:top.ICEcoder.pasteFile(top.ICEcoder.rightClickedFile)" onMouseOver="ICEcoder.showFileMenu()">Paste</a>
<a href="javascript:top.ICEcoder.uploadFilesSelect(top.ICEcoder.rightClickedFile)" onMouseOver="ICEcoder.showFileMenu()">Upload File(s)</a>
<div style="display: none">
<form enctype="multipart/form-data" id="uploadFilesForm" action="lib/file-control.php?action=upload&file=/uploaded" method="POST" target="fileControl">
<input type="hidden" name="folder" id="uploadDir" value="/">
<input type="file" name="filesInput[]" id="fileInput" onchange="top.ICEcoder.uploadFilesSubmit(this)" multiple>
<input type="submit" value="Upload File">
</form>
</div>
</span>
<a href="javascript:top.ICEcoder.deleteFile(top.ICEcoder.rightClickedFile)" onMouseOver="ICEcoder.showFileMenu()">Delete</a>
<span id="singleFileMenuItems">
<a href="javascript:top.ICEcoder.copyFile(top.ICEcoder.rightClickedFile)" onMouseOver="ICEcoder.showFileMenu()">Copy</a>
<a href="javascript:top.ICEcoder.renameFile(top.ICEcoder.rightClickedFile)" onMouseOver="ICEcoder.showFileMenu()">Rename</a>
<a href="javascript:window.open(top.ICEcoder.rightClickedFile.replace(/\|/g,'/'))" onMouseOver="ICEcoder.showFileMenu()">View Webpage</a>
</span>
<a href="javascript:top.ICEcoder.zipIt(top.ICEcoder.rightClickedFile)" onMouseOver="ICEcoder.showFileMenu()">Zip It!</a>
<a href="javascript:top.ICEcoder.propertiesScreen(top.ICEcoder.rightClickedFile)" onMouseOver="ICEcoder.showFileMenu()">Properties</a>
</div>
<div id="header" class="header" onContextMenu="return false">
<div class="plugins" id="pluginsContainer">
<?php echo $pluginsDisplay; ?>
</div>
<div class="version"><a href="javascript:top:ICEcoder.logout()">logout</a> : v <?php echo $ICEcoder["versionNo"];?></div><img src="images/full-screen.gif" id="screenMode" class="screenModeIcon" onClick="top.ICEcoder.fullScreenSwitcher()">
<img src="images/ice-coder.png" class="logo" onClick="ICEcoder.helpScreen()" onContextMenu="ICEcoder.settingsScreen()">
</div>
<div id="files" class="files" onMouseOver="ICEcoder.changeFilesW('expand')" onMouseOut="ICEcoder.changeFilesW('contract'); top.document.getElementById('fileMenu').style.display='none';">
<div class="account" id="account">
<div class="accountOptions">
<div title="Save" onClick="ICEcoder.fMIcon('save')" id="fMSave" class="save"></div>
<div title="Open" onClick="ICEcoder.fMIcon('open')" id="fMOpen" class="open"></div>
<div title="New File" onClick="ICEcoder.fMIcon('newFile')" id="fMNewFile" class="newFile"></div>
<div title="New Folder" onClick="ICEcoder.fMIcon('newFolder')" id="fMNewFolder" class="newFolder"></div>
<div title="Delete" onClick="ICEcoder.fMIcon('delete')" id="fMDelete" class="delete"></div>
<div title="Rename" onClick="ICEcoder.fMIcon('rename')" id="fMRename" class="rename"></div>
<div title="View" onClick="ICEcoder.fMIcon('view')" id="fMView" class="view"></div>
<div title="Lock" onClick="ICEcoder.lockUnlockNav()" id="fmLock" class="lock"></div>
</div>
</div>
<iframe id="filesFrame" class="frame" name="ff" src="files.php" style="opacity: 0" onLoad="this.style.opacity='1';this.contentWindow.onscroll=function(){top.ICEcoder.mouseDown=false}"></iframe>
<div class="serverMessage" id="serverMessage"></div>
</div>
<div id="editor" class="editor">
<div id="tabsBar" class="tabsBar" onContextMenu="return false">
<?php
for ($i=1;$i<=100;$i++) {
echo '<div id="tab'.$i.'" class="tab" draggable="true" onClick="ICEcoder.canSwitchTabs ? ICEcoder.switchTab('.$i.') : ICEcoder.canSwitchTabs=true; thisColor=\'#000\'" onMouseOver="thisColor=this.style.color;this.style.color=\'#000\'" onMouseOut="this.style.color=thisColor"></div>';
}
?><div class="newTab" onClick="ICEcoder.newTab()"><img src="images/nav-new.png"></div>
</div>
<div id="findBar" class="findBar" onContextMenu="return false">
<form name="findAndReplace" onSubmit="ICEcoder.findReplace('findReplace',false,true);return false">
<div class="findReplace">
<div class="findText">Find</div>
<input type="text" name="find" value="" id="find" class="textbox find" onKeyUp="ICEcoder.findReplace('find',true,false)">
<select name="connector" onChange="ICEcoder.findReplaceOptions()">
<option>in</option>
<option>and</option>
</select>
<div class="replaceText" id="rText" style="display: none">
<select name="replaceAction" class="replaceAction">
<option>replace</option>
<option>replace all</option>
</select>
with
</div>
<input type="text" name="replace" value="" id="replace" class="textbox replace" style="display: none">
<div class="targetText" id="rTarget" style="display: none">in</div>
<select name="target" onChange="ICEcoder.updateResultsDisplay(this.value=='this document' ? 'show' : 'hide')">
<option>this document</option>
<option>open documents</option>
<option>all files</option>
<option>all filenames</option>
</select>
<input type="submit" name="submit" value="&gt;&gt;" class="submit">
<div class="results" id="results"></div>
</div>
</form>
<form onSubmit="return ICEcoder.goToLine()">
<div class="codeAssist"><input type="checkbox" name="codeAssist" id="codeAssist" checked onClick="top.ICEcoder.codeAssistToggle()">Code Assist</div>
<div class="goLine">Go to Line<input type="text" name="goToLine" value="" id="goToLineNo" class="textbox goToLine">
</form>
</div>
<iframe name="contentFrame" id="content" src="editor.php" class="code"></iframe>
</div>
<div class="footer" id="footer" onContextMenu="return false">
<div class="nesting" id="nestValid">Nesting OK</div>
<div class="nestLoc">cursor nest location</div>
<div class="nestDisplay" id="nestDisplay"></div>
<div class="charDisplay" id="charDisplay"><span id="char"></span></div>
</div>
<script>
ICEcoder.initAliases();
ICEcoder.setLayout('dontSetEditor');
</script>
</body>
<?php include("lib/settings.php");
// Check IP permissions
if (!in_array($_SERVER["REMOTE_ADDR"], $_SESSION['allowedIPs']) && !in_array("*", $_SESSION['allowedIPs'])) {
header('Location: /');
};
$updateMsg = '';
// Check for updates
if ($ICEcoder["checkUpdates"]) {
$icv = json_encode(file_get_contents("http://icecoder.net/latest-version.txt"));
$icv = rtrim(ltrim($icv,'"'),'"\\n');
if ($ICEcoder["versionNo"]<$icv) {
$updateMsg = ';top.ICEcoder.message(\'ICEcoder '.$icv.' now released\n\nPlease upgrade\')';
}
}
?>
<!DOCTYPE html>
<html onMouseDown="top.ICEcoder.mouseDown=true" onMouseUp="top.ICEcoder.mouseDown=false" onMouseMove="if(top.ICEcoder) {top.ICEcoder.getMouseXY(event,'top');top.ICEcoder.canResizeFilesW()}">
<head>
<title>ICEcoder v <?php echo $ICEcoder["versionNo"];?></title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="robots" content="noindex, nofollow">
<link rel="stylesheet" type="text/css" href="lib/ice-coder.css">
<link rel="icon" type="image/png" href="favicon.png">
<script>
iceRoot = "<?php echo $ICEcoder["root"]; ?>";
window.onbeforeunload = function() {
if (top.ICEcoder.changedContent.indexOf(1)>-1) {
return "You have some unsaved changes.";
}
}
</script>
<script language="JavaScript" src="lib/ice-coder.js"></script>
<?php
if (file_exists(dirname(__FILE__)."/plugins/jshint/jshint.js")) {
echo '<script src="plugins/jshint/jshint.js"></script>';
}
?>
</head>
<body onLoad="<?php
echo 'top.ICEcoder.previousFiles = [';
if ($ICEcoder["previousFiles"]!="") {
$openFilesArray = explode(",",$ICEcoder["previousFiles"]);
echo "'".implode("','",$openFilesArray)."'";
}
echo "];top.ICEcoder.theme = '";
echo $ICEcoder["theme"]=="default" ? 'icecoder' : $ICEcoder["theme"];
echo "'";
echo ';top.ICEcoder.tabsIndent = ';
echo $ICEcoder["tabsIndent"] ? 'true' : 'false';
echo ';top.ICEcoder.openLastFiles = ';
echo $ICEcoder["openLastFiles"] ? 'true' : 'false';
echo ';top.ICEcoder.lineWrapping = ';
echo $ICEcoder["lineWrapping"] ? 'true' : 'false';
echo ';top.ICEcoder.tabWidth = ';
echo $ICEcoder["tabWidth"];
?>;ICEcoder.init()<?php echo $updateMsg.$onLoadExtras;?>" onResize="ICEcoder.setLayout()" onKeyDown="return ICEcoder.interceptKeys('coder',event);" onKeyUp="parent.ICEcoder.resetKeys(event);">
<div id="blackMask" class="blackMask" onClick="ICEcoder.showHide('hide',this)" onContextMenu="return false">
<div class="popupVCenter">
<div class="popup" id="mediaContainer"></div>
</div>
</div>
<div id="loadingMask" class="blackMask" style="visibility: visible" onContextMenu="return false">
<span class="progressBar" id="progressBar" style="-webkit-animation:fullexpand 10s ease-out; -moz-animation:fullexpand 10s ease-out"></span>
<div class="popupVCenter">
<div class="popup">
<div class="circleOutside"></div>
<div class="circleInside"></div>
&nbsp;&nbsp;&nbsp;working...
</div>
</div>
</div>
<div id="fileMenu" class="fileMenu" onMouseOver="ICEcoder.changeFilesW('expand')" onMouseOut="ICEcoder.changeFilesW('contract');this.style.display='none'" onContextMenu="return false">
<span id="folderMenuItems">
<a href="javascript:top.ICEcoder.newFile()" onMouseOver="ICEcoder.showFileMenu()">New File</a>
<a href="javascript:top.ICEcoder.newFolder()" onMouseOver="ICEcoder.showFileMenu()">New Folder</a>
<a href="javascript:top.ICEcoder.pasteFile(top.ICEcoder.rightClickedFile)" onMouseOver="ICEcoder.showFileMenu()">Paste</a>
<a href="javascript:top.ICEcoder.uploadFilesSelect(top.ICEcoder.rightClickedFile)" onMouseOver="ICEcoder.showFileMenu()">Upload File(s)</a>
<div style="display: none">
<form enctype="multipart/form-data" id="uploadFilesForm" action="lib/file-control.php?action=upload&file=/uploaded" method="POST" target="fileControl">
<input type="hidden" name="folder" id="uploadDir" value="/">
<input type="file" name="filesInput[]" id="fileInput" onchange="top.ICEcoder.uploadFilesSubmit(this)" multiple>
<input type="submit" value="Upload File">
</form>
</div>
</span>
<a href="javascript:top.ICEcoder.deleteFile(top.ICEcoder.rightClickedFile)" onMouseOver="ICEcoder.showFileMenu()">Delete</a>
<span id="singleFileMenuItems">
<a href="javascript:top.ICEcoder.copyFile(top.ICEcoder.rightClickedFile)" onMouseOver="ICEcoder.showFileMenu()">Copy</a>
<a href="javascript:top.ICEcoder.renameFile(top.ICEcoder.rightClickedFile)" onMouseOver="ICEcoder.showFileMenu()">Rename</a>
<a href="javascript:window.open(top.ICEcoder.rightClickedFile.replace(/\|/g,'/'))" onMouseOver="ICEcoder.showFileMenu()">View Webpage</a>
</span>
<a href="javascript:top.ICEcoder.zipIt(top.ICEcoder.rightClickedFile)" onMouseOver="ICEcoder.showFileMenu()">Zip It!</a>
<a href="javascript:top.ICEcoder.propertiesScreen(top.ICEcoder.rightClickedFile)" onMouseOver="ICEcoder.showFileMenu()">Properties</a>
</div>
<div id="header" class="header" onContextMenu="return false">
<div class="plugins" id="pluginsContainer">
<?php echo $pluginsDisplay; ?>
</div>
<div class="version"><a href="javascript:top:ICEcoder.logout()">logout</a> : v <?php echo $ICEcoder["versionNo"];?></div><img src="images/full-screen.gif" id="screenMode" class="screenModeIcon" onClick="top.ICEcoder.fullScreenSwitcher()">
<img src="images/ice-coder.png" class="logo" onClick="ICEcoder.helpScreen()" onContextMenu="ICEcoder.settingsScreen()">
</div>
<div id="files" class="files" onMouseOver="ICEcoder.changeFilesW('expand')" onMouseOut="ICEcoder.changeFilesW('contract'); top.document.getElementById('fileMenu').style.display='none';">
<div class="account" id="account">
<div class="accountOptions">
<div title="Save" onClick="ICEcoder.fMIcon('save')" id="fMSave" class="save"></div>
<div title="Open" onClick="ICEcoder.fMIcon('open')" id="fMOpen" class="open"></div>
<div title="New File" onClick="ICEcoder.fMIcon('newFile')" id="fMNewFile" class="newFile"></div>
<div title="New Folder" onClick="ICEcoder.fMIcon('newFolder')" id="fMNewFolder" class="newFolder"></div>
<div title="Delete" onClick="ICEcoder.fMIcon('delete')" id="fMDelete" class="delete"></div>
<div title="Rename" onClick="ICEcoder.fMIcon('rename')" id="fMRename" class="rename"></div>
<div title="View" onClick="ICEcoder.fMIcon('view')" id="fMView" class="view"></div>
<div title="Lock" onClick="ICEcoder.lockUnlockNav()" id="fmLock" class="lock"></div>
</div>
</div>
<iframe id="filesFrame" class="frame" name="ff" src="files.php" style="opacity: 0" onLoad="this.style.opacity='1';this.contentWindow.onscroll=function(){top.ICEcoder.mouseDown=false}"></iframe>
<div class="serverMessage" id="serverMessage"></div>
</div>
<div id="editor" class="editor">
<div id="tabsBar" class="tabsBar" onContextMenu="return false">
<a nohref onClick="top.ICEcoder.closeAllTabs()"><img src="images/nav-close.gif" class="closeAllTabs"></a>
<?php
for ($i=1;$i<=100;$i++) {
echo '<div id="tab'.$i.'" class="tab" draggable="true" onClick="ICEcoder.canSwitchTabs ? ICEcoder.switchTab('.$i.') : ICEcoder.canSwitchTabs=true; thisColor=\'#000\'" onMouseOver="thisColor=this.style.color;this.style.color=\'#000\'" onMouseOut="this.style.color=thisColor"></div>';
}
?><div class="newTab" onClick="ICEcoder.newTab()"><img src="images/nav-new.png"></div>
</div>
<div id="findBar" class="findBar" onContextMenu="return false">
<form name="findAndReplace" onSubmit="ICEcoder.findReplace('findReplace',false,true);return false">
<div class="findReplace">
<div class="findText">Find</div>
<input type="text" name="find" value="" id="find" class="textbox find" onKeyUp="ICEcoder.findReplace('find',true,false)">
<select name="connector" onChange="ICEcoder.findReplaceOptions()">
<option>in</option>
<option>and</option>
</select>
<div class="replaceText" id="rText" style="display: none">
<select name="replaceAction" class="replaceAction">
<option>replace</option>
<option>replace all</option>
</select>
with
</div>
<input type="text" name="replace" value="" id="replace" class="textbox replace" style="display: none">
<div class="targetText" id="rTarget" style="display: none">in</div>
<select name="target" onChange="ICEcoder.updateResultsDisplay(this.value=='this document' ? 'show' : 'hide')">
<option>this document</option>
<option>open documents</option>
<option>all files</option>
<option>all filenames</option>
</select>
<input type="submit" name="submit" value="&gt;&gt;" class="submit">
<div class="results" id="results"></div>
</div>
</form>
<form onSubmit="return ICEcoder.goToLine()">
<div class="codeAssist"><input type="checkbox" name="codeAssist" id="codeAssist" checked onClick="top.ICEcoder.codeAssistToggle()">Code Assist</div>
<div class="goLine">Go to Line<input type="text" name="goToLine" value="" id="goToLineNo" class="textbox goToLine">
</form>
</div>
<iframe name="contentFrame" id="content" src="editor.php" class="code"></iframe>
</div>
<div class="footer" id="footer" onContextMenu="return false">
<div class="nesting" id="nestValid">Nesting OK</div>
<div class="nestLoc">cursor nest location</div>
<div class="nestDisplay" id="nestDisplay"></div>
<div class="charDisplay" id="charDisplay"><span id="char"></span></div>
</div>
<script>
ICEcoder.initAliases();
ICEcoder.setLayout('dontSetEditor');
</script>
</body>
</html>

View File

@@ -1,147 +1,149 @@
/* First, reset everything to a standard */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
font-family: arial, verdana, helvetica, sans-serif;
border: 0;
margin: 0;
padding: 0;
outline: 0;
font-size: 12px;
vertical-align: top;
}
body {overflow: hidden;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
background-color: #222;
}
h1 {font-size: 36px; font-weight: normal; color: #888; margin-bottom: 20px}
h2 {font-size: 18px; font-weight: normal; color: #fff}
.blackMask {position: fixed; display: table; width: 100%; height: 100%; top: 0; left: 0; visibility: hidden; background-color: rgba(0,0,0,0.8); text-align: center; z-index: 100}
.blackMask .popupVCenter {#position: absolute; display: table-cell; #top: 50%; vertical-align: middle; text-align: center}
.popupVCenter .popup {#position: relative; #top: -50%; text-align: center; color: #fff; font-size: 10px}
.whiteGlow {box-shadow: 0 0 8px 2px rgba(255,255,255,0.6)}
.circleOutside {background-color: rgba(0,0,0,0); border:5px solid rgba(0,183,229,0.9); opacity:.9; border-top:5px solid rgba(0,0,0,0); border-left:5px solid rgba(0,0,0,0); border-radius:50px; box-shadow: 0 0 35px #2187e7;
width:50px; height:50px; margin:0 auto; -moz-animation:spin .5s infinite linear; -webkit-animation:spin .5s infinite linear;
}
.circleInside {background-color: rgba(0,0,0,0); border:5px solid rgba(0,183,229,0.9); opacity:.9; border-top:5px solid rgba(0,0,0,0); border-left:5px solid rgba(0,0,0,0); border-radius:50px; box-shadow: 0 0 15px #2187e7;
width:30px; height:30px; margin:0 auto; position:relative; top:-50px; -moz-animation:spinoff .5s infinite linear; -webkit-animation:spinoff .5s infinite linear;
}
@-moz-keyframes spin {
0% {-moz-transform:rotate(0deg)}
100% {-moz-transform:rotate(360deg)}
}
@-moz-keyframes spinoff {
0% {-moz-transform:rotate(0deg)}
100% {-moz-transform:rotate(-360deg)}
}
@-webkit-keyframes spin {
0% {-webkit-transform:rotate(0deg)}
100% {-webkit-transform:rotate(360deg)}
}
@-webkit-keyframes spinoff {
0% {-webkit-transform:rotate(0deg)}
100% {-webkit-transform:rotate(-360deg)}
}
.progressBar {position:absolute; top: 0; left: 0; width:100%; height:1px; margin:2px 0; background:#2187e7; box-shadow:0 0 10px 1px rgba(0,198,255,0.7)}
@-moz-keyframes fullexpand {
0% {width:0}
100%{width:100%}
}
@-webkit-keyframes fullexpand {
0% {width:0}
100%{width:100%}
}
.header {position: absolute; display: inline-block; top: 0; left: 0; width: 100%; height: 40px; background-color: #fff; text-align: right; z-index: 2}
.header .plugins {position: absolute; display: inline-block; left: 15px; top: 3px}
.header .plugins img {position: relative; display: inline-block; margin-right: 15px}
.header .screenModeIcon {position: absolute; top: 5px; right: 178px; cursor: pointer}
.header .version {position: relative; display: inline-block; margin-top: 25px; font-size: 10px; color: #bbb}
.header .version a {font-size: 10px; color: #bbb; text-decoration: none}
.header .logo {position: relative; margin: 5px 10px 0 5px; cursor: pointer}
.files {position: absolute; display: inline-block; top: 0; left: 0; height: 100%; width: 250px; background-color: #444; background-image: url('../images/files-arrow.png'); background-repeat: no-repeat; background-position: 100% 50%; overflow: hidden; z-index: 1;
box-shadow: 0 50px 10px 4px rgba(0,0,0,0.4);
}
.files .account {display: inline-block; height: 50px; width: 250px; margin-top: 40px; background-color: #888}
.files .accountOptions {position: relative; height: 32px; width: 100%; margin-left: 15px; margin-top: 8px}
.files .accountOptions div {display: inline-block; background: url('../images/file-manager-icons.png') 0 0 no-repeat; cursor: pointer}
.files .accountOptions .save {width: 30px; height: 32px; opacity: 0.3}
.files .accountOptions .open {width: 25px; height: 32px; background-position: -32px -3px; margin: 3px 0 0 7px; opacity: 0.3}
.files .accountOptions .newFile {width: 15px; height: 16px; background-position: -64px 0; margin: 8px 0 0 10px; opacity: 0.3}
.files .accountOptions .newFolder {width: 20px; height: 16px; background-position: -80px 0; margin: 8px 0 0 5px; opacity: 0.3}
.files .accountOptions .delete {width: 16px; height: 16px; background-position: -100px 0; margin: 8px 0 0 5px; opacity: 0.3}
.files .accountOptions .rename {width: 16px; height: 16px; background-position: -116px 0; margin: 8px 0 0 5px; opacity: 0.3}
.files .accountOptions .view {width: 16px; height: 16px; background-position: -132px 0; margin: 8px 0 0 5px; opacity: 0.3}
.files .accountOptions .lock {position: relative; margin-left: 208px; margin-top: -27px; width: 12px; height: 16px; background-position: -64px -16px; z-index: 1}
.files input:focus, .findReplace input:focus, .findReplace select:focus, .accountPassword:focus {outline: none; box-shadow: 0 0 10px 1px rgba(0,198,255,1)}
.files .button {position: absolute; border: 0; background: #444; color: #eee; height:20px; margin-top: 16px; margin-left: 5px; font-size: 11px; cursor: pointer}
.files .button:hover {background-color: #222; color: #eee}
.files .frame {display: inline-block; width: 250px}
.files .serverMessage {position: absolute; display: none; width: 450px; bottom: 0; margin-bottom: 30px; background-color: rgba(255,255,255,0.8); font-size: 10px; padding: 7px 12px; opacity: 0;
-webkit-transition: opacity 0.2s;
-moz-transition: opacity 0.2s;
transition: opacity 0.2s;
}
.files .serverMessage b {font-size: 10px}
.editor {position: absolute; display: inline-block; top: 0; left: 15px; width: 2400px}
.editor .tabsBar {display: inline-block; height: 22px; width: 2400px; margin-top: 40px; padding-left: 41px; background: #ddd}
.tabsBar .tab {display: none; background-image: url('../images/nav-bg.jpg'); background-repeat: repeat-x; background-position: 0 0; padding: 5px 8px 2px 8px; font-size: 10px; border-left: solid 1px #eee; border-right: solid 1px #777; border-radius: 4px 4px 0 0; color: #fff; direction: rtl; text-align: right; white-space: nowrap; overflow: hidden; cursor: pointer;
-webkit-transition: all 0.15s;
-moz-transition: all 0.15s;
transition: all 0.15s;
}
.tabsBar .tab .closeTab {margin: 1px 0 0 5px; border-radius: 6px}
.tabsBar .newTab {display: inline-block; background-image: url('../images/nav-bg.jpg'); background-repeat: repeat-x; background-position: 0 0; padding: 6px 5px 5px 5px; border-left: solid 1px #eee; border-right: solid 1px #777; border-radius: 4px 4px 0 0; cursor: pointer;}
.editor .findBar {display: inline-block; height: 28px; width: 2400px; color: #fff; background-color: #141414}
.findBar .findReplace {position: absolute; z-index: 1}
.findReplace select {position: relative; font-size: 10px; margin: 8px 2px 0 2px; top: -2px;}
.findReplace .findText {display: inline-block; height: 21px; font-size: 10px; margin: 8px 2px 0 2px; margin-left: 43px}
.findReplace .find {position: relative; width: 120px; height: 16px; border: 0; top: -3px; font-size: 10px; padding-left: 5px; margin-right: 3px}
.findReplace .replaceAction {margin: 0 2px 0 0; top: -2px}
.findReplace .replaceText {height: 21px; font-size: 10px; margin: 8px 2px 0 2px}
.findReplace .replace {position: relative; width: 120px; height: 16px; border: 0; top: -3px; font-size: 10px; padding-left: 5px}
.findReplace .targetText {height: 21px; font-size: 10px; margin: 8px 2px 0 2px}
.findReplace .submit {position: relative; top: -2px; height: 17px; border: 0; background-color: #444; color: #eee; font-size: 10px; margin-left: 2px; cursor: pointer}
.findReplace .submit:hover {background-color: #2187e7; color: #eee}
.findReplace .results {position: relative; display: inline-block; width: 200px; height: 20px; font-size: 10px; margin: 8px 0 0 20px}
.findBar .codeAssist {position: fixed; display: inline-block; width: 100px; right: 74px; top: 70px; height: 21px; font-size: 10px; z-index: 1}
.findBar .codeAssist input {margin-top: -1px}
.findBar .goLine {position: fixed; display: inline-block; width: 100px; right: -10px; top: 70px; height: 21px; font-size: 10px; z-index: 1}
.goLine .goToLine {width: 25px; height: 16px; border: 0; font-size: 10px; margin: -3px 0 0 3px}
.goLine .goToLine:focus {outline: none; box-shadow: 0 0 10px 1px rgba(0,198,255,1)}
.editor .code {position: relative; display: inline-block; top: 28px; width: 600px; height: 600px; visibility: hidden}
.footer {position: fixed; display: inline-block; width: 100%; height: 30px; bottom: 0; background-color: rgba(0,0,0,0.7); left: 0; z-index: 2}
.footer .nesting {display: inline-block; padding: 5px 8px; margin: 4px 0 0 15px; font-weight: bold; font-size: 10px; color: #fff; background-color: #0b0}
.footer .nestLoc {position: absolute; display: inline-block; width: 120px; padding: 5px 0 0 8px; margin-top: 2px; left: 112px; font-weight: bold; font-size: 12px; color: #fff; text-align: right}
.footer .nestDisplay {position: absolute; display: inline-block; padding: 5px 0 0 8px; margin-top: 0px; left: 255px; font-size: 12px; color: #fff; text-align: right}
.footer .charDisplay {position: absolute; display: inline-block; padding: 5px 0 0 8px; margin-top: 3px; left: 100%; font-weight: bold; font-size: 12px; color: #fff; text-align: right; width: 200px; text-align: right; margin-left: -220px}
.textbox {box-shadow: inset 1px 1px 2px 0 rgba(0,0,0,0.4)}
.fileMenu {position: absolute; display: none; left: 0; top: 0; background-color: #333; z-index: 10}
.fileMenu a {display: block; padding: 2px 5px; background-color: #333; color: #eee; text-decoration: none}
.fileMenu a:hover {background-color: #666}
.screenContainer {position: absolute; display: table; width: 100%; height: 100%; top: 0; left: 0; text-align: center}
.screenContainer .screenVCenter {#position: absolute; display: table-cell; #top: 50%; vertical-align: middle; text-align: center}
.screenVCenter .screenCenter {#position: relative; #top: -50%; text-align: center; display: inline}
.screenCenter .version {position: relative; display: block; margin: 5px 0 15px 0; font-size: 10px; color: #bbb}
.screenCenter .accountPassword {border: 0; background-color: #333; color: #fff; height: 20px}
.screenCenter .button {border: 0; background: #444; color: #eee; height: 22px; cursor: pointer}
/* First, reset everything to a standard */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
font-family: arial, verdana, helvetica, sans-serif;
border: 0;
margin: 0;
padding: 0;
outline: 0;
font-size: 12px;
vertical-align: top;
}
body {overflow: hidden;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
background-color: #222;
}
h1 {font-size: 36px; font-weight: normal; color: #888; margin-bottom: 20px}
h2 {font-size: 18px; font-weight: normal; color: #fff}
.blackMask {position: fixed; display: table; width: 100%; height: 100%; top: 0; left: 0; visibility: hidden; background-color: rgba(0,0,0,0.8); text-align: center; z-index: 100}
.blackMask .popupVCenter {#position: absolute; display: table-cell; #top: 50%; vertical-align: middle; text-align: center}
.popupVCenter .popup {#position: relative; #top: -50%; text-align: center; color: #fff; font-size: 10px}
.whiteGlow {box-shadow: 0 0 8px 2px rgba(255,255,255,0.6)}
.circleOutside {background-color: rgba(0,0,0,0); border:5px solid rgba(0,183,229,0.9); opacity:.9; border-top:5px solid rgba(0,0,0,0); border-left:5px solid rgba(0,0,0,0); border-radius:50px; box-shadow: 0 0 35px #2187e7;
width:50px; height:50px; margin:0 auto; -moz-animation:spin .5s infinite linear; -webkit-animation:spin .5s infinite linear;
}
.circleInside {background-color: rgba(0,0,0,0); border:5px solid rgba(0,183,229,0.9); opacity:.9; border-top:5px solid rgba(0,0,0,0); border-left:5px solid rgba(0,0,0,0); border-radius:50px; box-shadow: 0 0 15px #2187e7;
width:30px; height:30px; margin:0 auto; position:relative; top:-50px; -moz-animation:spinoff .5s infinite linear; -webkit-animation:spinoff .5s infinite linear;
}
@-moz-keyframes spin {
0% {-moz-transform:rotate(0deg)}
100% {-moz-transform:rotate(360deg)}
}
@-moz-keyframes spinoff {
0% {-moz-transform:rotate(0deg)}
100% {-moz-transform:rotate(-360deg)}
}
@-webkit-keyframes spin {
0% {-webkit-transform:rotate(0deg)}
100% {-webkit-transform:rotate(360deg)}
}
@-webkit-keyframes spinoff {
0% {-webkit-transform:rotate(0deg)}
100% {-webkit-transform:rotate(-360deg)}
}
.progressBar {position:absolute; top: 0; left: 0; width:100%; height:1px; margin:2px 0; background:#2187e7; box-shadow:0 0 10px 1px rgba(0,198,255,0.7)}
@-moz-keyframes fullexpand {
0% {width:0}
100%{width:100%}
}
@-webkit-keyframes fullexpand {
0% {width:0}
100%{width:100%}
}
.header {position: absolute; display: inline-block; top: 0; left: 0; width: 100%; height: 40px; background-color: #fff; text-align: right; z-index: 2}
.header .plugins {position: absolute; display: inline-block; left: 15px; top: 3px}
.header .plugins img {position: relative; display: inline-block; margin-right: 15px}
.header .screenModeIcon {position: absolute; top: 5px; right: 178px; cursor: pointer}
.header .version {position: relative; display: inline-block; margin-top: 25px; font-size: 10px; color: #bbb}
.header .version a {font-size: 10px; color: #bbb; text-decoration: none}
.header .logo {position: relative; margin: 5px 10px 0 5px; cursor: pointer}
.files {position: absolute; display: inline-block; top: 0; left: 0; height: 100%; width: 250px; background-color: #444; background-image: url('../images/files-arrow.png'); background-repeat: no-repeat; background-position: 100% 50%; overflow: hidden; z-index: 1;
box-shadow: 0 50px 10px 4px rgba(0,0,0,0.4);
}
.files .account {display: inline-block; height: 50px; width: 250px; margin-top: 40px; background-color: #888}
.files .accountOptions {position: relative; height: 32px; width: 100%; margin-left: 15px; margin-top: 8px}
.files .accountOptions div {display: inline-block; background: url('../images/file-manager-icons.png') 0 0 no-repeat; cursor: pointer}
.files .accountOptions .save {width: 30px; height: 32px; opacity: 0.3}
.files .accountOptions .open {width: 25px; height: 32px; background-position: -32px -3px; margin: 3px 0 0 7px; opacity: 0.3}
.files .accountOptions .newFile {width: 15px; height: 16px; background-position: -64px 0; margin: 8px 0 0 10px; opacity: 0.3}
.files .accountOptions .newFolder {width: 20px; height: 16px; background-position: -80px 0; margin: 8px 0 0 5px; opacity: 0.3}
.files .accountOptions .delete {width: 16px; height: 16px; background-position: -100px 0; margin: 8px 0 0 5px; opacity: 0.3}
.files .accountOptions .rename {width: 16px; height: 16px; background-position: -116px 0; margin: 8px 0 0 5px; opacity: 0.3}
.files .accountOptions .view {width: 16px; height: 16px; background-position: -132px 0; margin: 8px 0 0 5px; opacity: 0.3}
.files .accountOptions .lock {position: relative; margin-left: 208px; margin-top: -27px; width: 12px; height: 16px; background-position: -64px -16px; z-index: 1}
.files input:focus, .findReplace input:focus, .findReplace select:focus, .accountPassword:focus {outline: none; box-shadow: 0 0 10px 1px rgba(0,198,255,1)}
.files .button {position: absolute; border: 0; background: #444; color: #eee; height:20px; margin-top: 16px; margin-left: 5px; font-size: 11px; cursor: pointer}
.files .button:hover {background-color: #222; color: #eee}
.files .frame {display: inline-block; width: 250px}
.files .serverMessage {position: absolute; display: none; width: 450px; bottom: 0; margin-bottom: 30px; background-color: rgba(255,255,255,0.8); font-size: 10px; padding: 7px 12px; opacity: 0;
-webkit-transition: opacity 0.2s;
-moz-transition: opacity 0.2s;
transition: opacity 0.2s;
}
.files .serverMessage b {font-size: 10px}
.editor {position: absolute; display: inline-block; top: 0; left: 15px; width: 2400px}
.editor .tabsBar {display: inline-block; height: 22px; width: 2400px; margin-top: 40px; padding-left: 41px; background: #ddd}
.tabsBar .tab {display: none; background-image: url('../images/nav-bg.jpg'); background-repeat: repeat-x; background-position: 0 0; padding: 5px 8px 2px 8px; font-size: 10px; border-left: solid 1px #eee; border-right: solid 1px #777; border-radius: 4px 4px 0 0; color: #fff; direction: rtl; text-align: right; white-space: nowrap; overflow: hidden; cursor: pointer;
-webkit-transition: all 0.15s;
-moz-transition: all 0.15s;
transition: all 0.15s;
}
.tabsBar .tab .closeTab, .tabsBar .closeAllTabs {margin: 1px 0 0 5px; border-radius: 6px; cursor: pointer}
.tabsBar .closeAllTabs {position: absolute; margin: 6px 0 0 -25px; background: #bbb}
.tabsBar .closeAllTabs:hover {background: #000}
.tabsBar .newTab {display: inline-block; background-image: url('../images/nav-bg.jpg'); background-repeat: repeat-x; background-position: 0 0; padding: 6px 5px 5px 5px; border-left: solid 1px #eee; border-right: solid 1px #777; border-radius: 4px 4px 0 0; cursor: pointer;}
.editor .findBar {display: inline-block; height: 28px; width: 2400px; color: #fff; background-color: #141414}
.findBar .findReplace {position: absolute; z-index: 1}
.findReplace select {position: relative; font-size: 10px; margin: 8px 2px 0 2px; top: -2px;}
.findReplace .findText {display: inline-block; height: 21px; font-size: 10px; margin: 8px 2px 0 2px; margin-left: 43px}
.findReplace .find {position: relative; width: 120px; height: 16px; border: 0; top: -3px; font-size: 10px; padding-left: 5px; margin-right: 3px}
.findReplace .replaceAction {margin: 0 2px 0 0; top: -2px}
.findReplace .replaceText {height: 21px; font-size: 10px; margin: 8px 2px 0 2px}
.findReplace .replace {position: relative; width: 120px; height: 16px; border: 0; top: -3px; font-size: 10px; padding-left: 5px}
.findReplace .targetText {height: 21px; font-size: 10px; margin: 8px 2px 0 2px}
.findReplace .submit {position: relative; top: -2px; height: 17px; border: 0; background-color: #444; color: #eee; font-size: 10px; margin-left: 2px; cursor: pointer}
.findReplace .submit:hover {background-color: #2187e7; color: #eee}
.findReplace .results {position: relative; display: inline-block; width: 200px; height: 20px; font-size: 10px; margin: 8px 0 0 20px}
.findBar .codeAssist {position: fixed; display: inline-block; width: 100px; right: 74px; top: 70px; height: 21px; font-size: 10px; z-index: 1}
.findBar .codeAssist input {margin-top: -1px}
.findBar .goLine {position: fixed; display: inline-block; width: 100px; right: -10px; top: 70px; height: 21px; font-size: 10px; z-index: 1}
.goLine .goToLine {width: 25px; height: 16px; border: 0; font-size: 10px; margin: -3px 0 0 3px}
.goLine .goToLine:focus {outline: none; box-shadow: 0 0 10px 1px rgba(0,198,255,1)}
.editor .code {position: relative; display: inline-block; top: 28px; width: 600px; height: 600px; visibility: hidden}
.footer {position: fixed; display: inline-block; width: 100%; height: 30px; bottom: 0; background-color: rgba(0,0,0,0.7); left: 0; z-index: 2}
.footer .nesting {display: inline-block; padding: 5px 8px; margin: 4px 0 0 15px; font-weight: bold; font-size: 10px; color: #fff; background-color: #0b0}
.footer .nestLoc {position: absolute; display: inline-block; width: 120px; padding: 5px 0 0 8px; margin-top: 2px; left: 112px; font-weight: bold; font-size: 12px; color: #fff; text-align: right}
.footer .nestDisplay {position: absolute; display: inline-block; padding: 5px 0 0 8px; margin-top: 0px; left: 255px; font-size: 12px; color: #fff; text-align: right}
.footer .charDisplay {position: absolute; display: inline-block; padding: 5px 0 0 8px; margin-top: 3px; left: 100%; font-weight: bold; font-size: 12px; color: #fff; text-align: right; width: 200px; text-align: right; margin-left: -220px}
.textbox {box-shadow: inset 1px 1px 2px 0 rgba(0,0,0,0.4)}
.fileMenu {position: absolute; display: none; left: 0; top: 0; background-color: #333; z-index: 10}
.fileMenu a {display: block; padding: 2px 5px; background-color: #333; color: #eee; text-decoration: none}
.fileMenu a:hover {background-color: #666}
.screenContainer {position: absolute; display: table; width: 100%; height: 100%; top: 0; left: 0; text-align: center}
.screenContainer .screenVCenter {#position: absolute; display: table-cell; #top: 50%; vertical-align: middle; text-align: center}
.screenVCenter .screenCenter {#position: relative; #top: -50%; text-align: center; display: inline}
.screenCenter .version {position: relative; display: block; margin: 5px 0 15px 0; font-size: 10px; color: #bbb}
.screenCenter .accountPassword {border: 0; background-color: #333; color: #fff; height: 20px}
.screenCenter .button {border: 0; background: #444; color: #eee; height: 22px; cursor: pointer}
.screenCenter .button:hover {background: #2187e7; color: #eee}

View File

@@ -1717,6 +1717,13 @@ var ICEcoder = {
top.ICEcoder.setTabWidths();
},
// Close all tabs
closeAllTabs: function() {
for (var i=top.ICEcoder.cMInstances.length; i>0; i--) {
top.ICEcoder.closeTab(i);
}
},
// Set the tabs width
setTabWidths: function() {
var availWidth, tabWidth, thisWidth;