Made icons work in IE9 (with a few minor bugs)
git-svn-id: http://svg-edit.googlecode.com/svn/trunk@1680 eee81c28-f429-11dd-99c0-75d572ba1dddmaster
parent
631b2b4054
commit
9df823863a
|
@ -733,8 +733,8 @@
|
|||
</g>
|
||||
|
||||
<g id="fontsize">
|
||||
<svg width="50" height="50" xmlns="http://www.w3.org/2000/svg" xmlns:xml="http://www.w3.org/XML/1998/namespace">
|
||||
<text fill="#606060" stroke="none" x="14.451" y="41.4587" id="svg_2" font-size="26" font-family="serif" text-anchor="middle" xml:space="preserve">T</text>
|
||||
<svg width="50" height="50" xmlns="http://www.w3.org/2000/svg">
|
||||
<text fill="#606060" stroke="none" x="14.451" y="41.4587" id="svg_2" font-size="26" font-family="serif" text-anchor="middle">T</text>
|
||||
<text fill="#000000" stroke="none" x="28.853" y="41.8685" font-size="52" font-family="serif" text-anchor="middle" xml:space="preserve" id="svg_3">T</text>
|
||||
</svg>
|
||||
</g>
|
||||
|
|
|
@ -11,6 +11,8 @@
|
|||
*/
|
||||
|
||||
(function() {
|
||||
// TODO: Find out what causes bugs in jQuery animate for IE9
|
||||
if($.browser.msie) $.fx.off = true;
|
||||
|
||||
if(!window.svgEditor) window.svgEditor = function($) {
|
||||
var svgCanvas;
|
||||
|
|
|
@ -403,13 +403,13 @@ var Utils = this.Utils = function() {
|
|||
|
||||
var out;
|
||||
try{
|
||||
var dXML = ($.browser.msie)?new ActiveXObject("Microsoft.XMLDOM"):new DOMParser();
|
||||
var dXML = (window.DOMParser)?new DOMParser():new ActiveXObject("Microsoft.XMLDOM");
|
||||
dXML.async = false;
|
||||
} catch(e){
|
||||
throw new Error("XML Parser could not be instantiated");
|
||||
};
|
||||
try{
|
||||
if($.browser.msie) out = (dXML.loadXML(sXML))?dXML:false;
|
||||
if(dXML.loadXML) out = (dXML.loadXML(sXML))?dXML:false;
|
||||
else out = dXML.parseFromString(sXML, "text/xml");
|
||||
}
|
||||
catch(e){ throw new Error("Error parsing XML string"); };
|
||||
|
@ -422,7 +422,6 @@ var Utils = this.Utils = function() {
|
|||
|
||||
// TODO: declare the variables and set them as null, then move this setup stuff to
|
||||
// an initialization function - probably just use clear()
|
||||
console.log('r');
|
||||
var canvas = this,
|
||||
|
||||
// Namespace constants
|
||||
|
@ -4315,10 +4314,10 @@ var getMouseTarget = this.getMouseTarget = function(evt) {
|
|||
}
|
||||
start_x *= current_zoom;
|
||||
start_y *= current_zoom;
|
||||
console.log('p',[evt.pageX, evt.pageY]);
|
||||
console.log('c',[evt.clientX, evt.clientY]);
|
||||
console.log('o',[evt.offsetX, evt.offsetY]);
|
||||
console.log('s',[start_x, start_y]);
|
||||
// console.log('p',[evt.pageX, evt.pageY]);
|
||||
// console.log('c',[evt.clientX, evt.clientY]);
|
||||
// console.log('o',[evt.offsetX, evt.offsetY]);
|
||||
// console.log('s',[start_x, start_y]);
|
||||
|
||||
assignAttributes(rubberBox, {
|
||||
'x': start_x,
|
||||
|
|
|
@ -128,6 +128,38 @@ $(function() {
|
|||
|
||||
|
||||
(function($) {
|
||||
function makeSVG(el) {
|
||||
// manually create a copy of the element
|
||||
var new_el = document.createElementNS(el.namespaceURI, el.nodeName);
|
||||
$.each(el.attributes, function(i, attr) {
|
||||
var ns = attr.namespaceURI;
|
||||
if(ns) {
|
||||
new_el.setAttributeNS(ns, attr.nodeName, attr.nodeValue);
|
||||
} else {
|
||||
new_el.setAttribute(attr.nodeName, attr.nodeValue);
|
||||
}
|
||||
if(attr.nodeName == 'transform') {
|
||||
console.log('val1:', attr.nodeValue);
|
||||
console.log('val2:', new_el.getAttribute('transform'));
|
||||
}
|
||||
});
|
||||
|
||||
// now create copies of all children
|
||||
$.each(el.childNodes, function(i, child) {
|
||||
switch(child.nodeType) {
|
||||
case 1: // element node
|
||||
new_el.appendChild(makeSVG(child));
|
||||
break;
|
||||
case 3: // text node
|
||||
new_el.textContent = child.nodeValue;
|
||||
break;
|
||||
default:
|
||||
break;
|
||||
}
|
||||
});
|
||||
return new_el;
|
||||
}
|
||||
|
||||
var svg_icons = {};
|
||||
|
||||
$.svgIcons = function(file, opts) {
|
||||
|
@ -168,7 +200,19 @@ $(function() {
|
|||
});
|
||||
} else {
|
||||
if(err.responseXML) {
|
||||
// Is there a non-ActiveX solution in IE9?
|
||||
svgdoc = err.responseXML;
|
||||
|
||||
if(!svgdoc.childNodes.length) {
|
||||
if(window.ActiveXObject) {
|
||||
svgdoc = new ActiveXObject("Microsoft.XMLDOM");
|
||||
svgdoc.loadXML(err.responseText);
|
||||
} else {
|
||||
$(useFallback);
|
||||
}
|
||||
} else {
|
||||
$(useFallback);
|
||||
}
|
||||
$(function() {
|
||||
getIcons('ajax');
|
||||
});
|
||||
|
@ -220,20 +264,29 @@ $(function() {
|
|||
}
|
||||
}
|
||||
});
|
||||
elems = $(svgdoc.firstChild).children(); //.getElementsByTagName('foreignContent');
|
||||
var testSrc = data_pre + 'PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNzUiIGhlaWdodD0iMjc1Ij48L3N2Zz4%3D';
|
||||
|
||||
testImg = $(new Image()).attr({
|
||||
src: testSrc,
|
||||
width: 0,
|
||||
height: 0
|
||||
}).appendTo('body')
|
||||
.load(function () {
|
||||
// Safari 4 crashes, Opera and Chrome don't
|
||||
makeIcons(!isSafari);
|
||||
}).error(function () {
|
||||
makeIcons();
|
||||
});
|
||||
elems = $(svgdoc.firstChild).children(); //.getElementsByTagName('foreignContent');
|
||||
|
||||
if(!opts.no_img) {
|
||||
|
||||
var testSrc = data_pre + 'PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNzUiIGhlaWdodD0iMjc1Ij48L3N2Zz4%3D';
|
||||
|
||||
testImg = $(new Image()).attr({
|
||||
src: testSrc,
|
||||
width: 0,
|
||||
height: 0
|
||||
}).appendTo('body')
|
||||
.load(function () {
|
||||
// Safari 4 crashes, Opera and Chrome don't
|
||||
makeIcons(!isSafari);
|
||||
}).error(function () {
|
||||
makeIcons();
|
||||
});
|
||||
} else {
|
||||
setTimeout(function() {
|
||||
if(!icons_made) makeIcons();
|
||||
},500);
|
||||
}
|
||||
}
|
||||
|
||||
function makeIcons(toImage, fallback) {
|
||||
|
@ -290,9 +343,12 @@ $(function() {
|
|||
var id = elem.getAttribute('id');
|
||||
if(id == 'svg_eof') return;
|
||||
holder = $('#' + id);
|
||||
|
||||
var svg = elem.getElementsByTagNameNS(svgns, 'svg')[0];
|
||||
var svgroot = svgdoc.createElementNS(svgns, "svg");
|
||||
if(elem.getElementsByTagNameNS) {
|
||||
var svg = elem.getElementsByTagNameNS(svgns, 'svg')[0];
|
||||
} else {
|
||||
var svg = elem.getElementsByTagName('svg')[0];
|
||||
}
|
||||
var svgroot = document.createElementNS(svgns, "svg");
|
||||
svgroot.setAttributeNS(svgns, 'viewBox', [0,0,icon_w,icon_h].join(' '));
|
||||
|
||||
// Make flexible by converting width/height to viewBox
|
||||
|
@ -318,7 +374,13 @@ $(function() {
|
|||
// With cloning, causes issue in Opera/Win/Non-EN
|
||||
if(!isOpera) svg = svg.cloneNode(true);
|
||||
|
||||
svgroot.appendChild(svg);
|
||||
// TODO: Figure out why makeSVG is necessary for IE9
|
||||
try {
|
||||
svgroot.appendChild(svg);
|
||||
} catch(e) {
|
||||
// For IE9
|
||||
svgroot.appendChild(makeSVG(svg));
|
||||
}
|
||||
|
||||
if(toImage) {
|
||||
// Without cloning, Safari will crash
|
||||
|
@ -339,8 +401,12 @@ $(function() {
|
|||
$.each(opts.placement, function(sel, id) {
|
||||
if(!svg_icons[id]) return;
|
||||
$(sel).each(function(i) {
|
||||
var copy = svg_icons[id].clone();
|
||||
if(i > 0 && !toImage) copy = fixIDs(copy, i, true);
|
||||
// TODO: Figure out why makeSVG is necessary for IE9
|
||||
try {
|
||||
var copy = svg_icons[id].clone();
|
||||
} catch(e) {
|
||||
var copy = makeSVG(svg_icons[id][0]);
|
||||
}
|
||||
setIcon($(this), copy, id);
|
||||
})
|
||||
});
|
||||
|
@ -348,11 +414,9 @@ $(function() {
|
|||
if(!fallback) {
|
||||
if(toImage) temp_holder.remove();
|
||||
if(data_el) data_el.remove();
|
||||
testImg.remove();
|
||||
if(testImg) testImg.remove();
|
||||
}
|
||||
|
||||
if(opts.resize) $.resizeSvgIcons(opts.resize);
|
||||
|
||||
icons_made = true;
|
||||
|
||||
if(opts.callback) opts.callback(svg_icons);
|
||||
|
|
Loading…
Reference in New Issue