drag and drop upload
Mark MacKay
parent
6c83a8d487
commit
f84faccc60
Binary file not shown.
|
|
@ -10,70 +10,70 @@
|
|||
svgEditor.addExtension("server_opensave", {
|
||||
callback: function() {
|
||||
|
||||
var save_svg_action = 'extensions/filesave.php';
|
||||
var save_png_action = 'extensions/filesave.php';
|
||||
//var save_svg_action = 'extensions/filesave.php';
|
||||
//var save_png_action = 'extensions/filesave.php';
|
||||
|
||||
// Create upload target (hidden iframe)
|
||||
var target = $('<iframe name="output_frame" />').hide().appendTo('body');
|
||||
|
||||
svgEditor.setCustomHandlers({
|
||||
save: function(win, data) {
|
||||
var svg = "<?xml version=\"1.0\"?>\n" + data;
|
||||
|
||||
var title = svgCanvas.getDocumentTitle();
|
||||
var filename = title.replace(/[^a-z0-9\.\_\-]+/gi, '_');
|
||||
|
||||
var form = $('<form>').attr({
|
||||
method: 'post',
|
||||
action: save_svg_action,
|
||||
target: 'output_frame'
|
||||
}) .append('<input type="hidden" name="output_svg" value="' + encodeURI(svg) + '">')
|
||||
.append('<input type="hidden" name="filename" value="' + filename + '">')
|
||||
.appendTo('body')
|
||||
.submit().remove();
|
||||
},
|
||||
pngsave: function(win, data) {
|
||||
var issues = data.issues;
|
||||
|
||||
if(!$('#export_canvas').length) {
|
||||
$('<canvas>', {id: 'export_canvas'}).hide().appendTo('body');
|
||||
}
|
||||
var c = $('#export_canvas')[0];
|
||||
|
||||
c.width = svgCanvas.contentW;
|
||||
c.height = svgCanvas.contentH;
|
||||
canvg(c, data.svg, {renderCallback: function() {
|
||||
var datauri = c.toDataURL('image/png');
|
||||
|
||||
var uiStrings = svgEditor.uiStrings;
|
||||
var note = '';
|
||||
|
||||
// Check if there's issues
|
||||
if(issues.length) {
|
||||
var pre = "\n \u2022 ";
|
||||
note += ("\n\n" + pre + issues.join(pre));
|
||||
}
|
||||
|
||||
if(note.length) {
|
||||
alert(note);
|
||||
}
|
||||
|
||||
var title = svgCanvas.getDocumentTitle();
|
||||
var filename = title.replace(/[^a-z0-9\.\_\-]+/gi, '_');
|
||||
|
||||
var form = $('<form>').attr({
|
||||
method: 'post',
|
||||
action: save_png_action,
|
||||
target: 'output_frame'
|
||||
}) .append('<input type="hidden" name="output_png" value="' + datauri + '">')
|
||||
.append('<input type="hidden" name="filename" value="' + filename + '">')
|
||||
.appendTo('body')
|
||||
.submit().remove();
|
||||
}});
|
||||
|
||||
|
||||
}
|
||||
});
|
||||
//svgEditor.setCustomHandlers({
|
||||
// save: function(win, data) {
|
||||
// var svg = "<?xml version=\"1.0\"?>\n" + data;
|
||||
//
|
||||
// var title = svgCanvas.getDocumentTitle();
|
||||
// var filename = title.replace(/[^a-z0-9\.\_\-]+/gi, '_');
|
||||
//
|
||||
// var form = $('<form>').attr({
|
||||
// method: 'post',
|
||||
// action: save_svg_action,
|
||||
// target: 'output_frame'
|
||||
// }) .append('<input type="hidden" name="output_svg" value="' + encodeURI(svg) + '">')
|
||||
// .append('<input type="hidden" name="filename" value="' + filename + '">')
|
||||
// .appendTo('body')
|
||||
// .submit().remove();
|
||||
// },
|
||||
// pngsave: function(win, data) {
|
||||
// var issues = data.issues;
|
||||
//
|
||||
// if(!$('#export_canvas').length) {
|
||||
// $('<canvas>', {id: 'export_canvas'}).hide().appendTo('body');
|
||||
// }
|
||||
// var c = $('#export_canvas')[0];
|
||||
//
|
||||
// c.width = svgCanvas.contentW;
|
||||
// c.height = svgCanvas.contentH;
|
||||
// canvg(c, data.svg, {renderCallback: function() {
|
||||
// var datauri = c.toDataURL('image/png');
|
||||
//
|
||||
// var uiStrings = svgEditor.uiStrings;
|
||||
// var note = '';
|
||||
//
|
||||
// // Check if there's issues
|
||||
// if(issues.length) {
|
||||
// var pre = "\n \u2022 ";
|
||||
// note += ("\n\n" + pre + issues.join(pre));
|
||||
// }
|
||||
//
|
||||
// if(note.length) {
|
||||
// alert(note);
|
||||
// }
|
||||
//
|
||||
// var title = svgCanvas.getDocumentTitle();
|
||||
// var filename = title.replace(/[^a-z0-9\.\_\-]+/gi, '_');
|
||||
//
|
||||
// var form = $('<form>').attr({
|
||||
// method: 'post',
|
||||
// action: save_png_action,
|
||||
// target: 'output_frame'
|
||||
// }) .append('<input type="hidden" name="output_png" value="' + datauri + '">')
|
||||
// .append('<input type="hidden" name="filename" value="' + filename + '">')
|
||||
// .appendTo('body')
|
||||
// .submit().remove();
|
||||
// }});
|
||||
//
|
||||
//
|
||||
// }
|
||||
//});
|
||||
|
||||
// Do nothing if client support is found
|
||||
if(window.FileReader) return;
|
||||
|
|
|
|||
|
|
@ -236,6 +236,7 @@ svgedit.math.snapToAngle = function(x1,y1,x2,y2) {
|
|||
// Returns:
|
||||
// Boolean that's true if rectangles intersect
|
||||
svgedit.math.rectsIntersect = function(r1, r2) {
|
||||
if (typeof r1 == 'undefined' || typeof r2 == 'undefined') return false;
|
||||
return r2.x < (r1.x+r1.width) &&
|
||||
(r2.x+r2.width) > r1.x &&
|
||||
r2.y < (r1.y+r1.height) &&
|
||||
|
|
|
|||
|
|
@ -886,7 +886,7 @@ svgedit.path.removePath_ = function(id) {
|
|||
if(id in pathData) delete pathData[id];
|
||||
};
|
||||
|
||||
var getRotVals = function(x, y) {
|
||||
var getRotVals = function(x, y, oldcx, oldcy, newcx, newcy, angle) {
|
||||
dx = x - oldcx;
|
||||
dy = y - oldcy;
|
||||
|
||||
|
|
@ -905,7 +905,6 @@ var getRotVals = function(x, y) {
|
|||
|
||||
r = Math.sqrt(dx*dx + dy*dy);
|
||||
theta = Math.atan2(dy,dx) - angle;
|
||||
|
||||
return {'x':(r * Math.cos(theta) + newcx)/1,
|
||||
'y':(r * Math.sin(theta) + newcy)/1};
|
||||
};
|
||||
|
|
@ -946,11 +945,11 @@ svgedit.path.recalcRotatedPath = function() {
|
|||
type = seg.pathSegType;
|
||||
if(type == 1) continue;
|
||||
|
||||
var rvals = getRotVals(seg.x,seg.y),
|
||||
var rvals = getRotVals(seg.x,seg.y, oldcx, oldcy, newcx, newcy, angle),
|
||||
points = [rvals.x, rvals.y];
|
||||
if(seg.x1 != null && seg.x2 != null) {
|
||||
c_vals1 = getRotVals(seg.x1, seg.y1);
|
||||
c_vals2 = getRotVals(seg.x2, seg.y2);
|
||||
c_vals1 = getRotVals(seg.x1, seg.y1, oldcx, oldcy, newcx, newcy, angle);
|
||||
c_vals2 = getRotVals(seg.x2, seg.y2, oldcx, oldcy, newcx, newcy, angle);
|
||||
points.splice(points.length, 0, c_vals1.x , c_vals1.y, c_vals2.x, c_vals2.y);
|
||||
}
|
||||
svgedit.path.replacePathSeg(type, i, points);
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
/* Comment to prevent wrong concat */
|
||||
|
||||
body {
|
||||
background: #2F2F2C;
|
||||
background: #3f3f3c;
|
||||
font: 13px/120% 'Lucida Sans', 'Lucida Grande', 'Lucida Sans Unicode', sans-serif;
|
||||
-webkit-touch-callout: none;
|
||||
-webkit-user-select: none;
|
||||
|
|
@ -57,8 +57,15 @@ html, body {
|
|||
left: 0;
|
||||
}
|
||||
|
||||
#svg_editor {
|
||||
background: #2f2f2c;
|
||||
}
|
||||
|
||||
#menu_bar {
|
||||
margin: 0 0 0 50px
|
||||
padding: 0 0 0 50px;
|
||||
background: #2f2f2c;
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
#menu_bar.active .menu.open .menu_list {
|
||||
|
|
@ -373,7 +380,7 @@ html, body {
|
|||
display: none;
|
||||
}
|
||||
|
||||
#path_node_panel .tool_button {
|
||||
#use_panel .tool_button, #path_node_panel .tool_button {
|
||||
color: #999;
|
||||
border: solid #3F3F3C 1px;
|
||||
border-radius: 3px;
|
||||
|
|
@ -387,6 +394,12 @@ html, body {
|
|||
line-height: 24px;
|
||||
}
|
||||
|
||||
#use_panel .tool_button {
|
||||
padding-left: 10px;
|
||||
margin-bottom: 10px;
|
||||
width: 124px;
|
||||
}
|
||||
|
||||
#path_node_panel .tool_button img, #path_node_panel .tool_button svg {
|
||||
position: absolute;
|
||||
left: 5px;
|
||||
|
|
@ -522,6 +535,11 @@ html, body {
|
|||
background-color: #444;
|
||||
overflow: auto;
|
||||
text-align: center;
|
||||
-webkit-transition: -webkit-transform 500ms cubic-bezier(0.13,0.66,0.24,0.92);
|
||||
-moz-transition: -moz-transform 500ms cubic-bezier(0.13,0.66,0.24,0.92);
|
||||
-o-transition: -o-transform 500ms cubic-bezier(0.13,0.66,0.24,0.92);
|
||||
-ms-transition: -ms-transform 500ms cubic-bezier(0.13,0.66,0.24,0.92);
|
||||
transition: transform 500ms cubic-bezier(0.13,0.66,0.24,0.92);
|
||||
}
|
||||
|
||||
.touch div#workarea {
|
||||
|
|
@ -592,11 +610,13 @@ html, body {
|
|||
#tools_top {
|
||||
position: absolute;
|
||||
width: 160px;
|
||||
height: 100%;
|
||||
background: #2f2f2c;
|
||||
right: 0;
|
||||
top: 20px;
|
||||
border-bottom: none;
|
||||
overflow: visible;
|
||||
padding: 0 0 0 10px;
|
||||
padding: 0 0 0 15px;
|
||||
}
|
||||
|
||||
.touch #tools_top {
|
||||
|
|
@ -709,6 +729,7 @@ box-shadow: inset 0 3px 10px rgba(255, 255, 255, 0.1),
|
|||
border-right: none;
|
||||
width: 50px;
|
||||
top: 30px;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
background: #2F2F2C; /* Needed so flyout icons don't appear on the left */
|
||||
z-index: 4;
|
||||
|
|
@ -934,7 +955,7 @@ box-shadow: inset 0 3px 10px rgba(255, 255, 255, 0.1),
|
|||
|
||||
#tool_open input,
|
||||
#tool_import input,
|
||||
#tool_image input {
|
||||
#tool_import_bitmap input {
|
||||
position: absolute;
|
||||
opacity: 0;
|
||||
font-size: 10em;
|
||||
|
|
@ -1019,6 +1040,7 @@ box-shadow: inset 0 3px 10px rgba(255, 255, 255, 0.1),
|
|||
bottom: 0;
|
||||
height: 40px;
|
||||
overflow: visible;
|
||||
background: #2f2f2c;
|
||||
}
|
||||
|
||||
#tools_bottom_1 {
|
||||
|
|
@ -1322,10 +1344,22 @@ box-shadow: inset 0 3px 10px rgba(255, 255, 255, 0.1),
|
|||
#dialog_content {
|
||||
height: 95px;
|
||||
margin: 10px 10px 5px 10px;
|
||||
background: #DDD;
|
||||
overflow: auto;
|
||||
text-align: left;
|
||||
border: 1px solid #B0B0B0;
|
||||
font-size: 13px;
|
||||
}
|
||||
|
||||
#dialog_buttons input:last-child {
|
||||
background: #999 !important;
|
||||
position: absolute;
|
||||
left: 10px;
|
||||
bottom: 10px;
|
||||
}
|
||||
|
||||
#dialog_buttons input:first-child {
|
||||
position: absolute;
|
||||
right: 10px;
|
||||
bottom: 10px;
|
||||
}
|
||||
|
||||
#dialog_content.prompt {
|
||||
|
|
@ -1339,8 +1373,6 @@ box-shadow: inset 0 3px 10px rgba(255, 255, 255, 0.1),
|
|||
|
||||
#dialog_container {
|
||||
position: absolute;
|
||||
font-family: Verdana;
|
||||
text-align: center;
|
||||
left: 50%;
|
||||
top: 50%;
|
||||
width: 300px;
|
||||
|
|
@ -1349,16 +1381,12 @@ box-shadow: inset 0 3px 10px rgba(255, 255, 255, 0.1),
|
|||
margin-top: -80px;
|
||||
position:fixed;
|
||||
z-index:50001;
|
||||
background: #CCC;
|
||||
border: 1px outset #777;
|
||||
font-family:Verdana,Helvetica,sans-serif;
|
||||
font-size:0.8em;
|
||||
background: #fff;
|
||||
}
|
||||
|
||||
|
||||
#dialog_container, #dialog_content {
|
||||
border-radius: 5px;
|
||||
-moz-border-radius: 5px;
|
||||
-webkit-border-radius: 5px;
|
||||
border-radius: 3px;
|
||||
}
|
||||
|
||||
#dialog_buttons input[type=text] {
|
||||
|
|
|
|||
|
|
@ -55,7 +55,6 @@
|
|||
<script type="text/javascript" src="extensions/ext-grid.js"></script>
|
||||
<script type="text/javascript" src="requestanimationframe.js"></script>
|
||||
<script type="text/javascript" src="taphold.js"></script>
|
||||
<script type="text/javascript" src="extensions/ext-server_opensave.js"></script>
|
||||
<!--{endif}-->
|
||||
|
||||
|
||||
|
|
@ -99,9 +98,9 @@
|
|||
<div class="menu">
|
||||
<div class="menu_title">File</div>
|
||||
<div class="menu_list" id="file_menu">
|
||||
<div id="tool_clear" class="menu_item">New Image</div>
|
||||
<div id="tool_open" class="menu_item"><div id="fileinputs"></div>Open SVG...</div>
|
||||
<div id="tool_import" class="menu_item"><div id="fileinputs_import"></div>Place SVG...</div>
|
||||
<div id="tool_clear" class="menu_item">New Document</div>
|
||||
<div id="tool_open" class="menu_item" style="display: none;"><div id="fileinputs"></div>Open SVG...</div>
|
||||
<div id="tool_import" class="menu_item" style="display: none;"><div id="fileinputs_import"></div>Import Image...</div>
|
||||
<div id="tool_save" class="menu_item">Save Image... <span class="shortcut">⌘S</span></div>
|
||||
<div id="tool_export" class="menu_item">Export as PNG</div>
|
||||
</div>
|
||||
|
|
@ -357,17 +356,17 @@
|
|||
</div>
|
||||
|
||||
<div id="use_panel" class="context_panel clearfix">
|
||||
<div class="push_button" id="tool_unlink_use" data-title="Break link to reference element (make unique)"></div>
|
||||
<div class="tool_button clearfix" id="tool_unlink_use" data-title="Break link to reference element (make unique)">Break link reference</div>
|
||||
</div>
|
||||
|
||||
<div id="g_panel" class="context_panel clearfix">
|
||||
<h4>Group</h4>
|
||||
<label>
|
||||
<input id="g_x" class="attr_changer" data-title="Change ellipse's cx coordinate" size="3" data-attr="x" pattern="[0-9]*" />
|
||||
<input id="g_x" class="attr_changer" data-title="Change groups's x coordinate" size="3" data-attr="x" pattern="[0-9]*" />
|
||||
<span>X</span>
|
||||
</label>
|
||||
<label>
|
||||
<input id="g_y" class="attr_changer" data-title="Change ellipse's cy coordinate" size="3" data-attr="y" pattern="[0-9]*" />
|
||||
<input id="g_y" class="attr_changer" data-title="Change groups's y coordinate" size="3" data-attr="y" pattern="[0-9]*" />
|
||||
<span>Y</span>
|
||||
</label>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -71,8 +71,8 @@
|
|||
"enterNewLayerName":"Please enter the new layer name",
|
||||
"layerHasThatName":"Layer already has that name",
|
||||
"QmoveElemsToLayer":"Move selected elements to layer \"%s\"?",
|
||||
"QwantToClear":"Do you want to clear the drawing?\nThis will also erase your undo history!",
|
||||
"QwantToOpen":"Do you want to open a new file?\nThis will also erase your undo history!",
|
||||
"QwantToClear":"<strong>Do you want to clear the drawing?</strong>\nThis will also erase your undo history",
|
||||
"QwantToOpen":"Do you want to open a new file?\nThis will also erase your undo history",
|
||||
"QerrorsRevertToSource":"There were parsing errors in your SVG source.\nRevert back to original SVG source?",
|
||||
"QignoreSourceChanges":"Ignore changes made to SVG source?",
|
||||
"featNotSupported":"Feature not supported",
|
||||
|
|
@ -383,7 +383,7 @@
|
|||
if(type != 'alert') {
|
||||
$('<input type="button" value="' + uiStrings.common.cancel + '">')
|
||||
.appendTo(btn_holder)
|
||||
.on("click, touchstart", function() { box.hide();callback(false)});
|
||||
.on("click touchstart", function() { box.hide();callback(false)});
|
||||
}
|
||||
|
||||
if(type == 'prompt') {
|
||||
|
|
@ -475,7 +475,7 @@
|
|||
|
||||
// Chrome 5 (and 6?) don't allow saving, show source instead ( http://code.google.com/p/chromium/issues/detail?id=46735 )
|
||||
// IE9 doesn't allow standalone Data URLs ( https://connect.microsoft.com/IE/feedback/details/542600/data-uri-images-fail-when-loaded-by-themselves )
|
||||
if((~ua.indexOf('Chrome') && $.browser.version >= 533) || ~ua.indexOf('MSIE')) {
|
||||
if(~ua.indexOf('MSIE')) {
|
||||
showSourceEditor(0,true);
|
||||
return;
|
||||
}
|
||||
|
|
@ -547,7 +547,6 @@
|
|||
elems = elems.filter(Boolean)
|
||||
multiselected = (elems.length >= 2) ? elems : false;
|
||||
if (svgCanvas.elementsAreSame(multiselected)) selectedElement = multiselected[0]
|
||||
|
||||
if (selectedElement != null) {
|
||||
$('#multiselected_panel').hide()
|
||||
updateToolbar();
|
||||
|
|
@ -1306,22 +1305,26 @@
|
|||
// This function also updates the opacity and id elements that are in the context panel
|
||||
var updateToolbar = function() {
|
||||
if (selectedElement != null) {
|
||||
|
||||
switch ( selectedElement.tagName ) {
|
||||
case 'use':
|
||||
$(".context_panel").hide();
|
||||
$("#use_panel").show();
|
||||
break;
|
||||
case 'image':
|
||||
$(".context_panel").hide();
|
||||
$("#image_panel").show();
|
||||
break;
|
||||
case 'foreignObject':
|
||||
$(".context_panel").hide();
|
||||
break;
|
||||
case 'g':
|
||||
case 'a':
|
||||
// Look for common styles
|
||||
|
||||
var gWidth = null;
|
||||
|
||||
var childs = selectedElement.getElementsByTagName('*');
|
||||
for(var i = 0, len = childs.length; i < len; i++) {
|
||||
var swidth = childs[i].getAttribute("stroke-width");
|
||||
|
||||
if(i === 0) {
|
||||
gWidth = swidth;
|
||||
} else if(gWidth !== swidth) {
|
||||
|
|
@ -1329,18 +1332,15 @@
|
|||
}
|
||||
}
|
||||
|
||||
$('#stroke_width').val(gWidth === null ? "" : gWidth);
|
||||
//Editor.paintBox.fill.update(false);
|
||||
//Editor.paintBox.stroke.update(false);
|
||||
|
||||
|
||||
$('#stroke_width').val(gWidth === null ? "0" : gWidth);
|
||||
updateContextPanel();
|
||||
break;
|
||||
default:
|
||||
//removed because multiselect shouldnt set color
|
||||
//Editor.paintBox.fill.update(false);
|
||||
//Editor.paintBox.stroke.update(false);
|
||||
|
||||
$('#stroke_width').val(selectedElement.getAttribute("stroke-width") || 1);
|
||||
$('#stroke_width').val(selectedElement.getAttribute("stroke-width") || 0);
|
||||
var dash = selectedElement.getAttribute("stroke-dasharray") || "none"
|
||||
$('option', '#stroke_style').removeAttr('selected');
|
||||
$('#stroke_style option[value="'+ dash +'"]').attr("selected", "selected");
|
||||
|
|
@ -1365,8 +1365,6 @@
|
|||
$('#group_opacity').val(opac_perc);
|
||||
$.fn.dragInput.updateCursor($('#group_opacity')[0])
|
||||
}
|
||||
|
||||
updateToolButtonState();
|
||||
};
|
||||
|
||||
var setImageURL = Editor.setImageURL = function(url) {
|
||||
|
|
@ -1393,7 +1391,6 @@
|
|||
var unit = curConfig.baseUnit !== 'px' ? curConfig.baseUnit : null;
|
||||
var is_node = currentMode == 'pathedit'; //elem ? (elem.id && elem.id.indexOf('pathpointgrip') == 0) : false;
|
||||
|
||||
|
||||
if (is_node) {
|
||||
$('.context_panel').hide();
|
||||
$('#path_node_panel').show();
|
||||
|
|
@ -1415,6 +1412,7 @@
|
|||
$('#path_node_y').val(Math.round(point.y));
|
||||
if(point.type) {
|
||||
seg_type.val(point.type).removeAttr('disabled');
|
||||
$("#seg_type_label").html(point.type == 4 ? "Straight" : "Curve")
|
||||
} else {
|
||||
seg_type.val(4).attr('disabled','disabled');
|
||||
}
|
||||
|
|
@ -1887,7 +1885,7 @@
|
|||
return false;
|
||||
}
|
||||
var closer = function(e){
|
||||
if (e.target.nodeName.toLowerCase() === "input") return false;
|
||||
if (e.target.nodeName && e.target.nodeName.toLowerCase() === "input") return false;
|
||||
if (!$(e.target).hasClass("menu_title") && !$(e.target).parent().hasClass("menu_title")) {
|
||||
if(!$(e.target).hasClass("disabled") && $(e.target).hasClass("menu_item")) blinker(e)
|
||||
else $('#menu_bar').removeClass('active')
|
||||
|
|
@ -2835,65 +2833,6 @@
|
|||
});
|
||||
};
|
||||
|
||||
var updateToolButtonState = function() {
|
||||
/*
|
||||
var bNoFill = (svgCanvas.getColor('fill') == 'none');
|
||||
var bNoStroke = (svgCanvas.getColor('stroke') == 'none');
|
||||
var buttonsNeedingStroke = [ '#tool_fhpath', '#tool_line' ];
|
||||
var buttonsNeedingFillAndStroke = [ '#tools_rect .tool_button', '#tools_ellipse .tool_button', '#tool_text', '#tool_path'];
|
||||
if (bNoStroke) {
|
||||
for (var index in buttonsNeedingStroke) {
|
||||
var button = buttonsNeedingStroke[index];
|
||||
if ($(button).hasClass('tool_button_current')) {
|
||||
clickSelect();
|
||||
}
|
||||
$(button).addClass('disabled');
|
||||
}
|
||||
}
|
||||
else {
|
||||
for (var index in buttonsNeedingStroke) {
|
||||
var button = buttonsNeedingStroke[index];
|
||||
$(button).removeClass('disabled');
|
||||
}
|
||||
}
|
||||
|
||||
if (bNoStroke && bNoFill) {
|
||||
for (var index in buttonsNeedingFillAndStroke) {
|
||||
var button = buttonsNeedingFillAndStroke[index];
|
||||
if ($(button).hasClass('tool_button_current')) {
|
||||
clickSelect();
|
||||
}
|
||||
$(button).addClass('disabled');
|
||||
}
|
||||
}
|
||||
else {
|
||||
for (var index in buttonsNeedingFillAndStroke) {
|
||||
var button = buttonsNeedingFillAndStroke[index];
|
||||
$(button).removeClass('disabled');
|
||||
}
|
||||
}
|
||||
|
||||
svgCanvas.runExtensions("toolButtonStateUpdate", {
|
||||
nofill: bNoFill,
|
||||
nostroke: bNoStroke
|
||||
});
|
||||
|
||||
// Disable flyouts if all inside are disabled
|
||||
$('.tools_flyout').each(function() {
|
||||
var shower = $('#' + this.id + '_show');
|
||||
var has_enabled = false;
|
||||
$(this).children().each(function() {
|
||||
if(!$(this).hasClass('disabled')) {
|
||||
has_enabled = true;
|
||||
}
|
||||
});
|
||||
shower.toggleClass('disabled', !has_enabled);
|
||||
});
|
||||
|
||||
operaRepaint();
|
||||
*/
|
||||
};
|
||||
|
||||
var PaintBox = function(container, type) {
|
||||
var background = document.getElementById("canvas_background");
|
||||
var cur = {color: "fff", opacity: 1}
|
||||
|
|
@ -3637,12 +3576,108 @@
|
|||
}
|
||||
}
|
||||
|
||||
// use HTML5 File API: http://www.w3.org/TR/FileAPI/
|
||||
// if browser has HTML5 File API support, then we will show the open menu item
|
||||
// and provide a file input to click. When that change event fires, it will
|
||||
// get the text contents of the file and send it to the canvas
|
||||
if (window.FileReader) {
|
||||
var inp = $('<input type="file">').change(function() {
|
||||
|
||||
var import_image = function(e) {
|
||||
e.stopPropagation();
|
||||
e.preventDefault();
|
||||
$("#workarea").removeAttr("style");
|
||||
$('#main_menu').hide();
|
||||
var file = null;
|
||||
if (e.type == "drop") file = e.dataTransfer.files[0]
|
||||
else file = this.files[0];
|
||||
if (file) {
|
||||
if(file.type.indexOf("image") != -1) {
|
||||
//detected an image
|
||||
|
||||
//svg handing
|
||||
if(file.type.indexOf("svg") != -1) {
|
||||
var reader = new FileReader();
|
||||
reader.onloadend = function(e) {
|
||||
svgCanvas.importSvgString(e.target.result, true);
|
||||
svgCanvas.ungroupSelectedElement()
|
||||
svgCanvas.ungroupSelectedElement()
|
||||
svgCanvas.groupSelectedElements()
|
||||
svgCanvas.alignSelectedElements("m", "page")
|
||||
svgCanvas.alignSelectedElements("c", "page")
|
||||
};
|
||||
reader.readAsText(file);
|
||||
}
|
||||
|
||||
//image handling
|
||||
else {
|
||||
var reader = new FileReader();
|
||||
reader.onloadend = function(e) {
|
||||
// lets insert the new image until we know its dimensions
|
||||
insertNewImage = function(img_width, img_height){
|
||||
var newImage = svgCanvas.addSvgElementFromJson({
|
||||
"element": "image",
|
||||
"attr": {
|
||||
"x": 0,
|
||||
"y": 0,
|
||||
"width": img_width,
|
||||
"height": img_height,
|
||||
"id": svgCanvas.getNextId(),
|
||||
"style": "pointer-events:inherit"
|
||||
}
|
||||
});
|
||||
svgCanvas.setHref(newImage, e.target.result);
|
||||
svgCanvas.selectOnly([newImage])
|
||||
svgCanvas.alignSelectedElements("m", "page")
|
||||
svgCanvas.alignSelectedElements("c", "page")
|
||||
updateContextPanel();
|
||||
}
|
||||
// put a placeholder img so we know the default dimensions
|
||||
var img_width = 100;
|
||||
var img_height = 100;
|
||||
var img = new Image()
|
||||
img.src = e.target.result
|
||||
document.body.appendChild(img);
|
||||
img.onload = function() {
|
||||
img_width = img.offsetWidth
|
||||
img_height = img.offsetHeight
|
||||
insertNewImage(img_width, img_height);
|
||||
document.body.removeChild(img);
|
||||
}
|
||||
};
|
||||
reader.readAsDataURL(file)
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
var workarea = $("#workarea")
|
||||
|
||||
function onDragEnter(e) {
|
||||
e.stopPropagation();
|
||||
e.preventDefault();
|
||||
workarea.css({
|
||||
"-webkit-transform": "scale3d(1.1,1.1,1)",
|
||||
"-moz-transform": "scale3d(1.1,1.1,1)",
|
||||
"-o-transform": "scale(1.1)",
|
||||
"-ms-transform": "scale3d(1.1,1.1,1)",
|
||||
"transform": "scale3d(1.1,1.1,1)"
|
||||
})
|
||||
|
||||
}
|
||||
|
||||
function onDragOver(e) {
|
||||
e.stopPropagation();
|
||||
e.preventDefault();
|
||||
}
|
||||
|
||||
function onDragLeave(e) {
|
||||
workarea.removeAttr("style")
|
||||
e.stopPropagation();
|
||||
e.preventDefault();
|
||||
}
|
||||
|
||||
workarea[0].addEventListener('dragenter', onDragEnter, false);
|
||||
workarea[0].addEventListener('dragover', onDragOver, false);
|
||||
workarea[0].addEventListener('dragleave', onDragLeave, false);
|
||||
workarea[0].addEventListener('drop', import_image, false);
|
||||
|
||||
var open = $('<input type="file">').change(function() {
|
||||
var f = this;
|
||||
Editor.openPrep(function(ok) {
|
||||
if(!ok) return;
|
||||
|
|
@ -3657,21 +3692,13 @@
|
|||
}
|
||||
});
|
||||
});
|
||||
$("#tool_open").show().prepend(inp);
|
||||
var inp2 = $('<input type="file">').change(function() {
|
||||
$('#main_menu').hide();
|
||||
if(this.files.length==1) {
|
||||
var reader = new FileReader();
|
||||
reader.onloadend = function(e) {
|
||||
svgCanvas.importSvgString(e.target.result, true);
|
||||
updateCanvas();
|
||||
};
|
||||
reader.readAsText(this.files[0]);
|
||||
}
|
||||
});
|
||||
$("#tool_import").show().prepend(inp2);
|
||||
$("#tool_open").show().prepend(open);
|
||||
|
||||
var img_import = $('<input type="file">').change(import_image);
|
||||
$("#tool_import").show().prepend(img_import);
|
||||
}
|
||||
|
||||
|
||||
var updateCanvas = Editor.updateCanvas = function(center, new_ctr) {
|
||||
var w = workarea.width(), h = workarea.height();
|
||||
var w_orig = w, h_orig = h;
|
||||
|
|
|
|||
|
|
@ -1016,6 +1016,7 @@ this.setRotationAngle = function(val, preventUndo) {
|
|||
// ensure val is the proper type
|
||||
val = parseFloat(val);
|
||||
var elem = selectedElements[0];
|
||||
if (!elem) return;
|
||||
var oldTransform = elem.getAttribute("transform");
|
||||
var bbox = svgedit.utilities.getBBox(elem);
|
||||
var cx = bbox.x+bbox.width/2, cy = bbox.y+bbox.height/2;
|
||||
|
|
@ -3682,7 +3683,7 @@ var textActions = canvas.textActions = function() {
|
|||
display: 'inline'
|
||||
});
|
||||
|
||||
if(selblock) selblock.setAttribute('d', '');
|
||||
if(selblock) selblock.setAttribute('d', 'M 0 0');
|
||||
}
|
||||
|
||||
function setSelection(start, end, skipInput) {
|
||||
|
|
@ -4766,7 +4767,7 @@ var pathActions = canvas.pathActions = function() {
|
|||
var newseg = elem.createSVGPathSegLinetoAbs(start_item.x, start_item.y);
|
||||
|
||||
var closer = elem.createSVGPathSegClosePath();
|
||||
if(open_pt == svgedit.path.path.segs.length - 1) {
|
||||
if(open_pt == svgedit.path.path.segs.length) {
|
||||
list.appendItem(newseg);
|
||||
list.appendItem(closer);
|
||||
} else {
|
||||
|
|
|
|||
|
|
@ -89,7 +89,7 @@ div.jGraduate_Slider input{margin-top:5px}
|
|||
div.jGraduate_Slider img{top:0;left:0;position:absolute;cursor:ew-resize}
|
||||
.jPicker .Button .Ok,.jGraduate_Picker .jGraduate_OkCancel .jGraduate_Ok{-webkit-appearance:none;margin:0;position:absolute;bottom:5px;right:5px}
|
||||
.jPicker .Button .Cancel,.jGraduate_Picker .jGraduate_OkCancel .jGraduate_Cancel{margin:0;position:absolute;bottom:5px;left:5px}
|
||||
body{background:#2f2f2c;font:13px/120% 'Lucida Sans','Lucida Grande','Lucida Sans Unicode',sans-serif;-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;margin:0;padding:0}
|
||||
body{background:#3f3f3c;font:13px/120% 'Lucida Sans','Lucida Grande','Lucida Sans Unicode',sans-serif;-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;margin:0;padding:0}
|
||||
::selection{background:#000;color:#fff}
|
||||
::-moz-selection{background:#000;color:#fff}
|
||||
html,body{overflow:hidden;width:100%;height:100%}
|
||||
|
|
@ -99,7 +99,8 @@ html,body{overflow:hidden;width:100%;height:100%}
|
|||
::-webkit-scrollbar-corner{background:#444}
|
||||
#browser-not-supported{font-size:.8em;font-family:Verdana,Helvetica,Arial;color:#000}
|
||||
#svgroot{-moz-user-select:none;-webkit-user-select:none;position:absolute;top:0;left:0}
|
||||
#menu_bar{margin:0 0 0 50px}
|
||||
#svg_editor{background:#2f2f2c}
|
||||
#menu_bar{padding:0 0 0 50px;background:#2f2f2c;position:relative;z-index:1}
|
||||
#menu_bar.active .menu.open .menu_list{display:block}
|
||||
.menu{position:relative;z-index:5;color:#333;display:inline-block}
|
||||
.menu_title{cursor:pointer;display:inline-block;padding:7px 10px;z-index:10;color:#fff;position:relative;height:16px;vertical-align:top}
|
||||
|
|
@ -148,7 +149,8 @@ div#palette_holder #palette .palette_item{cursor:pointer}
|
|||
.touch #tool_fill .color_block{width:36px;height:36px}
|
||||
.touch #tool_fill .color_block svg{width:36px!important;height:36px!important}
|
||||
.touch #tool_switch{display:none}
|
||||
#path_node_panel .tool_button{color:#999;border:solid #3f3f3c 1px;border-radius:3px;padding:3px 10px 3px 40px;background:transparent;position:relative;margin-top:10px;width:90px;height:23px;line-height:24px}
|
||||
#use_panel .tool_button,#path_node_panel .tool_button{color:#999;border:solid #3f3f3c 1px;border-radius:3px;padding:3px 10px 3px 40px;background:transparent;position:relative;margin-top:10px;width:90px;height:23px;line-height:24px}
|
||||
#use_panel .tool_button{padding-left:10px;margin-bottom:10px;width:124px}
|
||||
#path_node_panel .tool_button img,#path_node_panel .tool_button svg{position:absolute;left:5px;top:3px}
|
||||
#color_tools #tool_fill .color_block:hover,#color_tools #tool_stroke .color_block:hover{border-color:#fff}
|
||||
#color_tools #tool_fill .color_block>div{position:absolute;top:0;left:0}
|
||||
|
|
@ -168,7 +170,7 @@ div#palette_holder #palette .palette_item{cursor:pointer}
|
|||
#color_tools .icon_label{padding:0;width:24px;height:100%;cursor:pointer;position:absolute}
|
||||
#linkLabel>svg{height:20px;padding-top:4px}
|
||||
div#palette{float:left;height:16px}
|
||||
div#workarea{display:inline-table-cell;position:absolute;top:30px;left:50px;bottom:40px;right:175px;background-color:#444;overflow:auto;text-align:center}
|
||||
div#workarea{display:inline-table-cell;position:absolute;top:30px;left:50px;bottom:40px;right:175px;background-color:#444;overflow:auto;text-align:center;-webkit-transition:-webkit-transform 500ms cubic-bezier(0.13,0.66,0.24,0.92);-moz-transition:-moz-transform 500ms cubic-bezier(0.13,0.66,0.24,0.92);-o-transition:-o-transform 500ms cubic-bezier(0.13,0.66,0.24,0.92);-ms-transition:-ms-transform 500ms cubic-bezier(0.13,0.66,0.24,0.92);transition:transform 500ms cubic-bezier(0.13,0.66,0.24,0.92)}
|
||||
.touch div#workarea{top:40px}
|
||||
div.palette_item{height:16px;width:16px;float:left}
|
||||
.touch div.palette_item{height:30px;border-top:solid #2f2f2c 5px;border-bottom:solid #2f2f2c 5px;width:19px;float:left}
|
||||
|
|
@ -181,7 +183,7 @@ div.palette_item{height:16px;width:16px;float:left}
|
|||
#tools_left .tool_button:after,#tools_left .tool_button_current:after{position:absolute;content:'';border:solid #2f2f2c 2px;top:-1px;left:-1px;width:26px;height:26px;z-index:0}
|
||||
#tools_left .tool_button_current{background-color:#0cf}
|
||||
#main_icon span{position:absolute;width:100%;height:100%;display:block;z-index:2}
|
||||
#tools_top{position:absolute;width:160px;right:0;top:20px;border-bottom:0;overflow:visible;padding:0 0 0 10px}
|
||||
#tools_top{position:absolute;width:160px;height:100%;background:#2f2f2c;right:0;top:20px;border-bottom:0;overflow:visible;padding:0 0 0 15px}
|
||||
.touch #tools_top{top:30px}
|
||||
label{display:block;color:#999}
|
||||
div#font-selector{width:140px;height:300px;overflow:auto;margin:0 auto;position:absolute;top:27px;right:0;border:1px solid black;padding:10px;display:none;background-color:white;z-index:10;border-radius:3px;box-shadow:0 5px 10px rgba(0,0,0,0.7)}
|
||||
|
|
@ -202,7 +204,7 @@ input[type=submit],input[type=button],button{background:#4f80ff;color:#fff;borde
|
|||
input[type=submit]:hover,button:hover{box-shadow:inset 0 3px 10px rgba(255,255,255,0.1),inset 0 -3px 10px rgba(0,0,0,0.2)}
|
||||
input[type=submit]:hover,button:hover{background:#2f84c1}
|
||||
input[type=submit]:active,button:active{box-shadow:inset 0 2px 2px rgba(0,0,0,0.2);border-bottom:solid rgba(255,255,255,0.1) 1px}
|
||||
#tools_left{position:absolute;border-right:0;width:50px;top:30px;left:0;background:#2f2f2c;z-index:4}
|
||||
#tools_left{position:absolute;border-right:0;width:50px;top:30px;bottom:0;left:0;background:#2f2f2c;z-index:4}
|
||||
#workarea.wireframe #svgcontent *{fill:none;stroke:#000;stroke-width:1px;stroke-opacity:1.0;stroke-dasharray:0;opacity:1;pointer-events:stroke;vector-effect:non-scaling-stroke;filter:none}
|
||||
#workarea.wireframe #svgcontent text{fill:#000;stroke:none}
|
||||
#workarea.wireframe #canvasBackground>rect{fill:#FFF!important}
|
||||
|
|
@ -233,7 +235,7 @@ input[type=submit]:active,button:active{box-shadow:inset 0 2px 2px rgba(0,0,0,0.
|
|||
.tool_button,.push_button,.tool_button_current,.push_button_pressed{height:27px;width:27px;border:solid #2f2f2c 8px;border-left-width:13px;margin:0;background-color:#ddd;cursor:pointer}
|
||||
#main_menu li#tool_open,#main_menu li#tool_import{position:relative;overflow:hidden}
|
||||
#tool_image{overflow:hidden}
|
||||
#tool_open input,#tool_import input,#tool_image input{position:absolute;opacity:0;font-size:10em;top:-5px;right:-5px;margin:0;cursor:pointer}
|
||||
#tool_open input,#tool_import input,#tool_import_bitmap input{position:absolute;opacity:0;font-size:10em;top:-5px;right:-5px;margin:0;cursor:pointer}
|
||||
.disabled{opacity:.5;cursor:default}
|
||||
.width_label{padding-right:5px}
|
||||
#text{position:absolute;left:-9999px}
|
||||
|
|
@ -243,7 +245,7 @@ input[type=submit]:active,button:active{box-shadow:inset 0 2px 2px rgba(0,0,0,0.
|
|||
.tools_flyout{position:absolute;display:none;cursor:pointer;width:385px;z-index:10;left:47px!important;height:324px;background:#fff;border-radius:5px;box-shadow:0 5px 10px rgba(0,0,0,0.5)}
|
||||
.tools_flyout_v{position:absolute;display:none;cursor:pointer;width:30px}
|
||||
.tools_flyout .tool_button{float:left;background-color:#fff;height:24px;width:24px}
|
||||
#tools_bottom{position:absolute;left:50px;right:0;bottom:0;height:40px;overflow:visible}
|
||||
#tools_bottom{position:absolute;left:50px;right:0;bottom:0;height:40px;overflow:visible;background:#2f2f2c}
|
||||
#tools_bottom_1{width:115px;float:left}
|
||||
#tools_bottom_2{position:relative;float:left;margin-top:5px}
|
||||
#tools_bottom input[type=text]{width:3.2em}
|
||||
|
|
@ -291,11 +293,13 @@ button.cancel,input.Cancel,input.cancel,input.jGraduate_Cancel,button.cancel{-we
|
|||
.toolbar_button button .svg_icon{display:none}
|
||||
#dialog_box{display:none}
|
||||
#dialog_box_overlay{background:black;opacity:.5;height:100%;left:0;position:absolute;top:0;width:100%;z-index:6}
|
||||
#dialog_content{height:95px;margin:10px 10px 5px 10px;background:#DDD;overflow:auto;text-align:left;border:1px solid #b0b0b0}
|
||||
#dialog_content{height:95px;margin:10px 10px 5px 10px;overflow:auto;text-align:left;font-size:13px}
|
||||
#dialog_buttons input:last-child{background:#999!important;position:absolute;left:10px;bottom:10px}
|
||||
#dialog_buttons input:first-child{position:absolute;right:10px;bottom:10px}
|
||||
#dialog_content.prompt{height:75px}
|
||||
#dialog_content p{margin:10px;line-height:1.3em}
|
||||
#dialog_container{position:absolute;font-family:Verdana;text-align:center;left:50%;top:50%;width:300px;margin-left:-150px;height:150px;margin-top:-80px;position:fixed;z-index:50001;background:#CCC;border:1px outset #777;font-family:Verdana,Helvetica,sans-serif;font-size:.8em}
|
||||
#dialog_container,#dialog_content{border-radius:5px;-moz-border-radius:5px;-webkit-border-radius:5px}
|
||||
#dialog_container{position:absolute;left:50%;top:50%;width:300px;margin-left:-150px;height:150px;margin-top:-80px;position:fixed;z-index:50001;background:#fff}
|
||||
#dialog_container,#dialog_content{border-radius:3px}
|
||||
#dialog_buttons input[type=text]{width:90%;display:block;margin:0 0 5px 11px}
|
||||
#dialog_buttons input[type=button]{margin:0 1em}
|
||||
.invisible{visibility:none}
|
||||
|
|
|
|||
File diff suppressed because it is too large
Load Diff
|
|
@ -463,7 +463,7 @@ function groupBBFix(selected) {
|
|||
// Parameters:
|
||||
// elem - Optional DOM element to get the BBox for
|
||||
svgedit.utilities.getBBox = function(elem) {
|
||||
var selected = elem || editorContext_.geSelectedElements()[0];
|
||||
var selected = elem || editorContext_.getSelectedElements()[0];
|
||||
if (elem.nodeType != 1) return null;
|
||||
var ret = null;
|
||||
var elname = selected.nodeName;
|
||||
|
|
|
|||
|
|
@ -583,7 +583,7 @@ div.jGraduate_Slider img {
|
|||
/* Comment to prevent wrong concat */
|
||||
|
||||
body {
|
||||
background: #2F2F2C;
|
||||
background: #3f3f3c;
|
||||
font: 13px/120% 'Lucida Sans', 'Lucida Grande', 'Lucida Sans Unicode', sans-serif;
|
||||
-webkit-touch-callout: none;
|
||||
-webkit-user-select: none;
|
||||
|
|
@ -639,8 +639,15 @@ html, body {
|
|||
left: 0;
|
||||
}
|
||||
|
||||
#svg_editor {
|
||||
background: #2f2f2c;
|
||||
}
|
||||
|
||||
#menu_bar {
|
||||
margin: 0 0 0 50px
|
||||
padding: 0 0 0 50px;
|
||||
background: #2f2f2c;
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
#menu_bar.active .menu.open .menu_list {
|
||||
|
|
@ -955,7 +962,7 @@ html, body {
|
|||
display: none;
|
||||
}
|
||||
|
||||
#path_node_panel .tool_button {
|
||||
#use_panel .tool_button, #path_node_panel .tool_button {
|
||||
color: #999;
|
||||
border: solid #3F3F3C 1px;
|
||||
border-radius: 3px;
|
||||
|
|
@ -969,6 +976,12 @@ html, body {
|
|||
line-height: 24px;
|
||||
}
|
||||
|
||||
#use_panel .tool_button {
|
||||
padding-left: 10px;
|
||||
margin-bottom: 10px;
|
||||
width: 124px;
|
||||
}
|
||||
|
||||
#path_node_panel .tool_button img, #path_node_panel .tool_button svg {
|
||||
position: absolute;
|
||||
left: 5px;
|
||||
|
|
@ -1104,6 +1117,11 @@ html, body {
|
|||
background-color: #444;
|
||||
overflow: auto;
|
||||
text-align: center;
|
||||
-webkit-transition: -webkit-transform 500ms cubic-bezier(0.13,0.66,0.24,0.92);
|
||||
-moz-transition: -moz-transform 500ms cubic-bezier(0.13,0.66,0.24,0.92);
|
||||
-o-transition: -o-transform 500ms cubic-bezier(0.13,0.66,0.24,0.92);
|
||||
-ms-transition: -ms-transform 500ms cubic-bezier(0.13,0.66,0.24,0.92);
|
||||
transition: transform 500ms cubic-bezier(0.13,0.66,0.24,0.92);
|
||||
}
|
||||
|
||||
.touch div#workarea {
|
||||
|
|
@ -1174,11 +1192,13 @@ html, body {
|
|||
#tools_top {
|
||||
position: absolute;
|
||||
width: 160px;
|
||||
height: 100%;
|
||||
background: #2f2f2c;
|
||||
right: 0;
|
||||
top: 20px;
|
||||
border-bottom: none;
|
||||
overflow: visible;
|
||||
padding: 0 0 0 10px;
|
||||
padding: 0 0 0 15px;
|
||||
}
|
||||
|
||||
.touch #tools_top {
|
||||
|
|
@ -1291,6 +1311,7 @@ box-shadow: inset 0 3px 10px rgba(255, 255, 255, 0.1),
|
|||
border-right: none;
|
||||
width: 50px;
|
||||
top: 30px;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
background: #2F2F2C; /* Needed so flyout icons don't appear on the left */
|
||||
z-index: 4;
|
||||
|
|
@ -1516,7 +1537,7 @@ box-shadow: inset 0 3px 10px rgba(255, 255, 255, 0.1),
|
|||
|
||||
#tool_open input,
|
||||
#tool_import input,
|
||||
#tool_image input {
|
||||
#tool_import_bitmap input {
|
||||
position: absolute;
|
||||
opacity: 0;
|
||||
font-size: 10em;
|
||||
|
|
@ -1601,6 +1622,7 @@ box-shadow: inset 0 3px 10px rgba(255, 255, 255, 0.1),
|
|||
bottom: 0;
|
||||
height: 40px;
|
||||
overflow: visible;
|
||||
background: #2f2f2c;
|
||||
}
|
||||
|
||||
#tools_bottom_1 {
|
||||
|
|
@ -1904,10 +1926,22 @@ box-shadow: inset 0 3px 10px rgba(255, 255, 255, 0.1),
|
|||
#dialog_content {
|
||||
height: 95px;
|
||||
margin: 10px 10px 5px 10px;
|
||||
background: #DDD;
|
||||
overflow: auto;
|
||||
text-align: left;
|
||||
border: 1px solid #B0B0B0;
|
||||
font-size: 13px;
|
||||
}
|
||||
|
||||
#dialog_buttons input:last-child {
|
||||
background: #999 !important;
|
||||
position: absolute;
|
||||
left: 10px;
|
||||
bottom: 10px;
|
||||
}
|
||||
|
||||
#dialog_buttons input:first-child {
|
||||
position: absolute;
|
||||
right: 10px;
|
||||
bottom: 10px;
|
||||
}
|
||||
|
||||
#dialog_content.prompt {
|
||||
|
|
@ -1921,8 +1955,6 @@ box-shadow: inset 0 3px 10px rgba(255, 255, 255, 0.1),
|
|||
|
||||
#dialog_container {
|
||||
position: absolute;
|
||||
font-family: Verdana;
|
||||
text-align: center;
|
||||
left: 50%;
|
||||
top: 50%;
|
||||
width: 300px;
|
||||
|
|
@ -1931,16 +1963,12 @@ box-shadow: inset 0 3px 10px rgba(255, 255, 255, 0.1),
|
|||
margin-top: -80px;
|
||||
position:fixed;
|
||||
z-index:50001;
|
||||
background: #CCC;
|
||||
border: 1px outset #777;
|
||||
font-family:Verdana,Helvetica,sans-serif;
|
||||
font-size:0.8em;
|
||||
background: #fff;
|
||||
}
|
||||
|
||||
|
||||
#dialog_container, #dialog_content {
|
||||
border-radius: 5px;
|
||||
-moz-border-radius: 5px;
|
||||
-webkit-border-radius: 5px;
|
||||
border-radius: 3px;
|
||||
}
|
||||
|
||||
#dialog_buttons input[type=text] {
|
||||
|
|
|
|||
|
|
@ -10,70 +10,70 @@
|
|||
svgEditor.addExtension("server_opensave", {
|
||||
callback: function() {
|
||||
|
||||
var save_svg_action = 'extensions/filesave.php';
|
||||
var save_png_action = 'extensions/filesave.php';
|
||||
//var save_svg_action = 'extensions/filesave.php';
|
||||
//var save_png_action = 'extensions/filesave.php';
|
||||
|
||||
// Create upload target (hidden iframe)
|
||||
var target = $('<iframe name="output_frame" />').hide().appendTo('body');
|
||||
|
||||
svgEditor.setCustomHandlers({
|
||||
save: function(win, data) {
|
||||
var svg = "<?xml version=\"1.0\"?>\n" + data;
|
||||
|
||||
var title = svgCanvas.getDocumentTitle();
|
||||
var filename = title.replace(/[^a-z0-9\.\_\-]+/gi, '_');
|
||||
|
||||
var form = $('<form>').attr({
|
||||
method: 'post',
|
||||
action: save_svg_action,
|
||||
target: 'output_frame'
|
||||
}) .append('<input type="hidden" name="output_svg" value="' + encodeURI(svg) + '">')
|
||||
.append('<input type="hidden" name="filename" value="' + filename + '">')
|
||||
.appendTo('body')
|
||||
.submit().remove();
|
||||
},
|
||||
pngsave: function(win, data) {
|
||||
var issues = data.issues;
|
||||
|
||||
if(!$('#export_canvas').length) {
|
||||
$('<canvas>', {id: 'export_canvas'}).hide().appendTo('body');
|
||||
}
|
||||
var c = $('#export_canvas')[0];
|
||||
|
||||
c.width = svgCanvas.contentW;
|
||||
c.height = svgCanvas.contentH;
|
||||
canvg(c, data.svg, {renderCallback: function() {
|
||||
var datauri = c.toDataURL('image/png');
|
||||
|
||||
var uiStrings = svgEditor.uiStrings;
|
||||
var note = '';
|
||||
|
||||
// Check if there's issues
|
||||
if(issues.length) {
|
||||
var pre = "\n \u2022 ";
|
||||
note += ("\n\n" + pre + issues.join(pre));
|
||||
}
|
||||
|
||||
if(note.length) {
|
||||
alert(note);
|
||||
}
|
||||
|
||||
var title = svgCanvas.getDocumentTitle();
|
||||
var filename = title.replace(/[^a-z0-9\.\_\-]+/gi, '_');
|
||||
|
||||
var form = $('<form>').attr({
|
||||
method: 'post',
|
||||
action: save_png_action,
|
||||
target: 'output_frame'
|
||||
}) .append('<input type="hidden" name="output_png" value="' + datauri + '">')
|
||||
.append('<input type="hidden" name="filename" value="' + filename + '">')
|
||||
.appendTo('body')
|
||||
.submit().remove();
|
||||
}});
|
||||
|
||||
|
||||
}
|
||||
});
|
||||
//svgEditor.setCustomHandlers({
|
||||
// save: function(win, data) {
|
||||
// var svg = "<?xml version=\"1.0\"?>\n" + data;
|
||||
//
|
||||
// var title = svgCanvas.getDocumentTitle();
|
||||
// var filename = title.replace(/[^a-z0-9\.\_\-]+/gi, '_');
|
||||
//
|
||||
// var form = $('<form>').attr({
|
||||
// method: 'post',
|
||||
// action: save_svg_action,
|
||||
// target: 'output_frame'
|
||||
// }) .append('<input type="hidden" name="output_svg" value="' + encodeURI(svg) + '">')
|
||||
// .append('<input type="hidden" name="filename" value="' + filename + '">')
|
||||
// .appendTo('body')
|
||||
// .submit().remove();
|
||||
// },
|
||||
// pngsave: function(win, data) {
|
||||
// var issues = data.issues;
|
||||
//
|
||||
// if(!$('#export_canvas').length) {
|
||||
// $('<canvas>', {id: 'export_canvas'}).hide().appendTo('body');
|
||||
// }
|
||||
// var c = $('#export_canvas')[0];
|
||||
//
|
||||
// c.width = svgCanvas.contentW;
|
||||
// c.height = svgCanvas.contentH;
|
||||
// canvg(c, data.svg, {renderCallback: function() {
|
||||
// var datauri = c.toDataURL('image/png');
|
||||
//
|
||||
// var uiStrings = svgEditor.uiStrings;
|
||||
// var note = '';
|
||||
//
|
||||
// // Check if there's issues
|
||||
// if(issues.length) {
|
||||
// var pre = "\n \u2022 ";
|
||||
// note += ("\n\n" + pre + issues.join(pre));
|
||||
// }
|
||||
//
|
||||
// if(note.length) {
|
||||
// alert(note);
|
||||
// }
|
||||
//
|
||||
// var title = svgCanvas.getDocumentTitle();
|
||||
// var filename = title.replace(/[^a-z0-9\.\_\-]+/gi, '_');
|
||||
//
|
||||
// var form = $('<form>').attr({
|
||||
// method: 'post',
|
||||
// action: save_png_action,
|
||||
// target: 'output_frame'
|
||||
// }) .append('<input type="hidden" name="output_png" value="' + datauri + '">')
|
||||
// .append('<input type="hidden" name="filename" value="' + filename + '">')
|
||||
// .appendTo('body')
|
||||
// .submit().remove();
|
||||
// }});
|
||||
//
|
||||
//
|
||||
// }
|
||||
//});
|
||||
|
||||
// Do nothing if client support is found
|
||||
if(window.FileReader) return;
|
||||
|
|
|
|||
|
|
@ -236,6 +236,7 @@ svgedit.math.snapToAngle = function(x1,y1,x2,y2) {
|
|||
// Returns:
|
||||
// Boolean that's true if rectangles intersect
|
||||
svgedit.math.rectsIntersect = function(r1, r2) {
|
||||
if (typeof r1 == 'undefined' || typeof r2 == 'undefined') return false;
|
||||
return r2.x < (r1.x+r1.width) &&
|
||||
(r2.x+r2.width) > r1.x &&
|
||||
r2.y < (r1.y+r1.height) &&
|
||||
|
|
|
|||
|
|
@ -886,7 +886,7 @@ svgedit.path.removePath_ = function(id) {
|
|||
if(id in pathData) delete pathData[id];
|
||||
};
|
||||
|
||||
var getRotVals = function(x, y) {
|
||||
var getRotVals = function(x, y, oldcx, oldcy, newcx, newcy, angle) {
|
||||
dx = x - oldcx;
|
||||
dy = y - oldcy;
|
||||
|
||||
|
|
@ -905,7 +905,6 @@ var getRotVals = function(x, y) {
|
|||
|
||||
r = Math.sqrt(dx*dx + dy*dy);
|
||||
theta = Math.atan2(dy,dx) - angle;
|
||||
|
||||
return {'x':(r * Math.cos(theta) + newcx)/1,
|
||||
'y':(r * Math.sin(theta) + newcy)/1};
|
||||
};
|
||||
|
|
@ -946,11 +945,11 @@ svgedit.path.recalcRotatedPath = function() {
|
|||
type = seg.pathSegType;
|
||||
if(type == 1) continue;
|
||||
|
||||
var rvals = getRotVals(seg.x,seg.y),
|
||||
var rvals = getRotVals(seg.x,seg.y, oldcx, oldcy, newcx, newcy, angle),
|
||||
points = [rvals.x, rvals.y];
|
||||
if(seg.x1 != null && seg.x2 != null) {
|
||||
c_vals1 = getRotVals(seg.x1, seg.y1);
|
||||
c_vals2 = getRotVals(seg.x2, seg.y2);
|
||||
c_vals1 = getRotVals(seg.x1, seg.y1, oldcx, oldcy, newcx, newcy, angle);
|
||||
c_vals2 = getRotVals(seg.x2, seg.y2, oldcx, oldcy, newcx, newcy, angle);
|
||||
points.splice(points.length, 0, c_vals1.x , c_vals1.y, c_vals2.x, c_vals2.y);
|
||||
}
|
||||
svgedit.path.replacePathSeg(type, i, points);
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
/* Comment to prevent wrong concat */
|
||||
|
||||
body {
|
||||
background: #2F2F2C;
|
||||
background: #3f3f3c;
|
||||
font: 13px/120% 'Lucida Sans', 'Lucida Grande', 'Lucida Sans Unicode', sans-serif;
|
||||
-webkit-touch-callout: none;
|
||||
-webkit-user-select: none;
|
||||
|
|
@ -57,8 +57,15 @@ html, body {
|
|||
left: 0;
|
||||
}
|
||||
|
||||
#svg_editor {
|
||||
background: #2f2f2c;
|
||||
}
|
||||
|
||||
#menu_bar {
|
||||
margin: 0 0 0 50px
|
||||
padding: 0 0 0 50px;
|
||||
background: #2f2f2c;
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
#menu_bar.active .menu.open .menu_list {
|
||||
|
|
@ -373,7 +380,7 @@ html, body {
|
|||
display: none;
|
||||
}
|
||||
|
||||
#path_node_panel .tool_button {
|
||||
#use_panel .tool_button, #path_node_panel .tool_button {
|
||||
color: #999;
|
||||
border: solid #3F3F3C 1px;
|
||||
border-radius: 3px;
|
||||
|
|
@ -387,6 +394,12 @@ html, body {
|
|||
line-height: 24px;
|
||||
}
|
||||
|
||||
#use_panel .tool_button {
|
||||
padding-left: 10px;
|
||||
margin-bottom: 10px;
|
||||
width: 124px;
|
||||
}
|
||||
|
||||
#path_node_panel .tool_button img, #path_node_panel .tool_button svg {
|
||||
position: absolute;
|
||||
left: 5px;
|
||||
|
|
@ -522,6 +535,11 @@ html, body {
|
|||
background-color: #444;
|
||||
overflow: auto;
|
||||
text-align: center;
|
||||
-webkit-transition: -webkit-transform 500ms cubic-bezier(0.13,0.66,0.24,0.92);
|
||||
-moz-transition: -moz-transform 500ms cubic-bezier(0.13,0.66,0.24,0.92);
|
||||
-o-transition: -o-transform 500ms cubic-bezier(0.13,0.66,0.24,0.92);
|
||||
-ms-transition: -ms-transform 500ms cubic-bezier(0.13,0.66,0.24,0.92);
|
||||
transition: transform 500ms cubic-bezier(0.13,0.66,0.24,0.92);
|
||||
}
|
||||
|
||||
.touch div#workarea {
|
||||
|
|
@ -592,11 +610,13 @@ html, body {
|
|||
#tools_top {
|
||||
position: absolute;
|
||||
width: 160px;
|
||||
height: 100%;
|
||||
background: #2f2f2c;
|
||||
right: 0;
|
||||
top: 20px;
|
||||
border-bottom: none;
|
||||
overflow: visible;
|
||||
padding: 0 0 0 10px;
|
||||
padding: 0 0 0 15px;
|
||||
}
|
||||
|
||||
.touch #tools_top {
|
||||
|
|
@ -709,6 +729,7 @@ box-shadow: inset 0 3px 10px rgba(255, 255, 255, 0.1),
|
|||
border-right: none;
|
||||
width: 50px;
|
||||
top: 30px;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
background: #2F2F2C; /* Needed so flyout icons don't appear on the left */
|
||||
z-index: 4;
|
||||
|
|
@ -934,7 +955,7 @@ box-shadow: inset 0 3px 10px rgba(255, 255, 255, 0.1),
|
|||
|
||||
#tool_open input,
|
||||
#tool_import input,
|
||||
#tool_image input {
|
||||
#tool_import_bitmap input {
|
||||
position: absolute;
|
||||
opacity: 0;
|
||||
font-size: 10em;
|
||||
|
|
@ -1019,6 +1040,7 @@ box-shadow: inset 0 3px 10px rgba(255, 255, 255, 0.1),
|
|||
bottom: 0;
|
||||
height: 40px;
|
||||
overflow: visible;
|
||||
background: #2f2f2c;
|
||||
}
|
||||
|
||||
#tools_bottom_1 {
|
||||
|
|
@ -1322,10 +1344,22 @@ box-shadow: inset 0 3px 10px rgba(255, 255, 255, 0.1),
|
|||
#dialog_content {
|
||||
height: 95px;
|
||||
margin: 10px 10px 5px 10px;
|
||||
background: #DDD;
|
||||
overflow: auto;
|
||||
text-align: left;
|
||||
border: 1px solid #B0B0B0;
|
||||
font-size: 13px;
|
||||
}
|
||||
|
||||
#dialog_buttons input:last-child {
|
||||
background: #999 !important;
|
||||
position: absolute;
|
||||
left: 10px;
|
||||
bottom: 10px;
|
||||
}
|
||||
|
||||
#dialog_buttons input:first-child {
|
||||
position: absolute;
|
||||
right: 10px;
|
||||
bottom: 10px;
|
||||
}
|
||||
|
||||
#dialog_content.prompt {
|
||||
|
|
@ -1339,8 +1373,6 @@ box-shadow: inset 0 3px 10px rgba(255, 255, 255, 0.1),
|
|||
|
||||
#dialog_container {
|
||||
position: absolute;
|
||||
font-family: Verdana;
|
||||
text-align: center;
|
||||
left: 50%;
|
||||
top: 50%;
|
||||
width: 300px;
|
||||
|
|
@ -1349,16 +1381,12 @@ box-shadow: inset 0 3px 10px rgba(255, 255, 255, 0.1),
|
|||
margin-top: -80px;
|
||||
position:fixed;
|
||||
z-index:50001;
|
||||
background: #CCC;
|
||||
border: 1px outset #777;
|
||||
font-family:Verdana,Helvetica,sans-serif;
|
||||
font-size:0.8em;
|
||||
background: #fff;
|
||||
}
|
||||
|
||||
|
||||
#dialog_container, #dialog_content {
|
||||
border-radius: 5px;
|
||||
-moz-border-radius: 5px;
|
||||
-webkit-border-radius: 5px;
|
||||
border-radius: 3px;
|
||||
}
|
||||
|
||||
#dialog_buttons input[type=text] {
|
||||
|
|
|
|||
|
|
@ -55,7 +55,6 @@
|
|||
<script type="text/javascript" src="extensions/ext-grid.js"></script>
|
||||
<script type="text/javascript" src="requestanimationframe.js"></script>
|
||||
<script type="text/javascript" src="taphold.js"></script>
|
||||
<script type="text/javascript" src="extensions/ext-server_opensave.js"></script>
|
||||
<!{endif}-->
|
||||
|
||||
|
||||
|
|
@ -99,9 +98,9 @@
|
|||
<div class="menu">
|
||||
<div class="menu_title">File</div>
|
||||
<div class="menu_list" id="file_menu">
|
||||
<div id="tool_clear" class="menu_item">New Image</div>
|
||||
<div id="tool_open" class="menu_item"><div id="fileinputs"></div>Open SVG...</div>
|
||||
<div id="tool_import" class="menu_item"><div id="fileinputs_import"></div>Place SVG...</div>
|
||||
<div id="tool_clear" class="menu_item">New Document</div>
|
||||
<div id="tool_open" class="menu_item" style="display: none;"><div id="fileinputs"></div>Open SVG...</div>
|
||||
<div id="tool_import" class="menu_item" style="display: none;"><div id="fileinputs_import"></div>Import Image...</div>
|
||||
<div id="tool_save" class="menu_item">Save Image... <span class="shortcut">⌘S</span></div>
|
||||
<div id="tool_export" class="menu_item">Export as PNG</div>
|
||||
</div>
|
||||
|
|
@ -357,17 +356,17 @@
|
|||
</div>
|
||||
|
||||
<div id="use_panel" class="context_panel clearfix">
|
||||
<div class="push_button" id="tool_unlink_use" data-title="Break link to reference element (make unique)"></div>
|
||||
<div class="tool_button clearfix" id="tool_unlink_use" data-title="Break link to reference element (make unique)">Break link reference</div>
|
||||
</div>
|
||||
|
||||
<div id="g_panel" class="context_panel clearfix">
|
||||
<h4>Group</h4>
|
||||
<label>
|
||||
<input id="g_x" class="attr_changer" data-title="Change ellipse's cx coordinate" size="3" data-attr="x" pattern="[0-9]*" />
|
||||
<input id="g_x" class="attr_changer" data-title="Change groups's x coordinate" size="3" data-attr="x" pattern="[0-9]*" />
|
||||
<span>X</span>
|
||||
</label>
|
||||
<label>
|
||||
<input id="g_y" class="attr_changer" data-title="Change ellipse's cy coordinate" size="3" data-attr="y" pattern="[0-9]*" />
|
||||
<input id="g_y" class="attr_changer" data-title="Change groups's y coordinate" size="3" data-attr="y" pattern="[0-9]*" />
|
||||
<span>Y</span>
|
||||
</label>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -71,8 +71,8 @@
|
|||
"enterNewLayerName":"Please enter the new layer name",
|
||||
"layerHasThatName":"Layer already has that name",
|
||||
"QmoveElemsToLayer":"Move selected elements to layer \"%s\"?",
|
||||
"QwantToClear":"Do you want to clear the drawing?\nThis will also erase your undo history!",
|
||||
"QwantToOpen":"Do you want to open a new file?\nThis will also erase your undo history!",
|
||||
"QwantToClear":"<strong>Do you want to clear the drawing?</strong>\nThis will also erase your undo history",
|
||||
"QwantToOpen":"Do you want to open a new file?\nThis will also erase your undo history",
|
||||
"QerrorsRevertToSource":"There were parsing errors in your SVG source.\nRevert back to original SVG source?",
|
||||
"QignoreSourceChanges":"Ignore changes made to SVG source?",
|
||||
"featNotSupported":"Feature not supported",
|
||||
|
|
@ -383,7 +383,7 @@
|
|||
if(type != 'alert') {
|
||||
$('<input type="button" value="' + uiStrings.common.cancel + '">')
|
||||
.appendTo(btn_holder)
|
||||
.on("click, touchstart", function() { box.hide();callback(false)});
|
||||
.on("click touchstart", function() { box.hide();callback(false)});
|
||||
}
|
||||
|
||||
if(type == 'prompt') {
|
||||
|
|
@ -475,7 +475,7 @@
|
|||
|
||||
// Chrome 5 (and 6?) don't allow saving, show source instead ( http://code.google.com/p/chromium/issues/detail?id=46735 )
|
||||
// IE9 doesn't allow standalone Data URLs ( https://connect.microsoft.com/IE/feedback/details/542600/data-uri-images-fail-when-loaded-by-themselves )
|
||||
if((~ua.indexOf('Chrome') && $.browser.version >= 533) || ~ua.indexOf('MSIE')) {
|
||||
if(~ua.indexOf('MSIE')) {
|
||||
showSourceEditor(0,true);
|
||||
return;
|
||||
}
|
||||
|
|
@ -547,7 +547,6 @@
|
|||
elems = elems.filter(Boolean)
|
||||
multiselected = (elems.length >= 2) ? elems : false;
|
||||
if (svgCanvas.elementsAreSame(multiselected)) selectedElement = multiselected[0]
|
||||
|
||||
if (selectedElement != null) {
|
||||
$('#multiselected_panel').hide()
|
||||
updateToolbar();
|
||||
|
|
@ -1306,22 +1305,26 @@
|
|||
// This function also updates the opacity and id elements that are in the context panel
|
||||
var updateToolbar = function() {
|
||||
if (selectedElement != null) {
|
||||
|
||||
switch ( selectedElement.tagName ) {
|
||||
case 'use':
|
||||
$(".context_panel").hide();
|
||||
$("#use_panel").show();
|
||||
break;
|
||||
case 'image':
|
||||
$(".context_panel").hide();
|
||||
$("#image_panel").show();
|
||||
break;
|
||||
case 'foreignObject':
|
||||
$(".context_panel").hide();
|
||||
break;
|
||||
case 'g':
|
||||
case 'a':
|
||||
// Look for common styles
|
||||
|
||||
var gWidth = null;
|
||||
|
||||
var childs = selectedElement.getElementsByTagName('*');
|
||||
for(var i = 0, len = childs.length; i < len; i++) {
|
||||
var swidth = childs[i].getAttribute("stroke-width");
|
||||
|
||||
if(i === 0) {
|
||||
gWidth = swidth;
|
||||
} else if(gWidth !== swidth) {
|
||||
|
|
@ -1329,18 +1332,15 @@
|
|||
}
|
||||
}
|
||||
|
||||
$('#stroke_width').val(gWidth === null ? "" : gWidth);
|
||||
//Editor.paintBox.fill.update(false);
|
||||
//Editor.paintBox.stroke.update(false);
|
||||
|
||||
|
||||
$('#stroke_width').val(gWidth === null ? "0" : gWidth);
|
||||
updateContextPanel();
|
||||
break;
|
||||
default:
|
||||
//removed because multiselect shouldnt set color
|
||||
//Editor.paintBox.fill.update(false);
|
||||
//Editor.paintBox.stroke.update(false);
|
||||
|
||||
$('#stroke_width').val(selectedElement.getAttribute("stroke-width") || 1);
|
||||
$('#stroke_width').val(selectedElement.getAttribute("stroke-width") || 0);
|
||||
var dash = selectedElement.getAttribute("stroke-dasharray") || "none"
|
||||
$('option', '#stroke_style').removeAttr('selected');
|
||||
$('#stroke_style option[value="'+ dash +'"]').attr("selected", "selected");
|
||||
|
|
@ -1365,8 +1365,6 @@
|
|||
$('#group_opacity').val(opac_perc);
|
||||
$.fn.dragInput.updateCursor($('#group_opacity')[0])
|
||||
}
|
||||
|
||||
updateToolButtonState();
|
||||
};
|
||||
|
||||
var setImageURL = Editor.setImageURL = function(url) {
|
||||
|
|
@ -1393,7 +1391,6 @@
|
|||
var unit = curConfig.baseUnit !== 'px' ? curConfig.baseUnit : null;
|
||||
var is_node = currentMode == 'pathedit'; //elem ? (elem.id && elem.id.indexOf('pathpointgrip') == 0) : false;
|
||||
|
||||
|
||||
if (is_node) {
|
||||
$('.context_panel').hide();
|
||||
$('#path_node_panel').show();
|
||||
|
|
@ -1415,6 +1412,7 @@
|
|||
$('#path_node_y').val(Math.round(point.y));
|
||||
if(point.type) {
|
||||
seg_type.val(point.type).removeAttr('disabled');
|
||||
$("#seg_type_label").html(point.type == 4 ? "Straight" : "Curve")
|
||||
} else {
|
||||
seg_type.val(4).attr('disabled','disabled');
|
||||
}
|
||||
|
|
@ -1887,7 +1885,7 @@
|
|||
return false;
|
||||
}
|
||||
var closer = function(e){
|
||||
if (e.target.nodeName.toLowerCase() === "input") return false;
|
||||
if (e.target.nodeName && e.target.nodeName.toLowerCase() === "input") return false;
|
||||
if (!$(e.target).hasClass("menu_title") && !$(e.target).parent().hasClass("menu_title")) {
|
||||
if(!$(e.target).hasClass("disabled") && $(e.target).hasClass("menu_item")) blinker(e)
|
||||
else $('#menu_bar').removeClass('active')
|
||||
|
|
@ -2835,65 +2833,6 @@
|
|||
});
|
||||
};
|
||||
|
||||
var updateToolButtonState = function() {
|
||||
/*
|
||||
var bNoFill = (svgCanvas.getColor('fill') == 'none');
|
||||
var bNoStroke = (svgCanvas.getColor('stroke') == 'none');
|
||||
var buttonsNeedingStroke = [ '#tool_fhpath', '#tool_line' ];
|
||||
var buttonsNeedingFillAndStroke = [ '#tools_rect .tool_button', '#tools_ellipse .tool_button', '#tool_text', '#tool_path'];
|
||||
if (bNoStroke) {
|
||||
for (var index in buttonsNeedingStroke) {
|
||||
var button = buttonsNeedingStroke[index];
|
||||
if ($(button).hasClass('tool_button_current')) {
|
||||
clickSelect();
|
||||
}
|
||||
$(button).addClass('disabled');
|
||||
}
|
||||
}
|
||||
else {
|
||||
for (var index in buttonsNeedingStroke) {
|
||||
var button = buttonsNeedingStroke[index];
|
||||
$(button).removeClass('disabled');
|
||||
}
|
||||
}
|
||||
|
||||
if (bNoStroke && bNoFill) {
|
||||
for (var index in buttonsNeedingFillAndStroke) {
|
||||
var button = buttonsNeedingFillAndStroke[index];
|
||||
if ($(button).hasClass('tool_button_current')) {
|
||||
clickSelect();
|
||||
}
|
||||
$(button).addClass('disabled');
|
||||
}
|
||||
}
|
||||
else {
|
||||
for (var index in buttonsNeedingFillAndStroke) {
|
||||
var button = buttonsNeedingFillAndStroke[index];
|
||||
$(button).removeClass('disabled');
|
||||
}
|
||||
}
|
||||
|
||||
svgCanvas.runExtensions("toolButtonStateUpdate", {
|
||||
nofill: bNoFill,
|
||||
nostroke: bNoStroke
|
||||
});
|
||||
|
||||
// Disable flyouts if all inside are disabled
|
||||
$('.tools_flyout').each(function() {
|
||||
var shower = $('#' + this.id + '_show');
|
||||
var has_enabled = false;
|
||||
$(this).children().each(function() {
|
||||
if(!$(this).hasClass('disabled')) {
|
||||
has_enabled = true;
|
||||
}
|
||||
});
|
||||
shower.toggleClass('disabled', !has_enabled);
|
||||
});
|
||||
|
||||
operaRepaint();
|
||||
*/
|
||||
};
|
||||
|
||||
var PaintBox = function(container, type) {
|
||||
var background = document.getElementById("canvas_background");
|
||||
var cur = {color: "fff", opacity: 1}
|
||||
|
|
@ -3637,12 +3576,108 @@
|
|||
}
|
||||
}
|
||||
|
||||
// use HTML5 File API: http://www.w3.org/TR/FileAPI/
|
||||
// if browser has HTML5 File API support, then we will show the open menu item
|
||||
// and provide a file input to click. When that change event fires, it will
|
||||
// get the text contents of the file and send it to the canvas
|
||||
if (window.FileReader) {
|
||||
var inp = $('<input type="file">').change(function() {
|
||||
|
||||
var import_image = function(e) {
|
||||
e.stopPropagation();
|
||||
e.preventDefault();
|
||||
$("#workarea").removeAttr("style");
|
||||
$('#main_menu').hide();
|
||||
var file = null;
|
||||
if (e.type == "drop") file = e.dataTransfer.files[0]
|
||||
else file = this.files[0];
|
||||
if (file) {
|
||||
if(file.type.indexOf("image") != -1) {
|
||||
//detected an image
|
||||
|
||||
//svg handing
|
||||
if(file.type.indexOf("svg") != -1) {
|
||||
var reader = new FileReader();
|
||||
reader.onloadend = function(e) {
|
||||
svgCanvas.importSvgString(e.target.result, true);
|
||||
svgCanvas.ungroupSelectedElement()
|
||||
svgCanvas.ungroupSelectedElement()
|
||||
svgCanvas.groupSelectedElements()
|
||||
svgCanvas.alignSelectedElements("m", "page")
|
||||
svgCanvas.alignSelectedElements("c", "page")
|
||||
};
|
||||
reader.readAsText(file);
|
||||
}
|
||||
|
||||
//image handling
|
||||
else {
|
||||
var reader = new FileReader();
|
||||
reader.onloadend = function(e) {
|
||||
// lets insert the new image until we know its dimensions
|
||||
insertNewImage = function(img_width, img_height){
|
||||
var newImage = svgCanvas.addSvgElementFromJson({
|
||||
"element": "image",
|
||||
"attr": {
|
||||
"x": 0,
|
||||
"y": 0,
|
||||
"width": img_width,
|
||||
"height": img_height,
|
||||
"id": svgCanvas.getNextId(),
|
||||
"style": "pointer-events:inherit"
|
||||
}
|
||||
});
|
||||
svgCanvas.setHref(newImage, e.target.result);
|
||||
svgCanvas.selectOnly([newImage])
|
||||
svgCanvas.alignSelectedElements("m", "page")
|
||||
svgCanvas.alignSelectedElements("c", "page")
|
||||
updateContextPanel();
|
||||
}
|
||||
// put a placeholder img so we know the default dimensions
|
||||
var img_width = 100;
|
||||
var img_height = 100;
|
||||
var img = new Image()
|
||||
img.src = e.target.result
|
||||
document.body.appendChild(img);
|
||||
img.onload = function() {
|
||||
img_width = img.offsetWidth
|
||||
img_height = img.offsetHeight
|
||||
insertNewImage(img_width, img_height);
|
||||
document.body.removeChild(img);
|
||||
}
|
||||
};
|
||||
reader.readAsDataURL(file)
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
var workarea = $("#workarea")
|
||||
|
||||
function onDragEnter(e) {
|
||||
e.stopPropagation();
|
||||
e.preventDefault();
|
||||
workarea.css({
|
||||
"-webkit-transform": "scale3d(1.1,1.1,1)",
|
||||
"-moz-transform": "scale3d(1.1,1.1,1)",
|
||||
"-o-transform": "scale(1.1)",
|
||||
"-ms-transform": "scale3d(1.1,1.1,1)",
|
||||
"transform": "scale3d(1.1,1.1,1)"
|
||||
})
|
||||
|
||||
}
|
||||
|
||||
function onDragOver(e) {
|
||||
e.stopPropagation();
|
||||
e.preventDefault();
|
||||
}
|
||||
|
||||
function onDragLeave(e) {
|
||||
workarea.removeAttr("style")
|
||||
e.stopPropagation();
|
||||
e.preventDefault();
|
||||
}
|
||||
|
||||
workarea[0].addEventListener('dragenter', onDragEnter, false);
|
||||
workarea[0].addEventListener('dragover', onDragOver, false);
|
||||
workarea[0].addEventListener('dragleave', onDragLeave, false);
|
||||
workarea[0].addEventListener('drop', import_image, false);
|
||||
|
||||
var open = $('<input type="file">').change(function() {
|
||||
var f = this;
|
||||
Editor.openPrep(function(ok) {
|
||||
if(!ok) return;
|
||||
|
|
@ -3657,21 +3692,13 @@
|
|||
}
|
||||
});
|
||||
});
|
||||
$("#tool_open").show().prepend(inp);
|
||||
var inp2 = $('<input type="file">').change(function() {
|
||||
$('#main_menu').hide();
|
||||
if(this.files.length==1) {
|
||||
var reader = new FileReader();
|
||||
reader.onloadend = function(e) {
|
||||
svgCanvas.importSvgString(e.target.result, true);
|
||||
updateCanvas();
|
||||
};
|
||||
reader.readAsText(this.files[0]);
|
||||
}
|
||||
});
|
||||
$("#tool_import").show().prepend(inp2);
|
||||
$("#tool_open").show().prepend(open);
|
||||
|
||||
var img_import = $('<input type="file">').change(import_image);
|
||||
$("#tool_import").show().prepend(img_import);
|
||||
}
|
||||
|
||||
|
||||
var updateCanvas = Editor.updateCanvas = function(center, new_ctr) {
|
||||
var w = workarea.width(), h = workarea.height();
|
||||
var w_orig = w, h_orig = h;
|
||||
|
|
|
|||
|
|
@ -1016,6 +1016,7 @@ this.setRotationAngle = function(val, preventUndo) {
|
|||
// ensure val is the proper type
|
||||
val = parseFloat(val);
|
||||
var elem = selectedElements[0];
|
||||
if (!elem) return;
|
||||
var oldTransform = elem.getAttribute("transform");
|
||||
var bbox = svgedit.utilities.getBBox(elem);
|
||||
var cx = bbox.x+bbox.width/2, cy = bbox.y+bbox.height/2;
|
||||
|
|
@ -3682,7 +3683,7 @@ var textActions = canvas.textActions = function() {
|
|||
display: 'inline'
|
||||
});
|
||||
|
||||
if(selblock) selblock.setAttribute('d', '');
|
||||
if(selblock) selblock.setAttribute('d', 'M 0 0');
|
||||
}
|
||||
|
||||
function setSelection(start, end, skipInput) {
|
||||
|
|
@ -4766,7 +4767,7 @@ var pathActions = canvas.pathActions = function() {
|
|||
var newseg = elem.createSVGPathSegLinetoAbs(start_item.x, start_item.y);
|
||||
|
||||
var closer = elem.createSVGPathSegClosePath();
|
||||
if(open_pt == svgedit.path.path.segs.length - 1) {
|
||||
if(open_pt == svgedit.path.path.segs.length) {
|
||||
list.appendItem(newseg);
|
||||
list.appendItem(closer);
|
||||
} else {
|
||||
|
|
|
|||
|
|
@ -89,7 +89,7 @@ div.jGraduate_Slider input{margin-top:5px}
|
|||
div.jGraduate_Slider img{top:0;left:0;position:absolute;cursor:ew-resize}
|
||||
.jPicker .Button .Ok,.jGraduate_Picker .jGraduate_OkCancel .jGraduate_Ok{-webkit-appearance:none;margin:0;position:absolute;bottom:5px;right:5px}
|
||||
.jPicker .Button .Cancel,.jGraduate_Picker .jGraduate_OkCancel .jGraduate_Cancel{margin:0;position:absolute;bottom:5px;left:5px}
|
||||
body{background:#2f2f2c;font:13px/120% 'Lucida Sans','Lucida Grande','Lucida Sans Unicode',sans-serif;-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;margin:0;padding:0}
|
||||
body{background:#3f3f3c;font:13px/120% 'Lucida Sans','Lucida Grande','Lucida Sans Unicode',sans-serif;-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;margin:0;padding:0}
|
||||
::selection{background:#000;color:#fff}
|
||||
::-moz-selection{background:#000;color:#fff}
|
||||
html,body{overflow:hidden;width:100%;height:100%}
|
||||
|
|
@ -99,7 +99,8 @@ html,body{overflow:hidden;width:100%;height:100%}
|
|||
::-webkit-scrollbar-corner{background:#444}
|
||||
#browser-not-supported{font-size:.8em;font-family:Verdana,Helvetica,Arial;color:#000}
|
||||
#svgroot{-moz-user-select:none;-webkit-user-select:none;position:absolute;top:0;left:0}
|
||||
#menu_bar{margin:0 0 0 50px}
|
||||
#svg_editor{background:#2f2f2c}
|
||||
#menu_bar{padding:0 0 0 50px;background:#2f2f2c;position:relative;z-index:1}
|
||||
#menu_bar.active .menu.open .menu_list{display:block}
|
||||
.menu{position:relative;z-index:5;color:#333;display:inline-block}
|
||||
.menu_title{cursor:pointer;display:inline-block;padding:7px 10px;z-index:10;color:#fff;position:relative;height:16px;vertical-align:top}
|
||||
|
|
@ -148,7 +149,8 @@ div#palette_holder #palette .palette_item{cursor:pointer}
|
|||
.touch #tool_fill .color_block{width:36px;height:36px}
|
||||
.touch #tool_fill .color_block svg{width:36px!important;height:36px!important}
|
||||
.touch #tool_switch{display:none}
|
||||
#path_node_panel .tool_button{color:#999;border:solid #3f3f3c 1px;border-radius:3px;padding:3px 10px 3px 40px;background:transparent;position:relative;margin-top:10px;width:90px;height:23px;line-height:24px}
|
||||
#use_panel .tool_button,#path_node_panel .tool_button{color:#999;border:solid #3f3f3c 1px;border-radius:3px;padding:3px 10px 3px 40px;background:transparent;position:relative;margin-top:10px;width:90px;height:23px;line-height:24px}
|
||||
#use_panel .tool_button{padding-left:10px;margin-bottom:10px;width:124px}
|
||||
#path_node_panel .tool_button img,#path_node_panel .tool_button svg{position:absolute;left:5px;top:3px}
|
||||
#color_tools #tool_fill .color_block:hover,#color_tools #tool_stroke .color_block:hover{border-color:#fff}
|
||||
#color_tools #tool_fill .color_block>div{position:absolute;top:0;left:0}
|
||||
|
|
@ -168,7 +170,7 @@ div#palette_holder #palette .palette_item{cursor:pointer}
|
|||
#color_tools .icon_label{padding:0;width:24px;height:100%;cursor:pointer;position:absolute}
|
||||
#linkLabel>svg{height:20px;padding-top:4px}
|
||||
div#palette{float:left;height:16px}
|
||||
div#workarea{display:inline-table-cell;position:absolute;top:30px;left:50px;bottom:40px;right:175px;background-color:#444;overflow:auto;text-align:center}
|
||||
div#workarea{display:inline-table-cell;position:absolute;top:30px;left:50px;bottom:40px;right:175px;background-color:#444;overflow:auto;text-align:center;-webkit-transition:-webkit-transform 500ms cubic-bezier(0.13,0.66,0.24,0.92);-moz-transition:-moz-transform 500ms cubic-bezier(0.13,0.66,0.24,0.92);-o-transition:-o-transform 500ms cubic-bezier(0.13,0.66,0.24,0.92);-ms-transition:-ms-transform 500ms cubic-bezier(0.13,0.66,0.24,0.92);transition:transform 500ms cubic-bezier(0.13,0.66,0.24,0.92)}
|
||||
.touch div#workarea{top:40px}
|
||||
div.palette_item{height:16px;width:16px;float:left}
|
||||
.touch div.palette_item{height:30px;border-top:solid #2f2f2c 5px;border-bottom:solid #2f2f2c 5px;width:19px;float:left}
|
||||
|
|
@ -181,7 +183,7 @@ div.palette_item{height:16px;width:16px;float:left}
|
|||
#tools_left .tool_button:after,#tools_left .tool_button_current:after{position:absolute;content:'';border:solid #2f2f2c 2px;top:-1px;left:-1px;width:26px;height:26px;z-index:0}
|
||||
#tools_left .tool_button_current{background-color:#0cf}
|
||||
#main_icon span{position:absolute;width:100%;height:100%;display:block;z-index:2}
|
||||
#tools_top{position:absolute;width:160px;right:0;top:20px;border-bottom:0;overflow:visible;padding:0 0 0 10px}
|
||||
#tools_top{position:absolute;width:160px;height:100%;background:#2f2f2c;right:0;top:20px;border-bottom:0;overflow:visible;padding:0 0 0 15px}
|
||||
.touch #tools_top{top:30px}
|
||||
label{display:block;color:#999}
|
||||
div#font-selector{width:140px;height:300px;overflow:auto;margin:0 auto;position:absolute;top:27px;right:0;border:1px solid black;padding:10px;display:none;background-color:white;z-index:10;border-radius:3px;box-shadow:0 5px 10px rgba(0,0,0,0.7)}
|
||||
|
|
@ -202,7 +204,7 @@ input[type=submit],input[type=button],button{background:#4f80ff;color:#fff;borde
|
|||
input[type=submit]:hover,button:hover{box-shadow:inset 0 3px 10px rgba(255,255,255,0.1),inset 0 -3px 10px rgba(0,0,0,0.2)}
|
||||
input[type=submit]:hover,button:hover{background:#2f84c1}
|
||||
input[type=submit]:active,button:active{box-shadow:inset 0 2px 2px rgba(0,0,0,0.2);border-bottom:solid rgba(255,255,255,0.1) 1px}
|
||||
#tools_left{position:absolute;border-right:0;width:50px;top:30px;left:0;background:#2f2f2c;z-index:4}
|
||||
#tools_left{position:absolute;border-right:0;width:50px;top:30px;bottom:0;left:0;background:#2f2f2c;z-index:4}
|
||||
#workarea.wireframe #svgcontent *{fill:none;stroke:#000;stroke-width:1px;stroke-opacity:1.0;stroke-dasharray:0;opacity:1;pointer-events:stroke;vector-effect:non-scaling-stroke;filter:none}
|
||||
#workarea.wireframe #svgcontent text{fill:#000;stroke:none}
|
||||
#workarea.wireframe #canvasBackground>rect{fill:#FFF!important}
|
||||
|
|
@ -233,7 +235,7 @@ input[type=submit]:active,button:active{box-shadow:inset 0 2px 2px rgba(0,0,0,0.
|
|||
.tool_button,.push_button,.tool_button_current,.push_button_pressed{height:27px;width:27px;border:solid #2f2f2c 8px;border-left-width:13px;margin:0;background-color:#ddd;cursor:pointer}
|
||||
#main_menu li#tool_open,#main_menu li#tool_import{position:relative;overflow:hidden}
|
||||
#tool_image{overflow:hidden}
|
||||
#tool_open input,#tool_import input,#tool_image input{position:absolute;opacity:0;font-size:10em;top:-5px;right:-5px;margin:0;cursor:pointer}
|
||||
#tool_open input,#tool_import input,#tool_import_bitmap input{position:absolute;opacity:0;font-size:10em;top:-5px;right:-5px;margin:0;cursor:pointer}
|
||||
.disabled{opacity:.5;cursor:default}
|
||||
.width_label{padding-right:5px}
|
||||
#text{position:absolute;left:-9999px}
|
||||
|
|
@ -243,7 +245,7 @@ input[type=submit]:active,button:active{box-shadow:inset 0 2px 2px rgba(0,0,0,0.
|
|||
.tools_flyout{position:absolute;display:none;cursor:pointer;width:385px;z-index:10;left:47px!important;height:324px;background:#fff;border-radius:5px;box-shadow:0 5px 10px rgba(0,0,0,0.5)}
|
||||
.tools_flyout_v{position:absolute;display:none;cursor:pointer;width:30px}
|
||||
.tools_flyout .tool_button{float:left;background-color:#fff;height:24px;width:24px}
|
||||
#tools_bottom{position:absolute;left:50px;right:0;bottom:0;height:40px;overflow:visible}
|
||||
#tools_bottom{position:absolute;left:50px;right:0;bottom:0;height:40px;overflow:visible;background:#2f2f2c}
|
||||
#tools_bottom_1{width:115px;float:left}
|
||||
#tools_bottom_2{position:relative;float:left;margin-top:5px}
|
||||
#tools_bottom input[type=text]{width:3.2em}
|
||||
|
|
@ -291,11 +293,13 @@ button.cancel,input.Cancel,input.cancel,input.jGraduate_Cancel,button.cancel{-we
|
|||
.toolbar_button button .svg_icon{display:none}
|
||||
#dialog_box{display:none}
|
||||
#dialog_box_overlay{background:black;opacity:.5;height:100%;left:0;position:absolute;top:0;width:100%;z-index:6}
|
||||
#dialog_content{height:95px;margin:10px 10px 5px 10px;background:#DDD;overflow:auto;text-align:left;border:1px solid #b0b0b0}
|
||||
#dialog_content{height:95px;margin:10px 10px 5px 10px;overflow:auto;text-align:left;font-size:13px}
|
||||
#dialog_buttons input:last-child{background:#999!important;position:absolute;left:10px;bottom:10px}
|
||||
#dialog_buttons input:first-child{position:absolute;right:10px;bottom:10px}
|
||||
#dialog_content.prompt{height:75px}
|
||||
#dialog_content p{margin:10px;line-height:1.3em}
|
||||
#dialog_container{position:absolute;font-family:Verdana;text-align:center;left:50%;top:50%;width:300px;margin-left:-150px;height:150px;margin-top:-80px;position:fixed;z-index:50001;background:#CCC;border:1px outset #777;font-family:Verdana,Helvetica,sans-serif;font-size:.8em}
|
||||
#dialog_container,#dialog_content{border-radius:5px;-moz-border-radius:5px;-webkit-border-radius:5px}
|
||||
#dialog_container{position:absolute;left:50%;top:50%;width:300px;margin-left:-150px;height:150px;margin-top:-80px;position:fixed;z-index:50001;background:#fff}
|
||||
#dialog_container,#dialog_content{border-radius:3px}
|
||||
#dialog_buttons input[type=text]{width:90%;display:block;margin:0 0 5px 11px}
|
||||
#dialog_buttons input[type=button]{margin:0 1em}
|
||||
.invisible{visibility:none}
|
||||
|
|
|
|||
File diff suppressed because it is too large
Load Diff
|
|
@ -463,7 +463,7 @@ function groupBBFix(selected) {
|
|||
// Parameters:
|
||||
// elem - Optional DOM element to get the BBox for
|
||||
svgedit.utilities.getBBox = function(elem) {
|
||||
var selected = elem || editorContext_.geSelectedElements()[0];
|
||||
var selected = elem || editorContext_.getSelectedElements()[0];
|
||||
if (elem.nodeType != 1) return null;
|
||||
var ret = null;
|
||||
var elname = selected.nodeName;
|
||||
|
|
|
|||
|
|
@ -583,7 +583,7 @@ div.jGraduate_Slider img {
|
|||
/* Comment to prevent wrong concat */
|
||||
|
||||
body {
|
||||
background: #2F2F2C;
|
||||
background: #3f3f3c;
|
||||
font: 13px/120% 'Lucida Sans', 'Lucida Grande', 'Lucida Sans Unicode', sans-serif;
|
||||
-webkit-touch-callout: none;
|
||||
-webkit-user-select: none;
|
||||
|
|
@ -639,8 +639,15 @@ html, body {
|
|||
left: 0;
|
||||
}
|
||||
|
||||
#svg_editor {
|
||||
background: #2f2f2c;
|
||||
}
|
||||
|
||||
#menu_bar {
|
||||
margin: 0 0 0 50px
|
||||
padding: 0 0 0 50px;
|
||||
background: #2f2f2c;
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
#menu_bar.active .menu.open .menu_list {
|
||||
|
|
@ -955,7 +962,7 @@ html, body {
|
|||
display: none;
|
||||
}
|
||||
|
||||
#path_node_panel .tool_button {
|
||||
#use_panel .tool_button, #path_node_panel .tool_button {
|
||||
color: #999;
|
||||
border: solid #3F3F3C 1px;
|
||||
border-radius: 3px;
|
||||
|
|
@ -969,6 +976,12 @@ html, body {
|
|||
line-height: 24px;
|
||||
}
|
||||
|
||||
#use_panel .tool_button {
|
||||
padding-left: 10px;
|
||||
margin-bottom: 10px;
|
||||
width: 124px;
|
||||
}
|
||||
|
||||
#path_node_panel .tool_button img, #path_node_panel .tool_button svg {
|
||||
position: absolute;
|
||||
left: 5px;
|
||||
|
|
@ -1104,6 +1117,11 @@ html, body {
|
|||
background-color: #444;
|
||||
overflow: auto;
|
||||
text-align: center;
|
||||
-webkit-transition: -webkit-transform 500ms cubic-bezier(0.13,0.66,0.24,0.92);
|
||||
-moz-transition: -moz-transform 500ms cubic-bezier(0.13,0.66,0.24,0.92);
|
||||
-o-transition: -o-transform 500ms cubic-bezier(0.13,0.66,0.24,0.92);
|
||||
-ms-transition: -ms-transform 500ms cubic-bezier(0.13,0.66,0.24,0.92);
|
||||
transition: transform 500ms cubic-bezier(0.13,0.66,0.24,0.92);
|
||||
}
|
||||
|
||||
.touch div#workarea {
|
||||
|
|
@ -1174,11 +1192,13 @@ html, body {
|
|||
#tools_top {
|
||||
position: absolute;
|
||||
width: 160px;
|
||||
height: 100%;
|
||||
background: #2f2f2c;
|
||||
right: 0;
|
||||
top: 20px;
|
||||
border-bottom: none;
|
||||
overflow: visible;
|
||||
padding: 0 0 0 10px;
|
||||
padding: 0 0 0 15px;
|
||||
}
|
||||
|
||||
.touch #tools_top {
|
||||
|
|
@ -1291,6 +1311,7 @@ box-shadow: inset 0 3px 10px rgba(255, 255, 255, 0.1),
|
|||
border-right: none;
|
||||
width: 50px;
|
||||
top: 30px;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
background: #2F2F2C; /* Needed so flyout icons don't appear on the left */
|
||||
z-index: 4;
|
||||
|
|
@ -1516,7 +1537,7 @@ box-shadow: inset 0 3px 10px rgba(255, 255, 255, 0.1),
|
|||
|
||||
#tool_open input,
|
||||
#tool_import input,
|
||||
#tool_image input {
|
||||
#tool_import_bitmap input {
|
||||
position: absolute;
|
||||
opacity: 0;
|
||||
font-size: 10em;
|
||||
|
|
@ -1601,6 +1622,7 @@ box-shadow: inset 0 3px 10px rgba(255, 255, 255, 0.1),
|
|||
bottom: 0;
|
||||
height: 40px;
|
||||
overflow: visible;
|
||||
background: #2f2f2c;
|
||||
}
|
||||
|
||||
#tools_bottom_1 {
|
||||
|
|
@ -1904,10 +1926,22 @@ box-shadow: inset 0 3px 10px rgba(255, 255, 255, 0.1),
|
|||
#dialog_content {
|
||||
height: 95px;
|
||||
margin: 10px 10px 5px 10px;
|
||||
background: #DDD;
|
||||
overflow: auto;
|
||||
text-align: left;
|
||||
border: 1px solid #B0B0B0;
|
||||
font-size: 13px;
|
||||
}
|
||||
|
||||
#dialog_buttons input:last-child {
|
||||
background: #999 !important;
|
||||
position: absolute;
|
||||
left: 10px;
|
||||
bottom: 10px;
|
||||
}
|
||||
|
||||
#dialog_buttons input:first-child {
|
||||
position: absolute;
|
||||
right: 10px;
|
||||
bottom: 10px;
|
||||
}
|
||||
|
||||
#dialog_content.prompt {
|
||||
|
|
@ -1921,8 +1955,6 @@ box-shadow: inset 0 3px 10px rgba(255, 255, 255, 0.1),
|
|||
|
||||
#dialog_container {
|
||||
position: absolute;
|
||||
font-family: Verdana;
|
||||
text-align: center;
|
||||
left: 50%;
|
||||
top: 50%;
|
||||
width: 300px;
|
||||
|
|
@ -1931,16 +1963,12 @@ box-shadow: inset 0 3px 10px rgba(255, 255, 255, 0.1),
|
|||
margin-top: -80px;
|
||||
position:fixed;
|
||||
z-index:50001;
|
||||
background: #CCC;
|
||||
border: 1px outset #777;
|
||||
font-family:Verdana,Helvetica,sans-serif;
|
||||
font-size:0.8em;
|
||||
background: #fff;
|
||||
}
|
||||
|
||||
|
||||
#dialog_container, #dialog_content {
|
||||
border-radius: 5px;
|
||||
-moz-border-radius: 5px;
|
||||
-webkit-border-radius: 5px;
|
||||
border-radius: 3px;
|
||||
}
|
||||
|
||||
#dialog_buttons input[type=text] {
|
||||
|
|
|
|||
Loading…
Reference in New Issue