| OLD | NEW |
| 1 function createRectangleTest(elementId, stylesheetId, bounds, shapeBounds, units
, content) { | 1 function createRectangleTest(elementId, stylesheetId, bounds, shapeBounds, units
, content) { |
| 2 var elem; | 2 var elem; |
| 3 if (elementId) | 3 if (elementId) |
| 4 elem = document.getElementById(elementId); | 4 elem = document.getElementById(elementId); |
| 5 else { | 5 else { |
| 6 elem = document.createElement('div'); | 6 elem = document.createElement('div'); |
| 7 elem.setAttribute('id', elementId); | 7 elem.setAttribute('id', elementId); |
| 8 document.appendChild(elem); | 8 document.appendChild(elem); |
| 9 } | 9 } |
| 10 | 10 |
| 11 var stylesheet = document.getElementById(stylesheetId).sheet; | 11 var stylesheet = document.getElementById(stylesheetId).sheet; |
| 12 var rules = []; | 12 var rules = []; |
| 13 for (var i in bounds) | 13 for (var i in bounds) |
| 14 rules.push(i + ':' + bounds[i] + units); | 14 rules.push(i + ':' + bounds[i] + units); |
| 15 var rectangleBounds = [shapeBounds.x + units, shapeBounds.y + units, shapeBo
unds.width + units, shapeBounds.height + units]; | 15 var rectangleBounds = [shapeBounds.x + units, shapeBounds.y + units, shapeBo
unds.width + units, shapeBounds.height + units]; |
| 16 rules.push('-webkit-shape-inside: rectangle(' + rectangleBounds.join(',') +
')'); | 16 rules.push('-webkit-shape-inside: rectangle(' + rectangleBounds.join(',') +
')'); |
| 17 rules.push('position: relative'); | 17 rules.push('position: relative'); |
| 18 rules.push('overflow-wrap: break-word'); | 18 rules.push('overflow-wrap: break-word'); |
| 19 stylesheet.insertRule('#' + elementId + '{' + rules.join(';') + '}'); | 19 stylesheet.insertRule('#' + elementId + '{' + rules.join(';') + '}', 0); |
| 20 | 20 |
| 21 rules = []; | 21 rules = []; |
| 22 rules.push('left: ' + (shapeBounds.x - 1) + units, 'top: ' + (shapeBounds.y
- 1) + units, 'width: ' + rectangleBounds[2], 'height: ' + rectangleBounds[3]); | 22 rules.push('left: ' + (shapeBounds.x - 1) + units, 'top: ' + (shapeBounds.y
- 1) + units, 'width: ' + rectangleBounds[2], 'height: ' + rectangleBounds[3]); |
| 23 rules.push('position: absolute', 'display: block', 'content: \' \''); | 23 rules.push('position: absolute', 'display: block', 'content: \' \''); |
| 24 rules.push('border: 1px solid blue'); | 24 rules.push('border: 1px solid blue'); |
| 25 stylesheet.insertRule('#' + elementId + ':before{' + rules.join(';') + '}'); | 25 stylesheet.insertRule('#' + elementId + ':before{' + rules.join(';') + '}',
0); |
| 26 if (content) | 26 if (content) |
| 27 elem.innerHTML = content; | 27 elem.innerHTML = content; |
| 28 } | 28 } |
| 29 | 29 |
| 30 function createRectangleTestResult(elementId, stylesheetId, bounds, shapeBounds,
units, content) { | 30 function createRectangleTestResult(elementId, stylesheetId, bounds, shapeBounds,
units, content) { |
| 31 var elem; | 31 var elem; |
| 32 if (elementId) | 32 if (elementId) |
| 33 elem = document.getElementById(elementId); | 33 elem = document.getElementById(elementId); |
| 34 else { | 34 else { |
| 35 elem = document.createElement('div'); | 35 elem = document.createElement('div'); |
| 36 elem.setAttribute('id', elementId); | 36 elem.setAttribute('id', elementId); |
| 37 document.appendChild(elem); | 37 document.appendChild(elem); |
| 38 } | 38 } |
| 39 | 39 |
| 40 var stylesheet = document.getElementById(stylesheetId).sheet; | 40 var stylesheet = document.getElementById(stylesheetId).sheet; |
| 41 var rules = []; | 41 var rules = []; |
| 42 rules.push('width: ' + shapeBounds.width + units, 'height: ' + shapeBounds.h
eight + units); | 42 rules.push('width: ' + shapeBounds.width + units, 'height: ' + shapeBounds.h
eight + units); |
| 43 rules.push('padding-left: ' + shapeBounds.x + units, 'padding-right: ' + (bo
unds.width - shapeBounds.width - shapeBounds.x) + units); | 43 rules.push('padding-left: ' + shapeBounds.x + units, 'padding-right: ' + (bo
unds.width - shapeBounds.width - shapeBounds.x) + units); |
| 44 rules.push('padding-top: ' + shapeBounds.y + units, 'padding-bottom: ' + (bo
unds.height - shapeBounds.height - shapeBounds.y) + units); | 44 rules.push('padding-top: ' + shapeBounds.y + units, 'padding-bottom: ' + (bo
unds.height - shapeBounds.height - shapeBounds.y) + units); |
| 45 rules.push('position: relative'); | 45 rules.push('position: relative'); |
| 46 rules.push('overflow-wrap: break-word'); | 46 rules.push('overflow-wrap: break-word'); |
| 47 stylesheet.insertRule('#' + elementId + '{' + rules.join(';') + '}'); | 47 stylesheet.insertRule('#' + elementId + '{' + rules.join(';') + '}', 0); |
| 48 | 48 |
| 49 rules = []; | 49 rules = []; |
| 50 rules.push('left: ' + (shapeBounds.x - 1) + units, 'top: ' + (shapeBounds.y
- 1) + units, 'width: ' + shapeBounds.width + units, 'height: ' + shapeBounds.he
ight + units); | 50 rules.push('left: ' + (shapeBounds.x - 1) + units, 'top: ' + (shapeBounds.y
- 1) + units, 'width: ' + shapeBounds.width + units, 'height: ' + shapeBounds.he
ight + units); |
| 51 rules.push('position: absolute', 'display: block', 'content: \' \''); | 51 rules.push('position: absolute', 'display: block', 'content: \' \''); |
| 52 rules.push('border: 1px solid blue'); | 52 rules.push('border: 1px solid blue'); |
| 53 stylesheet.insertRule('#' + elementId + ':before{' + rules.join(';') + '}'); | 53 stylesheet.insertRule('#' + elementId + ':before{' + rules.join(';') + '}',
0); |
| 54 if (content) | 54 if (content) |
| 55 elem.innerHTML = content; | 55 elem.innerHTML = content; |
| 56 } | 56 } |
| OLD | NEW |