Skip to content

Commit fae9fd3

Browse files
author
SeungpilPark
committed
#6 IE Edge support navigator now.
1 parent 4a7a163 commit fae9fd3

5 files changed

Lines changed: 106 additions & 32 deletions

File tree

‎src/main/webapp/examples/develope.html‎

Lines changed: 8 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -165,6 +165,10 @@
165165
<script type="text/javascript" src="../src/shape/elec/Location.js"></script>
166166
<script type="text/javascript" src="../src/shape/elec/Manhole.js"></script>
167167

168+
<!--<script type="text/javascript" src="http://canvg.github.io/canvg/rgbcolor.js"></script>-->
169+
<!--<script type="text/javascript" src="http://canvg.github.io/canvg/StackBlur.js"></script>-->
170+
<!--<script type="text/javascript" src="http://canvg.github.io/canvg/canvg.js"></script>-->
171+
168172
<!--<script type="text/javascript" src="../src/worker/og-worker.js"></script>-->
169173

170174
<style type="text/css">
@@ -342,7 +346,7 @@
342346
canvas.fastLoadingON();
343347

344348
var date1 = new Date();
345-
for (var i = 0; i < 50; i++) {
349+
for (var i = 0; i < 10; i++) {
346350
var p1 = [i * 10, i * 10];
347351
var p2 = [i * 10 + 50, i * 10 + 50];
348352
var location = canvas.drawShape(p1, new OG.MILoad(), [50, 50]);
@@ -556,7 +560,9 @@ <h3><a href="#">BPMN</a></h3>
556560

557561
<div class="ui-layout-center" id="canvas" style="cursor: default;">
558562
</div>
559-
<div id="canvas_slider"></div>
563+
<div id="canvas_slider">
564+
</div>
565+
<img src="" id="testImg">
560566

561567
<script type="text/javascript">
562568
$(function () {

‎src/main/webapp/opengraph/OpenGraph-0.1.2-SNAPSHOT-All.js‎

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎src/main/webapp/opengraph/OpenGraph-0.1.2-SNAPSHOT-min.js‎

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎src/main/webapp/opengraph/OpenGraph-0.1.2-SNAPSHOT.js‎

Lines changed: 48 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -33209,18 +33209,50 @@ OG.graph.Canvas.prototype = {
3320933209

3321033210
var svg = me._RENDERER.getRootElement();
3321133211
var svgData = new XMLSerializer().serializeToString(svg);
33212-
33213-
var image = new Image();
33214-
image.src = 'data:image/svg+xml;utf-8,' + svgData;
33215-
image.onload = function () {
33216-
var canvas = document.getElementById(sliderImage.attr('id'));
33217-
canvas.width = sliderImageWrapper.width();
33218-
canvas.height = sliderImageWrapper.width() * image.height / image.width;
33219-
var context = canvas.getContext('2d');
33220-
context.drawImage(image, 0, 0, sliderImageWrapper.width(), sliderImageWrapper.width() * image.height / image.width);
33221-
$(image).remove();
33222-
};
33223-
me.updateNavigatior();
33212+
var canvasSize = this.getCanvasSize();
33213+
33214+
if (OG.Util.isIE()) {
33215+
svgData = '<?xml version="1.0" encoding="utf-8"?>' + svgData.replace('xmlns="http://www.w3.org/2000/svg"', '').replace('xmlns:NS1=""', '').replace('NS1:', '');
33216+
var encoded = window.btoa(unescape(encodeURIComponent(svgData)));
33217+
var image = document.createElement('img');
33218+
$(image).css({
33219+
position: 'absolute',
33220+
top: '0px',
33221+
left: '0px',
33222+
opacity: 0
33223+
});
33224+
document.body.appendChild(image);
33225+
image.src = 'data:image/svg+xml;base64,' + encoded;
33226+
image.onload = function () {
33227+
var canvas = document.getElementById(sliderImage.attr('id'));
33228+
canvas.width = sliderImageWrapper.width();
33229+
canvas.height = sliderImageWrapper.width() * image.height / image.width;
33230+
var context = canvas.getContext('2d');
33231+
try {
33232+
context.drawImage(image, 0, 0, sliderImageWrapper.width(), sliderImageWrapper.width() * image.height / image.width);
33233+
$(image).remove();
33234+
me.updateNavigatior();
33235+
} catch (e) {
33236+
$(image).remove();
33237+
}
33238+
};
33239+
} else {
33240+
var image = new Image();
33241+
image.src = 'data:image/svg+xml;utf-8,' + svgData;
33242+
image.onload = function () {
33243+
var canvas = document.getElementById(sliderImage.attr('id'));
33244+
canvas.width = sliderImageWrapper.width();
33245+
canvas.height = sliderImageWrapper.width() * image.height / image.width;
33246+
var context = canvas.getContext('2d');
33247+
try {
33248+
context.drawImage(image, 0, 0, sliderImageWrapper.width(), sliderImageWrapper.width() * image.height / image.width);
33249+
$(image).remove();
33250+
me.updateNavigatior();
33251+
} catch (e) {
33252+
$(image).remove();
33253+
}
33254+
};
33255+
}
3322433256
}
3322533257

3322633258
//$('#testImg').remove();
@@ -34336,6 +34368,8 @@ OG.graph.Canvas.prototype = {
3433634368
}
3433734369
if (item.data) {
3433834370
cell['@data'] = escape(OG.JSON.encode(item.data));
34371+
} else {
34372+
cell['@data'] = escape(OG.JSON.encode(item.shape.data));
3433934373
}
3434034374
if (shape.textList) {
3434134375
cell['@textList'] = escape(OG.JSON.encode(shape.textList));
@@ -34602,7 +34636,7 @@ OG.graph.Canvas.prototype = {
3460234636
}
3460334637

3460434638
cellCount++;
34605-
$(renderer._PAPER.canvas).trigger('loading', [Math.round((cellCount/totalCount)*100)]);
34639+
$(renderer._PAPER.canvas).trigger('loading', [Math.round((cellCount / totalCount) * 100)]);
3460634640
}
3460734641

3460834642
this.fastLoadingOFF();
@@ -34962,7 +34996,7 @@ OG.graph.Canvas.prototype = {
3496234996
/**
3496334997
* 캔버스 로딩 이벤트 리스너
3496434998
*/
34965-
onLoading: function(callbackFunc){
34999+
onLoading: function (callbackFunc) {
3496635000
$(this.getRootElement()).bind('loading', function (event, progress) {
3496735001
callbackFunc(event, progress);
3496835002
});

‎src/main/webapp/src/graph/Canvas.js‎

Lines changed: 48 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -1170,18 +1170,50 @@ OG.graph.Canvas.prototype = {
11701170

11711171
var svg = me._RENDERER.getRootElement();
11721172
var svgData = new XMLSerializer().serializeToString(svg);
1173-
1174-
var image = new Image();
1175-
image.src = 'data:image/svg+xml;utf-8,' + svgData;
1176-
image.onload = function () {
1177-
var canvas = document.getElementById(sliderImage.attr('id'));
1178-
canvas.width = sliderImageWrapper.width();
1179-
canvas.height = sliderImageWrapper.width() * image.height / image.width;
1180-
var context = canvas.getContext('2d');
1181-
context.drawImage(image, 0, 0, sliderImageWrapper.width(), sliderImageWrapper.width() * image.height / image.width);
1182-
$(image).remove();
1183-
};
1184-
me.updateNavigatior();
1173+
var canvasSize = this.getCanvasSize();
1174+
1175+
if (OG.Util.isIE()) {
1176+
svgData = '<?xml version="1.0" encoding="utf-8"?>' + svgData.replace('xmlns="http://www.w3.org/2000/svg"', '').replace('xmlns:NS1=""', '').replace('NS1:', '');
1177+
var encoded = window.btoa(unescape(encodeURIComponent(svgData)));
1178+
var image = document.createElement('img');
1179+
$(image).css({
1180+
position: 'absolute',
1181+
top: '0px',
1182+
left: '0px',
1183+
opacity: 0
1184+
});
1185+
document.body.appendChild(image);
1186+
image.src = 'data:image/svg+xml;base64,' + encoded;
1187+
image.onload = function () {
1188+
var canvas = document.getElementById(sliderImage.attr('id'));
1189+
canvas.width = sliderImageWrapper.width();
1190+
canvas.height = sliderImageWrapper.width() * image.height / image.width;
1191+
var context = canvas.getContext('2d');
1192+
try {
1193+
context.drawImage(image, 0, 0, sliderImageWrapper.width(), sliderImageWrapper.width() * image.height / image.width);
1194+
$(image).remove();
1195+
me.updateNavigatior();
1196+
} catch (e) {
1197+
$(image).remove();
1198+
}
1199+
};
1200+
} else {
1201+
var image = new Image();
1202+
image.src = 'data:image/svg+xml;utf-8,' + svgData;
1203+
image.onload = function () {
1204+
var canvas = document.getElementById(sliderImage.attr('id'));
1205+
canvas.width = sliderImageWrapper.width();
1206+
canvas.height = sliderImageWrapper.width() * image.height / image.width;
1207+
var context = canvas.getContext('2d');
1208+
try {
1209+
context.drawImage(image, 0, 0, sliderImageWrapper.width(), sliderImageWrapper.width() * image.height / image.width);
1210+
$(image).remove();
1211+
me.updateNavigatior();
1212+
} catch (e) {
1213+
$(image).remove();
1214+
}
1215+
};
1216+
}
11851217
}
11861218

11871219
//$('#testImg').remove();
@@ -2297,6 +2329,8 @@ OG.graph.Canvas.prototype = {
22972329
}
22982330
if (item.data) {
22992331
cell['@data'] = escape(OG.JSON.encode(item.data));
2332+
} else {
2333+
cell['@data'] = escape(OG.JSON.encode(item.shape.data));
23002334
}
23012335
if (shape.textList) {
23022336
cell['@textList'] = escape(OG.JSON.encode(shape.textList));
@@ -2563,7 +2597,7 @@ OG.graph.Canvas.prototype = {
25632597
}
25642598

25652599
cellCount++;
2566-
$(renderer._PAPER.canvas).trigger('loading', [Math.round((cellCount/totalCount)*100)]);
2600+
$(renderer._PAPER.canvas).trigger('loading', [Math.round((cellCount / totalCount) * 100)]);
25672601
}
25682602

25692603
this.fastLoadingOFF();
@@ -2923,7 +2957,7 @@ OG.graph.Canvas.prototype = {
29232957
/**
29242958
* 캔버스 로딩 이벤트 리스너
29252959
*/
2926-
onLoading: function(callbackFunc){
2960+
onLoading: function (callbackFunc) {
29272961
$(this.getRootElement()).bind('loading', function (event, progress) {
29282962
callbackFunc(event, progress);
29292963
});

0 commit comments

Comments
 (0)