il y a 3 ans · bb2548ccde
--- a/src/admin/js/mode/clike/index.html
+++ b/src/admin/js/mode/clike/index.html
@@ -1,360 +0,0 @@
 <!DOCTYPE html>

 <title>CodeMirror: C-like mode</title>
 <meta charset="utf-8"/>
 <link rel=stylesheet href="../../doc/docs.css">

 <link rel="stylesheet" href="../../lib/codemirror.css">
 <script src="../../lib/codemirror.js"></script>
 <script src="../../addon/edit/matchbrackets.js"></script>
 <link rel="stylesheet" href="../../addon/hint/show-hint.css">
 <script src="../../addon/hint/show-hint.js"></script>
 <script src="clike.js"></script>
 <style>.CodeMirror {border: 2px inset #dee;}</style>
 <div id=nav>
  <a href="http://codemirror.net"><h1>CodeMirror</h1><img id=logo src="../../doc/logo.png"></a>

  <ul>
    <li><a href="../../index.html">Home</a>
    <li><a href="../../doc/manual.html">Manual</a>
    <li><a href="https://github.com/codemirror/codemirror">Code</a>
  </ul>
  <ul>
    <li><a href="../index.html">Language modes</a>
    <li><a class=active href="javascript:;">C-like</a>
  </ul>
 </div>

 <article>
 <h2>C-like mode</h2>

 <div><textarea id="c-code">
 /* C demo code */

 #include <zmq.h>
 #include <pthread.h>
 #include <semaphore.h>
 #include <time.h>
 #include <stdio.h>
 #include <fcntl.h>
 #include <malloc.h>

 typedef struct {
  void* arg_socket;
  zmq_msg_t* arg_msg;
  char* arg_string;
  unsigned long arg_len;
  int arg_int, arg_command;

  int signal_fd;
  int pad;
  void* context;
  sem_t sem;
 } acl_zmq_context;

 #define p(X) (context->arg_##X)

 void* zmq_thread(void* context_pointer) {
  acl_zmq_context* context = (acl_zmq_context*)context_pointer;
  char ok = 'K', err = 'X';
  int res;

  while (1) {
    while ((res = sem_wait(&amp;context->sem)) == EINTR);
    if (res) {write(context->signal_fd, &amp;err, 1); goto cleanup;}
    switch(p(command)) {
    case 0: goto cleanup;
    case 1: p(socket) = zmq_socket(context->context, p(int)); break;
    case 2: p(int) = zmq_close(p(socket)); break;
    case 3: p(int) = zmq_bind(p(socket), p(string)); break;
    case 4: p(int) = zmq_connect(p(socket), p(string)); break;
    case 5: p(int) = zmq_getsockopt(p(socket), p(int), (void*)p(string), &amp;p(len)); break;
    case 6: p(int) = zmq_setsockopt(p(socket), p(int), (void*)p(string), p(len)); break;
    case 7: p(int) = zmq_send(p(socket), p(msg), p(int)); break;
    case 8: p(int) = zmq_recv(p(socket), p(msg), p(int)); break;
    case 9: p(int) = zmq_poll(p(socket), p(int), p(len)); break;
    }
    p(command) = errno;
    write(context->signal_fd, &amp;ok, 1);
  }
 cleanup:
  close(context->signal_fd);
  free(context_pointer);
  return 0;
 }

 void* zmq_thread_init(void* zmq_context, int signal_fd) {
  acl_zmq_context* context = malloc(sizeof(acl_zmq_context));
  pthread_t thread;

  context->context = zmq_context;
  context->signal_fd = signal_fd;
  sem_init(&amp;context->sem, 1, 0);
  pthread_create(&amp;thread, 0, &amp;zmq_thread, context);
  pthread_detach(thread);
  return context;
 }
 </textarea></div>

 <h2>C++ example</h2>

 <div><textarea id="cpp-code">
 #include <iostream>
 #include "mystuff/util.h"

 namespace {
 enum Enum {
  VAL1, VAL2, VAL3
 };

 char32_t unicode_string = U"\U0010FFFF";
 string raw_string = R"delim(anything
 you
 want)delim";

 int Helper(const MyType& param) {
  return 0;
 }
 } // namespace

 class ForwardDec;

 template <class T, class V>
 class Class : public BaseClass {
  const MyType<T, V> member_;

 public:
  const MyType<T, V>& Method() const {
    return member_;
  }

  void Method2(MyType<T, V>* value);
 }

 template <class T, class V>
 void Class::Method2(MyType<T, V>* value) {
  std::out << 1 >> method();
  value->Method3(member_);
  member_ = value;
 }
 </textarea></div>

 <h2>Objective-C example</h2>

 <div><textarea id="objectivec-code">
 /*
 This is a longer comment
 That spans two lines
 */

 #import <Test/Test.h>
@implementation YourAppDelegate

 // This is a one-line comment

 - (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions{
  char myString[] = "This is a C character array";
  int test = 5;
  return YES;
 }
 </textarea></div>

 <h2>Java example</h2>

 <div><textarea id="java-code">
 import com.demo.util.MyType;
 import com.demo.util.MyInterface;

 public enum Enum {
  VAL1, VAL2, VAL3
 }

 public class Class<T, V> implements MyInterface {
  public static final MyType<T, V> member;
  
  private class InnerClass {
    public int zero() {
      return 0;
    }
  }

  @Override
  public MyType method() {
    return member;
  }

  public void method2(MyType<T, V> value) {
    method();
    value.method3();
    member = value;
  }
 }
 </textarea></div>

 <h2>Scala example</h2>

 <div><textarea id="scala-code">
 object FilterTest extends App {
  def filter(xs: List[Int], threshold: Int) = {
    def process(ys: List[Int]): List[Int] =
      if (ys.isEmpty) ys
      else if (ys.head < threshold) ys.head :: process(ys.tail)
      else process(ys.tail)
    process(xs)
  }
  println(filter(List(1, 9, 2, 8, 3, 7, 4), 5))
 }
 </textarea></div>

 <h2>Kotlin mode</h2>

 <div><textarea id="kotlin-code">
 package org.wasabi.http

 import java.util.concurrent.Executors
 import java.net.InetSocketAddress
 import org.wasabi.app.AppConfiguration
 import io.netty.bootstrap.ServerBootstrap
 import io.netty.channel.nio.NioEventLoopGroup
 import io.netty.channel.socket.nio.NioServerSocketChannel
 import org.wasabi.app.AppServer

 public class HttpServer(private val appServer: AppServer) {

    val bootstrap: ServerBootstrap
    val primaryGroup: NioEventLoopGroup
    val workerGroup:  NioEventLoopGroup

    init {
        // Define worker groups
        primaryGroup = NioEventLoopGroup()
        workerGroup = NioEventLoopGroup()

        // Initialize bootstrap of server
        bootstrap = ServerBootstrap()

        bootstrap.group(primaryGroup, workerGroup)
        bootstrap.channel(javaClass<NioServerSocketChannel>())
        bootstrap.childHandler(NettyPipelineInitializer(appServer))
    }

    public fun start(wait: Boolean = true) {
        val channel = bootstrap.bind(appServer.configuration.port)?.sync()?.channel()

        if (wait) {
            channel?.closeFuture()?.sync()
        }
    }

    public fun stop() {
        // Shutdown all event loops
        primaryGroup.shutdownGracefully()
        workerGroup.shutdownGracefully()

        // Wait till all threads are terminated
        primaryGroup.terminationFuture().sync()
        workerGroup.terminationFuture().sync()
    }
 }
 </textarea></div>

 <h2>Ceylon mode</h2>

 <div><textarea id="ceylon-code">
 "Produces the [[stream|Iterable]] that results from repeated
 application of the given [[function|next]] to the given
 [[first]] element of the stream, until the function first
 returns [[finished]]. If the given function never returns 
 `finished`, the resulting stream is infinite.

 For example:

     loop(0)(2.plus).takeWhile(10.largerThan)

 produces the stream `{ 0, 2, 4, 6, 8 }`."
 tagged("Streams")
 shared {Element+} loop&lt;Element&gt;(
        "The first element of the resulting stream."
        Element first)(
        "The function that produces the next element of the
         stream, given the current element. The function may
         return [[finished]] to indicate the end of the 
         stream."
        Element|Finished next(Element element))
    =&gt; let (start = first)
    object satisfies {Element+} {
        first =&gt; start;
        empty =&gt; false;
        function nextElement(Element element)
                =&gt; next(element);
        iterator()
                =&gt; object satisfies Iterator&lt;Element&gt; {
            variable Element|Finished current = start;
            shared actual Element|Finished next() {
                if (!is Finished result = current) {
                    current = nextElement(result);
                    return result;
                }
                else {
                    return finished;
                }
            }
        };
    };
 </textarea></div>

    <script>
      var cEditor = CodeMirror.fromTextArea(document.getElementById("c-code"), {
        lineNumbers: true,
        matchBrackets: true,
        mode: "text/x-csrc"
      });
      var cppEditor = CodeMirror.fromTextArea(document.getElementById("cpp-code"), {
        lineNumbers: true,
        matchBrackets: true,
        mode: "text/x-c++src"
      });
      var javaEditor = CodeMirror.fromTextArea(document.getElementById("java-code"), {
        lineNumbers: true,
        matchBrackets: true,
        mode: "text/x-java"
      });
      var objectivecEditor = CodeMirror.fromTextArea(document.getElementById("objectivec-code"), {
        lineNumbers: true,
        matchBrackets: true,
        mode: "text/x-objectivec"
      });
      var scalaEditor = CodeMirror.fromTextArea(document.getElementById("scala-code"), {
        lineNumbers: true,
        matchBrackets: true,
        mode: "text/x-scala"
      });
      var kotlinEditor = CodeMirror.fromTextArea(document.getElementById("kotlin-code"), {
          lineNumbers: true,
          matchBrackets: true,
          mode: "text/x-kotlin"
      });
      var ceylonEditor = CodeMirror.fromTextArea(document.getElementById("ceylon-code"), {
          lineNumbers: true,
          matchBrackets: true,
          mode: "text/x-ceylon"
      });
      var mac = CodeMirror.keyMap.default == CodeMirror.keyMap.macDefault;
      CodeMirror.keyMap.default[(mac ? "Cmd" : "Ctrl") + "-Space"] = "autocomplete";
    </script>

    <p>Simple mode that tries to handle C-like languages as well as it
    can. Takes two configuration parameters: <code>keywords</code>, an
    object whose property names are the keywords in the language,
    and <code>useCPP</code>, which determines whether C preprocessor
    directives are recognized.</p>

    <p><strong>MIME types defined:</strong> <code>text/x-csrc</code>
    (C), <code>text/x-c++src</code> (C++), <code>text/x-java</code>
    (Java), <code>text/x-csharp</code> (C#),
    <code>text/x-objectivec</code> (Objective-C),
    <code>text/x-scala</code> (Scala), <code>text/x-vertex</code>
    <code>x-shader/x-fragment</code> (shader programs),
    <code>text/x-squirrel</code> (Squirrel) and
    <code>text/x-ceylon</code> (Ceylon)</p>
 </article>
--- a/src/admin/js/mode/clike/scala.html
+++ b/src/admin/js/mode/clike/scala.html
@@ -1,767 +0,0 @@
 <!DOCTYPE html>

 <title>CodeMirror: Scala mode</title>
 <meta charset="utf-8"/>
 <link rel=stylesheet href="../../doc/docs.css">

 <link rel="stylesheet" href="../../lib/codemirror.css">
 <link rel="stylesheet" href="../../theme/ambiance.css">
 <script src="../../lib/codemirror.js"></script>
 <script src="../../addon/edit/matchbrackets.js"></script>
 <script src="clike.js"></script>
 <div id=nav>
  <a href="http://codemirror.net"><h1>CodeMirror</h1><img id=logo src="../../doc/logo.png"></a>

  <ul>
    <li><a href="../../index.html">Home</a>
    <li><a href="../../doc/manual.html">Manual</a>
    <li><a href="https://github.com/codemirror/codemirror">Code</a>
  </ul>
  <ul>
    <li><a href="../index.html">Language modes</a>
    <li><a class=active href="javascript:;">Scala</a>
  </ul>
 </div>

 <article>
 <h2>Scala mode</h2>
 <form>
 <textarea id="code" name="code">

  /*                     __                                               *\
  **     ________ ___   / /  ___     Scala API                            **
  **    / __/ __// _ | / /  / _ |    (c) 2003-2011, LAMP/EPFL             **
  **  __\ \/ /__/ __ |/ /__/ __ |    http://scala-lang.org/               **
  ** /____/\___/_/ |_/____/_/ | |                                         **
  **                          |/                                          **
  \*                                                                      */

  package scala.collection

  import generic._
  import mutable.{ Builder, ListBuffer }
  import annotation.{tailrec, migration, bridge}
  import annotation.unchecked.{ uncheckedVariance => uV }
  import parallel.ParIterable

  /** A template trait for traversable collections of type `Traversable[A]`.
   *  
   *  $traversableInfo
   *  @define mutability
   *  @define traversableInfo
   *  This is a base trait of all kinds of $mutability Scala collections. It
   *  implements the behavior common to all collections, in terms of a method
   *  `foreach` with signature:
   * {{{
   *     def foreach[U](f: Elem => U): Unit
   * }}}
   *  Collection classes mixing in this trait provide a concrete 
   *  `foreach` method which traverses all the
   *  elements contained in the collection, applying a given function to each.
   *  They also need to provide a method `newBuilder`
   *  which creates a builder for collections of the same kind.
   *  
   *  A traversable class might or might not have two properties: strictness
   *  and orderedness. Neither is represented as a type.
   *  
   *  The instances of a strict collection class have all their elements
   *  computed before they can be used as values. By contrast, instances of
   *  a non-strict collection class may defer computation of some of their
   *  elements until after the instance is available as a value.
   *  A typical example of a non-strict collection class is a
   *  <a href="../immutable/Stream.html" target="ContentFrame">
   *  `scala.collection.immutable.Stream`</a>.
   *  A more general class of examples are `TraversableViews`.
   *  
   *  If a collection is an instance of an ordered collection class, traversing
   *  its elements with `foreach` will always visit elements in the
   *  same order, even for different runs of the program. If the class is not
   *  ordered, `foreach` can visit elements in different orders for
   *  different runs (but it will keep the same order in the same run).'
   * 
   *  A typical example of a collection class which is not ordered is a
   *  `HashMap` of objects. The traversal order for hash maps will
   *  depend on the hash codes of its elements, and these hash codes might
   *  differ from one run to the next. By contrast, a `LinkedHashMap`
   *  is ordered because it's `foreach` method visits elements in the
   *  order they were inserted into the `HashMap`.
   *
   *  @author Martin Odersky
   *  @version 2.8
   *  @since   2.8
   *  @tparam A    the element type of the collection
   *  @tparam Repr the type of the actual collection containing the elements.
   *
   *  @define Coll Traversable
   *  @define coll traversable collection
   */
  trait TraversableLike[+A, +Repr] extends HasNewBuilder[A, Repr] 
                                      with FilterMonadic[A, Repr]
                                      with TraversableOnce[A]
                                      with GenTraversableLike[A, Repr]
                                      with Parallelizable[A, ParIterable[A]]
  {
    self =>

    import Traversable.breaks._

    /** The type implementing this traversable */
    protected type Self = Repr

    /** The collection of type $coll underlying this `TraversableLike` object.
     *  By default this is implemented as the `TraversableLike` object itself,
     *  but this can be overridden.
     */
    def repr: Repr = this.asInstanceOf[Repr]

    /** The underlying collection seen as an instance of `$Coll`.
     *  By default this is implemented as the current collection object itself,
     *  but this can be overridden.
     */
    protected[this] def thisCollection: Traversable[A] = this.asInstanceOf[Traversable[A]]

    /** A conversion from collections of type `Repr` to `$Coll` objects.
     *  By default this is implemented as just a cast, but this can be overridden.
     */
    protected[this] def toCollection(repr: Repr): Traversable[A] = repr.asInstanceOf[Traversable[A]]

    /** Creates a new builder for this collection type.
     */
    protected[this] def newBuilder: Builder[A, Repr]

    protected[this] def parCombiner = ParIterable.newCombiner[A]

    /** Applies a function `f` to all elements of this $coll.
     *  
     *    Note: this method underlies the implementation of most other bulk operations.
     *    It's important to implement this method in an efficient way.
     *  
     *
     *  @param  f   the function that is applied for its side-effect to every element.
     *              The result of function `f` is discarded.
     *              
     *  @tparam  U  the type parameter describing the result of function `f`. 
     *              This result will always be ignored. Typically `U` is `Unit`,
     *              but this is not necessary.
     *
     *  @usecase def foreach(f: A => Unit): Unit
     */
    def foreach[U](f: A => U): Unit

    /** Tests whether this $coll is empty.
     *
     *  @return    `true` if the $coll contain no elements, `false` otherwise.
     */
    def isEmpty: Boolean = {
      var result = true
      breakable {
        for (x <- this) {
          result = false
          break
        }
      }
      result
    }

    /** Tests whether this $coll is known to have a finite size.
     *  All strict collections are known to have finite size. For a non-strict collection
     *  such as `Stream`, the predicate returns `true` if all elements have been computed.
     *  It returns `false` if the stream is not yet evaluated to the end.
     *
     *  Note: many collection methods will not work on collections of infinite sizes. 
     *
     *  @return  `true` if this collection is known to have finite size, `false` otherwise.
     */
    def hasDefiniteSize = true

    def ++[B >: A, That](that: GenTraversableOnce[B])(implicit bf: CanBuildFrom[Repr, B, That]): That = {
      val b = bf(repr)
      if (that.isInstanceOf[IndexedSeqLike[_, _]]) b.sizeHint(this, that.seq.size)
      b ++= thisCollection
      b ++= that.seq
      b.result
    }

    @bridge
    def ++[B >: A, That](that: TraversableOnce[B])(implicit bf: CanBuildFrom[Repr, B, That]): That =
      ++(that: GenTraversableOnce[B])(bf)

    /** Concatenates this $coll with the elements of a traversable collection.
     *  It differs from ++ in that the right operand determines the type of the
     *  resulting collection rather than the left one.
     * 
     *  @param that   the traversable to append.
     *  @tparam B     the element type of the returned collection. 
     *  @tparam That  $thatinfo
     *  @param bf     $bfinfo
     *  @return       a new collection of type `That` which contains all elements
     *                of this $coll followed by all elements of `that`.
     * 
     *  @usecase def ++:[B](that: TraversableOnce[B]): $Coll[B]
     *  
     *  @return       a new $coll which contains all elements of this $coll
     *                followed by all elements of `that`.
     */
    def ++:[B >: A, That](that: TraversableOnce[B])(implicit bf: CanBuildFrom[Repr, B, That]): That = {
      val b = bf(repr)
      if (that.isInstanceOf[IndexedSeqLike[_, _]]) b.sizeHint(this, that.size)
      b ++= that
      b ++= thisCollection
      b.result
    }

    /** This overload exists because: for the implementation of ++: we should reuse
     *  that of ++ because many collections override it with more efficient versions.
     *  Since TraversableOnce has no '++' method, we have to implement that directly,
     *  but Traversable and down can use the overload.
     */
    def ++:[B >: A, That](that: Traversable[B])(implicit bf: CanBuildFrom[Repr, B, That]): That =
      (that ++ seq)(breakOut)

    def map[B, That](f: A => B)(implicit bf: CanBuildFrom[Repr, B, That]): That = {
      val b = bf(repr)
      b.sizeHint(this) 
      for (x <- this) b += f(x)
      b.result
    }

    def flatMap[B, That](f: A => GenTraversableOnce[B])(implicit bf: CanBuildFrom[Repr, B, That]): That = {
      val b = bf(repr)
      for (x <- this) b ++= f(x).seq
      b.result
    }

    /** Selects all elements of this $coll which satisfy a predicate.
     *
     *  @param p     the predicate used to test elements.
     *  @return      a new $coll consisting of all elements of this $coll that satisfy the given
     *               predicate `p`. The order of the elements is preserved.
     */
    def filter(p: A => Boolean): Repr = {
      val b = newBuilder
      for (x <- this) 
        if (p(x)) b += x
      b.result
    }

    /** Selects all elements of this $coll which do not satisfy a predicate.
     *
     *  @param p     the predicate used to test elements.
     *  @return      a new $coll consisting of all elements of this $coll that do not satisfy the given
     *               predicate `p`. The order of the elements is preserved.
     */
    def filterNot(p: A => Boolean): Repr = filter(!p(_))

    def collect[B, That](pf: PartialFunction[A, B])(implicit bf: CanBuildFrom[Repr, B, That]): That = {
      val b = bf(repr)
      for (x <- this) if (pf.isDefinedAt(x)) b += pf(x)
      b.result
    }

    /** Builds a new collection by applying an option-valued function to all
     *  elements of this $coll on which the function is defined.
     *
     *  @param f      the option-valued function which filters and maps the $coll.
     *  @tparam B     the element type of the returned collection.
     *  @tparam That  $thatinfo
     *  @param bf     $bfinfo
     *  @return       a new collection of type `That` resulting from applying the option-valued function
     *                `f` to each element and collecting all defined results.
     *                The order of the elements is preserved.
     *
     *  @usecase def filterMap[B](f: A => Option[B]): $Coll[B]
     *  
     *  @param pf     the partial function which filters and maps the $coll.
     *  @return       a new $coll resulting from applying the given option-valued function
     *                `f` to each element and collecting all defined results.
     *                The order of the elements is preserved.
    def filterMap[B, That](f: A => Option[B])(implicit bf: CanBuildFrom[Repr, B, That]): That = {
      val b = bf(repr)
      for (x <- this) 
        f(x) match {
          case Some(y) => b += y
          case _ =>
        }
      b.result
    }
     */

    /** Partitions this $coll in two ${coll}s according to a predicate.
     *
     *  @param p the predicate on which to partition.
     *  @return  a pair of ${coll}s: the first $coll consists of all elements that 
     *           satisfy the predicate `p` and the second $coll consists of all elements
     *           that don't. The relative order of the elements in the resulting ${coll}s
     *           is the same as in the original $coll.
     */
    def partition(p: A => Boolean): (Repr, Repr) = {
      val l, r = newBuilder
      for (x <- this) (if (p(x)) l else r) += x
      (l.result, r.result)
    }

    def groupBy[K](f: A => K): immutable.Map[K, Repr] = {
      val m = mutable.Map.empty[K, Builder[A, Repr]]
      for (elem <- this) {
        val key = f(elem)
        val bldr = m.getOrElseUpdate(key, newBuilder)
        bldr += elem
      }
      val b = immutable.Map.newBuilder[K, Repr]
      for ((k, v) <- m)
        b += ((k, v.result))

      b.result
    }

    /** Tests whether a predicate holds for all elements of this $coll.
     *
     *  $mayNotTerminateInf
     *
     *  @param   p     the predicate used to test elements.
     *  @return        `true` if the given predicate `p` holds for all elements
     *                 of this $coll, otherwise `false`.
     */
    def forall(p: A => Boolean): Boolean = {
      var result = true
      breakable {
        for (x <- this)
          if (!p(x)) { result = false; break }
      }
      result
    }

    /** Tests whether a predicate holds for some of the elements of this $coll.
     *
     *  $mayNotTerminateInf
     *
     *  @param   p     the predicate used to test elements.
     *  @return        `true` if the given predicate `p` holds for some of the
     *                 elements of this $coll, otherwise `false`.
     */
    def exists(p: A => Boolean): Boolean = {
      var result = false
      breakable {
        for (x <- this)
          if (p(x)) { result = true; break }
      }
      result
    }

    /** Finds the first element of the $coll satisfying a predicate, if any.
     * 
     *  $mayNotTerminateInf
     *  $orderDependent
     *
     *  @param p    the predicate used to test elements.
     *  @return     an option value containing the first element in the $coll
     *              that satisfies `p`, or `None` if none exists.
     */
    def find(p: A => Boolean): Option[A] = {
      var result: Option[A] = None
      breakable {
        for (x <- this)
          if (p(x)) { result = Some(x); break }
      }
      result
    }

    def scan[B >: A, That](z: B)(op: (B, B) => B)(implicit cbf: CanBuildFrom[Repr, B, That]): That = scanLeft(z)(op)

    def scanLeft[B, That](z: B)(op: (B, A) => B)(implicit bf: CanBuildFrom[Repr, B, That]): That = {
      val b = bf(repr)
      b.sizeHint(this, 1)
      var acc = z
      b += acc
      for (x <- this) { acc = op(acc, x); b += acc }
      b.result
    }

    @migration(2, 9,
      "This scanRight definition has changed in 2.9.\n" +
      "The previous behavior can be reproduced with scanRight.reverse."
    )
    def scanRight[B, That](z: B)(op: (A, B) => B)(implicit bf: CanBuildFrom[Repr, B, That]): That = {
      var scanned = List(z)
      var acc = z
      for (x <- reversed) {
        acc = op(x, acc)
        scanned ::= acc
      }
      val b = bf(repr)
      for (elem <- scanned) b += elem
      b.result
    }

    /** Selects the first element of this $coll.
     *  $orderDependent
     *  @return  the first element of this $coll.
     *  @throws `NoSuchElementException` if the $coll is empty.
     */
    def head: A = {
      var result: () => A = () => throw new NoSuchElementException
      breakable {
        for (x <- this) {
          result = () => x
          break
        }
      }
      result()
    }

    /** Optionally selects the first element.
     *  $orderDependent
     *  @return  the first element of this $coll if it is nonempty, `None` if it is empty.
     */
    def headOption: Option[A] = if (isEmpty) None else Some(head)

    /** Selects all elements except the first.
     *  $orderDependent
     *  @return  a $coll consisting of all elements of this $coll
     *           except the first one.
     *  @throws `UnsupportedOperationException` if the $coll is empty.
     */ 
    override def tail: Repr = {
      if (isEmpty) throw new UnsupportedOperationException("empty.tail")
      drop(1)
    }

    /** Selects the last element.
      * $orderDependent
      * @return The last element of this $coll.
      * @throws NoSuchElementException If the $coll is empty.
      */
    def last: A = {
      var lst = head
      for (x <- this)
        lst = x
      lst
    }

    /** Optionally selects the last element.
     *  $orderDependent
     *  @return  the last element of this $coll$ if it is nonempty, `None` if it is empty.
     */
    def lastOption: Option[A] = if (isEmpty) None else Some(last)

    /** Selects all elements except the last.
     *  $orderDependent
     *  @return  a $coll consisting of all elements of this $coll
     *           except the last one.
     *  @throws `UnsupportedOperationException` if the $coll is empty.
     */
    def init: Repr = {
      if (isEmpty) throw new UnsupportedOperationException("empty.init")
      var lst = head
      var follow = false
      val b = newBuilder
      b.sizeHint(this, -1)
      for (x <- this.seq) {
        if (follow) b += lst
        else follow = true
        lst = x
      }
      b.result
    }

    def take(n: Int): Repr = slice(0, n)

    def drop(n: Int): Repr = 
      if (n <= 0) {
        val b = newBuilder
        b.sizeHint(this)
        b ++= thisCollection result
      }
      else sliceWithKnownDelta(n, Int.MaxValue, -n)

    def slice(from: Int, until: Int): Repr = sliceWithKnownBound(math.max(from, 0), until)

    // Precondition: from >= 0, until > 0, builder already configured for building.
    private[this] def sliceInternal(from: Int, until: Int, b: Builder[A, Repr]): Repr = {
      var i = 0
      breakable {
        for (x <- this.seq) {
          if (i >= from) b += x
          i += 1
          if (i >= until) break
        }
      }
      b.result
    }
    // Precondition: from >= 0
    private[scala] def sliceWithKnownDelta(from: Int, until: Int, delta: Int): Repr = {
      val b = newBuilder
      if (until <= from) b.result
      else {
        b.sizeHint(this, delta)
        sliceInternal(from, until, b)
      }
    }
    // Precondition: from >= 0
    private[scala] def sliceWithKnownBound(from: Int, until: Int): Repr = {
      val b = newBuilder
      if (until <= from) b.result
      else {
        b.sizeHintBounded(until - from, this)      
        sliceInternal(from, until, b)
      }
    }

    def takeWhile(p: A => Boolean): Repr = {
      val b = newBuilder
      breakable {
        for (x <- this) {
          if (!p(x)) break
          b += x
        }
      }
      b.result
    }

    def dropWhile(p: A => Boolean): Repr = {
      val b = newBuilder
      var go = false
      for (x <- this) {
        if (!p(x)) go = true
        if (go) b += x
      }
      b.result
    }

    def span(p: A => Boolean): (Repr, Repr) = {
      val l, r = newBuilder
      var toLeft = true
      for (x <- this) {
        toLeft = toLeft && p(x)
        (if (toLeft) l else r) += x
      }
      (l.result, r.result)
    }

    def splitAt(n: Int): (Repr, Repr) = {
      val l, r = newBuilder
      l.sizeHintBounded(n, this)
      if (n >= 0) r.sizeHint(this, -n)
      var i = 0
      for (x <- this) {
        (if (i < n) l else r) += x
        i += 1
      }
      (l.result, r.result)
    }

    /** Iterates over the tails of this $coll. The first value will be this
     *  $coll and the final one will be an empty $coll, with the intervening
     *  values the results of successive applications of `tail`.
     *
     *  @return   an iterator over all the tails of this $coll
     *  @example  `List(1,2,3).tails = Iterator(List(1,2,3), List(2,3), List(3), Nil)`
     */  
    def tails: Iterator[Repr] = iterateUntilEmpty(_.tail)

    /** Iterates over the inits of this $coll. The first value will be this
     *  $coll and the final one will be an empty $coll, with the intervening
     *  values the results of successive applications of `init`.
     *
     *  @return  an iterator over all the inits of this $coll
     *  @example  `List(1,2,3).inits = Iterator(List(1,2,3), List(1,2), List(1), Nil)`
     */
    def inits: Iterator[Repr] = iterateUntilEmpty(_.init)

    /** Copies elements of this $coll to an array.
     *  Fills the given array `xs` with at most `len` elements of
     *  this $coll, starting at position `start`.
     *  Copying will stop once either the end of the current $coll is reached,
     *  or the end of the array is reached, or `len` elements have been copied.
     *
     *  $willNotTerminateInf
     * 
     *  @param  xs     the array to fill.
     *  @param  start  the starting index.
     *  @param  len    the maximal number of elements to copy.
     *  @tparam B      the type of the elements of the array. 
     * 
     *
     *  @usecase def copyToArray(xs: Array[A], start: Int, len: Int): Unit
     */
    def copyToArray[B >: A](xs: Array[B], start: Int, len: Int) {
      var i = start
      val end = (start + len) min xs.length
      breakable {
        for (x <- this) {
          if (i >= end) break
          xs(i) = x
          i += 1
        }
      }
    }

    def toTraversable: Traversable[A] = thisCollection
    def toIterator: Iterator[A] = toStream.iterator
    def toStream: Stream[A] = toBuffer.toStream

    /** Converts this $coll to a string.
     *
     *  @return   a string representation of this collection. By default this
     *            string consists of the `stringPrefix` of this $coll,
     *            followed by all elements separated by commas and enclosed in parentheses.
     */
    override def toString = mkString(stringPrefix + "(", ", ", ")")

    /** Defines the prefix of this object's `toString` representation.
     *
     *  @return  a string representation which starts the result of `toString`
     *           applied to this $coll. By default the string prefix is the
     *           simple name of the collection class $coll.
     */
    def stringPrefix : String = {
      var string = repr.asInstanceOf[AnyRef].getClass.getName
      val idx1 = string.lastIndexOf('.' : Int)
      if (idx1 != -1) string = string.substring(idx1 + 1)
      val idx2 = string.indexOf('$')
      if (idx2 != -1) string = string.substring(0, idx2)
      string
    }

    /** Creates a non-strict view of this $coll.
     * 
     *  @return a non-strict view of this $coll.
     */
    def view = new TraversableView[A, Repr] {
      protected lazy val underlying = self.repr
      override def foreach[U](f: A => U) = self foreach f
    }

    /** Creates a non-strict view of a slice of this $coll.
     *
     *  Note: the difference between `view` and `slice` is that `view` produces
     *        a view of the current $coll, whereas `slice` produces a new $coll.
     * 
     *  Note: `view(from, to)` is equivalent to `view.slice(from, to)`
     *  $orderDependent
     * 
     *  @param from   the index of the first element of the view
     *  @param until  the index of the element following the view
     *  @return a non-strict view of a slice of this $coll, starting at index `from`
     *  and extending up to (but not including) index `until`.
     */
    def view(from: Int, until: Int): TraversableView[A, Repr] = view.slice(from, until)

    /** Creates a non-strict filter of this $coll.
     *
     *  Note: the difference between `c filter p` and `c withFilter p` is that
     *        the former creates a new collection, whereas the latter only
     *        restricts the domain of subsequent `map`, `flatMap`, `foreach`,
     *        and `withFilter` operations.
     *  $orderDependent
     * 
     *  @param p   the predicate used to test elements.
     *  @return    an object of class `WithFilter`, which supports
     *             `map`, `flatMap`, `foreach`, and `withFilter` operations.
     *             All these operations apply to those elements of this $coll which
     *             satisfy the predicate `p`.
     */
    def withFilter(p: A => Boolean): FilterMonadic[A, Repr] = new WithFilter(p)

    /** A class supporting filtered operations. Instances of this class are
     *  returned by method `withFilter`.
     */
    class WithFilter(p: A => Boolean) extends FilterMonadic[A, Repr] {

      /** Builds a new collection by applying a function to all elements of the
       *  outer $coll containing this `WithFilter` instance that satisfy predicate `p`.
       *
       *  @param f      the function to apply to each element.
       *  @tparam B     the element type of the returned collection.
       *  @tparam That  $thatinfo
       *  @param bf     $bfinfo
       *  @return       a new collection of type `That` resulting from applying
       *                the given function `f` to each element of the outer $coll
       *                that satisfies predicate `p` and collecting the results.
       *
       *  @usecase def map[B](f: A => B): $Coll[B] 
       *  
       *  @return       a new $coll resulting from applying the given function
       *                `f` to each element of the outer $coll that satisfies
       *                predicate `p` and collecting the results.
       */
      def map[B, That](f: A => B)(implicit bf: CanBuildFrom[Repr, B, That]): That = {
        val b = bf(repr)
        for (x <- self) 
          if (p(x)) b += f(x)
        b.result
      }

      /** Builds a new collection by applying a function to all elements of the
       *  outer $coll containing this `WithFilter` instance that satisfy
       *  predicate `p` and concatenating the results. 
       *
       *  @param f      the function to apply to each element.
       *  @tparam B     the element type of the returned collection.
       *  @tparam That  $thatinfo
       *  @param bf     $bfinfo
       *  @return       a new collection of type `That` resulting from applying
       *                the given collection-valued function `f` to each element
       *                of the outer $coll that satisfies predicate `p` and
       *                concatenating the results.
       *
       *  @usecase def flatMap[B](f: A => TraversableOnce[B]): $Coll[B]
       * 
       *  @return       a new $coll resulting from applying the given collection-valued function
       *                `f` to each element of the outer $coll that satisfies predicate `p` and concatenating the results.
       */
      def flatMap[B, That](f: A => GenTraversableOnce[B])(implicit bf: CanBuildFrom[Repr, B, That]): That = {
        val b = bf(repr)
        for (x <- self) 
          if (p(x)) b ++= f(x).seq
        b.result
      }

      /** Applies a function `f` to all elements of the outer $coll containing
       *  this `WithFilter` instance that satisfy predicate `p`.
       *
       *  @param  f   the function that is applied for its side-effect to every element.
       *              The result of function `f` is discarded.
       *              
       *  @tparam  U  the type parameter describing the result of function `f`. 
       *              This result will always be ignored. Typically `U` is `Unit`,
       *              but this is not necessary.
       *
       *  @usecase def foreach(f: A => Unit): Unit
       */   
      def foreach[U](f: A => U): Unit = 
        for (x <- self) 
          if (p(x)) f(x)

      /** Further refines the filter for this $coll.
       *
       *  @param q   the predicate used to test elements.
       *  @return    an object of class `WithFilter`, which supports
       *             `map`, `flatMap`, `foreach`, and `withFilter` operations.
       *             All these operations apply to those elements of this $coll which
       *             satisfy the predicate `q` in addition to the predicate `p`.
       */
      def withFilter(q: A => Boolean): WithFilter = 
        new WithFilter(x => p(x) && q(x))
    }

    // A helper for tails and inits.
    private def iterateUntilEmpty(f: Traversable[A @uV] => Traversable[A @uV]): Iterator[Repr] = {
      val it = Iterator.iterate(thisCollection)(f) takeWhile (x => !x.isEmpty)
      it ++ Iterator(Nil) map (newBuilder ++= _ result)
    }
  }


 </textarea>
 </form>

    <script>
      var editor = CodeMirror.fromTextArea(document.getElementById("code"), {
        lineNumbers: true,
        matchBrackets: true,
        theme: "ambiance",
        mode: "text/x-scala"
      });
    </script>
  </article>
--- a/src/admin/js/mode/css/gss.html
+++ b/src/admin/js/mode/css/gss.html
@@ -1,103 +0,0 @@
 <!DOCTYPE html>

 <title>CodeMirror: Closure Stylesheets (GSS) mode</title>
 <meta charset="utf-8"/>
 <link rel=stylesheet href="../../doc/docs.css">

 <link rel="stylesheet" href="../../lib/codemirror.css">
 <link rel="stylesheet" href="../../addon/hint/show-hint.css">
 <script src="../../lib/codemirror.js"></script>
 <script src="css.js"></script>
 <script src="../../addon/hint/show-hint.js"></script>
 <script src="../../addon/hint/css-hint.js"></script>
 <style>.CodeMirror {background: #f8f8f8;}</style>
 <div id=nav>
  <a href="http://codemirror.net"><h1>CodeMirror</h1><img id=logo src="../../doc/logo.png"></a>

  <ul>
    <li><a href="../../index.html">Home</a>
    <li><a href="../../doc/manual.html">Manual</a>
    <li><a href="https://github.com/codemirror/codemirror">Code</a>
  </ul>
  <ul>
    <li><a href="../index.html">Language modes</a>
    <li><a class=active href="javascript:;">Closure Stylesheets (GSS)</a>
  </ul>
 </div>

 <article>
 <h2>Closure Stylesheets (GSS) mode</h2>
 <form><textarea id="code" name="code">
 /* Some example Closure Stylesheets */

@provide 'some.styles';

@require 'other.styles';

@component {

@def FONT_FAMILY           "Times New Roman", Georgia, Serif;
@def FONT_SIZE_NORMAL      15px;
@def FONT_NORMAL           normal FONT_SIZE_NORMAL FONT_FAMILY;

@def BG_COLOR              rgb(235, 239, 249);

@def DIALOG_BORDER_COLOR   rgb(107, 144, 218);
@def DIALOG_BG_COLOR       BG_COLOR;

@def LEFT_HAND_NAV_WIDTH    180px;
@def LEFT_HAND_NAV_PADDING  3px;

@defmixin size(WIDTH, HEIGHT) {
  width: WIDTH;
  height: HEIGHT;
 }

 body {
  background-color: BG_COLOR;
  margin: 0;
  padding: 3em 6em;
  font: FONT_NORMAL;
  color: #000;
 }

 #navigation a {
  font-weight: bold;
  text-decoration: none !important;
 }

 .dialog {
  background-color: DIALOG_BG_COLOR;
  border: 1px solid DIALOG_BORDER_COLOR;
 }

 .content {
  position: absolute;
  margin-left: add(LEFT_HAND_NAV_PADDING,  /* padding left */
                   LEFT_HAND_NAV_WIDTH,
                   LEFT_HAND_NAV_PADDING); /* padding right */

 }

 .logo {
  @mixin size(150px, 55px);
  background-image: url('http://www.google.com/images/logo_sm.gif');
 }

 }
 </textarea></form>
    <script>
      var editor = CodeMirror.fromTextArea(document.getElementById("code"), {
        extraKeys: {"Ctrl-Space": "autocomplete"},
        lineNumbers: true,
        matchBrackets: "text/x-less",
        mode: "text/x-gss"
      });
    </script>

    <p>A mode for <a href="https://github.com/google/closure-stylesheets">Closure Stylesheets</a> (GSS).</p>
    <p><strong>MIME type defined:</strong> <code>text/x-gss</code>.</p>

    <p><strong>Parsing/Highlighting Tests:</strong> <a href="../../test/index.html#gss_*">normal</a>,  <a href="../../test/index.html#verbose,gss_*">verbose</a>.</p>

  </article>
--- a/src/admin/js/mode/css/index.html
+++ b/src/admin/js/mode/css/index.html
@@ -1,75 +0,0 @@
 <!DOCTYPE html>

 <title>CodeMirror: CSS mode</title>
 <meta charset="utf-8"/>
 <link rel=stylesheet href="../../doc/docs.css">

 <link rel="stylesheet" href="../../lib/codemirror.css">
 <link rel="stylesheet" href="../../addon/hint/show-hint.css">
 <script src="../../lib/codemirror.js"></script>
 <script src="css.js"></script>
 <script src="../../addon/hint/show-hint.js"></script>
 <script src="../../addon/hint/css-hint.js"></script>
 <style>.CodeMirror {background: #f8f8f8;}</style>
 <div id=nav>
  <a href="http://codemirror.net"><h1>CodeMirror</h1><img id=logo src="../../doc/logo.png"></a>

  <ul>
    <li><a href="../../index.html">Home</a>
    <li><a href="../../doc/manual.html">Manual</a>
    <li><a href="https://github.com/codemirror/codemirror">Code</a>
  </ul>
  <ul>
    <li><a href="../index.html">Language modes</a>
    <li><a class=active href="javascript:;">CSS</a>
  </ul>
 </div>

 <article>
 <h2>CSS mode</h2>
 <form><textarea id="code" name="code">
 /* Some example CSS */

@import url("something.css");

 body {
  margin: 0;
  padding: 3em 6em;
  font-family: tahoma, arial, sans-serif;
  color: #000;
 }

 #navigation a {
  font-weight: bold;
  text-decoration: none !important;
 }

 h1 {
  font-size: 2.5em;
 }

 h2 {
  font-size: 1.7em;
 }

 h1:before, h2:before {
  content: "::";
 }

 code {
  font-family: courier, monospace;
  font-size: 80%;
  color: #418A8A;
 }
 </textarea></form>
    <script>
      var editor = CodeMirror.fromTextArea(document.getElementById("code"), {
        extraKeys: {"Ctrl-Space": "autocomplete"}
      });
    </script>

    <p><strong>MIME types defined:</strong> <code>text/css</code>, <code>text/x-scss</code> (<a href="scss.html">demo</a>), <code>text/x-less</code> (<a href="less.html">demo</a>).</p>

    <p><strong>Parsing/Highlighting Tests:</strong> <a href="../../test/index.html#css_*">normal</a>,  <a href="../../test/index.html#verbose,css_*">verbose</a>.</p>

  </article>
--- a/src/admin/js/mode/css/less.html
+++ b/src/admin/js/mode/css/less.html
@@ -1,152 +0,0 @@
 <!DOCTYPE html>

 <title>CodeMirror: LESS mode</title>
 <meta charset="utf-8"/>
 <link rel=stylesheet href="../../doc/docs.css">

 <link rel="stylesheet" href="../../lib/codemirror.css">
 <script src="../../lib/codemirror.js"></script>
 <script src="../../addon/edit/matchbrackets.js"></script>
 <script src="css.js"></script>
 <style>.CodeMirror {border: 1px solid #ddd; line-height: 1.2;}</style>
 <div id=nav>
  <a href="http://codemirror.net"><h1>CodeMirror</h1><img id=logo src="../../doc/logo.png"></a>

  <ul>
    <li><a href="../../index.html">Home</a>
    <li><a href="../../doc/manual.html">Manual</a>
    <li><a href="https://github.com/codemirror/codemirror">Code</a>
  </ul>
  <ul>
    <li><a href="../index.html">Language modes</a>
    <li><a class=active href="javascript:;">LESS</a>
  </ul>
 </div>

 <article>
 <h2>LESS mode</h2>
 <form><textarea id="code" name="code">@media screen and (device-aspect-ratio: 16/9) { … }
@media screen and (device-aspect-ratio: 1280/720) { … }
@media screen and (device-aspect-ratio: 2560/1440) { … }

 html:lang(fr-be)

 tr:nth-child(2n+1) /* represents every odd row of an HTML table */

 img:nth-of-type(2n+1) { float: right; }
 img:nth-of-type(2n) { float: left; }

 body > h2:not(:first-of-type):not(:last-of-type)

 html|*:not(:link):not(:visited)
 *|*:not(:hover)
 p::first-line { text-transform: uppercase }

@namespace foo url(http://www.example.com);
 foo|h1 { color: blue }  /* first rule */

 span[hello="Ocean"][goodbye="Land"]

 E[foo]{
  padding:65px;
 }

 input[type="search"]::-webkit-search-decoration,
 input[type="search"]::-webkit-search-cancel-button {
  -webkit-appearance: none; // Inner-padding issues in Chrome OSX, Safari 5
 }
 button::-moz-focus-inner,
 input::-moz-focus-inner { // Inner padding and border oddities in FF3/4
  padding: 0;
  border: 0;
 }
 .btn {
  // reset here as of 2.0.3 due to Recess property order
  border-color: #ccc;
  border-color: rgba(0,0,0,.1) rgba(0,0,0,.1) rgba(0,0,0,.25);
 }
 fieldset span button, fieldset span input[type="file"] {
  font-size:12px;
 	font-family:Arial, Helvetica, sans-serif;
 }

 .rounded-corners (@radius: 5px) {
  border-radius: @radius;
  -webkit-border-radius: @radius;
  -moz-border-radius: @radius;
 }

@import url("something.css");

@light-blue:   hsl(190, 50%, 65%);

 #menu {
  position: absolute;
  width: 100%;
  z-index: 3;
  clear: both;
  display: block;
  background-color: @blue;
  height: 42px;
  border-top: 2px solid lighten(@alpha-blue, 20%);
  border-bottom: 2px solid darken(@alpha-blue, 25%);
  .box-shadow(0, 1px, 8px, 0.6);
  -moz-box-shadow: 0 0 0 #000; // Because firefox sucks.

  &.docked {
    background-color: hsla(210, 60%, 40%, 0.4);
  }
  &:hover {
    background-color: @blue;
  }

  #dropdown {
    margin: 0 0 0 117px;
    padding: 0;
    padding-top: 5px;
    display: none;
    width: 190px;
    border-top: 2px solid @medium;
    color: @highlight;
    border: 2px solid darken(@medium, 25%);
    border-left-color: darken(@medium, 15%);
    border-right-color: darken(@medium, 15%);
    border-top-width: 0;
    background-color: darken(@medium, 10%);
    ul {
      padding: 0px;  
    }
    li {
      font-size: 14px;
      display: block;
      text-align: left;
      padding: 0;
      border: 0;
      a {
        display: block;
        padding: 0px 15px;  
        text-decoration: none;
        color: white;  
        &:hover {
          background-color: darken(@medium, 15%);
          text-decoration: none;
        }
      }
    }
    .border-radius(5px, bottom);
    .box-shadow(0, 6px, 8px, 0.5);
  }
 }
 </textarea></form>
    <script>
      var editor = CodeMirror.fromTextArea(document.getElementById("code"), {
        lineNumbers : true,
        matchBrackets : true,
        mode: "text/x-less"
      });
    </script>

    <p>The LESS mode is a sub-mode of the <a href="index.html">CSS mode</a> (defined in <code>css.js</code>).</p>

    <p><strong>Parsing/Highlighting Tests:</strong> <a href="../../test/index.html#less_*">normal</a>,  <a href="../../test/index.html#verbose,less_*">verbose</a>.</p>
  </article>
--- a/src/admin/js/mode/css/scss.html
+++ b/src/admin/js/mode/css/scss.html
@@ -1,157 +0,0 @@
 <!DOCTYPE html>

 <title>CodeMirror: SCSS mode</title>
 <meta charset="utf-8"/>
 <link rel=stylesheet href="../../doc/docs.css">

 <link rel="stylesheet" href="../../lib/codemirror.css">
 <script src="../../lib/codemirror.js"></script>
 <script src="css.js"></script>
 <style>.CodeMirror {background: #f8f8f8;}</style>
 <div id=nav>
  <a href="http://codemirror.net"><h1>CodeMirror</h1><img id=logo src="../../doc/logo.png"></a>

  <ul>
    <li><a href="../../index.html">Home</a>
    <li><a href="../../doc/manual.html">Manual</a>
    <li><a href="https://github.com/codemirror/codemirror">Code</a>
  </ul>
  <ul>
    <li><a href="../index.html">Language modes</a>
    <li><a class=active href="javascript:;">SCSS</a>
  </ul>
 </div>

 <article>
 <h2>SCSS mode</h2>
 <form><textarea id="code" name="code">
 /* Some example SCSS */

@import "compass/css3";
 $variable: #333;

 $blue: #3bbfce;
 $margin: 16px;

 .content-navigation {
  #nested {
    background-color: black;
  }
  border-color: $blue;
  color:
    darken($blue, 9%);
 }

 .border {
  padding: $margin / 2;
  margin: $margin / 2;
  border-color: $blue;
 }

@mixin table-base {
  th {
    text-align: center;
    font-weight: bold;
  }
  td, th {padding: 2px}
 }

 table.hl {
  margin: 2em 0;
  td.ln {
    text-align: right;
  }
 }

 li {
  font: {
    family: serif;
    weight: bold;
    size: 1.2em;
  }
 }

@mixin left($dist) {
  float: left;
  margin-left: $dist;
 }

 #data {
  @include left(10px);
  @include table-base;
 }

 .source {
  @include flow-into(target);
  border: 10px solid green;
  margin: 20px;
  width: 200px; }

 .new-container {
  @include flow-from(target);
  border: 10px solid red;
  margin: 20px;
  width: 200px; }

 body {
  margin: 0;
  padding: 3em 6em;
  font-family: tahoma, arial, sans-serif;
  color: #000;
 }

@mixin yellow() {
  background: yellow;
 }

 .big {
  font-size: 14px;
 }

 .nested {
  @include border-radius(3px);
  @extend .big;
  p {
    background: whitesmoke;
    a {
      color: red;
    }
  }
 }

 #navigation a {
  font-weight: bold;
  text-decoration: none !important;
 }

 h1 {
  font-size: 2.5em;
 }

 h2 {
  font-size: 1.7em;
 }

 h1:before, h2:before {
  content: "::";
 }

 code {
  font-family: courier, monospace;
  font-size: 80%;
  color: #418A8A;
 }
 </textarea></form>
    <script>
      var editor = CodeMirror.fromTextArea(document.getElementById("code"), {
        lineNumbers: true,
        matchBrackets: true,
        mode: "text/x-scss"
      });
    </script>

    <p>The SCSS mode is a sub-mode of the <a href="index.html">CSS mode</a> (defined in <code>css.js</code>).</p>

    <p><strong>Parsing/Highlighting Tests:</strong> <a href="../../test/index.html#scss_*">normal</a>,  <a href="../../test/index.html#verbose,scss_*">verbose</a>.</p>

  </article>
--- a/src/admin/js/mode/htmlmixed/index.html
+++ b/src/admin/js/mode/htmlmixed/index.html
@@ -1,100 +0,0 @@
 <!DOCTYPE html>

 <title>CodeMirror: HTML mixed mode</title>
 <meta charset="utf-8"/>
 <link rel=stylesheet href="../../doc/docs.css">

 <link rel="stylesheet" href="../../lib/codemirror.css">
 <script src="../../lib/codemirror.js"></script>
 <script src="../../addon/selection/selection-pointer.js"></script>
 <script src="../xml/xml.js"></script>
 <script src="../javascript/javascript.js"></script>
 <script src="../css/css.js"></script>
 <script src="../vbscript/vbscript.js"></script>
 <script src="htmlmixed.js"></script>
 <style>.CodeMirror {border-top: 1px solid black; border-bottom: 1px solid black;}</style>
 <div id=nav>
  <a href="http://codemirror.net"><h1>CodeMirror</h1><img id=logo src="../../doc/logo.png"></a>

  <ul>
    <li><a href="../../index.html">Home</a>
    <li><a href="../../doc/manual.html">Manual</a>
    <li><a href="https://github.com/codemirror/codemirror">Code</a>
  </ul>
  <ul>
    <li><a href="../index.html">Language modes</a>
    <li><a class=active href="javascript:;">HTML mixed</a>
  </ul>
 </div>

 <article>
 <h2>HTML mixed mode</h2>
 <form><textarea id="code" name="code">
 <html style="color: green">
  <!-- this is a comment -->
  <head>
    <title>Mixed HTML Example</title>
    <style type="text/css">
      h1 {font-family: comic sans; color: #f0f;}
      div {background: yellow !important;}
      body {
        max-width: 50em;
        margin: 1em 2em 1em 5em;
      }
    </style>
  </head>
  <body>
    <h1>Mixed HTML Example</h1>
    <script>
      function jsFunc(arg1, arg2) {
        if (arg1 && arg2) document.body.innerHTML = "achoo";
      }
    </script>
  </body>
 </html>
 </textarea></form>
    <script>
      // Define an extended mixed-mode that understands vbscript and
      // leaves mustache/handlebars embedded templates in html mode
      var mixedMode = {
        name: "htmlmixed",
        scriptTypes: [{matches: /\/x-handlebars-template|\/x-mustache/i,
                       mode: null},
                      {matches: /(text|application)\/(x-)?vb(a|script)/i,
                       mode: "vbscript"}]
      };
      var editor = CodeMirror.fromTextArea(document.getElementById("code"), {
        mode: mixedMode,
        selectionPointer: true
      });
    </script>

    <p>The HTML mixed mode depends on the XML, JavaScript, and CSS modes.</p>

    <p>It takes an optional mode configuration
    option, <code>tags</code>, which can be used to add custom
    behavior for specific tags. When given, it should be an object
    mapping tag names (for example <code>script</code>) to arrays or
    three-element arrays. Those inner arrays indicate [attributeName,
    valueRegexp, <a href="../../doc/manual.html#option_mode">modeSpec</a>]
    specifications. For example, you could use <code>["type", /^foo$/,
    "foo"]</code> to map the attribute <code>type="foo"</code> to
    the <code>foo</code> mode. When the first two fields are null
    (<code>[null, null, "mode"]</code>), the given mode is used for
    any such tag that doesn't match any of the previously given
    attributes. For example:</p>

    <pre>var myModeSpec = {
  name: "htmlmixed",
  tags: {
    style: [["type", /^text/(x-)?scss$/, "text/x-scss"],
            [null, null, "css"]],
    custom: [[null, null, "customMode"]]
  }
 }</pre>

    <p><strong>MIME types defined:</strong> <code>text/html</code>
    (redefined, only takes effect if you load this parser after the
    XML parser).</p>

  </article>
--- a/src/admin/js/mode/javascript/index.html
+++ b/src/admin/js/mode/javascript/index.html
@@ -1,114 +0,0 @@
 <!DOCTYPE html>

 <title>CodeMirror: JavaScript mode</title>
 <meta charset="utf-8"/>
 <link rel=stylesheet href="../../doc/docs.css">

 <link rel="stylesheet" href="../../lib/codemirror.css">
 <script src="../../lib/codemirror.js"></script>
 <script src="../../addon/edit/matchbrackets.js"></script>
 <script src="../../addon/comment/continuecomment.js"></script>
 <script src="../../addon/comment/comment.js"></script>
 <script src="javascript.js"></script>
 <style type="text/css">.CodeMirror {border-top: 1px solid black; border-bottom: 1px solid black;}</style>
 <div id=nav>
  <a href="http://codemirror.net"><h1>CodeMirror</h1><img id=logo src="../../doc/logo.png"></a>

  <ul>
    <li><a href="../../index.html">Home</a>
    <li><a href="../../doc/manual.html">Manual</a>
    <li><a href="https://github.com/codemirror/codemirror">Code</a>
  </ul>
  <ul>
    <li><a href="../index.html">Language modes</a>
    <li><a class=active href="javascript:;">JavaScript</a>
  </ul>
 </div>

 <article>
 <h2>JavaScript mode</h2>


 <div><textarea id="code" name="code">
 // Demo code (the actual new parser character stream implementation)

 function StringStream(string) {
  this.pos = 0;
  this.string = string;
 }

 StringStream.prototype = {
  done: function() {return this.pos >= this.string.length;},
  peek: function() {return this.string.charAt(this.pos);},
  next: function() {
    if (this.pos &lt; this.string.length)
      return this.string.charAt(this.pos++);
  },
  eat: function(match) {
    var ch = this.string.charAt(this.pos);
    if (typeof match == "string") var ok = ch == match;
    else var ok = ch &amp;&amp; match.test ? match.test(ch) : match(ch);
    if (ok) {this.pos++; return ch;}
  },
  eatWhile: function(match) {
    var start = this.pos;
    while (this.eat(match));
    if (this.pos > start) return this.string.slice(start, this.pos);
  },
  backUp: function(n) {this.pos -= n;},
  column: function() {return this.pos;},
  eatSpace: function() {
    var start = this.pos;
    while (/\s/.test(this.string.charAt(this.pos))) this.pos++;
    return this.pos - start;
  },
  match: function(pattern, consume, caseInsensitive) {
    if (typeof pattern == "string") {
      function cased(str) {return caseInsensitive ? str.toLowerCase() : str;}
      if (cased(this.string).indexOf(cased(pattern), this.pos) == this.pos) {
        if (consume !== false) this.pos += str.length;
        return true;
      }
    }
    else {
      var match = this.string.slice(this.pos).match(pattern);
      if (match &amp;&amp; consume !== false) this.pos += match[0].length;
      return match;
    }
  }
 };
 </textarea></div>

    <script>
      var editor = CodeMirror.fromTextArea(document.getElementById("code"), {
        lineNumbers: true,
        matchBrackets: true,
        continueComments: "Enter",
        extraKeys: {"Ctrl-Q": "toggleComment"}
      });
    </script>

    <p>
      JavaScript mode supports several configuration options:
      <ul>
        <li><code>json</code> which will set the mode to expect JSON
        data rather than a JavaScript program.</li>
        <li><code>jsonld</code> which will set the mode to expect
        <a href="http://json-ld.org">JSON-LD</a> linked data rather
        than a JavaScript program (<a href="json-ld.html">demo</a>).</li>
        <li><code>typescript</code> which will activate additional
        syntax highlighting and some other things for TypeScript code
        (<a href="typescript.html">demo</a>).</li>
        <li><code>statementIndent</code> which (given a number) will
        determine the amount of indentation to use for statements
        continued on a new line.</li>
        <li><code>wordCharacters</code>, a regexp that indicates which
        characters should be considered part of an identifier.
        Defaults to <code>/[\w$]/</code>, which does not handle
        non-ASCII identifiers. Can be set to something more elaborate
        to improve Unicode support.</li>
      </ul>
    </p>

    <p><strong>MIME types defined:</strong> <code>text/javascript</code>, <code>application/json</code>, <code>application/ld+json</code>, <code>text/typescript</code>, <code>application/typescript</code>.</p>
  </article>
--- a/src/admin/js/mode/javascript/json-ld.html
+++ b/src/admin/js/mode/javascript/json-ld.html
@@ -1,72 +0,0 @@
 <!DOCTYPE html>

 <title>CodeMirror: JSON-LD mode</title>
 <meta charset="utf-8"/>
 <link rel=stylesheet href="../../doc/docs.css">

 <link rel="stylesheet" href="../../lib/codemirror.css">
 <script src="../../lib/codemirror.js"></script>
 <script src="../../addon/edit/matchbrackets.js"></script>
 <script src="../../addon/comment/continuecomment.js"></script>
 <script src="../../addon/comment/comment.js"></script>
 <script src="javascript.js"></script>
 <style type="text/css">.CodeMirror {border-top: 1px solid black; border-bottom: 1px solid black;}</style>
 <div id="nav">
  <a href="http://codemirror.net"><h1>CodeMirror</h1><img id=logo src="../../doc/logo.png"/></a>

  <ul>
    <li><a href="../../index.html">Home</a>
    <li><a href="../../doc/manual.html">Manual</a>
    <li><a href="https://github.com/codemirror/codemirror">Code</a>
  </ul>
  <ul>
    <li><a href="../index.html">Language modes</a>
    <li><a class=active href="javascript:;">JSON-LD</a>
  </ul>
 </div>

 <article>
 <h2>JSON-LD mode</h2>


 <div><textarea id="code" name="code">
 {
  "@context": {
    "name": "http://schema.org/name",
    "description": "http://schema.org/description",
    "image": {
      "@id": "http://schema.org/image",
      "@type": "@id"
    },
    "geo": "http://schema.org/geo",
    "latitude": {
      "@id": "http://schema.org/latitude",
      "@type": "xsd:float"
    },
    "longitude": {
      "@id": "http://schema.org/longitude",
      "@type": "xsd:float"
    },
    "xsd": "http://www.w3.org/2001/XMLSchema#"
  },
  "name": "The Empire State Building",
  "description": "The Empire State Building is a 102-story landmark in New York City.",
  "image": "http://www.civil.usherbrooke.ca/cours/gci215a/empire-state-building.jpg",
  "geo": {
    "latitude": "40.75",
    "longitude": "73.98"
  }
 }
 </textarea></div>

    <script>
      var editor = CodeMirror.fromTextArea(document.getElementById("code"), {
        matchBrackets: true,
        autoCloseBrackets: true,
        mode: "application/ld+json",
        lineWrapping: true
      });
    </script>
    
    <p>This is a specialization of the <a href="index.html">JavaScript mode</a>.</p>
  </article>
--- a/src/admin/js/mode/javascript/typescript.html
+++ b/src/admin/js/mode/javascript/typescript.html
@@ -1,61 +0,0 @@
 <!DOCTYPE html>

 <title>CodeMirror: TypeScript mode</title>
 <meta charset="utf-8"/>
 <link rel=stylesheet href="../../doc/docs.css">

 <link rel="stylesheet" href="../../lib/codemirror.css">
 <script src="../../lib/codemirror.js"></script>
 <script src="javascript.js"></script>
 <style type="text/css">.CodeMirror {border-top: 1px solid black; border-bottom: 1px solid black;}</style>
 <div id=nav>
  <a href="http://codemirror.net"><h1>CodeMirror</h1><img id=logo src="../../doc/logo.png"></a>

  <ul>
    <li><a href="../../index.html">Home</a>
    <li><a href="../../doc/manual.html">Manual</a>
    <li><a href="https://github.com/codemirror/codemirror">Code</a>
  </ul>
  <ul>
    <li><a href="../index.html">Language modes</a>
    <li><a class=active href="javascript:;">TypeScript</a>
  </ul>
 </div>

 <article>
 <h2>TypeScript mode</h2>


 <div><textarea id="code" name="code">
 class Greeter {
  greeting: string;
  constructor (message: string) {
    this.greeting = message;
  }
  greet() {
    return "Hello, " + this.greeting;
  }
 }   

 var greeter = new Greeter("world");

 var button = document.createElement('button')
 button.innerText = "Say Hello"
 button.onclick = function() {
  alert(greeter.greet())
 }

 document.body.appendChild(button)

 </textarea></div>

    <script>
      var editor = CodeMirror.fromTextArea(document.getElementById("code"), {
        lineNumbers: true,
        matchBrackets: true,
        mode: "text/typescript"
      });
    </script>

    <p>This is a specialization of the <a href="index.html">JavaScript mode</a>.</p>
  </article>
--- a/src/admin/js/mode/php/index.html
+++ b/src/admin/js/mode/php/index.html
@@ -1,64 +0,0 @@
 <!DOCTYPE html>

 <title>CodeMirror: PHP mode</title>
 <meta charset="utf-8"/>
 <link rel=stylesheet href="../../doc/docs.css">

 <link rel="stylesheet" href="../../lib/codemirror.css">
 <script src="../../lib/codemirror.js"></script>
 <script src="../../addon/edit/matchbrackets.js"></script>
 <script src="../htmlmixed/htmlmixed.js"></script>
 <script src="../xml/xml.js"></script>
 <script src="../javascript/javascript.js"></script>
 <script src="../css/css.js"></script>
 <script src="../clike/clike.js"></script>
 <script src="php.js"></script>
 <style type="text/css">.CodeMirror {border-top: 1px solid black; border-bottom: 1px solid black;}</style>
 <div id=nav>
  <a href="http://codemirror.net"><h1>CodeMirror</h1><img id=logo src="../../doc/logo.png"></a>

  <ul>
    <li><a href="../../index.html">Home</a>
    <li><a href="../../doc/manual.html">Manual</a>
    <li><a href="https://github.com/codemirror/codemirror">Code</a>
  </ul>
  <ul>
    <li><a href="../index.html">Language modes</a>
    <li><a class=active href="javascript:;">PHP</a>
  </ul>
 </div>

 <article>
 <h2>PHP mode</h2>
 <form><textarea id="code" name="code">
 <?php
 $a = array('a' => 1, 'b' => 2, 3 => 'c');

 echo "$a[a] ${a[3] /* } comment */} {$a[b]} \$a[a]";

 function hello($who) {
 	return "Hello $who!";
 }
 ?>
 <p>The program says <?= hello("World") ?>.</p>
 <script>
 	alert("And here is some JS code"); // also colored
 </script>
 </textarea></form>

    <script>
      var editor = CodeMirror.fromTextArea(document.getElementById("code"), {
        lineNumbers: true,
        matchBrackets: true,
        mode: "application/x-httpd-php",
        indentUnit: 4,
        indentWithTabs: true
      });
    </script>

    <p>Simple HTML/PHP mode based on
    the <a href="../clike/">C-like</a> mode. Depends on XML,
    JavaScript, CSS, HTMLMixed, and C-like modes.</p>

    <p><strong>MIME types defined:</strong> <code>application/x-httpd-php</code> (HTML with PHP code), <code>text/x-php</code> (plain, non-wrapped PHP code).</p>
  </article>
--- a/src/admin/js/mode/sql/index.html
+++ b/src/admin/js/mode/sql/index.html
@@ -1,86 +0,0 @@
 <!DOCTYPE html>

 <title>CodeMirror: SQL Mode for CodeMirror</title>
 <meta charset="utf-8"/>
 <link rel=stylesheet href="../../doc/docs.css">

 <link rel="stylesheet" href="../../lib/codemirror.css" />
 <script src="../../lib/codemirror.js"></script>
 <script src="sql.js"></script>
 <link rel="stylesheet" href="../../addon/hint/show-hint.css" />
 <script src="../../addon/hint/show-hint.js"></script>
 <script src="../../addon/hint/sql-hint.js"></script>
 <style>
 .CodeMirror {
    border-top: 1px solid black;
    border-bottom: 1px solid black;
 }
        </style>
 <div id=nav>
  <a href="http://codemirror.net"><h1>CodeMirror</h1><img id=logo src="../../doc/logo.png"></a>

  <ul>
    <li><a href="../../index.html">Home</a>
    <li><a href="../../doc/manual.html">Manual</a>
    <li><a href="https://github.com/codemirror/codemirror">Code</a>
  </ul>
  <ul>
    <li><a href="../index.html">Language modes</a>
    <li><a class=active href="javascript:;">SQL Mode for CodeMirror</a>
  </ul>
 </div>

 <article>
 <h2>SQL Mode for CodeMirror</h2>
 <form>
            <textarea id="code" name="code">-- SQL Mode for CodeMirror
 SELECT SQL_NO_CACHE DISTINCT
 		@var1 AS `val1`, @'val2', @global.'sql_mode',
 		1.1 AS `float_val`, .14 AS `another_float`, 0.09e3 AS `int_with_esp`,
 		0xFA5 AS `hex`, x'fa5' AS `hex2`, 0b101 AS `bin`, b'101' AS `bin2`,
 		DATE '1994-01-01' AS `sql_date`, { T "1994-01-01" } AS `odbc_date`,
 		'my string', _utf8'your string', N'her string',
        TRUE, FALSE, UNKNOWN
 	FROM DUAL
 	-- space needed after '--'
 	# 1 line comment
 	/* multiline
 	comment! */
 	LIMIT 1 OFFSET 0;
 </textarea>
            </form>
            <p><strong>MIME types defined:</strong> 
            <code><a href="?mime=text/x-sql">text/x-sql</a></code>,
            <code><a href="?mime=text/x-mysql">text/x-mysql</a></code>,
            <code><a href="?mime=text/x-mariadb">text/x-mariadb</a></code>,
            <code><a href="?mime=text/x-cassandra">text/x-cassandra</a></code>,
            <code><a href="?mime=text/x-plsql">text/x-plsql</a></code>,
            <code><a href="?mime=text/x-mssql">text/x-mssql</a></code>,
            <code><a href="?mime=text/x-hive">text/x-hive</a></code>,
            <code><a href="?mime=text/x-pgsql">text/x-pgsql</a></code>,
            <code><a href="?mime=text/x-gql">text/x-gql</a></code>.
        </p>
 <script>
 window.onload = function() {
  var mime = 'text/x-mariadb';
  // get mime type
  if (window.location.href.indexOf('mime=') > -1) {
    mime = window.location.href.substr(window.location.href.indexOf('mime=') + 5);
  }
  window.editor = CodeMirror.fromTextArea(document.getElementById('code'), {
    mode: mime,
    indentWithTabs: true,
    smartIndent: true,
    lineNumbers: true,
    matchBrackets : true,
    autofocus: true,
    extraKeys: {"Ctrl-Space": "autocomplete"},
    hintOptions: {tables: {
      users: {name: null, score: null, birthDate: null},
      countries: {name: null, population: null, size: null}
    }}
  });
 };
 </script>

 </article>
--- a/src/admin/js/mode/xml/index.html
+++ b/src/admin/js/mode/xml/index.html
@@ -1,61 +0,0 @@
 <!DOCTYPE html>

 <title>CodeMirror: XML mode</title>
 <meta charset="utf-8"/>
 <link rel=stylesheet href="../../doc/docs.css">

 <link rel="stylesheet" href="../../lib/codemirror.css">
 <script src="../../lib/codemirror.js"></script>
 <script src="xml.js"></script>
 <style type="text/css">.CodeMirror {border-top: 1px solid black; border-bottom: 1px solid black;}</style>
 <div id=nav>
  <a href="http://codemirror.net"><h1>CodeMirror</h1><img id=logo src="../../doc/logo.png"></a>

  <ul>
    <li><a href="../../index.html">Home</a>
    <li><a href="../../doc/manual.html">Manual</a>
    <li><a href="https://github.com/codemirror/codemirror">Code</a>
  </ul>
  <ul>
    <li><a href="../index.html">Language modes</a>
    <li><a class=active href="javascript:;">XML</a>
  </ul>
 </div>

 <article>
 <h2>XML mode</h2>
 <form><textarea id="code" name="code">
 &lt;html style="color: green"&gt;
  &lt;!-- this is a comment -&gt;
  &lt;head&gt;
    &lt;title&gt;HTML Example&lt;/title&gt;
  &lt;/head&gt;
  &lt;body&gt;
    The indentation tries to be &lt;em&gt;somewhat &amp;quot;do what
    I mean&amp;quot;&lt;/em&gt; but might not match your style.
  &lt;/body&gt;
 &lt;/html&gt;
 </textarea></form>
    <script>
      var editor = CodeMirror.fromTextArea(document.getElementById("code"), {
        mode: "text/html",
        lineNumbers: true
      });
    </script>
    <p>The XML mode supports these configuration parameters:</p>
    <dl>
      <dt><code>htmlMode (boolean)</code></dt>
      <dd>This switches the mode to parse HTML instead of XML. This
      means attributes do not have to be quoted, and some elements
      (such as <code>br</code>) do not require a closing tag.</dd>
      <dt><code>matchClosing (boolean)</code></dt>
      <dd>Controls whether the mode checks that close tags match the
      corresponding opening tag, and highlights mismatches as errors.
      Defaults to true.</dd>
      <dt><code>alignCDATA (boolean)</code></dt>
      <dd>Setting this to true will force the opening tag of CDATA
      blocks to not be indented.</dd>
    </dl>

    <p><strong>MIME types defined:</strong> <code>application/xml</code>, <code>text/html</code>.</p>
  </article>
--- a/src/static/img/106.gif
+++ b/src/static/img/106.gif
--- a/src/static/img/c-bury.png
+++ b/src/static/img/c-bury.png
--- a/src/static/img/c-digg.png
+++ b/src/static/img/c-digg.png
--- a/src/static/img/df_gbg.gif
+++ b/src/static/img/df_gbg.gif
--- a/src/static/img/face/1.gif
+++ b/src/static/img/face/1.gif
--- a/src/static/img/face/2.gif
+++ b/src/static/img/face/2.gif
--- a/src/static/img/face/3.gif
+++ b/src/static/img/face/3.gif
--- a/src/static/img/face/4.gif
+++ b/src/static/img/face/4.gif
--- a/src/static/img/face/5.gif
+++ b/src/static/img/face/5.gif
--- a/src/static/img/face/6.gif
+++ b/src/static/img/face/6.gif
--- a/src/static/img/face/7.gif
+++ b/src/static/img/face/7.gif
--- a/src/static/img/face/8.gif
+++ b/src/static/img/face/8.gif
--- a/src/static/img/fbico.gif
+++ b/src/static/img/fbico.gif
--- a/src/static/img/file.gif
+++ b/src/static/img/file.gif
--- a/src/static/img/file_move.gif
+++ b/src/static/img/file_move.gif
--- a/src/static/img/lbg.gif
+++ b/src/static/img/lbg.gif
--- a/src/static/img/menuarrow.gif
+++ b/src/static/img/menuarrow.gif
--- a/src/static/img/menumember.gif
+++ b/src/static/img/menumember.gif