Browse Source

Allow disabling of RangeItem limitSize (#3050)

Some browsers cannot handle very large DIVs so by default range DIVs
can be truncated outside the visible area. This change allows the use
of a new `limitSize` item option which disables this functionality,
allowing the creation of full-width DIVs.

I don’t see an existing test spec that covers RageItem.js so I’m
submitting without tests. However we’ve using Timeline in production on
a fairly large project with these changes in place for several months
and it works fine.
jittering-top
Graham J 7 years ago
committed by Yotam Berkowitz
parent
commit
e4efee604f
3 changed files with 11 additions and 1 deletions
  1. +8
    -0
      docs/timeline/index.html
  2. +2
    -1
      lib/timeline/component/item/RangeItem.js
  3. +1
    -0
      lib/timeline/optionsTimeline.js

+ 8
- 0
docs/timeline/index.html View File

@ -342,6 +342,14 @@ var items = new vis.DataSet([
Types 'box' and 'point' need a start date, the types 'range' and 'background' needs both a start and end date.
</td>
</tr>
<tr>
<td>limitSize</td>
<td>Boolean</td>
<td>no</td>
<td>Some browsers cannot handle very large DIVs so by default range DIVs can be truncated outside the visible area.
Setting this to <code>false</code> will cause the creation of full-size DIVs.
</td>
</tr>
<tr class='toggle collapsible' onclick="toggleTable('itemOptionTable', 'itemEditable', this);">
<td><span parent="itemEditable" class="right-caret"></span> editable</td>
<td>Boolean or Object</td>

+ 2
- 1
lib/timeline/component/item/RangeItem.js View File

@ -231,7 +231,8 @@ RangeItem.prototype.repositionX = function(limitSize) {
var contentWidth;
// limit the width of the range, as browsers cannot draw very wide divs
if (limitSize === undefined || limitSize === true) {
// unless limitSize: false is explicitly set in item data
if (this.data.limitSize !== false && (limitSize === undefined || limitSize === true)) {
if (start < -parentWidth) {
start = -parentWidth;
}

+ 1
- 0
lib/timeline/optionsTimeline.js View File

@ -94,6 +94,7 @@ let allOptions = {
range: { 'boolean': bool, 'undefined': 'undefined'},
__type__: { 'boolean': bool, object}
},
limitSize: {'boolean': bool},
locale:{string},
locales:{
__any__: {any},

Loading…
Cancel
Save