u239361
/
wuyebaoxiuapi


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508
							<!DOCTYPE html>
<html lang="zh">
    <head>
        <meta charset="utf-8" />
        <title>Chnage mode - Editor.md examples</title>
        <link rel="stylesheet" href="css/style.css" />
        <link rel="stylesheet" href="../css/editormd.css" />
        <link rel="shortcut icon" href="https://pandao.github.io/editor.md/favicon.ico" type="image/x-icon" />
        <style>
            #codes textarea {display: none;}
        </style>
    </head>
    <body>
        <div id="layout">
            <header>
                <h1>Chnage mode</h1>
                <p>Become to the code editor</p>
                <p>Modes : <select id="modes">
                    <option value="">select modes</option>
                </select>&nbsp;&nbsp;Themes : 
                    <select id="themes">
                        <option selected="selected" value="">select themes</option>
                    </select>
                </p>
            </header>
            <div class="btns">
                <button id="get-code-btn">Get code source</button>
                <button id="fullscreen-btn">Fullscreen (Press F11 into, ESC exit)</button>
            </div>
            <div id="codes">
            <textarea id="html-code">&lt;!DOCTYPE html&gt;
&lt;html lang="zh"&gt;
    &lt;head&gt;
        &lt;meta charset="utf-8" /&gt;
        &lt;title&gt;Chnage mode - Editor.md examples&lt;/title&gt;
        &lt;link rel="stylesheet" href="css/style.css" /&gt;
        &lt;link rel="stylesheet" href="../css/editormd.css" /&gt;
        &lt;link rel="shortcut icon" href="https://pandao.github.io/editor.md/favicon.ico" type="image/x-icon" /&gt;
    &lt;/head&gt;
    &lt;body&gt;
        &lt;div id="layout"&gt;
            &lt;header&gt;
                &lt;h1&gt;Chnage mode&lt;/h1&gt;
            &lt;/header&gt;
            &lt;div id="test-editormd"&gt;
                &lt;textarea style="display:none;"&gt;&lt;/textarea&gt;
            &lt;/div&gt;
        &lt;/div&gt;
        &lt;script src="js/jquery.min.js"&gt;&lt;/script&gt;
        &lt;script src="../editormd.js"&gt;&lt;/script&gt;
        &lt;script type="text/javascript"&gt;
            $(function() {
                var testEditor = editormd("test-editormd", {
                    width            : "90%",
                    height           : 720,
                    watch            : false,
                    toolbar          : false,
                    codeFold         : true,
                    searchReplace    : true,
                    placeholder      : "Enjoy coding!",
                    value            : (localStorage.mode) ? $("#"+localStorage.mode.replace("text/", "")+"-code").val() : $("#html-code").val(),
                    theme            : (localStorage.theme) ? localStorage.theme : "default",
                    mode             : (localStorage.mode) ? localStorage.mode : "text/html",
                    path             : '../lib/'
                });
            });
        &lt;/script&gt;
    &lt;/body&gt;
&lt;/html&gt;</textarea>
<textarea id="javascript-code">$(function() {
    var testEditor = editormd("test-editormd", {
        width            : "90%",
        height           : 720,
        watch            : false,
        toolbar          : false,
        codeFold         : true,
        searchReplace    : true,
        placeholder      : "Enjoy coding!",
        value            : (localStorage.mode) ? $("#"+localStorage.mode.replace("text/", "")+"-code").val() : $("#html-code").val(),
        theme            : (localStorage.theme) ? localStorage.theme : "default",
        mode             : (localStorage.mode) ? localStorage.mode : "text/html",
        path             : '../lib/'
    });
});</textarea>
<textarea id="xml-code">&lt;?xml version="1.0" encoding="utf-8" ?&gt;
&lt;root&gt;
	&lt;photo url="https://pandao.github.io/editor.md/examples/images/7.jpg"&gt;
		&lt;title&gt;李健首张专辑《似水流年》封面&lt;/title&gt;
		&lt;width&gt;360&lt;/width&gt;
		&lt;height&gt;360&lt;/height&gt;
	&lt;/photo&gt;
	&lt;photo url="https://pandao.github.io/editor.md/examples/images/7.jpg"&gt;
		&lt;title&gt;李健首张专辑《似水流年》封面&lt;/title&gt;
		&lt;width&gt;360&lt;/width&gt;
		&lt;height&gt;360&lt;/height&gt;
	&lt;/photo&gt;
	&lt;photo url="https://pandao.github.io/editor.md/examples/images/7.jpg"&gt;
		&lt;title&gt;李健首张专辑《似水流年》封面&lt;/title&gt;
		&lt;width&gt;360&lt;/width&gt;
		&lt;height&gt;360&lt;/height&gt;
	&lt;/photo&gt;
&lt;/root&gt;</textarea>
<textarea id="ruby-code">#!/usr/bin/ruby

puts "Hello World!";
 
# Ruby knows what you
# mean, even if you
# want to do math on
# an entire Array
cities  = %w[ London
              Oslo
              Paris
              Amsterdam
              Berlin ]
visited = %w[Berlin Oslo]

puts "I still need " +
     "to visit the " +
     "following cities:",
     cities - visited</textarea>
<textarea id="json-code">{
    "employees": [
        {
            "firstName" : "Bill",
            "lastName" : "Gates"
        },
        {
            "firstName" : "George",
            "lastName" : "Bush"
        },
        {
            "firstName" : "Thomas",
            "lastName" : "Carter"
        }
    ],
    "employees": [
        {
            "firstName" : "Bill",
            "lastName" : "Gates"
        },
        {
            "firstName" : "George",
            "lastName" : "Bush"
        },
        {
            "firstName" : "Thomas",
            "lastName" : "Carter"
        }
    ],
}</textarea>
<textarea id="php-code">&lt;?php
    $app = new Phalcon\Mvc\Micro();

    //Set a route with the name "show-post"
    $app->get('/blog/{year}/{title}', function ($year, $title) use ($app) {

        //.. show the post here
        return $year.$title;

    })->setName('show-post');

    $app->get('/', function () {
        echo "<h1>Welcome !</h1>";

        echo $app->url->get(array(
            'for' => 'show-post',
            'title' => 'php-is-a-great-framework',
            'year' => 2012
        ));
    });

    $app->get('/posts/{year:[0-9]+}/{title:[a-zA-Z\-]+}', function ($year, $title) {
        echo "<h1>Title: $title</h1>";
        echo "<h2>Year: $year</h2>";
    });

    //Requiring another file
    $app->get('/show/results', function () {
        require 'views/results.php';
    });

    //Returning a JSON
    $app->get('/get/some-json', function () {
        echo json_encode(array("some", "important", "data"));
    });

    //This route makes a redirection to another route
    $app->post('/old/welcome', function () use ($app) {
        $app->response->redirect("new/welcome");
    });

    $app->post('/new/welcome', function () use ($app) {
        echo 'This is the new Welcome';
    });

    /*
    //Matches if the HTTP method is POST
    $app->post('/api/products/add', "add_product");

    //Matches if the HTTP method is PUT
    $app->put('/api/products/update/{id}', "update_product");

    //Matches if the HTTP method is DELETE
    $app->put('/api/products/remove/{id}', "delete_product");

    //Matches if the HTTP method is GET or POST
    $app->map('/repos/store/refs')->via(array('GET', 'POST'));
    */

    $app->handle();
?&gt;</textarea>
<textarea id="cpp-code">#include "dialog.h"
#include <QApplication>

int main(int argc, char *argv[])
{
    QApplication a(argc, argv);
    Dialog w;
    w.show();

    return a.exec();
}</textarea>
<textarea id="java-code">package com.demo.blog;

import com.jfinal.aop.Before;
import com.jfinal.core.Controller;

@Before(BlogInterceptor.class)
public class BlogController extends Controller {
	public void index() {
		setAttr("blogPage", Blog.me.paginate(getParaToInt(0, 1), 10));
		render("blog.html");
	}

	public void add() {
	}

	@Before(BlogValidator.class)
	public void save() {
		getModel(Blog.class).save();
		redirect("/blog");
	}

	public void edit() {
		setAttr("blog", Blog.me.findById(getParaToInt()));
	}

	@Before(BlogValidator.class)
	public void update() {
		getModel(Blog.class).update();
		redirect("/blog");
	}

	public void delete() {
		Blog.me.deleteById(getParaToInt());
		redirect("/blog");
	}
}
</textarea>
<textarea id="actionscript-code">package com.flite
{
	import flash.net.*;
	import flash.events.*;
	import flash.display.*;

	/**
	 * @package com.flite
	 * @class   XMLLoader
	 * @author  pandao pandao@vip.qq.com
	 */

	public class XMLLoder
	{
		public var xml:XML;
		public var url:String;
		public var list:XMLList;
		public var percent:Number = 0;
		public var onload:Function;
		public var onerror:Function;
		public var onpreload:Function;
		public var onprogress:Function;

		private var loader:URLLoader;

		public function XMLLoder(url:String) : void
		{
			this.url = url;

			xml = new XML();
			xml.ignoreWhite = true;

            loader = new URLLoader();
            loader.load(new URLRequest(url));
			loader.addEventListener(Event.OPEN, preloadHandler);
			loader.addEventListener(IOErrorEvent.IO_ERROR, errorHandler);
			loader.addEventListener(ProgressEvent.PROGRESS, progressHandler);
            loader.addEventListener(Event.COMPLETE, loadedHandler);
		}

		private function preloadHandler(event:Event) : void
        {
			onpreload = onpreload || new Function;
			onpreload(event);
		}

		private function errorHandler(event:IOErrorEvent) : void
		{
			onerror = onerror || new Function;
			onerror(event);
		}

		private function progressHandler(event:ProgressEvent) : void
		{
			percent = Math.round((event.bytesLoaded / event.bytesTotal) * 100);

			onprogress = onprogress || new Function;
			onprogress(event, percent);
		}

		private function loadedHandler(event:Event) : void
		{
			xml = XML(loader.data);

			onload = onload || new Function;
			onload(xml);
		}
	}

}</textarea><textarea id="perl-code">#!/usr/bin/perl
use strict;
use warnings;

print "Hello, World...\n";
</textarea>
           <textarea id="go-code">package main

import (
    "github.com/astaxie/beego"
)

type MainController struct {
    beego.Controller
}

func (this *MainController) Get() {
    this.Ctx.WriteString("hello world")
}

func main() {
    beego.Router("/", &MainController{})
    beego.Run()
}</textarea><textarea id="python-code">#!/usr/bin/env python

from flask import Flask
app = Flask(__name__)

@app.route('/')
def hello_world():
    return 'Hello World!'

if __name__ == '__main__':
    app.run()</textarea>
           <textarea id="css-code">    body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,
    th,td,hr,button,article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section {
        margin:0;padding:0;
    }

    article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary {
        display: block;
    }

    audio, canvas, video {
        display: inline-block;
    }

    body, button, input, select, textarea {
        font:12px/1.5 Tahoma, "Hiragino Sans GB", "Microsoft Yahei", Arial;
    }

    body {
        font-size:12px;
        color:#666;
        background:#fff url(../images/) no-repeat left top;
    }

    a {
        color:#444;
        text-decoration: none;
    }

    a:hover {
        color:#065BC2;
        text-decoration: none;
    }

    .clear {
        zoom:1;
    }

    .clear:after {
        content:"";
        height:0;
        visibility:hidden;
        clear:both;
        display:block;
    }

    img {
        border:none;
        vertical-align: middle;
    }

    ul {
        list-style: none;
    }</textarea></div>
            <div id="test-editormd">
                <textarea style="display:none;"></textarea>
            </div>
        </div>
        <script src="js/jquery.min.js"></script>
        <script src="../editormd.js"></script>
        <script type="text/javascript">
            var testEditor;
            
            function getCodeValue() {
                return (localStorage.modeName) ? $("#"+localStorage.modeName.replace("text/", "").replace("c/c++", "cpp")+"-code").val() : $("#html-code").val();
            }
            
            $(function() {
                testEditor = editormd("test-editormd", {
                    width            : "90%",
                    height           : 720,
                    watch            : false,
                    toolbar          : false,
                    codeFold         : true,
                    searchReplace    : true,
                    placeholder      : "Enjoy coding!",
                    value            : getCodeValue(),
                    theme            : (localStorage.theme) ? localStorage.theme : "default",
                    mode             : (localStorage.mode) ? localStorage.mode : "text/html",
                    path             : '../lib/'
                });

                $("#get-code-btn").bind("click", function() {
                    alert(testEditor.getValue());
                });

                $("#fullscreen-btn").bind("click", function() {
                    testEditor.fullscreen();
                });
                
                var select = $("#themes");
                
                for (var i = 0, len = editormd.themes.length; i < len; i ++)
                {                    
                    var theme    = editormd.themes[i];
                    var selected = (localStorage.theme == theme) ? " selected=\"selected\"" : "";
                    select.append("<option value=\"" + theme + "\"" + selected + ">" + theme + "</option>");
                }
                
                select.change(function(){
                    var theme = $(this).val();
                    
                    if (theme == "")
                    {
                        alert("theme == \"\"");
                        return false;
                    }
                    
                    localStorage.theme = theme;
                    testEditor.setTheme(theme);
                });   
                
                var modesSelect = $("#modes");
                var modeNames = ["text/html", "javascript", "php", "text/xml", "text/json", "java", "actionscript", "perl", "go", "python", "c/c++", "css", "ruby"];
                var modes     = ["text/html", "javascript", "php", "text/xml", "text/json", "clike", "javascript", "perl", "go", "python", "clike", "css", "ruby"];
                
                for (var i = 0, len = modes.length; i < len; i ++)
                {                    
                    var mode    = modes[i];
                    var selected = (localStorage.modeName == modeNames[i]) ? " selected=\"selected\"" : "";
                    modesSelect.append("<option value=\"" + mode + "\"" + selected + " name=\"" + modeNames[i] + "\"" + selected + ">" + modeNames[i] + "</option>");
                }
                
                modesSelect.change(function(){
                    var mode = $(this).val();
                    var modeName = $(this).find("option:selected").attr("name");
                    
                    if (mode == "")
                    {
                        alert("mode == \"\"");
                        return false;
                    }
                    
                    localStorage.mode     = mode;
                    localStorage.modeName = modeName;
                    
                    var code = getCodeValue();
                    
                    testEditor.setCodeMirrorOption("mode", mode);
                    //testEditor.setCodeMirrorOption("value", code);
                    testEditor.setValue(code);
                });  
            });
        </script>
    </body>
</html>