editor.php

完美的在线教育系统

			<a href="javascript: editor.doSubmit('watermark');" class="buttons" title="OK"><img src="img/btn_ok.gif" height="30" width="30" alt="OK" /></a>
		</div>	
		<div id="watermarkMessage" style="display: none;">
			<script>document.write("<div id=\"tool_inputs\" style=\"text-align: center; width: 90%; color: #474767;\"><label style=\" font-weight: bold; letter-spacing: 3px;\">" + i18n("Watermarking is disabled.") + "</label><br /><label>" + i18n("No watermarks were found or all watermarks are to big for the target image.") + "</label></div>");</script>
		</div>	
	</div>	
	<div id="tools_crop" style="display:none;">
		<div id="tool_inputs">
			<label for="cx">Start X:</label><input type="text" id="cx"  class="textInput" onchange="updateMarker('crop')"/>
			<label for="cy">Start Y:</label><input type="text" id="cy" class="textInput" onchange="updateMarker('crop')"/>
			<label for="cw">Width:</label><input type="text" id="cw" class="textInput" onchange="updateMarker('crop')"/>
			<label for="ch">Height:</label><input type="text" id="ch" class="textInput" onchange="updateMarker('crop')"/>
			<img src="img/div.gif" height="30" width="2" class="div" alt="|" />
		</div>	
		<a href="javascript: editor.doSubmit('crop');" class="buttons" title="OK"><img src="img/btn_ok.gif" height="30" width="30" alt="OK" /></a>
		<a href="javascript: editor.reset();" class="buttons" title="Cancel"><img src="img/btn_cancel.gif" height="30" width="30" alt="Cancel" /></a>		
	</div>	
	<div id="tools_scale" style="display:none;">
		<div id="tool_inputs">
			<label for="sw">Width:</label><input type="text" id="sw" class="textInput" onchange="checkConstrains('width')"/>
			<a href="javascript:toggleConstraints();" title="Lock"><img src="img/islocked2.gif" id="scaleConstImg" height="14" width="8" alt="Lock" class="div" /></a><label for="sh">Height:</label>
			<input type="text" id="sh" class="textInput" onchange="checkConstrains('height')"/>
			<input type="checkbox" id="constProp" value="1" checked="checked" onclick="toggleConstraints()"/>
			<label for="constProp">Constrain Proportions</label>
			<img src="img/div.gif" height="30" width="2" class="div" alt="|" />
		</div>	
		<a href="javascript: editor.doSubmit('scale');" class="buttons" title="OK"><img src="img/btn_ok.gif" height="30" width="30" alt="OK" /></a>
		<a href="javascript: editor.reset();" class="buttons" title="Cancel"><img src="img/btn_cancel.gif" height="30" width="30" alt="Cancel" /></a>		
	</div>	
	<div id="tools_rotate" style="display:none;">
		<div id="tool_inputs">
			<select id="flip" name="flip" style="margin-left: 10px; vertical-align: middle;">
              <option selected>Flip Image</option>
              <option>-----------------</option>
              <option value="hoz">Flip Horizontal</option>
              <option value="ver">Flip Virtical</option>
         </select>
			<select name="rotate" onchange="rotatePreset(this)" style="margin-left: 20px; vertical-align: middle;">
              <option selected>Rotate Image</option>
              <option>-----------------</option>

              <option value="180">Rotate 180 &deg;</option>
              <option value="90">Rotate 90 &deg; CW</option>
              <option value="-90">Rotate 90 &deg; CCW</option>
         </select>
			<label for="ra">Angle:</label><input type="text" id="ra" class="textInput" />
			<img src="img/div.gif" height="30" width="2" class="div" alt="|" />
		</div>	
		<a href="javascript: editor.doSubmit('rotate');" class="buttons" title="OK"><img src="img/btn_ok.gif" height="30" width="30" alt="OK" /></a>
	</div>		
	<div id="tools_measure" style="display:none;">
		<div id="tool_inputs">
			<label id="xLabel">X:<input type="text" class="measureStats" id="sx" disabled /></label>
			<label id="yLabel">Y:<input type="text" class="measureStats" id="sy" disabled /></label>
			<img src="img/div.gif" height="30" width="2" class="div" alt="|" />
			<label id="widthLabel">W:<input type="text" class="measureStats" id="mw" disabled /></label>
			<label id="heightLabel">H:<input type="text" class="measureStats" id="mh" disabled /></label>
			<img src="img/div.gif" height="30" width="2" class="div" alt="|" />
			<label id="angleLabel">A:<input type="text" class="measureStats" id="ma" disabled /></label>
			<label id="diagonalLabel">D:<input type="text" class="measureStats" id="md" disabled /></label>
			<img src="img/div.gif" height="30" width="2" class="div" alt="|" />
			<button type="button" onclick="editor.reset();" >Clear</button>

			<script>
				document.getElementById("xLabel").title = i18n("start x coordinate");
				document.getElementById("yLabel").title = i18n("start y coordinate");
				document.getElementById("widthLabel").title = i18n("width");
				document.getElementById("heightLabel").title = i18n("height");
				document.getElementById("angleLabel").title = i18n("angle");
				document.getElementById("diagonalLabel").title = i18n("diagonal length");
			</script>
		</div>	
	</div>
	<div id="tools_save" style="display:none;">

<?php if($IMConfig['demo'] != true) { ?>

		<div id="tool_inputs">

	<?php if($IMConfig['allow_newFileName'] == true) { ?>
			<label for="save_filename">Filename:</label><input type="text" id="save_filename" value="<?php if($IMConfig['allow_overwrite'] == false){ echo $editor->getDefaultSaveFile(); }else{ echo basename($_GET['img']); } ?>" />
	<?php }else{ ?>
			<input type="hidden" id="save_filename" value="<?php echo basename($_GET['img']); ?>" />
	<?php } ?>

	<?php
	$pos = strrpos($_GET['img'], ".");
	$ext = substr($_GET['img'], $pos + 1);
	?>
			<select name="format" id="save_format" style="margin-left: 10px; vertical-align: middle; <?php if($IMConfig['allow_newFileName'] != true && $ext != "jpg" && $ext != "jpeg") {echo "display: none;";} ?>" onchange="updateFormat(this)">
            <option value="" selected>Image Format</option>
            <option value="">---------------------</option>
            <option value="jpeg,85">JPEG High</option>
            <option value="jpeg,60">JPEG Medium</option>
            <option value="jpeg,35">JPEG Low</option>
			<?php if($IMConfig['allow_newFileName'] == true){ ?>
            <option value="png">PNG</option>
			<?php    if($editor->isGDGIFAble() != -1) { ?>
            <option value="gif">GIF</option>
			<?php    } ?>
			<?php } ?>
			</select>

			<label>Quality:</label>
			<table style="display: inline; vertical-align: middle;" cellpadding="0" cellspacing="0">
				<tr>
				<td>
					<div id="slidercasingsave" class="slidercasing"> 
				<div id="slidertracksave" class="slidertrack" style="width:100px"><img src="img/spacer.gif" width="1" height="1" border="0" alt="track"></div>
            <div id="sliderbarsave" class="sliderbar" style="left:85px" onmousedown="captureStart('save');"><img src="img/spacer.gif" width="1" height="1" border="0" alt="track"></div>
			</div>	
				</td>
				</tr>
			</table>				
			<input type="text" id="sliderfieldsave" onchange="updateSlider(this.value, 'save')" style="width: 2em;" value="85"/>
			<img src="img/div.gif" height="30" width="2" class="div" alt="|" />
		</div>	
		<a href="javascript: editor.doSubmit('save');" class="buttons" title="OK"><img src="img/btn_ok.gif" height="30" width="30" alt="OK" /></a>

	<?php }else{ ?>

		<div id="tool_inputs" style="text-align: center; width: 90%; font-size: 150%; font-weight: bold; letter-spacing: 3px; color: #474767;">
			<label>Demo</label>
		</div>	

	<?php } ?>

	</div>	
</div>
<div id="toolbar">
	<div id="buttons">

		<a href="javascript:toggle('replace')" id="icon_replace" title="Replace" <?php if($IMConfig['allow_replace'] == false) { echo "style=\"display: none;\""; } ?> ><img src="img/replace.gif" height="20" width="20" alt="Replace" /><span>Replace</span></a>
		<a href="javascript:toggle('watermark')" id="icon_watermark" title="Watermark" <?php if(empty($IMConfig['watermarks'])) { echo "style=\"display: none;\""; } ?> ><img src="img/watermark.gif" height="20" width="20" alt="Watermark" /><span>Watermark</span></a>
		<a href="javascript:toggle('crop')" id="icon_crop" title="Crop"><img src="img/crop.gif" height="20" width="20" alt="Crop" /><span>Crop</span></a>
		<a href="javascript:toggle('scale')" id="icon_scale" title="Resize"><img src="img/scale.gif" height="20" width="20" alt="Resize" /><span>Resize</span></a>
		<a href="javascript:toggle('rotate')" id="icon_rotate" title="Rotate"><img src="img/rotate.gif" height="20" width="20" alt="Rotate" /><span>Rotate</span></a>
		<a href="javascript:toggle('measure')" id="icon_measure" title="Measure"><img src="img/measure.gif" height="20" width="20" alt="Measure" /><span>Measure</span></a>
		<a href="javascript: toggleMarker();" title="Marker"><img id="markerImg" src="img/t_black.gif" height="20" width="20" alt="Marker" /><span>Marker</span></a>
		<a href="javascript:toggle('save')" id="icon_save" title="Save"><img src="img/save.gif" height="20" width="20" alt="Save" /><span>Save</span></a>
	</div>
</div>
<div id="contents">
<div id="messages" style="display: none;"><span id="message"></span><img SRC="img/dots.gif" width="22" height="12" alt="..." /></div>
<iframe src="editorFrame.php?img=<?php if(isset($_GET['img'])) echo rawurlencode(htmlentities($_GET['img'])); ?>" name="editor" id="editor" scrolling="auto" title="Image Editor" frameborder="0"></iframe>
</div>
<div id="bottom"></div>
</body>
</html>