Permalink
Browse files

first commit

  • Loading branch information...
1 parent feaf65a commit 4eb5a7864e2ce1611a3ac16fffb6aa3ab146296a @DekusDenial committed Apr 2, 2012
Showing with 291 additions and 78 deletions.
  1. +2 −0 .gitignore
  2. +24 −0 config.rb
  3. BIN images/bg_dark.png
  4. +34 −78 index.html
  5. +51 −0 js/application.js
  6. +28 −0 js/prettify.js
  7. +30 −0 sass/_google-prettify.scss
  8. +5 −0 sass/ie.scss
  9. +3 −0 sass/print.scss
  10. +55 −0 sass/screen.scss
  11. +1 −0 stylesheets/ie.css
  12. +1 −0 stylesheets/print.css
  13. +57 −0 stylesheets/screen.css
View
@@ -0,0 +1,2 @@
+.sass-cache
+.DS_Store
View
@@ -0,0 +1,24 @@
+# Require any additional compass plugins here.
+
+# Set this to the root of your project when deployed:
+http_path = "/"
+css_dir = "stylesheets"
+sass_dir = "sass"
+images_dir = "images"
+javascripts_dir = "js"
+
+# You can select your preferred output style here (can be overridden via the command line):
+output_style = :compact
+
+# To enable relative paths to assets via compass helper functions. Uncomment:
+# relative_assets = true
+
+# To disable debugging comments that display the original location of your selectors. Uncomment:
+line_comments = false
+
+
+# If you prefer the indented syntax, you might want to regenerate this
+# project again passing --syntax sass, or you can uncomment this:
+# preferred_syntax = :sass
+# and then run:
+# sass-convert -R --from scss --to sass sass scss && rm -rf sass && mv scss sass
View
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
View
@@ -1,85 +1,41 @@
<!DOCTYPE html>
<html>
<head>
- <meta charset='utf-8'>
-
- <title>DekusDenial/Compact-Markup-Evaluator @ GitHub</title>
-
- <style type="text/css">
- body {
- margin-top: 1.0em;
- background-color: #ddc0df;
- font-family: Helvetica, Arial, FreeSans, san-serif;
- color: #000000;
- }
- #container {
- margin: 0 auto;
- width: 700px;
- }
- h1 { font-size: 3.8em; color: #223f20; margin-bottom: 3px; }
- h1 .small { font-size: 0.4em; }
- h1 a { text-decoration: none }
- h2 { font-size: 1.5em; color: #223f20; }
- h3 { text-align: center; color: #223f20; }
- a { color: #223f20; }
- .description { font-size: 1.2em; margin-bottom: 30px; margin-top: 30px; font-style: italic;}
- .download { float: right; }
- pre { background: #000; color: #fff; padding: 15px;}
- hr { border: 0; width: 80%; border-bottom: 1px solid #aaa}
- .footer { text-align:center; padding-top:30px; font-style: italic; }
- </style>
+ <meta http-equiv="content-type" content="text/html;charset=UTF-8">
+ <title>Compact Markup Evaluator</title>
+ <link href="stylesheets/screen.css" media="screen, projection" rel="stylesheet" type="text/css">
</head>
-
-<body>
- <a href="https://github.com/DekusDenial/Compact-Markup-Evaluator"><img style="position: absolute; top: 0; right: 0; border: 0;" src="http://s3.amazonaws.com/github/ribbons/forkme_right_darkblue_121621.png" alt="Fork me on GitHub" /></a>
-
- <div id="container">
-
- <div class="download">
- <a href="https://github.com/DekusDenial/Compact-Markup-Evaluator/zipball/master">
- <img border="0" width="90" src="https://github.com/images/modules/download/zip.png"></a>
- <a href="https://github.com/DekusDenial/Compact-Markup-Evaluator/tarball/master">
- <img border="0" width="90" src="https://github.com/images/modules/download/tar.png"></a>
- </div>
-
- <h1><a href="https://github.com/DekusDenial/Compact-Markup-Evaluator">Compact-Markup-Evaluator</a>
- <span class="small">by <a href="https://github.com/DekusDenial">DekusDenial</a></span></h1>
-
- <div class="description">
- Place to test your HTML, CSS, and Javascript Code
- </div>
-
-
-
-
-
-
-
-
-
-
-
-
- <h2>Contact</h2>
- <p>Dekus (dekusdenial@hotmail.com)
+<body onload="prettyPrint()">
+ <div class="input">
+ <form>
+ <fieldset id="div_html">
+ <legend title="html">HTML</legend>
+ <textarea name="html" id="html" cols="30" rows="10" placeholder="Enter your HTML here..."></textarea>
+ </fieldset>
+ <fieldset id="div_css">
+ <legend title="css">CSS</legend>
+ <textarea name="css" id="css" cols="30" rows="10" placeholder="Enter your CSS here..."></textarea>
+ </fieldset>
+ <fieldset id="div_js">
+ <legend title="js">JavaScript</legend>
+ <textarea name="js" id="js" cols="30" rows="10" placeholder="Enter your JavaScript here..."></textarea>
+ </fieldset>
+ <p>
+ <label><input name="jslib" type="radio" value="jquery" checked="checked">jQuery</label>
+ <label><input name="jslib" type="radio" value="mootool">MooTool</label>
+ </p>
+ </form>
+ </div>
+ <div class="output">
+ <fieldset>
+ <legend>Output View</legend>
+ <iframe id="output" frameborder="0"></iframe>
+ </fieldset>
-
-
- <h2>Download</h2>
- <p>
- You can download this project in either
- <a href="https://github.com/DekusDenial/Compact-Markup-Evaluator/zipball/master">zip</a> or
- <a href="https://github.com/DekusDenial/Compact-Markup-Evaluator/tarball/master">tar formats.
- </p>
- <p>You can also clone the project with <a href="http://git-scm.com">Git</a>
- by running:
- <pre>$ git clone git://github.com/DekusDenial/Compact-Markup-Evaluator</pre>
- </p>
-
- <div class="footer">
- get the source code on GitHub : <a href="https://github.com/DekusDenial/Compact-Markup-Evaluator">DekusDenial/Compact-Markup-Evaluator</a>
- </div>
</div>
- </div>
+
+ <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
+ <script type="text/javascript" src="js/prettify.js"></script>
+ <script type="text/javascript" src="js/application.js"></script>
</body>
-</body>
+</html>
View
@@ -0,0 +1,51 @@
+(function(){
+
+ function elementSupportsAttribute(element, attribute) {
+ return (attribute in document.createElement(element));
+ };
+
+ if (!elementSupportsAttribute('textarea', 'placeholder')) {
+ // Fallback for browsers that don't support HTML5 placeholder attribute
+ var $titles = $('legend'), $txt = $titles.siblings();
+ $.each($titles, function(_, title) {
+ $txt.filter('#' + $(title).attr('title'))
+ .data('text', 'Enter your ' + title.innerText + ' here...')
+ .css('color', '#999')
+ .on('focus', function() {
+ if (this.value == $(this).data('text')) {
+ this.value = '';
+ }
+ })
+ .on('blur', function() {
+ if (this.value == '') {
+ this.value = $(this).data('text');
+ }
+ });
+ });
+ }
+
+ var $output = $('iframe#output'), inner = $output.contents();
+ var body = inner.find('body').css('background', 'white');
+ var styles = inner.find('head').append('<style>').children('style');
+ // make jQuery and its alias available to the iframe
+ var $jslib = $('input:checked');
+ if ($jslib && $jslib.val() == 'jquery') {
+ $output[0].contentWindow.$ = $output[0].contentWindow.jQuery = window.top.$;
+ window.output_context = $output[0].contentWindow.output_context = $output[0].contentWindow.document;
+ }
+
+
+ $('textarea').on('keyup', function() {
+ var $area = $(this);
+ if ($area.attr('id') === 'html') {
+ body.html($area.val());
+ } else if (($area.attr('id') === 'css')) {
+ styles.text($area.val());
+ } else {
+ // $output[0].contentWindow.eval('(function (){ ' + $area.val() + ' })()');
+ // $('iframe')[0].contentWindow.$('p', $('iframe').contents().find('body'));
+ $output[0].contentWindow.eval($area.val());
+ }
+ });
+
+})();
Oops, something went wrong.

0 comments on commit 4eb5a78

Please sign in to comment.