Index: trunk/parsers/wikidom/lib/synth/views/es.ContentView.js |
— | — | @@ -44,6 +44,11 @@ |
45 | 45 | this.model.on( 'clear', render ); |
46 | 46 | this.model.on( 'annotate', render ); |
47 | 47 | this.scanBoundaries(); |
| 48 | + |
| 49 | + this.$ranges = $( '<div class="editSurface-ranges"></div>' ).prependTo( this.$ ); |
| 50 | + this.$rangeStart = $( '<div class="editSurface-range"></div>' ).appendTo( this.$ranges ); |
| 51 | + this.$rangeFill = $( '<div class="editSurface-range"></div>' ).appendTo( this.$ranges ); |
| 52 | + this.$rangeEnd = $( '<div class="editSurface-range"></div>' ).appendTo( this.$ranges ); |
48 | 53 | }; |
49 | 54 | |
50 | 55 | /* Static Members */ |
— | — | @@ -190,6 +195,52 @@ |
191 | 196 | return out; |
192 | 197 | }; |
193 | 198 | |
| 199 | +es.ContentView.prototype.drawSelection = function( range ) { |
| 200 | + range.normalize(); |
| 201 | + |
| 202 | + var fromLineIndex = this.getLineIndex( range.start ), |
| 203 | + toLineIndex = this.getLineIndex( range.end ), |
| 204 | + fromPosition = this.getPosition( range.start ), |
| 205 | + toPosition = this.getPosition( range.end ); |
| 206 | + |
| 207 | + if ( fromLineIndex === toLineIndex ) { |
| 208 | + // Single line selection |
| 209 | + this.$rangeStart.css( { |
| 210 | + 'top': fromPosition.top, |
| 211 | + 'left': fromPosition.left, |
| 212 | + 'width': toPosition.left - fromPosition.left, |
| 213 | + 'height': fromPosition.bottom - fromPosition.top |
| 214 | + } ).show(); |
| 215 | + this.$rangeFill.hide(); |
| 216 | + this.$rangeEnd.hide(); |
| 217 | + } else { |
| 218 | + // Multiple line selection |
| 219 | + var blockWidth = this.$.width(); |
| 220 | + this.$rangeStart.css( { |
| 221 | + 'top': fromPosition.top, |
| 222 | + 'left': fromPosition.left, |
| 223 | + 'width': blockWidth - fromPosition.left, |
| 224 | + 'height': fromPosition.bottom - fromPosition.top |
| 225 | + } ).show(); |
| 226 | + this.$rangeEnd.css( { |
| 227 | + 'top': toPosition.top, |
| 228 | + 'left': 0, |
| 229 | + 'width': toPosition.left, |
| 230 | + 'height': toPosition.bottom - toPosition.top |
| 231 | + } ).show(); |
| 232 | + if ( fromLineIndex + 1 < toLineIndex ) { |
| 233 | + this.$rangeFill.css( { |
| 234 | + 'top': fromPosition.bottom, |
| 235 | + 'left': 0, |
| 236 | + 'width': blockWidth, |
| 237 | + 'height': toPosition.top - fromPosition.bottom |
| 238 | + } ).show(); |
| 239 | + } else { |
| 240 | + this.$rangeFill.hide(); |
| 241 | + } |
| 242 | + } |
| 243 | +}; |
| 244 | + |
194 | 245 | es.ContentView.prototype.getLineIndex = function( offset ) { |
195 | 246 | for ( var i = 0; i < this.lines.length; i++ ) { |
196 | 247 | if ( this.lines[i].range.containsOffset( offset ) ) { |