← Back to branch summary

~automne-team/automne/trunk

« back to all changes in this revision

Viewing changes to automne/codemirror/js/select.js

  • Committer: sebastien-pauchet
  • Date: 2012-02-15 16:47:40 UTC
  • mfrom: (363.2.105 4.2)
  • Revision ID: seb@automne-cms.org-20120215164740-xrk26iafkvztwv6s
Merge stable branch 4.2.0

Show diffs side-by-side

added added

removed removed

Lines of Context:
automne/codemirror/js/select.js
1
 
/* Functionality for finding, storing, and restoring selections
2
 
 *
3
 
 * This does not provide a generic API, just the minimal functionality
4
 
 * required by the CodeMirror system.
5
 
 */
6
 
 
7
 
// Namespace object.
8
 
var select = {};
9
 
 
10
 
(function() {
11
 
  select.ie_selection = document.selection && document.selection.createRangeCollection;
12
 
 
13
 
  // Find the 'top-level' (defined as 'a direct child of the node
14
 
  // passed as the top argument') node that the given node is
15
 
  // contained in. Return null if the given node is not inside the top
16
 
  // node.
17
 
  function topLevelNodeAt(node, top) {
18
 
    while (node && node.parentNode != top)
19
 
      node = node.parentNode;
20
 
    return node;
21
 
  }
22
 
 
23
 
  // Find the top-level node that contains the node before this one.
24
 
  function topLevelNodeBefore(node, top) {
25
 
    while (!node.previousSibling && node.parentNode != top)
26
 
      node = node.parentNode;
27
 
    return topLevelNodeAt(node.previousSibling, top);
28
 
  }
29
 
 
30
 
  // Used to prevent restoring a selection when we do not need to.
31
 
  var currentSelection = null;
32
 
 
33
 
  var fourSpaces = "\u00a0\u00a0\u00a0\u00a0";
34
 
 
35
 
  select.snapshotChanged = function() {
36
 
    if (currentSelection) currentSelection.changed = true;
37
 
  };
38
 
 
39
 
  // This is called by the code in editor.js whenever it is replacing
40
 
  // a text node. The function sees whether the given oldNode is part
41
 
  // of the current selection, and updates this selection if it is.
42
 
  // Because nodes are often only partially replaced, the length of
43
 
  // the part that gets replaced has to be taken into account -- the
44
 
  // selection might stay in the oldNode if the newNode is smaller
45
 
  // than the selection's offset. The offset argument is needed in
46
 
  // case the selection does move to the new object, and the given
47
 
  // length is not the whole length of the new node (part of it might
48
 
  // have been used to replace another node).
49
 
  select.snapshotReplaceNode = function(from, to, length, offset) {
50
 
    if (!currentSelection) return;
51
 
    currentSelection.changed = true;
52
 
 
53
 
    function replace(point) {
54
 
      if (from == point.node) {
55
 
        if (length && point.offset > length) {
56
 
          point.offset -= length;
57
 
        }
58
 
        else {
59
 
          point.node = to;
60
 
          point.offset += (offset || 0);
61
 
        }
62
 
      }
63
 
    }
64
 
    replace(currentSelection.start);
65
 
    replace(currentSelection.end);
66
 
  };
67
 
 
68
 
  select.snapshotMove = function(from, to, distance, relative, ifAtStart) {
69
 
    if (!currentSelection) return;
70
 
    currentSelection.changed = true;
71
 
 
72
 
    function move(point) {
73
 
      if (from == point.node && (!ifAtStart || point.offset == 0)) {
74
 
        point.node = to;
75
 
        if (relative) point.offset = Math.max(0, point.offset + distance);
76
 
        else point.offset = distance;
77
 
      }
78
 
    }
79
 
    move(currentSelection.start);
80
 
    move(currentSelection.end);
81
 
  };
82
 
 
83
 
  // Most functions are defined in two ways, one for the IE selection
84
 
  // model, one for the W3C one.
85
 
  if (select.ie_selection) {
86
 
    function selectionNode(win, start) {
87
 
      var range = win.document.selection.createRange();
88
 
      range.collapse(start);
89
 
 
90
 
      function nodeAfter(node) {
91
 
        var found = null;
92
 
        while (!found && node) {
93
 
          found = node.nextSibling;
94
 
          node = node.parentNode;
95
 
        }
96
 
        return nodeAtStartOf(found);
97
 
      }
98
 
 
99
 
      function nodeAtStartOf(node) {
100
 
        while (node && node.firstChild) node = node.firstChild;
101
 
        return {node: node, offset: 0};
102
 
      }
103
 
 
104
 
      var containing = range.parentElement();
105
 
      if (!isAncestor(win.document.body, containing)) return null;
106
 
      if (!containing.firstChild) return nodeAtStartOf(containing);
107
 
 
108
 
      var working = range.duplicate();
109
 
      working.moveToElementText(containing);
110
 
      working.collapse(true);
111
 
      for (var cur = containing.firstChild; cur; cur = cur.nextSibling) {
112
 
        if (cur.nodeType == 3) {
113
 
          var size = cur.nodeValue.length;
114
 
          working.move("character", size);
115
 
        }
116
 
        else {
117
 
          working.moveToElementText(cur);
118
 
          working.collapse(false);
119
 
        }
120
 
 
121
 
        var dir = range.compareEndPoints("StartToStart", working);
122
 
        if (dir == 0) return nodeAfter(cur);
123
 
        if (dir == 1) continue;
124
 
        if (cur.nodeType != 3) return nodeAtStartOf(cur);
125
 
 
126
 
        working.setEndPoint("StartToEnd", range);
127
 
        return {node: cur, offset: size - working.text.length};
128
 
      }
129
 
      return nodeAfter(containing);
130
 
    }
131
 
 
132
 
    select.markSelection = function(win) {
133
 
      currentSelection = null;
134
 
      var sel = win.document.selection;
135
 
      if (!sel) return;
136
 
      var start = selectionNode(win, true),
137
 
          end = selectionNode(win, false);
138
 
      if (!start || !end) return;
139
 
      currentSelection = {start: start, end: end, window: win, changed: false};
140
 
    };
141
 
 
142
 
    select.selectMarked = function() {
143
 
      if (!currentSelection || !currentSelection.changed) return;
144
 
 
145
 
      function makeRange(point) {
146
 
        var range = currentSelection.window.document.body.createTextRange();
147
 
        var node = point.node;
148
 
        if (!node) {
149
 
          range.moveToElementText(currentSelection.window.document.body);
150
 
          range.collapse(false);
151
 
        }
152
 
        else if (node.nodeType == 3) {
153
 
          range.moveToElementText(node.parentNode);
154
 
          var offset = point.offset;
155
 
          while (node.previousSibling) {
156
 
            node = node.previousSibling;
157
 
            offset += (node.innerText || "").length;
158
 
          }
159
 
          range.move("character", offset);
160
 
        }
161
 
        else {
162
 
          range.moveToElementText(node);
163
 
          range.collapse(true);
164
 
        }
165
 
        return range;
166
 
      }
167
 
 
168
 
      var start = makeRange(currentSelection.start), end = makeRange(currentSelection.end);
169
 
      start.setEndPoint("StartToEnd", end);
170
 
      start.select();
171
 
    };
172
 
 
173
 
    // Get the top-level node that one end of the cursor is inside or
174
 
    // after. Note that this returns false for 'no cursor', and null
175
 
    // for 'start of document'.
176
 
    select.selectionTopNode = function(container, start) {
177
 
      var selection = container.ownerDocument.selection;
178
 
      if (!selection) return false;
179
 
 
180
 
      var range = selection.createRange();
181
 
      range.collapse(start);
182
 
      var around = range.parentElement();
183
 
      if (around && isAncestor(container, around)) {
184
 
        // Only use this node if the selection is not at its start.
185
 
        var range2 = range.duplicate();
186
 
        range2.moveToElementText(around);
187
 
        if (range.compareEndPoints("StartToStart", range2) == -1)
188
 
          return topLevelNodeAt(around, container);
189
 
      }
190
 
      // Fall-back hack
191
 
      try {range.pasteHTML("<span id='xxx-temp-xxx'></span>");}
192
 
      catch (e) {return false;}
193
 
 
194
 
      var temp = container.ownerDocument.getElementById("xxx-temp-xxx");
195
 
      if (temp) {
196
 
        var result = topLevelNodeBefore(temp, container);
197
 
        removeElement(temp);
198
 
        return result;
199
 
      }
200
 
      return false;
201
 
    };
202
 
 
203
 
    // Place the cursor after this.start. This is only useful when
204
 
    // manually moving the cursor instead of restoring it to its old
205
 
    // position.
206
 
    select.focusAfterNode = function(node, container) {
207
 
      var range = container.ownerDocument.body.createTextRange();
208
 
      range.moveToElementText(node || container);
209
 
      range.collapse(!node);
210
 
      range.select();
211
 
    };
212
 
 
213
 
    select.somethingSelected = function(win) {
214
 
      var sel = win.document.selection;
215
 
      return sel && (sel.createRange().text != "");
216
 
    };
217
 
 
218
 
    function insertAtCursor(window, html) {
219
 
      var selection = window.document.selection;
220
 
      if (selection) {
221
 
        var range = selection.createRange();
222
 
        range.pasteHTML(html);
223
 
        range.collapse(false);
224
 
        range.select();
225
 
      }
226
 
    }
227
 
 
228
 
    // Used to normalize the effect of the enter key, since browsers
229
 
    // do widely different things when pressing enter in designMode.
230
 
    select.insertNewlineAtCursor = function(window) {
231
 
      insertAtCursor(window, "<br>");
232
 
    };
233
 
 
234
 
    select.insertTabAtCursor = function(window) {
235
 
      insertAtCursor(window, fourSpaces);
236
 
    };
237
 
 
238
 
    // Get the BR node at the start of the line on which the cursor
239
 
    // currently is, and the offset into the line. Returns null as
240
 
    // node if cursor is on first line.
241
 
    select.cursorPos = function(container, start) {
242
 
      var selection = container.ownerDocument.selection;
243
 
      if (!selection) return null;
244
 
 
245
 
      var topNode = select.selectionTopNode(container, start);
246
 
      while (topNode && topNode.nodeName != "BR")
247
 
        topNode = topNode.previousSibling;
248
 
 
249
 
      var range = selection.createRange(), range2 = range.duplicate();
250
 
      range.collapse(start);
251
 
      if (topNode) {
252
 
        range2.moveToElementText(topNode);
253
 
        range2.collapse(false);
254
 
      }
255
 
      else {
256
 
        // When nothing is selected, we can get all kinds of funky errors here.
257
 
        try { range2.moveToElementText(container); }
258
 
        catch (e) { return null; }
259
 
        range2.collapse(true);
260
 
      }
261
 
      range.setEndPoint("StartToStart", range2);
262
 
 
263
 
      return {node: topNode, offset: range.text.length};
264
 
    };
265
 
 
266
 
    select.setCursorPos = function(container, from, to) {
267
 
      function rangeAt(pos) {
268
 
        var range = container.ownerDocument.body.createTextRange();
269
 
        if (!pos.node) {
270
 
          range.moveToElementText(container);
271
 
          range.collapse(true);
272
 
        }
273
 
        else {
274
 
          range.moveToElementText(pos.node);
275
 
          range.collapse(false);
276
 
        }
277
 
        range.move("character", pos.offset);
278
 
        return range;
279
 
      }
280
 
 
281
 
      var range = rangeAt(from);
282
 
      if (to && to != from)
283
 
        range.setEndPoint("EndToEnd", rangeAt(to));
284
 
      range.select();
285
 
    }
286
 
 
287
 
    // Make sure the cursor is visible.
288
 
    select.scrollToCursor = function(container) {
289
 
      var selection = container.ownerDocument.selection;
290
 
      if (!selection) return null;
291
 
      selection.createRange().scrollIntoView();
292
 
    };
293
 
 
294
 
    select.scrollToNode = function(node) {
295
 
      if (!node) return;
296
 
      node.scrollIntoView();
297
 
    };
298
 
 
299
 
    // Some hacks for storing and re-storing the selection when the editor loses and regains focus.
300
 
    select.selectionCoords = function (win) {
301
 
      var selection = win.document.selection;
302
 
      if (!selection) return null;
303
 
      var start = selection.createRange(), end = start.duplicate();
304
 
      start.collapse(true);
305
 
      end.collapse(false);
306
 
 
307
 
      var body = win.document.body;
308
 
      return {start: {x: start.boundingLeft + body.scrollLeft - 1,
309
 
                      y: start.boundingTop + body.scrollTop},
310
 
              end: {x: end.boundingLeft + body.scrollLeft - 1,
311
 
                    y: end.boundingTop + body.scrollTop}};
312
 
    };
313
 
 
314
 
    // Restore a stored selection.
315
 
    select.selectCoords = function(win, coords) {
316
 
      if (!coords) return;
317
 
 
318
 
      var range1 = win.document.body.createTextRange(), range2 = range1.duplicate();
319
 
      // This can fail for various hard-to-handle reasons.
320
 
      try {
321
 
        range1.moveToPoint(coords.start.x, coords.start.y);
322
 
        range2.moveToPoint(coords.end.x, coords.end.y);
323
 
        range1.setEndPoint("EndToStart", range2);
324
 
        range1.select();
325
 
      } catch(e) {alert(e.message);}
326
 
    };
327
 
  }
328
 
  // W3C model
329
 
  else {
330
 
    // Store start and end nodes, and offsets within these, and refer
331
 
    // back to the selection object from those nodes, so that this
332
 
    // object can be updated when the nodes are replaced before the
333
 
    // selection is restored.
334
 
    select.markSelection = function (win) {
335
 
      var selection = win.getSelection();
336
 
      if (!selection || selection.rangeCount == 0)
337
 
        return (currentSelection = null);
338
 
      var range = selection.getRangeAt(0);
339
 
 
340
 
      currentSelection = {
341
 
        start: {node: range.startContainer, offset: range.startOffset},
342
 
        end: {node: range.endContainer, offset: range.endOffset},
343
 
        window: win,
344
 
        changed: false
345
 
      };
346
 
 
347
 
      // We want the nodes right at the cursor, not one of their
348
 
      // ancestors with a suitable offset. This goes down the DOM tree
349
 
      // until a 'leaf' is reached (or is it *up* the DOM tree?).
350
 
      function normalize(point){
351
 
        while (point.node.nodeType != 3 && point.node.nodeName != "BR") {
352
 
          var newNode = point.node.childNodes[point.offset] || point.node.nextSibling;
353
 
          point.offset = 0;
354
 
          while (!newNode && point.node.parentNode) {
355
 
            point.node = point.node.parentNode;
356
 
            newNode = point.node.nextSibling;
357
 
          }
358
 
          point.node = newNode;
359
 
          if (!newNode)
360
 
            break;
361
 
        }
362
 
      }
363
 
 
364
 
      normalize(currentSelection.start);
365
 
      normalize(currentSelection.end);
366
 
    };
367
 
 
368
 
    select.selectMarked = function () {
369
 
      if (!currentSelection || !currentSelection.changed) return;
370
 
      var win = currentSelection.window, range = win.document.createRange();
371
 
 
372
 
      function setPoint(point, which) {
373
 
        if (point.node) {
374
 
          // Some magic to generalize the setting of the start and end
375
 
          // of a range.
376
 
          if (point.offset == 0)
377
 
            range["set" + which + "Before"](point.node);
378
 
          else
379
 
            range["set" + which](point.node, point.offset);
380
 
        }
381
 
        else {
382
 
          range.setStartAfter(win.document.body.lastChild || win.document.body);
383
 
        }
384
 
      }
385
 
 
386
 
      setPoint(currentSelection.end, "End");
387
 
      setPoint(currentSelection.start, "Start");
388
 
      selectRange(range, win);
389
 
    };
390
 
 
391
 
    // Helper for selecting a range object.
392
 
    function selectRange(range, window) {
393
 
      var selection = window.getSelection();
394
 
      selection.removeAllRanges();
395
 
      selection.addRange(range);
396
 
    };
397
 
    function selectionRange(window) {
398
 
      var selection = window.getSelection();
399
 
      if (!selection || selection.rangeCount == 0)
400
 
        return false;
401
 
      else
402
 
        return selection.getRangeAt(0);
403
 
    }
404
 
 
405
 
    // Finding the top-level node at the cursor in the W3C is, as you
406
 
    // can see, quite an involved process.
407
 
    select.selectionTopNode = function(container, start) {
408
 
      var range = selectionRange(container.ownerDocument.defaultView);
409
 
      if (!range) return false;
410
 
 
411
 
      var node = start ? range.startContainer : range.endContainer;
412
 
      var offset = start ? range.startOffset : range.endOffset;
413
 
      // Work around (yet another) bug in Opera's selection model.
414
 
      if (window.opera && !start && range.endContainer == container && range.endOffset == range.startOffset + 1 &&
415
 
          container.childNodes[range.startOffset] && container.childNodes[range.startOffset].nodeName == "BR")
416
 
        offset--;
417
 
 
418
 
      // For text nodes, we look at the node itself if the cursor is
419
 
      // inside, or at the node before it if the cursor is at the
420
 
      // start.
421
 
      if (node.nodeType == 3){
422
 
        if (offset > 0)
423
 
          return topLevelNodeAt(node, container);
424
 
        else
425
 
          return topLevelNodeBefore(node, container);
426
 
      }
427
 
      // Occasionally, browsers will return the HTML node as
428
 
      // selection. If the offset is 0, we take the start of the frame
429
 
      // ('after null'), otherwise, we take the last node.
430
 
      else if (node.nodeName == "HTML") {
431
 
        return (offset == 1 ? null : container.lastChild);
432
 
      }
433
 
      // If the given node is our 'container', we just look up the
434
 
      // correct node by using the offset.
435
 
      else if (node == container) {
436
 
        return (offset == 0) ? null : node.childNodes[offset - 1];
437
 
      }
438
 
      // In any other case, we have a regular node. If the cursor is
439
 
      // at the end of the node, we use the node itself, if it is at
440
 
      // the start, we use the node before it, and in any other
441
 
      // case, we look up the child before the cursor and use that.
442
 
      else {
443
 
        if (offset == node.childNodes.length)
444
 
          return topLevelNodeAt(node, container);
445
 
        else if (offset == 0)
446
 
          return topLevelNodeBefore(node, container);
447
 
        else
448
 
          return topLevelNodeAt(node.childNodes[offset - 1], container);
449
 
      }
450
 
    };
451
 
 
452
 
    select.focusAfterNode = function(node, container) {
453
 
      var win = container.ownerDocument.defaultView,
454
 
          range = win.document.createRange();
455
 
      range.setStartBefore(container.firstChild || container);
456
 
      // In Opera, setting the end of a range at the end of a line
457
 
      // (before a BR) will cause the cursor to appear on the next
458
 
      // line, so we set the end inside of the start node when
459
 
      // possible.
460
 
      if (node && !node.firstChild)
461
 
        range.setEndAfter(node);
462
 
      else if (node)
463
 
        range.setEnd(node, node.childNodes.length);
464
 
      else
465
 
        range.setEndBefore(container.firstChild || container);
466
 
      range.collapse(false);
467
 
      selectRange(range, win);
468
 
    };
469
 
 
470
 
    select.somethingSelected = function(win) {
471
 
      var range = selectionRange(win);
472
 
      return range && !range.collapsed;
473
 
    };
474
 
 
475
 
    function insertNodeAtCursor(window, node) {
476
 
      var range = selectionRange(window);
477
 
      if (!range) return;
478
 
 
479
 
      range.deleteContents();
480
 
      range.insertNode(node);
481
 
      webkitLastLineHack(window.document.body);
482
 
      range = window.document.createRange();
483
 
      range.selectNode(node);
484
 
      range.collapse(false);
485
 
      selectRange(range, window);
486
 
    }
487
 
 
488
 
    select.insertNewlineAtCursor = function(window) {
489
 
      insertNodeAtCursor(window, window.document.createElement("BR"));
490
 
    };
491
 
 
492
 
    select.insertTabAtCursor = function(window) {
493
 
      insertNodeAtCursor(window, window.document.createTextNode(fourSpaces));
494
 
    };
495
 
 
496
 
    select.cursorPos = function(container, start) {
497
 
      var range = selectionRange(window);
498
 
      if (!range) return;
499
 
 
500
 
      var topNode = select.selectionTopNode(container, start);
501
 
      while (topNode && topNode.nodeName != "BR")
502
 
        topNode = topNode.previousSibling;
503
 
 
504
 
      range = range.cloneRange();
505
 
      range.collapse(start);
506
 
      if (topNode)
507
 
        range.setStartAfter(topNode);
508
 
      else
509
 
        range.setStartBefore(container);
510
 
      return {node: topNode, offset: range.toString().length};
511
 
    };
512
 
 
513
 
    select.setCursorPos = function(container, from, to) {
514
 
      var win = container.ownerDocument.defaultView,
515
 
          range = win.document.createRange();
516
 
 
517
 
      function setPoint(node, offset, side) {
518
 
        if (!node)
519
 
          node = container.firstChild;
520
 
        else
521
 
          node = node.nextSibling;
522
 
 
523
 
        if (!node)
524
 
          return;
525
 
 
526
 
        if (offset == 0) {
527
 
          range["set" + side + "Before"](node);
528
 
          return true;
529
 
        }
530
 
 
531
 
        var backlog = []
532
 
        function decompose(node) {
533
 
          if (node.nodeType == 3)
534
 
            backlog.push(node);
535
 
          else
536
 
            forEach(node.childNodes, decompose);
537
 
        }
538
 
        while (true) {
539
 
          while (node && !backlog.length) {
540
 
            decompose(node);
541
 
            node = node.nextSibling;
542
 
          }
543
 
          var cur = backlog.shift();
544
 
          if (!cur) return false;
545
 
 
546
 
          var length = cur.nodeValue.length;
547
 
          if (length >= offset) {
548
 
            range["set" + side](cur, offset);
549
 
            return true;
550
 
          }
551
 
          offset -= length;
552
 
        }
553
 
      }
554
 
 
555
 
      to = to || from;
556
 
      if (setPoint(to.node, to.offset, "End") && setPoint(from.node, from.offset, "Start"))
557
 
        selectRange(range, win);
558
 
    };
559
 
 
560
 
    select.scrollToNode = function(element) {
561
 
      if (!element) return;
562
 
      var doc = element.ownerDocument, body = doc.body, win = doc.defaultView, html = doc.documentElement;
563
 
      
564
 
      // In Opera, BR elements *always* have a scrollTop property of zero. Go Opera.
565
 
      while (element && !element.offsetTop)
566
 
        element = element.previousSibling;
567
 
 
568
 
      var y = 0, pos = element;
569
 
      while (pos && pos.offsetParent) {
570
 
        y += pos.offsetTop;
571
 
        pos = pos.offsetParent;
572
 
      }
573
 
 
574
 
      var screen_y = y - (body.scrollTop || html.scrollTop || 0);
575
 
      if (screen_y < 0 || screen_y > win.innerHeight - 30)
576
 
        win.scrollTo(body.scrollLeft || html.scrollLeft || 0, y);
577
 
    };
578
 
 
579
 
    select.scrollToCursor = function(container) {
580
 
      select.scrollToNode(select.selectionTopNode(container, true) || container.firstChild);
581
 
    };
582
 
  }
583
 
})();