2013-11-28 09:41:53 +04:00
|
|
|
<html>
|
2013-11-30 05:10:01 +04:00
|
|
|
<link rel="stylesheet" type="text/css" href="editor.css">
|
2013-11-28 09:41:53 +04:00
|
|
|
<style>
|
|
|
|
|
|
2013-11-30 04:18:50 +04:00
|
|
|
body.dark {
|
2013-11-30 04:41:05 +04:00
|
|
|
background: #0a0a0a;
|
2013-11-30 04:18:50 +04:00
|
|
|
color: silver;
|
|
|
|
|
}
|
2013-11-30 03:41:54 +04:00
|
|
|
|
|
|
|
|
|
2013-11-30 04:18:50 +04:00
|
|
|
body.gray {
|
|
|
|
|
background: #333;
|
|
|
|
|
color: silver;
|
|
|
|
|
}
|
|
|
|
|
|
2013-11-30 03:41:54 +04:00
|
|
|
|
2013-11-30 05:10:01 +04:00
|
|
|
|
2013-11-28 09:41:53 +04:00
|
|
|
</style>
|
|
|
|
|
<script src="jquery.js"></script>
|
2013-11-29 17:27:59 +04:00
|
|
|
<script src="jquery-ui.js"></script>
|
2013-11-30 05:10:01 +04:00
|
|
|
<script src="editor.js"></script>
|
2013-11-28 09:41:53 +04:00
|
|
|
<script>
|
2013-11-30 04:41:05 +04:00
|
|
|
|
|
|
|
|
|
|
|
|
|
function toggleThemes(){
|
|
|
|
|
var b = $('body')
|
|
|
|
|
if(b.hasClass('gray')){
|
|
|
|
|
b.removeClass('gray')
|
|
|
|
|
b.addClass('dark')
|
|
|
|
|
} else if(b.hasClass('dark')){
|
|
|
|
|
b.removeClass('dark')
|
|
|
|
|
} else {
|
|
|
|
|
b.addClass('gray')
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
2013-11-30 01:00:43 +04:00
|
|
|
// setup...
|
2013-11-29 03:33:09 +04:00
|
|
|
$(function(){
|
2013-11-29 17:27:59 +04:00
|
|
|
var target = '#image'
|
2013-11-29 03:33:09 +04:00
|
|
|
|
2013-11-29 21:52:22 +04:00
|
|
|
var panel = makeControls(target).hide()
|
2013-11-29 03:33:09 +04:00
|
|
|
|
2013-11-29 21:52:22 +04:00
|
|
|
$('body').append(panel)
|
|
|
|
|
|
2013-11-30 01:00:43 +04:00
|
|
|
reloadControls(target)
|
|
|
|
|
|
2013-11-29 21:52:22 +04:00
|
|
|
$(target)
|
|
|
|
|
.click(function(){
|
|
|
|
|
panel.show()
|
|
|
|
|
})
|
2013-11-30 04:18:50 +04:00
|
|
|
|
2013-11-29 03:33:09 +04:00
|
|
|
})
|
|
|
|
|
|
2013-11-30 01:00:43 +04:00
|
|
|
|
|
|
|
|
|
|
|
|
|
/*********************************************************************/
|
2013-11-28 09:41:53 +04:00
|
|
|
</script>
|
|
|
|
|
<body>
|
2013-11-29 21:52:22 +04:00
|
|
|
<img id="image" src="image.jpg" >
|
2013-11-30 04:41:05 +04:00
|
|
|
<p>click image to show editor panel and <a href="javascript:toggleThemes()">here</a> to toggle theme...</p>
|
2013-11-28 09:41:53 +04:00
|
|
|
</body>
|
|
|
|
|
</html>
|
