Skip to content
Projects
Groups
Snippets
Help
Loading...
Help
Submit feedback
Contribute to GitLab
Sign in
Toggle navigation
K
kityminder-core
Project
Project
Details
Activity
Releases
Cycle Analytics
Repository
Repository
Files
Commits
Branches
Tags
Contributors
Graph
Compare
Charts
Issues
0
Issues
0
List
Board
Labels
Milestones
Merge Requests
0
Merge Requests
0
Members
Members
Collapse sidebar
Close sidebar
Activity
Graph
Charts
Create a new issue
Commits
Issue Boards
Open sidebar
吴志俊
kityminder-core
Commits
047672a2
Commit
047672a2
authored
Jun 16, 2014
by
techird
Browse files
Options
Browse Files
Download
Email Patches
Plain Diff
stash
parent
c21187a3
Changes
4
Hide whitespace changes
Inline
Side-by-side
Showing
4 changed files
with
179 additions
and
142 deletions
+179
-142
utils.js
src/core/utils.js
+3
-3
dragtree.js
src/module/dragtree.js
+35
-29
png.js
src/protocal/png.js
+99
-99
svg.js
src/protocal/svg.js
+42
-11
No files found.
src/core/utils.js
View file @
047672a2
...
@@ -174,13 +174,13 @@ var utils = Utils = KityMinder.Utils = {
...
@@ -174,13 +174,13 @@ var utils = Utils = KityMinder.Utils = {
},
},
getNodeCommonAncestor
:
function
(
nodeA
,
nodeB
)
{
getNodeCommonAncestor
:
function
(
nodeA
,
nodeB
)
{
if
(
nodeA
===
nodeB
)
{
if
(
nodeA
===
nodeB
)
{
return
nodeA
.
parent
return
nodeA
.
parent
;
}
}
if
(
nodeA
.
contains
(
nodeB
))
{
if
(
nodeA
.
contains
(
nodeB
))
{
return
this
return
nodeB
;
}
}
if
(
nodeB
.
contains
(
nodeA
))
{
if
(
nodeB
.
contains
(
nodeA
))
{
return
nodeB
return
nodeB
;
}
}
var
parent
=
nodeA
.
parent
;
var
parent
=
nodeA
.
parent
;
while
(
!
parent
.
contains
(
nodeB
))
{
while
(
!
parent
.
contains
(
nodeB
))
{
...
...
src/module/dragtree.js
View file @
047672a2
...
@@ -66,6 +66,25 @@ var DragBox = kity.createClass('DragBox', {
...
@@ -66,6 +66,25 @@ var DragBox = kity.createClass('DragBox', {
this
.
addShapes
([
this
.
_rect
,
this
.
_text
]);
this
.
addShapes
([
this
.
_rect
,
this
.
_text
]);
},
},
// 进入拖放模式:
// 1. 计算拖放源和允许的拖放目标
// 2. 渲染拖放盒子
// 3. 启动收缩动画
// 4. 标记已启动
_enterDragMode
:
function
()
{
this
.
_calcDragSources
();
if
(
!
this
.
_dragSources
.
length
)
{
this
.
_startPosition
=
null
;
return
false
;
}
this
.
_calcDropTargets
();
if
(
this
.
_dragSources
.
length
>
1
)
{
this
.
_shrink
();
this
.
_drawForDragMode
();
}
this
.
_dragMode
=
true
;
return
true
;
},
// 从选中的节点计算拖放源
// 从选中的节点计算拖放源
// 并不是所有选中的节点都作为拖放源,如果选中节点中存在 A 和 B,
// 并不是所有选中的节点都作为拖放源,如果选中节点中存在 A 和 B,
...
@@ -108,34 +127,6 @@ var DragBox = kity.createClass('DragBox', {
...
@@ -108,34 +127,6 @@ var DragBox = kity.createClass('DragBox', {
this
.
_dropTargetBoxes
=
this
.
_dropTargets
.
map
(
boxMapper
);
this
.
_dropTargetBoxes
=
this
.
_dropTargets
.
map
(
boxMapper
);
},
},
// 进入拖放模式:
// 1. 计算拖放源和允许的拖放目标
// 2. 渲染拖放盒子
// 3. 启动收缩动画
// 4. 标记已启动
_enterDragMode
:
function
()
{
this
.
_calcDragSources
();
if
(
!
this
.
_dragSources
.
length
)
{
this
.
_startPosition
=
null
;
return
false
;
}
this
.
_calcDropTargets
();
this
.
_drawForDragMode
();
this
.
_shrink
();
this
.
_dragMode
=
true
;
return
true
;
},
_leaveDragMode
:
function
()
{
this
.
remove
();
this
.
_dragMode
=
false
;
this
.
_dropSucceedTarget
=
null
;
this
.
_removeDropHint
();
},
_drawForDragMode
:
function
()
{
this
.
_text
.
setContent
(
this
.
_dragSources
.
length
+
' items'
);
this
.
_text
.
setPosition
(
this
.
_startPosition
.
x
,
this
.
_startPosition
.
y
+
5
);
this
.
_minder
.
getRenderContainer
().
addShape
(
this
);
},
_shrink
:
function
()
{
_shrink
:
function
()
{
// 合并所有拖放源图形的矩形即可
// 合并所有拖放源图形的矩形即可
function
calcSourceArea
(
boxArray
)
{
function
calcSourceArea
(
boxArray
)
{
...
@@ -167,6 +158,20 @@ var DragBox = kity.createClass('DragBox', {
...
@@ -167,6 +158,20 @@ var DragBox = kity.createClass('DragBox', {
var
animator
=
new
AreaAnimator
(
sourceArea
,
focusArea
);
var
animator
=
new
AreaAnimator
(
sourceArea
,
focusArea
);
animator
.
start
(
this
.
_rect
,
400
,
'easeOutQuint'
);
animator
.
start
(
this
.
_rect
,
400
,
'easeOutQuint'
);
},
},
_leaveDragMode
:
function
()
{
this
.
remove
();
this
.
_dragMode
=
false
;
this
.
_dropSucceedTarget
=
null
;
this
.
_removeDropHint
();
},
_drawForDragMode
:
function
()
{
this
.
_text
.
setContent
(
this
.
_dragSources
.
length
+
' items'
);
this
.
_text
.
setPosition
(
this
.
_startPosition
.
x
,
this
.
_startPosition
.
y
+
5
);
this
.
_minder
.
getRenderContainer
().
addShape
(
this
);
},
// 此处可用线段树优化,但考虑到节点不多,必要性不到,就用暴力测试
// 此处可用线段树优化,但考虑到节点不多,必要性不到,就用暴力测试
_dropTest
:
function
()
{
_dropTest
:
function
()
{
var
dragBox
=
this
.
getRenderBox
(),
var
dragBox
=
this
.
getRenderBox
(),
...
@@ -235,10 +240,11 @@ var DragBox = kity.createClass('DragBox', {
...
@@ -235,10 +240,11 @@ var DragBox = kity.createClass('DragBox', {
var
movement
=
kity
.
Vector
.
fromPoints
(
this
.
_startPosition
,
this
.
_dragPosition
);
var
movement
=
kity
.
Vector
.
fromPoints
(
this
.
_startPosition
,
this
.
_dragPosition
);
var
minder
=
this
.
_minder
;
var
minder
=
this
.
_minder
;
this
.
_dragSources
.
forEach
(
function
(
source
)
{
this
.
_dragSources
.
forEach
(
function
(
source
)
{
source
.
setLayoutOffset
(
movement
);
source
.
setLayoutOffset
(
movement
);
minder
.
layout
();
});
});
minder
.
layout
();
this
.
setTranslate
(
movement
);
this
.
setTranslate
(
movement
);
...
...
src/protocal/png.js
View file @
047672a2
KityMinder
.
registerProtocal
(
"png"
,
function
()
{
KityMinder
.
registerProtocal
(
"png"
,
function
()
{
function
loadImage
(
url
,
callback
)
{
function
loadImage
(
url
,
callback
)
{
var
image
=
new
Image
();
var
image
=
new
Image
();
image
.
onload
=
callback
;
image
.
onload
=
callback
;
console
.
log
(
url
);
console
.
log
(
url
);
image
.
src
=
url
;
image
.
src
=
url
;
}
}
return
{
return
{
fileDescription
:
'PNG 图片(暂不支持IE)'
,
fileDescription
:
'PNG 图片(暂不支持IE)'
,
fileExtension
:
'.png'
,
fileExtension
:
'.png'
,
encode
:
function
(
json
,
km
)
{
encode
:
function
(
json
,
km
)
{
var
domContainer
=
km
.
getPaper
().
container
,
var
domContainer
=
km
.
getPaper
().
container
,
svgXml
,
svgXml
,
$svg
,
$svg
,
bgDeclare
=
getComputedStyle
(
domContainer
).
backgroundImage
,
bgDeclare
=
getComputedStyle
(
domContainer
).
backgroundImage
,
bgUrl
=
/url
\((
.+
)\)
$/
.
exec
(
bgDeclare
)[
1
],
bgUrl
=
/url
\((
.+
)\)
$/
.
exec
(
bgDeclare
)[
1
],
renderContainer
=
km
.
getRenderContainer
(),
renderContainer
=
km
.
getRenderContainer
(),
renderBox
=
renderContainer
.
getRenderBox
(),
renderBox
=
renderContainer
.
getRenderBox
(),
transform
=
renderContainer
.
getTransform
(),
transform
=
renderContainer
.
getTransform
(),
width
=
renderBox
.
width
,
width
=
renderBox
.
width
,
height
=
renderBox
.
height
,
height
=
renderBox
.
height
,
padding
=
20
,
padding
=
20
,
canvas
=
document
.
createElement
(
'canvas'
),
canvas
=
document
.
createElement
(
'canvas'
),
ctx
=
canvas
.
getContext
(
'2d'
),
ctx
=
canvas
.
getContext
(
'2d'
),
blob
,
DomURL
,
url
,
img
,
finishCallback
;
blob
,
DomURL
,
url
,
img
,
finishCallback
;
bgUrl
=
bgUrl
.
replace
(
/"/g
,
''
);
bgUrl
=
bgUrl
.
replace
(
/"/g
,
''
);
renderContainer
.
translate
(
-
renderBox
.
x
,
-
renderBox
.
y
);
renderContainer
.
translate
(
-
renderBox
.
x
,
-
renderBox
.
y
);
svgXml
=
km
.
getPaper
().
container
.
innerHTML
;
svgXml
=
km
.
getPaper
().
container
.
innerHTML
;
renderContainer
.
translate
(
renderBox
.
x
,
renderBox
.
y
);
renderContainer
.
translate
(
renderBox
.
x
,
renderBox
.
y
);
$svg
=
$
(
svgXml
);
$svg
=
$
(
svgXml
).
filter
(
'svg'
);
$svg
.
attr
(
{
$svg
.
attr
({
width
:
renderBox
.
width
,
width
:
renderBox
.
width
,
height
:
renderBox
.
height
,
height
:
renderBox
.
height
,
style
:
'font-family: Arial, "Microsoft Yahei","Heiti SC";'
style
:
'font-family: Arial, "Microsoft Yahei","Heiti SC";'
}
);
});
// need a xml with width and height
// need a xml with width and height
svgXml
=
$
(
'<div></div>'
).
append
(
$svg
).
html
();
svgXml
=
$
(
'<div></div>'
).
append
(
$svg
).
html
();
// svg 含有 符号导出报错 Entity 'nbsp' not defined
// svg 含有 符号导出报错 Entity 'nbsp' not defined
svgXml
=
svgXml
.
replace
(
/ /g
,
' '
);
svgXml
=
svgXml
.
replace
(
/ /g
,
' '
);
blob
=
new
Blob
(
[
svgXml
],
{
blob
=
new
Blob
([
svgXml
],
{
type
:
"image/svg+xml;charset=utf-8"
type
:
"image/svg+xml;charset=utf-8"
}
);
});
DomURL
=
window
.
URL
||
window
.
webkitURL
||
window
;
DomURL
=
window
.
URL
||
window
.
webkitURL
||
window
;
url
=
DomURL
.
createObjectURL
(
blob
);
url
=
DomURL
.
createObjectURL
(
blob
);
canvas
.
width
=
width
+
padding
*
2
;
canvas
.
width
=
width
+
padding
*
2
;
canvas
.
height
=
height
+
padding
*
2
;
canvas
.
height
=
height
+
padding
*
2
;
function
fillBackground
(
ctx
,
image
,
width
,
height
)
{
function
fillBackground
(
ctx
,
image
,
width
,
height
)
{
ctx
.
save
();
ctx
.
save
();
ctx
.
fillStyle
=
ctx
.
createPattern
(
image
,
"repeat"
);
ctx
.
fillStyle
=
ctx
.
createPattern
(
image
,
"repeat"
);
ctx
.
fillRect
(
0
,
0
,
width
,
height
);
ctx
.
fillRect
(
0
,
0
,
width
,
height
);
ctx
.
restore
();
ctx
.
restore
();
}
}
function
drawImage
(
ctx
,
image
,
x
,
y
)
{
function
drawImage
(
ctx
,
image
,
x
,
y
)
{
ctx
.
drawImage
(
image
,
x
,
y
);
ctx
.
drawImage
(
image
,
x
,
y
);
}
}
function
generateDataUrl
(
canvas
)
{
function
generateDataUrl
(
canvas
)
{
var
url
=
canvas
.
toDataURL
(
'png'
);
var
url
=
canvas
.
toDataURL
(
'png'
);
return
url
;
return
url
;
}
}
loadImage
(
url
,
function
()
{
loadImage
(
url
,
function
()
{
var
svgImage
=
this
;
var
svgImage
=
this
;
loadImage
(
bgUrl
,
function
()
{
loadImage
(
bgUrl
,
function
()
{
var
downloadUrl
;
var
downloadUrl
;
fillBackground
(
ctx
,
this
,
canvas
.
width
,
canvas
.
height
);
fillBackground
(
ctx
,
this
,
canvas
.
width
,
canvas
.
height
);
drawImage
(
ctx
,
svgImage
,
padding
,
padding
);
drawImage
(
ctx
,
svgImage
,
padding
,
padding
);
DomURL
.
revokeObjectURL
(
url
);
DomURL
.
revokeObjectURL
(
url
);
downloadUrl
=
generateDataUrl
(
canvas
);
downloadUrl
=
generateDataUrl
(
canvas
);
if
(
finishCallback
)
{
if
(
finishCallback
)
{
finishCallback
(
downloadUrl
);
finishCallback
(
downloadUrl
);
}
}
}
);
});
}
);
});
return
{
return
{
then
:
function
(
callback
)
{
then
:
function
(
callback
)
{
finishCallback
=
callback
;
finishCallback
=
callback
;
}
}
};
};
},
},
recognizePriority
:
-
1
recognizePriority
:
-
1
};
};
}
);
});
\ No newline at end of file
\ No newline at end of file
src/protocal/svg.js
View file @
047672a2
KityMinder
.
registerProtocal
(
"svg"
,
function
()
{
KityMinder
.
registerProtocal
(
"svg"
,
function
()
{
return
{
return
{
fileDescription
:
'SVG 矢量图(暂不支持IE)'
,
fileDescription
:
'SVG 矢量图(暂不支持IE)'
,
fileExtension
:
'.svg'
,
fileExtension
:
'.svg'
,
mineType
:
'image/svg+xml'
,
mineType
:
'image/svg+xml'
,
encode
:
function
(
json
,
km
)
{
encode
:
function
(
json
,
km
)
{
// svg 含有 符号导出报错 Entity 'nbsp' not defined
var
domContainer
=
km
.
getPaper
().
container
,
return
km
.
getPaper
().
container
.
innerHTML
.
replace
(
/ /g
,
' '
);
svgXml
,
},
$svg
,
recognizePriority
:
-
1
};
renderContainer
=
km
.
getRenderContainer
(),
}
);
renderBox
=
renderContainer
.
getRenderBox
(),
\ No newline at end of file
transform
=
renderContainer
.
getTransform
(),
width
=
renderBox
.
width
,
height
=
renderBox
.
height
,
padding
=
20
;
svgXml
=
km
.
getPaper
().
container
.
innerHTML
;
$svg
=
$
(
svgXml
).
filter
(
'svg'
);
$svg
.
attr
({
width
:
width
+
padding
*
2
|
0
,
height
:
height
+
padding
*
2
|
0
,
style
:
'font-family: Arial, "Microsoft Yahei","Heiti SC";'
});
$svg
[
0
].
setAttribute
(
'viewBox'
,
[
renderBox
.
x
-
padding
|
0
,
renderBox
.
y
-
padding
|
0
,
width
+
padding
*
2
|
0
,
height
+
padding
*
2
|
0
].
join
(
' '
));
// need a xml with width and height
svgXml
=
$
(
'<div></div>'
).
append
(
$svg
).
html
();
// svg 含有 符号导出报错 Entity 'nbsp' not defined
svgXml
=
svgXml
.
replace
(
/ /g
,
' '
);
// svg 含有 符号导出报错 Entity 'nbsp' not defined
return
svgXml
;
},
recognizePriority
:
-
1
};
});
\ No newline at end of file
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment