Skip to content
体验新版
项目
组织
正在加载...
登录
切换导航
打开侧边栏
ChenYFan_OHHH
uni-app
提交
460e0a99
U
uni-app
项目概览
ChenYFan_OHHH
/
uni-app
与 Fork 源项目一致
Fork自
DCloud / uni-app
通知
1
Star
1
Fork
0
代码
文件
提交
分支
Tags
贡献者
分支图
Diff
Issue
1
列表
看板
标记
里程碑
合并请求
0
DevOps
流水线
流水线任务
计划
Wiki
0
Wiki
分析
仓库
DevOps
项目成员
Pages
U
uni-app
项目概览
项目概览
详情
发布
仓库
仓库
文件
提交
分支
标签
贡献者
分支图
比较
Issue
1
Issue
1
列表
看板
标记
里程碑
合并请求
0
合并请求
0
Pages
DevOps
DevOps
流水线
流水线任务
计划
分析
分析
仓库分析
DevOps
Wiki
0
Wiki
成员
成员
收起侧边栏
关闭侧边栏
动态
分支图
创建新Issue
流水线任务
提交
Issue看板
体验新版 GitCode,发现更多精彩内容 >>
提交
460e0a99
编写于
5月 24, 2021
作者:
fxy060608
浏览文件
操作
浏览文件
下载
差异文件
chore: merge
上级
b7e0ac9e
2cafc199
变更
8
隐藏空白更改
内联
并排
Showing
8 changed file
with
1683 addition
and
1575 deletion
+1683
-1575
packages/uni-api/src/service/context/canvas.ts
packages/uni-api/src/service/context/canvas.ts
+4
-3
packages/uni-components/src/components/canvas/index.tsx
packages/uni-components/src/components/canvas/index.tsx
+734
-0
packages/uni-components/src/components/canvas/index.vue
packages/uni-components/src/components/canvas/index.vue
+0
-630
packages/uni-components/src/components/index.ts
packages/uni-components/src/components/index.ts
+1
-1
packages/uni-components/src/helpers/useContextInfo.ts
packages/uni-components/src/helpers/useContextInfo.ts
+2
-2
packages/uni-h5/dist/uni-h5.cjs.js
packages/uni-h5/dist/uni-h5.cjs.js
+466
-476
packages/uni-h5/dist/uni-h5.es.js
packages/uni-h5/dist/uni-h5.es.js
+471
-462
packages/uni-h5/src/platform/saveImage.ts
packages/uni-h5/src/platform/saveImage.ts
+5
-1
未找到文件。
packages/uni-api/src/service/context/canvas.ts
浏览文件 @
460e0a99
...
...
@@ -361,6 +361,7 @@ type ActionsItem = {
method
:
string
data
:
ActionsItemData
|
Array
<
ActionsItem
>
}
export
type
Actions
=
Array
<
ActionsItem
>
type
DefaultState
=
typeof
defaultState
type
Callback
=
(
result
:
any
)
=>
void
|
undefined
type
LineCapType
=
'
butt
'
|
'
round
'
|
'
square
'
...
...
@@ -371,8 +372,8 @@ type TextBaselineType = 'top' | 'bottom' | 'middle' | 'normal'
export
class
CanvasContext
implements
UniApp
.
CanvasContext
{
id
:
string
pageId
:
number
actions
:
A
rray
<
ActionsItem
>
path
:
A
rray
<
ActionsItem
>
actions
:
A
ctions
path
:
A
ctions
subpath
:
Array
<
ActionsItem
[
'
data
'
]
>
state
:
DefaultState
drawingState
:
Array
<
DefaultState
>
...
...
@@ -656,7 +657,7 @@ export class CanvasContext implements UniApp.CanvasContext {
var
style
=
fontFormat
[
1
].
trim
().
split
(
/
\s
/
)
var
fontSize
=
parseFloat
(
fontFormat
[
3
])
var
fontFamily
=
fontFormat
[
7
]
var
actions
:
A
rray
<
ActionsItem
>
=
[]
var
actions
:
A
ctions
=
[]
style
.
forEach
(
function
(
value
,
index
)
{
if
([
'
italic
'
,
'
oblique
'
,
'
normal
'
].
indexOf
(
value
)
>
-
1
)
{
actions
.
push
({
...
...
packages/uni-components/src/components/canvas/index.tsx
0 → 100644
浏览文件 @
460e0a99
import
{
ref
,
computed
,
ExtractPropTypes
,
Ref
,
onMounted
}
from
'
vue
'
import
{
extend
}
from
'
@vue/shared
'
import
type
{
Actions
}
from
'
@dcloudio/uni-api
'
import
{
useAttrs
,
useContextInfo
,
useSubscribe
,
withWebEvent
,
defineBuiltInComponent
,
}
from
'
@dcloudio/uni-components
'
import
{
getCurrentPageId
,
onEventPrevent
}
from
'
@dcloudio/uni-core
'
import
{
saveImage
,
getSameOriginUrl
,
getRealPath
,
}
from
'
@dcloudio/uni-platform
'
import
ResizeSensor
from
'
../resize-sensor
'
import
{
useNativeEvent
,
NativeEventTrigger
}
from
'
../../helpers/useEvent
'
import
{
pixelRatio
,
wrapper
,
initHidpi
}
from
'
../../helpers/hidpi
'
import
{
once
}
from
'
@dcloudio/uni-shared
'
const
initHidpiOnce
=
/*#__PURE__*/
once
(
initHidpi
)
function
$getRealPath
(
src
:
string
)
{
return
src
?
getRealPath
(
src
)
:
src
}
function
resolveColor
(
color
:
number
[])
{
color
=
color
.
slice
(
0
)
color
[
3
]
=
color
[
3
]
/
255
return
'
rgba(
'
+
color
.
join
(
'
,
'
)
+
'
)
'
}
function
processTouches
(
target
:
EventTarget
,
touches
:
TouchEvent
[
'
touches
'
])
{
const
eventTarget
=
target
as
HTMLElement
return
Array
.
from
(
touches
).
map
((
touch
)
=>
{
let
boundingClientRect
=
eventTarget
.
getBoundingClientRect
()
return
{
identifier
:
touch
.
identifier
,
x
:
touch
.
clientX
-
boundingClientRect
.
left
,
y
:
touch
.
clientY
-
boundingClientRect
.
top
,
}
})
}
let
tempCanvas
:
HTMLCanvasElement
function
getTempCanvas
(
width
=
0
,
height
=
0
)
{
if
(
!
tempCanvas
)
{
tempCanvas
=
document
.
createElement
(
'
canvas
'
)
}
tempCanvas
.
width
=
width
tempCanvas
.
height
=
height
return
tempCanvas
}
const
props
=
{
canvasId
:
{
type
:
String
,
default
:
''
,
},
disableScroll
:
{
type
:
[
Boolean
,
String
],
default
:
false
,
},
}
type
Props
=
ExtractPropTypes
<
typeof
props
>
export
default
/*#__PURE__*/
defineBuiltInComponent
({
inheritAttrs
:
false
,
name
:
'
Canvas
'
,
compatConfig
:
{
MODE
:
3
,
},
props
,
computed
:
{
id
():
Props
[
'
canvasId
'
]
{
return
this
.
canvasId
},
},
setup
(
props
,
{
emit
,
slots
})
{
initHidpiOnce
()
const
canvas
=
ref
<
HTMLCanvasElement
|
null
>
(
null
)
const
sensor
=
ref
<
HTMLElement
|
null
>
(
null
)
const
actionsWaiting
=
ref
(
false
)
const
trigger
=
useNativeEvent
(
emit
)
const
{
$attrs
,
$excludeAttrs
,
$listeners
}
=
useAttrs
({
excludeListeners
:
true
,
})
const
{
_listeners
}
=
useListeners
(
props
,
$listeners
,
trigger
)
const
{
_handleSubscribe
,
_resize
}
=
useMethods
(
canvas
,
actionsWaiting
)
useSubscribe
(
_handleSubscribe
as
(
type
:
string
,
data
:
unknown
)
=>
void
,
useContextInfo
(
props
.
canvasId
),
true
)
onMounted
(()
=>
{
_resize
()
})
return
()
=>
{
const
{
canvasId
,
disableScroll
}
=
props
return
(
<
uni
-
canvas
canvas
-
id
=
{
canvasId
}
disable
-
scroll
=
{
disableScroll
}
{
...
$attrs
.
value
}
{
...
$excludeAttrs
.
value
}
{
...
_listeners
.
value
}
>
<
canvas
ref
=
{
canvas
}
class
=
"uni-canvas-canvas"
width
=
"300"
height
=
"150"
/>
<
div
style
=
"position: absolute;top: 0;left: 0;width: 100%;height: 100%;overflow: hidden;"
>
{
slots
.
default
&&
slots
.
default
()
}
</
div
>
{
/* @ts-ignore */
}
<
ResizeSensor
ref
=
{
sensor
}
onResize
=
{
_resize
}
/>
</
uni
-
canvas
>
)
}
},
})
function
useListeners
(
props
:
Props
,
Listeners
:
Ref
<
{}
>
,
trigger
:
NativeEventTrigger
)
{
const
_listeners
=
computed
(()
=>
{
let
events
=
[
'
onTouchstart
'
,
'
onTouchmove
'
,
'
onTouchend
'
]
let
_$listeners
=
Listeners
.
value
let
$listeners
=
Object
.
assign
(
{},
(()
=>
{
let
obj
=
{}
for
(
const
key
in
_$listeners
)
{
if
(
Object
.
prototype
.
hasOwnProperty
.
call
(
_$listeners
,
key
))
{
const
event
=
(
_$listeners
as
any
)[
key
]
;(
obj
as
any
)[
key
]
=
event
}
}
return
obj
})()
)
events
.
forEach
((
event
)
=>
{
let
existing
=
(
$listeners
as
any
)[
event
]
let
eventHandler
=
[]
if
(
existing
)
{
eventHandler
.
push
(
withWebEvent
((
$event
)
=>
{
trigger
(
event
.
replace
(
'
on
'
,
''
).
toLocaleLowerCase
(),
Object
.
assign
(
{},
// $event无法直接assign
(()
=>
{
let
obj
=
{}
for
(
const
key
in
$event
)
{
;(
obj
as
any
)[
key
]
=
$event
[
key
]
}
return
obj
})(),
{
touches
:
processTouches
(
$event
.
currentTarget
,
$event
.
touches
),
changedTouches
:
processTouches
(
$event
.
currentTarget
,
$event
.
changedTouches
),
}
)
as
unknown
as
Event
)
})
)
}
if
(
props
.
disableScroll
&&
event
===
'
onTouchmove
'
)
{
eventHandler
.
push
(
onEventPrevent
)
}
;(
$listeners
as
any
)[
event
]
=
eventHandler
})
return
$listeners
})
return
{
_listeners
,
}
}
function
useMethods
(
canvasRef
:
Ref
<
HTMLCanvasElement
|
null
>
,
actionsWaiting
:
Ref
<
boolean
>
)
{
let
_actionsDefer
:
Array
<
[
Actions
,
boolean
,
number
?]
>
=
[]
let
_images
:
{
[
key
:
string
]:
HTMLImageElement
&
{
ready
:
boolean
}
}
=
{}
function
_resize
()
{
var
canvas
=
canvasRef
.
value
!
if
(
canvas
.
width
>
0
&&
canvas
.
height
>
0
)
{
var
context
=
canvas
.
getContext
(
'
2d
'
)
!
var
imageData
=
context
.
getImageData
(
0
,
0
,
canvas
.
width
,
canvas
.
height
)
wrapper
(
canvas
)
context
.
putImageData
(
imageData
,
0
,
0
)
}
else
{
wrapper
(
canvas
)
}
}
function
actionsChanged
({
actions
,
reserve
,
callbackId
,
}:
{
actions
:
Actions
reserve
:
boolean
callbackId
:
number
})
{
if
(
!
actions
)
{
return
}
if
(
actionsWaiting
.
value
)
{
_actionsDefer
.
push
([
actions
,
reserve
,
callbackId
])
return
}
var
canvas
=
canvasRef
.
value
!
var
c2d
=
canvas
.
getContext
(
'
2d
'
)
!
if
(
!
reserve
)
{
c2d
.
fillStyle
=
'
#000000
'
c2d
.
strokeStyle
=
'
#000000
'
c2d
.
shadowColor
=
'
#000000
'
c2d
.
shadowBlur
=
0
c2d
.
shadowOffsetX
=
0
c2d
.
shadowOffsetY
=
0
c2d
.
setTransform
(
1
,
0
,
0
,
1
,
0
,
0
)
c2d
.
clearRect
(
0
,
0
,
canvas
.
width
,
canvas
.
height
)
}
preloadImage
(
actions
)
for
(
let
index
=
0
;
index
<
actions
.
length
;
index
++
)
{
type
MultipleArray
=
Array
<
Array
<
number
|
string
|
number
[]
>>
type
LinearGradient
=
Parameters
<
CanvasFillStrokeStyles
[
'
createLinearGradient
'
]
>
const
action
=
actions
[
index
]
let
method
=
action
.
method
const
data
=
action
.
data
as
Array
<
string
|
LinearGradient
|
MultipleArray
>
if
(
/^set/
.
test
(
method
)
&&
method
!==
'
setTransform
'
)
{
const
method1
=
method
[
3
].
toLowerCase
()
+
method
.
slice
(
4
)
let
color
:
CanvasGradient
|
string
if
(
method1
===
'
fillStyle
'
||
method1
===
'
strokeStyle
'
)
{
if
(
data
[
0
]
===
'
normal
'
)
{
color
=
resolveColor
(
data
[
1
]
as
number
[])
}
else
if
(
data
[
0
]
===
'
linear
'
)
{
const
LinearGradient
=
c2d
.
createLinearGradient
(
...(
data
[
1
]
as
LinearGradient
)
)
;(
data
[
2
]
as
MultipleArray
).
forEach
(
function
(
data2
)
{
const
offset
=
data2
[
0
]
as
number
const
color
=
resolveColor
(
data2
[
1
]
as
number
[])
LinearGradient
.
addColorStop
(
offset
,
color
)
})
color
=
LinearGradient
}
else
if
(
data
[
0
]
===
'
radial
'
)
{
const
x
=
data
[
1
][
0
]
as
number
const
y
=
data
[
1
][
1
]
as
number
const
r
=
data
[
1
][
2
]
as
number
const
LinearGradient
=
c2d
.
createRadialGradient
(
x
,
y
,
0
,
x
,
y
,
r
)
// @ts-ignore
data
[
2
].
forEach
(
function
(
data2
)
{
const
offset
=
data2
[
0
]
const
color
=
resolveColor
(
data2
[
1
])
LinearGradient
.
addColorStop
(
offset
,
color
)
})
color
=
LinearGradient
}
else
if
(
data
[
0
]
===
'
pattern
'
)
{
const
loaded
=
checkImageLoaded
(
data
[
1
]
as
string
,
actions
.
slice
(
index
+
1
),
callbackId
,
function
(
image
)
{
if
(
image
)
{
c2d
[
method1
]
=
c2d
.
createPattern
(
image
,
data
[
2
]
as
string
)
!
}
}
)
if
(
!
loaded
)
{
break
}
continue
}
c2d
[
method1
]
=
color
!
}
else
if
(
method1
===
'
globalAlpha
'
)
{
c2d
[
method1
]
=
Number
(
data
[
0
])
/
255
}
else
if
(
method1
===
'
shadow
'
)
{
var
_
=
[
'
shadowOffsetX
'
,
'
shadowOffsetY
'
,
'
shadowBlur
'
,
'
shadowColor
'
,
]
data
.
forEach
(
function
(
color_
,
method_
)
{
// @ts-ignore
c2d
[
_
[
method_
]]
=
// @ts-ignore
_
[
method_
]
===
'
shadowColor
'
?
resolveColor
(
color_
)
:
color_
})
}
else
if
(
method1
===
'
fontSize
'
)
{
// @ts-ignore
const
font
=
c2d
.
__font__
||
c2d
.
font
// @ts-ignore
c2d
.
__font__
=
c2d
.
font
=
font
.
replace
(
/
\d
+
\.?\d
*px/
,
data
[
0
]
+
'
px
'
)
}
else
if
(
method1
===
'
lineDash
'
)
{
// @ts-ignore
c2d
.
setLineDash
(
data
[
0
])
// @ts-ignore
c2d
.
lineDashOffset
=
data
[
1
]
||
0
}
else
if
(
method1
===
'
textBaseline
'
)
{
if
(
data
[
0
]
===
'
normal
'
)
{
data
[
0
]
=
'
alphabetic
'
}
// @ts-ignore
c2d
[
method1
]
=
data
[
0
]
}
else
if
(
method1
===
'
font
'
)
{
// @ts-ignore
c2d
.
__font__
=
c2d
.
font
=
data
[
0
]
}
else
{
// @ts-ignore
c2d
[
method1
]
=
data
[
0
]
}
}
else
if
(
method
===
'
fillPath
'
||
method
===
'
strokePath
'
)
{
method
=
method
.
replace
(
/Path/
,
''
)
c2d
.
beginPath
()
data
.
forEach
(
function
(
data_
)
{
// @ts-ignore
c2d
[
data_
.
method
].
apply
(
c2d
,
data_
.
data
)
})
// @ts-ignore
c2d
[
method
]()
}
else
if
(
method
===
'
fillText
'
)
{
// @ts-ignore
c2d
.
fillText
.
apply
(
c2d
,
data
)
}
else
if
(
method
===
'
drawImage
'
)
{
var
A
=
(
function
()
{
var
dataArray
=
[...
data
]
var
url
=
dataArray
[
0
]
as
string
var
otherData
=
dataArray
.
slice
(
1
)
_images
=
_images
||
{}
if
(
checkImageLoaded
(
url
,
actions
.
slice
(
index
+
1
),
callbackId
,
function
(
image
)
{
if
(
image
)
{
c2d
.
drawImage
.
apply
(
c2d
,
// @ts-ignore
[
image
].
concat
(
// @ts-ignore
[...
otherData
.
slice
(
4
,
8
)],
[...
otherData
.
slice
(
0
,
4
)]
)
)
}
}
)
)
return
'
break
'
})()
if
(
A
===
'
break
'
)
{
break
}
}
else
{
if
(
method
===
'
clip
'
)
{
data
.
forEach
(
function
(
data_
)
{
// @ts-ignore
c2d
[
data_
.
method
].
apply
(
c2d
,
data_
.
data
)
})
c2d
.
clip
()
}
else
{
// @ts-ignore
c2d
[
method
].
apply
(
c2d
,
data
)
}
}
}
if
(
!
actionsWaiting
.
value
&&
callbackId
)
{
UniViewJSBridge
.
publishHandler
(
'
onCanvasMethodCallback
'
,
{
callbackId
,
data
:
{
errMsg
:
'
drawCanvas:ok
'
,
},
},
getCurrentPageId
()
)
}
}
function
preloadImage
(
actions
:
Actions
)
{
actions
.
forEach
(
function
(
action
)
{
var
method
=
action
.
method
var
data
=
action
.
data
var
src
=
''
if
(
method
===
'
drawImage
'
)
{
src
=
data
[
0
]
as
string
src
=
$getRealPath
(
src
)
data
[
0
]
=
src
}
else
if
(
method
===
'
setFillStyle
'
&&
data
[
0
]
===
'
pattern
'
)
{
src
=
data
[
1
]
as
string
src
=
$getRealPath
(
src
)
data
[
1
]
=
src
}
if
(
src
&&
!
_images
[
src
])
{
loadImage
()
}
/**
* 加载图像
*/
function
loadImage
()
{
// @ts-ignore
const
image
=
(
_images
[
src
]
=
new
Image
())
image
.
onload
=
function
()
{
// @ts-ignore
image
.
ready
=
true
}
// 安卓 WebView 除本地路径无跨域问题
if
(
__PLATFORM__
===
'
app
'
&&
navigator
.
vendor
===
'
Google Inc.
'
)
{
if
(
src
.
indexOf
(
'
file://
'
)
===
0
)
{
image
.
crossOrigin
=
'
anonymous
'
}
image
.
src
=
src
return
}
getSameOriginUrl
(
src
)
.
then
((
src
)
=>
{
image
.
src
=
src
})
.
catch
(()
=>
{
image
.
src
=
src
})
}
})
}
function
checkImageLoaded
(
src
:
string
,
actions
:
Actions
,
callbackId
:
number
,
fn
:
(
a
:
CanvasImageSource
)
=>
void
)
{
var
image
=
_images
[
src
]
if
(
image
.
ready
)
{
fn
(
image
)
return
true
}
else
{
_actionsDefer
.
unshift
([
actions
,
true
])
actionsWaiting
.
value
=
true
image
.
onload
=
function
()
{
image
.
ready
=
true
fn
(
image
)
actionsWaiting
.
value
=
false
var
actions
=
_actionsDefer
.
slice
(
0
)
_actionsDefer
=
[]
for
(
var
action
=
actions
.
shift
();
action
;
)
{
actionsChanged
({
actions
:
action
[
0
],
reserve
:
action
[
1
],
callbackId
,
})
action
=
actions
.
shift
()
}
}
return
false
}
}
function
getImageData
({
x
=
0
,
y
=
0
,
width
,
height
,
destWidth
,
destHeight
,
hidpi
=
true
,
dataType
,
quality
=
1
,
type
=
'
png
'
,
callbackId
,
}:
{
x
:
number
y
:
number
width
:
number
height
:
number
destWidth
:
number
destHeight
:
number
hidpi
:
boolean
dataType
:
string
quality
:
number
type
:
string
callbackId
?:
number
})
{
const
canvas
=
canvasRef
.
value
!
let
data
:
string
|
number
[]
const
maxWidth
=
canvas
.
offsetWidth
-
x
width
=
width
?
Math
.
min
(
width
,
maxWidth
)
:
maxWidth
const
maxHeight
=
canvas
.
offsetHeight
-
y
height
=
height
?
Math
.
min
(
height
,
maxHeight
)
:
maxHeight
if
(
!
hidpi
)
{
if
(
!
destWidth
&&
!
destHeight
)
{
destWidth
=
Math
.
round
(
width
*
pixelRatio
)
destHeight
=
Math
.
round
(
height
*
pixelRatio
)
}
else
if
(
!
destWidth
)
{
destWidth
=
Math
.
round
((
width
/
height
)
*
destHeight
)
}
else
if
(
!
destHeight
)
{
destHeight
=
Math
.
round
((
height
/
width
)
*
destWidth
)
}
}
else
{
destWidth
=
width
destHeight
=
height
}
const
newCanvas
=
getTempCanvas
(
destWidth
,
destHeight
)
const
context
=
newCanvas
.
getContext
(
'
2d
'
)
!
if
(
type
===
'
jpeg
'
||
type
===
'
jpg
'
)
{
type
=
'
jpeg
'
context
.
fillStyle
=
'
#fff
'
context
.
fillRect
(
0
,
0
,
destWidth
,
destHeight
)
}
// @ts-ignore
context
.
__hidpi__
=
true
// @ts-ignore
context
.
drawImageByCanvas
(
canvas
,
x
,
y
,
width
,
height
,
0
,
0
,
destWidth
,
destHeight
,
false
)
let
result
try
{
let
compressed
if
(
dataType
===
'
base64
'
)
{
data
=
newCanvas
.
toDataURL
(
`image/
${
type
}
`
,
quality
)
}
else
{
const
imgData
=
context
.
getImageData
(
0
,
0
,
destWidth
,
destHeight
)
if
(
__PLATFORM__
===
'
app
'
)
{
const
pako
=
require
(
'
pako
'
)
// eslint-disable-line no-restricted-globals
data
=
pako
.
deflateRaw
(
imgData
.
data
as
any
,
{
to
:
'
string
'
})
compressed
=
true
}
else
{
// fix [...]展开TypedArray在低版本手机报错的问题,使用Array.prototype.slice
data
=
Array
.
prototype
.
slice
.
call
(
imgData
.
data
)
}
}
result
=
{
errMsg
:
'
canvasGetImageData:ok
'
,
data
,
compressed
,
width
:
destWidth
,
height
:
destHeight
,
}
}
catch
(
error
)
{
result
=
{
errMsg
:
`canvasGetImageData:fail
${
error
}
`
,
}
}
newCanvas
.
height
=
newCanvas
.
width
=
0
// @ts-ignore
context
.
__hidpi__
=
false
if
(
!
callbackId
)
{
return
result
}
else
{
UniViewJSBridge
.
publishHandler
(
'
onCanvasMethodCallback
'
,
{
callbackId
,
data
:
result
,
},
getCurrentPageId
()
)
}
}
function
putImageData
({
data
,
x
,
y
,
width
,
height
,
compressed
,
callbackId
,
}:
{
data
:
Array
<
number
>
x
:
number
y
:
number
width
:
number
height
:
number
compressed
:
boolean
callbackId
:
number
})
{
try
{
if
(
!
height
)
{
height
=
Math
.
round
(
data
.
length
/
4
/
width
)
}
const
canvas
=
getTempCanvas
(
width
,
height
)
const
context
=
canvas
.
getContext
(
'
2d
'
)
!
if
(
__PLATFORM__
===
'
app
'
&&
compressed
)
{
const
pako
=
require
(
'
pako
'
)
// eslint-disable-line no-restricted-globals
data
=
pako
.
inflateRaw
(
data
)
as
any
}
context
.
putImageData
(
new
ImageData
(
new
Uint8ClampedArray
(
data
),
width
,
height
),
0
,
0
)
canvasRef
.
value
!
.
getContext
(
'
2d
'
)
!
.
drawImage
(
canvas
,
x
,
y
,
width
,
height
)
canvas
.
height
=
canvas
.
width
=
0
}
catch
(
error
)
{
UniViewJSBridge
.
publishHandler
(
'
onCanvasMethodCallback
'
,
{
callbackId
,
data
:
{
errMsg
:
'
canvasPutImageData:fail
'
,
},
},
getCurrentPageId
()
)
return
}
UniViewJSBridge
.
publishHandler
(
'
onCanvasMethodCallback
'
,
{
callbackId
,
data
:
{
errMsg
:
'
canvasPutImageData:ok
'
,
},
},
getCurrentPageId
()
)
}
function
toTempFilePath
({
x
=
0
,
y
=
0
,
width
,
height
,
destWidth
,
destHeight
,
fileType
,
quality
,
dirname
,
callbackId
,
}:
{
x
:
number
y
:
number
width
:
number
height
:
number
destWidth
:
number
destHeight
:
number
fileType
:
string
quality
:
number
dirname
:
string
callbackId
:
number
})
{
const
res
=
getImageData
({
x
,
y
,
width
,
height
,
destWidth
,
destHeight
,
hidpi
:
false
,
dataType
:
'
base64
'
,
type
:
fileType
,
quality
,
})
!
if
(
!
res
.
data
||
!
res
.
data
.
length
)
{
UniViewJSBridge
.
publishHandler
(
'
onCanvasMethodCallback
'
,
{
callbackId
,
data
:
{
errMsg
:
res
!
.
errMsg
.
replace
(
'
canvasPutImageData
'
,
'
toTempFilePath
'
),
},
},
getCurrentPageId
()
)
return
}
saveImage
(
res
.
data
as
string
,
dirname
,
(
error
,
tempFilePath
)
=>
{
let
errMsg
=
`toTempFilePath:
${
error
?
'
fail
'
:
'
ok
'
}
`
if
(
error
)
{
errMsg
+=
`
${
error
.
message
}
`
}
UniViewJSBridge
.
publishHandler
(
'
onCanvasMethodCallback
'
,
{
callbackId
,
data
:
{
errMsg
,
tempFilePath
:
tempFilePath
,
},
},
getCurrentPageId
()
)
})
}
const
methods
=
{
actionsChanged
,
getImageData
,
putImageData
,
toTempFilePath
,
}
function
_handleSubscribe
(
type
:
keyof
typeof
methods
,
data
=
{})
{
let
method
=
methods
[
type
]
if
(
type
.
indexOf
(
'
_
'
)
!==
0
&&
typeof
method
===
'
function
'
)
{
method
(
data
as
any
)
}
}
return
extend
(
methods
,
{
_resize
,
_handleSubscribe
,
})
}
packages/uni-components/src/components/canvas/index.vue
已删除
100644 → 0
浏览文件 @
b7e0ac9e
<
template
>
<uni-canvas
:canvas-id=
"canvasId"
:disable-scroll=
"disableScroll"
v-bind=
"
{ ...Attrs, ...ExcludeAttrs }"
v-on="_listeners"
>
<canvas
class=
"uni-canvas-canvas"
ref=
"canvas"
width=
"300"
height=
"150"
/>
<div
style=
"
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
overflow: hidden;
"
>
<slot
/>
</div>
<ResizeSensor
ref=
"sensor"
@
resize=
"_resize"
/>
</uni-canvas>
</
template
>
<
script
lang=
"ts"
>
import
{
ref
}
from
"
vue
"
;
import
{
useAttrs
,
useContextInfo
,
useSubscribe
,
withWebEvent
,
}
from
"
@dcloudio/uni-components
"
;
import
{
getCurrentPageId
,
onEventPrevent
}
from
"
@dcloudio/uni-core
"
;
import
{
saveImage
,
getSameOriginUrl
,
getRealPath
}
from
"
@dcloudio/uni-platform
"
;
import
ResizeSensor
from
"
../resize-sensor
"
;
import
{
useNativeEvent
}
from
"
../../helpers/useEvent
"
;
import
{
pixelRatio
,
wrapper
,
initHidpi
}
from
"
../../helpers/hidpi
"
;
import
{
once
}
from
"
@dcloudio/uni-shared
"
;
const
initHidpiOnce
=
/*#__PURE__*/
once
(
initHidpi
)
function
$getRealPath
(
src
)
{
return
src
?
getRealPath
(
src
)
:
src
;
}
function
resolveColor
(
color
)
{
color
=
color
.
slice
(
0
);
color
[
3
]
=
color
[
3
]
/
255
;
return
"
rgba(
"
+
color
.
join
(
"
,
"
)
+
"
)
"
;
}
function
processTouches
(
target
,
touches
)
{
return
[].
map
.
call
(
touches
,
(
touch
)
=>
{
var
boundingClientRect
=
target
.
getBoundingClientRect
();
return
{
identifier
:
touch
.
identifier
,
x
:
touch
.
clientX
-
boundingClientRect
.
left
,
y
:
touch
.
clientY
-
boundingClientRect
.
top
,
};
});
}
var
tempCanvas
;
function
getTempCanvas
(
width
=
0
,
height
=
0
)
{
if
(
!
tempCanvas
)
{
tempCanvas
=
document
.
createElement
(
"
canvas
"
);
}
tempCanvas
.
width
=
width
;
tempCanvas
.
height
=
height
;
return
tempCanvas
;
}
export
default
{
name
:
"
Canvas
"
,
inheritAttrs
:
false
,
compatConfig
:
{
MODE
:
3
,
},
components
:
{
ResizeSensor
,
},
props
:
{
canvasId
:
{
type
:
String
,
default
:
""
,
},
disableScroll
:
{
type
:
[
Boolean
,
String
],
default
:
false
,
},
},
data
()
{
return
{
actionsWaiting
:
false
,
};
},
computed
:
{
id
()
{
return
this
.
canvasId
;
},
_listeners
()
{
let
events
=
[
"
touchstart
"
,
"
touchmove
"
,
"
touchend
"
];
let
_$listeners
=
this
.
Listeners
;
let
$listeners
=
Object
.
assign
(
{},
(()
=>
{
let
obj
=
{};
for
(
const
key
in
_$listeners
)
{
if
(
Object
.
prototype
.
hasOwnProperty
.
call
(
_$listeners
,
key
))
{
const
event
=
_$listeners
[
key
];
obj
[
key
.
replace
(
"
on
"
,
""
).
toLowerCase
()]
=
event
;
}
}
return
obj
;
})()
);
events
.
forEach
((
event
)
=>
{
let
existing
=
$listeners
[
event
];
let
eventHandler
=
[];
if
(
existing
)
{
eventHandler
.
push
(
withWebEvent
((
$event
)
=>
{
this
.
$trigger
(
event
,
Object
.
assign
(
{},
// $event无法直接assign
(()
=>
{
let
obj
=
{};
for
(
const
key
in
$event
)
{
obj
[
key
]
=
$event
[
key
];
}
return
obj
;
})(),
{
touches
:
processTouches
(
$event
.
currentTarget
,
$event
.
touches
),
changedTouches
:
processTouches
(
$event
.
currentTarget
,
$event
.
changedTouches
),
}
)
);
})
);
}
if
(
this
.
disableScroll
&&
event
===
"
touchmove
"
)
{
eventHandler
.
push
(
onEventPrevent
);
}
$listeners
[
event
]
=
eventHandler
;
});
return
$listeners
;
},
},
created
()
{
this
.
_actionsDefer
=
[];
this
.
_images
=
{};
const
id
=
useContextInfo
();
useSubscribe
(
this
.
_handleSubscribe
,
id
,
true
);
},
beforeMount
()
{
// 将来放在onBeforeMount时,编译至cjs时,会自动摇树掉
initHidpiOnce
();
},
mounted
()
{
this
.
$trigger
=
useNativeEvent
(
this
.
$emit
);
this
.
_resize
();
},
beforeUnmount
()
{
const
canvas
=
this
.
canvas
;
canvas
.
height
=
canvas
.
width
=
0
;
},
methods
:
{
_handleSubscribe
(
type
,
data
=
{})
{
var
method
=
this
[
type
];
if
(
type
.
indexOf
(
"
_
"
)
!==
0
&&
typeof
method
===
"
function
"
)
{
method
(
data
);
}
},
_resize
()
{
var
canvas
=
this
.
canvas
;
if
(
canvas
.
width
>
0
&&
canvas
.
height
>
0
)
{
var
context
=
canvas
.
getContext
(
"
2d
"
);
var
imageData
=
context
.
getImageData
(
0
,
0
,
canvas
.
width
,
canvas
.
height
);
wrapper
(
canvas
);
context
.
putImageData
(
imageData
,
0
,
0
);
}
else
{
wrapper
(
canvas
);
}
},
actionsChanged
({
actions
,
reserve
,
callbackId
})
{
var
self
=
this
;
if
(
!
actions
)
{
return
;
}
if
(
this
.
actionsWaiting
)
{
this
.
_actionsDefer
.
push
([
actions
,
reserve
,
callbackId
]);
return
;
}
var
canvas
=
this
.
canvas
;
var
c2d
=
canvas
.
getContext
(
"
2d
"
);
if
(
!
reserve
)
{
c2d
.
fillStyle
=
"
#000000
"
;
c2d
.
strokeStyle
=
"
#000000
"
;
c2d
.
shadowColor
=
"
#000000
"
;
c2d
.
shadowBlur
=
0
;
c2d
.
shadowOffsetX
=
0
;
c2d
.
shadowOffsetY
=
0
;
c2d
.
setTransform
(
1
,
0
,
0
,
1
,
0
,
0
);
c2d
.
clearRect
(
0
,
0
,
canvas
.
width
,
canvas
.
height
);
}
this
.
preloadImage
(
actions
);
for
(
let
index
=
0
;
index
<
actions
.
length
;
index
++
)
{
const
action
=
actions
[
index
];
let
method
=
action
.
method
;
const
data
=
action
.
data
;
if
(
/^set/
.
test
(
method
)
&&
method
!==
"
setTransform
"
)
{
const
method1
=
method
[
3
].
toLowerCase
()
+
method
.
slice
(
4
);
let
color
;
if
(
method1
===
"
fillStyle
"
||
method1
===
"
strokeStyle
"
)
{
if
(
data
[
0
]
===
"
normal
"
)
{
color
=
resolveColor
(
data
[
1
]);
}
else
if
(
data
[
0
]
===
"
linear
"
)
{
const
LinearGradient
=
c2d
.
createLinearGradient
(...
data
[
1
]);
data
[
2
].
forEach
(
function
(
data2
)
{
const
offset
=
data2
[
0
];
const
color
=
resolveColor
(
data2
[
1
]);
LinearGradient
.
addColorStop
(
offset
,
color
);
});
color
=
LinearGradient
;
}
else
if
(
data
[
0
]
===
"
radial
"
)
{
const
x
=
data
[
1
][
0
];
const
y
=
data
[
1
][
1
];
const
r
=
data
[
1
][
2
];
const
LinearGradient
=
c2d
.
createRadialGradient
(
x
,
y
,
0
,
x
,
y
,
r
);
data
[
2
].
forEach
(
function
(
data2
)
{
const
offset
=
data2
[
0
];
const
color
=
resolveColor
(
data2
[
1
]);
LinearGradient
.
addColorStop
(
offset
,
color
);
});
color
=
LinearGradient
;
}
else
if
(
data
[
0
]
===
"
pattern
"
)
{
const
loaded
=
this
.
checkImageLoaded
(
data
[
1
],
actions
.
slice
(
index
+
1
),
callbackId
,
function
(
image
)
{
if
(
image
)
{
c2d
[
method1
]
=
c2d
.
createPattern
(
image
,
data
[
2
]);
}
}
);
if
(
!
loaded
)
{
break
;
}
continue
;
}
c2d
[
method1
]
=
color
;
}
else
if
(
method1
===
"
globalAlpha
"
)
{
c2d
[
method1
]
=
data
[
0
]
/
255
;
}
else
if
(
method1
===
"
shadow
"
)
{
var
_
=
[
"
shadowOffsetX
"
,
"
shadowOffsetY
"
,
"
shadowBlur
"
,
"
shadowColor
"
];
data
.
forEach
(
function
(
color_
,
method_
)
{
c2d
[
_
[
method_
]]
=
_
[
method_
]
===
"
shadowColor
"
?
resolveColor
(
color_
)
:
color_
;
});
}
else
if
(
method1
===
"
fontSize
"
)
{
const
font
=
c2d
.
__font__
||
c2d
.
font
;
c2d
.
__font__
=
c2d
.
font
=
font
.
replace
(
/
\d
+
\.?\d
*px/
,
data
[
0
]
+
"
px
"
);
}
else
if
(
method1
===
"
lineDash
"
)
{
c2d
.
setLineDash
(
data
[
0
]);
c2d
.
lineDashOffset
=
data
[
1
]
||
0
;
}
else
if
(
method1
===
"
textBaseline
"
)
{
if
(
data
[
0
]
===
"
normal
"
)
{
data
[
0
]
=
"
alphabetic
"
;
}
c2d
[
method1
]
=
data
[
0
];
}
else
if
(
method1
===
"
font
"
)
{
c2d
.
__font__
=
c2d
.
font
=
data
[
0
];
}
else
{
c2d
[
method1
]
=
data
[
0
];
}
}
else
if
(
method
===
"
fillPath
"
||
method
===
"
strokePath
"
)
{
method
=
method
.
replace
(
/Path/
,
""
);
c2d
.
beginPath
();
data
.
forEach
(
function
(
data_
)
{
c2d
[
data_
.
method
].
apply
(
c2d
,
data_
.
data
);
});
c2d
[
method
]();
}
else
if
(
method
===
"
fillText
"
)
{
c2d
.
fillText
.
apply
(
c2d
,
data
);
}
else
if
(
method
===
"
drawImage
"
)
{
var
A
=
(
function
()
{
var
dataArray
=
[...
data
];
var
url
=
dataArray
[
0
];
var
otherData
=
dataArray
.
slice
(
1
);
self
.
_images
=
self
.
_images
||
{};
if
(
!
self
.
checkImageLoaded
(
url
,
actions
.
slice
(
index
+
1
),
callbackId
,
function
(
image
)
{
if
(
image
)
{
c2d
.
drawImage
.
apply
(
c2d
,
[
image
].
concat
(
[...
otherData
.
slice
(
4
,
8
)],
[...
otherData
.
slice
(
0
,
4
)]
)
);
}
}
)
)
return
"
break
"
;
})();
if
(
A
===
"
break
"
)
{
break
;
}
}
else
{
if
(
method
===
"
clip
"
)
{
data
.
forEach
(
function
(
data_
)
{
c2d
[
data_
.
method
].
apply
(
c2d
,
data_
.
data
);
});
c2d
.
clip
();
}
else
{
c2d
[
method
].
apply
(
c2d
,
data
);
}
}
}
if
(
!
this
.
actionsWaiting
&&
callbackId
)
{
UniViewJSBridge
.
publishHandler
(
"
onCanvasMethodCallback
"
,
{
callbackId
,
data
:
{
errMsg
:
"
drawCanvas:ok
"
,
},
},
getCurrentPageId
()
);
}
},
preloadImage
:
function
(
actions
)
{
var
self
=
this
;
actions
.
forEach
(
function
(
action
)
{
var
method
=
action
.
method
;
var
data
=
action
.
data
;
var
src
=
""
;
if
(
method
===
"
drawImage
"
)
{
src
=
data
[
0
];
src
=
$getRealPath
(
src
);
data
[
0
]
=
src
;
}
else
if
(
method
===
"
setFillStyle
"
&&
data
[
0
]
===
"
pattern
"
)
{
src
=
data
[
1
];
src
=
$getRealPath
(
src
);
data
[
1
]
=
src
;
}
if
(
src
&&
!
self
.
_images
[
src
])
{
loadImage
();
}
/**
* 加载图像
*/
function
loadImage
()
{
const
image
=
(
self
.
_images
[
src
]
=
new
Image
());
image
.
onload
=
function
()
{
image
.
ready
=
true
;
};
// 安卓 WebView 除本地路径无跨域问题
if
(
__PLATFORM__
===
"
app-plus
"
&&
navigator
.
vendor
===
"
Google Inc.
"
)
{
if
(
src
.
indexOf
(
"
file://
"
)
===
0
)
{
image
.
crossOrigin
=
"
anonymous
"
;
}
image
.
src
=
src
;
return
;
}
getSameOriginUrl
(
src
)
.
then
((
src
)
=>
{
image
.
src
=
src
;
})
.
catch
(()
=>
{
image
.
src
=
src
;
});
}
});
},
checkImageLoaded
:
function
(
src
,
actions
,
callbackId
,
fn
)
{
var
self
=
this
;
var
image
=
this
.
_images
[
src
];
if
(
image
.
ready
)
{
fn
(
image
);
return
true
;
}
else
{
this
.
_actionsDefer
.
unshift
([
actions
,
true
]);
this
.
actionsWaiting
=
true
;
image
.
onload
=
function
()
{
image
.
ready
=
true
;
fn
(
image
);
self
.
actionsWaiting
=
false
;
var
actions
=
self
.
_actionsDefer
.
slice
(
0
);
self
.
_actionsDefer
=
[];
for
(
var
action
=
actions
.
shift
();
action
;)
{
self
.
actionsChanged
({
actions
:
action
[
0
],
reserve
:
action
[
1
],
callbackId
,
});
action
=
actions
.
shift
();
}
};
return
false
;
}
},
getImageData
({
x
=
0
,
y
=
0
,
width
,
height
,
destWidth
,
destHeight
,
hidpi
=
true
,
dataType
,
quality
=
1
,
type
=
"
png
"
,
callbackId
,
})
{
const
canvas
=
this
.
canvas
;
let
data
;
const
maxWidth
=
canvas
.
offsetWidth
-
x
;
width
=
width
?
Math
.
min
(
width
,
maxWidth
)
:
maxWidth
;
const
maxHeight
=
canvas
.
offsetHeight
-
y
;
height
=
height
?
Math
.
min
(
height
,
maxHeight
)
:
maxHeight
;
if
(
!
hidpi
)
{
if
(
!
destWidth
&&
!
destHeight
)
{
destWidth
=
Math
.
round
(
width
*
pixelRatio
);
destHeight
=
Math
.
round
(
height
*
pixelRatio
);
}
else
if
(
!
destWidth
)
{
destWidth
=
Math
.
round
((
width
/
height
)
*
destHeight
);
}
else
if
(
!
destHeight
)
{
destHeight
=
Math
.
round
((
height
/
width
)
*
destWidth
);
}
}
else
{
destWidth
=
width
;
destHeight
=
height
;
}
const
newCanvas
=
getTempCanvas
(
destWidth
,
destHeight
);
const
context
=
newCanvas
.
getContext
(
"
2d
"
);
if
(
type
===
"
jpeg
"
||
type
===
"
jpg
"
)
{
type
=
"
jpeg
"
;
context
.
fillStyle
=
"
#fff
"
;
context
.
fillRect
(
0
,
0
,
destWidth
,
destHeight
);
}
context
.
__hidpi__
=
true
;
context
.
drawImageByCanvas
(
canvas
,
x
,
y
,
width
,
height
,
0
,
0
,
destWidth
,
destHeight
,
false
);
let
result
;
try
{
let
compressed
;
if
(
dataType
===
"
base64
"
)
{
data
=
newCanvas
.
toDataURL
(
`image/
${
type
}
`
,
quality
);
}
else
{
const
imgData
=
context
.
getImageData
(
0
,
0
,
destWidth
,
destHeight
);
if
(
__PLATFORM__
===
"
app-plus
"
)
{
const
pako
=
require
(
"
pako
"
);
data
=
pako
.
deflateRaw
(
imgData
.
data
,
{
to
:
"
string
"
});
compressed
=
true
;
}
else
{
// fix [...]展开TypedArray在低版本手机报错的问题,使用Array.prototype.slice
data
=
Array
.
prototype
.
slice
.
call
(
imgData
.
data
);
}
}
result
=
{
errMsg
:
"
canvasGetImageData:ok
"
,
data
,
compressed
,
width
:
destWidth
,
height
:
destHeight
,
};
}
catch
(
error
)
{
result
=
{
errMsg
:
`canvasGetImageData:fail
${
error
}
`
,
};
}
newCanvas
.
height
=
newCanvas
.
width
=
0
;
context
.
__hidpi__
=
false
;
if
(
!
callbackId
)
{
return
result
;
}
else
{
UniViewJSBridge
.
publishHandler
(
"
onCanvasMethodCallback
"
,
{
callbackId
,
data
:
result
,
},
getCurrentPageId
()
);
}
},
putImageData
({
data
,
x
,
y
,
width
,
height
,
compressed
,
callbackId
})
{
try
{
if
(
!
height
)
{
height
=
Math
.
round
(
data
.
length
/
4
/
width
);
}
const
canvas
=
getTempCanvas
(
width
,
height
);
const
context
=
canvas
.
getContext
(
"
2d
"
);
if
(
__PLATFORM__
===
"
app-plus
"
&&
compressed
)
{
const
pako
=
require
(
"
pako
"
);
data
=
pako
.
inflateRaw
(
data
);
}
context
.
putImageData
(
new
ImageData
(
new
Uint8ClampedArray
(
data
),
width
,
height
),
0
,
0
);
this
.
canvas
.
getContext
(
"
2d
"
).
drawImage
(
canvas
,
x
,
y
,
width
,
height
);
canvas
.
height
=
canvas
.
width
=
0
;
}
catch
(
error
)
{
UniViewJSBridge
.
publishHandler
(
"
onCanvasMethodCallback
"
,
{
callbackId
,
data
:
{
errMsg
:
"
canvasPutImageData:fail
"
,
},
},
getCurrentPageId
()
);
return
;
}
UniViewJSBridge
.
publishHandler
(
"
onCanvasMethodCallback
"
,
{
callbackId
,
data
:
{
errMsg
:
"
canvasPutImageData:ok
"
,
},
},
getCurrentPageId
()
);
},
toTempFilePath
({
x
=
0
,
y
=
0
,
width
,
height
,
destWidth
,
destHeight
,
fileType
,
quality
,
dirname
,
callbackId
,
})
{
const
res
=
this
.
getImageData
({
x
,
y
,
width
,
height
,
destWidth
,
destHeight
,
hidpi
:
false
,
dataType
:
"
base64
"
,
type
:
fileType
,
quality
,
});
if
(
!
res
.
data
||
!
res
.
data
.
length
)
{
UniViewJSBridge
.
publishHandler
(
"
onCanvasMethodCallback
"
,
{
callbackId
,
data
:
{
errMsg
:
res
.
errMsg
.
replace
(
"
canvasPutImageData
"
,
"
toTempFilePath
"
),
},
},
getCurrentPageId
()
);
return
;
}
saveImage
(
res
.
data
,
dirname
,
(
error
,
tempFilePath
)
=>
{
let
errMsg
=
`toTempFilePath:
${
error
?
"
fail
"
:
"
ok
"
}
`
;
if
(
error
)
{
errMsg
+=
`
${
error
.
message
}
`
;
}
UniViewJSBridge
.
publishHandler
(
"
onCanvasMethodCallback
"
,
{
callbackId
,
data
:
{
errMsg
,
tempFilePath
:
tempFilePath
,
},
},
getCurrentPageId
()
);
});
},
},
setup
()
{
const
canvas
=
ref
(
null
);
const
sensor
=
ref
(
null
);
const
{
$attrs
:
Attrs
,
$excludeAttrs
:
ExcludeAttrs
,
$listeners
:
Listeners
,
}
=
useAttrs
({
excludeListeners
:
true
,
});
return
{
canvas
,
sensor
,
Attrs
,
ExcludeAttrs
,
Listeners
,
};
},
};
</
script
>
packages/uni-components/src/components/index.ts
浏览文件 @
460e0a99
import
Audio
from
'
./audio/index.vue
'
import
Button
from
'
./button/index
'
import
Canvas
from
'
./canvas/index
.vue
'
import
Canvas
from
'
./canvas/index
'
import
Checkbox
from
'
./checkbox/index
'
import
CheckboxGroup
from
'
./checkbox-group/index
'
import
Editor
from
'
./editor/index
'
...
...
packages/uni-components/src/helpers/useContextInfo.ts
浏览文件 @
460e0a99
...
...
@@ -13,12 +13,12 @@ export interface HTMLElementWithContextInfo extends HTMLElement {
__uniContextInfo
?:
ContextInfo
}
let
index
=
0
export
function
useContextInfo
()
{
export
function
useContextInfo
(
_id
?:
string
)
{
const
page
=
useCurrentPageId
()
const
instance
=
getCurrentInstance
()
!
const
vm
=
instance
.
proxy
!
const
type
=
vm
.
$options
.
name
!
.
toLowerCase
()
as
ContextType
const
id
=
(
vm
as
any
).
id
||
`context
${
index
++
}
`
const
id
=
_id
||
(
vm
as
any
).
id
||
`context
${
index
++
}
`
onMounted
(()
=>
{
const
el
=
vm
.
$el
as
HTMLElementWithContextInfo
el
.
__uniContextInfo
=
{
...
...
packages/uni-h5/dist/uni-h5.cjs.js
浏览文件 @
460e0a99
"
use strict
"
;
var
__defProp
=
Object
.
defineProperty
;
var
__getOwnPropSymbols
=
Object
.
getOwnPropertySymbols
;
var
__hasOwnProp
=
Object
.
prototype
.
hasOwnProperty
;
var
__propIsEnum
=
Object
.
prototype
.
propertyIsEnumerable
;
var
__defNormalProp
=
(
obj
,
key
,
value
)
=>
key
in
obj
?
__defProp
(
obj
,
key
,
{
enumerable
:
true
,
configurable
:
true
,
writable
:
true
,
value
})
:
obj
[
key
]
=
value
;
var
__spreadValues
=
(
a2
,
b
)
=>
{
for
(
var
prop
in
b
||
(
b
=
{}))
if
(
__hasOwnProp
.
call
(
b
,
prop
))
__defNormalProp
(
a2
,
prop
,
b
[
prop
]);
if
(
__getOwnPropSymbols
)
for
(
var
prop
of
__getOwnPropSymbols
(
b
))
{
if
(
__propIsEnum
.
call
(
b
,
prop
))
__defNormalProp
(
a2
,
prop
,
b
[
prop
]);
}
return
a2
;
};
Object
.
defineProperty
(
exports
,
"
__esModule
"
,
{
value
:
true
});
exports
[
Symbol
.
toStringTag
]
=
"
Module
"
;
var
shared
=
require
(
"
@vue/shared
"
);
...
...
@@ -883,7 +867,7 @@ function throttle(fn, wait) {
};
return
newFn
;
}
const
_sfc_main$
5
=
{
const
_sfc_main$
4
=
{
name
:
"
Audio
"
,
mixins
:
[
subscriber
],
props
:
{
...
...
@@ -1002,13 +986,13 @@ const _sfc_main$5 = {
}
}
};
const
_hoisted_1$
4
=
{
class
:
"
uni-audio-default
"
};
const
_hoisted_2$
3
=
{
class
:
"
uni-audio-right
"
};
const
_hoisted_1$
3
=
{
class
:
"
uni-audio-default
"
};
const
_hoisted_2$
2
=
{
class
:
"
uni-audio-right
"
};
const
_hoisted_3$2
=
{
class
:
"
uni-audio-time
"
};
const
_hoisted_4$2
=
{
class
:
"
uni-audio-info
"
};
const
_hoisted_5$1
=
{
class
:
"
uni-audio-name
"
};
const
_hoisted_6$1
=
{
class
:
"
uni-audio-author
"
};
function
_sfc_render$
5
(
_ctx
,
_cache
,
$props
,
$setup
,
$data
,
$options
)
{
function
_sfc_render$
4
(
_ctx
,
_cache
,
$props
,
$setup
,
$data
,
$options
)
{
return
vue
.
openBlock
(),
vue
.
createBlock
(
"
uni-audio
"
,
vue
.
mergeProps
({
id
:
$props
.
id
,
controls
:
!!
$props
.
controls
...
...
@@ -1018,7 +1002,7 @@ function _sfc_render$5(_ctx, _cache, $props, $setup, $data, $options) {
loop
:
$props
.
loop
,
style
:
{
"
display
"
:
"
none
"
}
},
null
,
8
,
[
"
loop
"
]),
vue
.
createVNode
(
"
div
"
,
_hoisted_1$
4
,
[
vue
.
createVNode
(
"
div
"
,
_hoisted_1$
3
,
[
vue
.
createVNode
(
"
div
"
,
{
style
:
"
background-image: url(
"
+
_ctx
.
$getRealPath
(
$props
.
poster
)
+
"
);
"
,
class
:
"
uni-audio-left
"
...
...
@@ -1028,7 +1012,7 @@ function _sfc_render$5(_ctx, _cache, $props, $setup, $data, $options) {
onClick
:
_cache
[
1
]
||
(
_cache
[
1
]
=
(...
args
)
=>
$options
.
trigger
&&
$options
.
trigger
(...
args
))
},
null
,
2
)
],
4
),
vue
.
createVNode
(
"
div
"
,
_hoisted_2$
3
,
[
vue
.
createVNode
(
"
div
"
,
_hoisted_2$
2
,
[
vue
.
createVNode
(
"
div
"
,
_hoisted_3$2
,
vue
.
toDisplayString
(
$data
.
currentTime
),
1
),
vue
.
createVNode
(
"
div
"
,
_hoisted_4$2
,
[
vue
.
createVNode
(
"
div
"
,
_hoisted_5$1
,
vue
.
toDisplayString
(
$props
.
name
),
1
),
...
...
@@ -1038,7 +1022,7 @@ function _sfc_render$5(_ctx, _cache, $props, $setup, $data, $options) {
])
],
16
,
[
"
id
"
,
"
controls
"
]);
}
_sfc_main$
5
.
render
=
_sfc_render$5
;
_sfc_main$
4
.
render
=
_sfc_render$4
;
function
converPx
(
value
)
{
if
(
/^-
?\d
+
[
ur
]
px$/i
.
test
(
value
))
{
return
value
.
replace
(
/
(
^-
?\d
+
)[
ur
]
px$/i
,
(
text
,
num
)
=>
{
...
...
@@ -1270,7 +1254,7 @@ function normalizeCustomEvent(name, domEvt, el, detail) {
};
}
const
uniFormKey
=
PolySymbol
(
process
.
env
.
NODE_ENV
!==
"
production
"
?
"
uniForm
"
:
"
uf
"
);
var
index$
u
=
/* @__PURE__ */
defineBuiltInComponent
({
var
index$
v
=
/* @__PURE__ */
defineBuiltInComponent
({
name
:
"
Form
"
,
setup
(
_props
,
{
slots
,
...
...
@@ -1310,15 +1294,15 @@ function provideForm(emit2) {
return
fields2
;
}
const
uniLabelKey
=
PolySymbol
(
process
.
env
.
NODE_ENV
!==
"
production
"
?
"
uniLabel
"
:
"
ul
"
);
const
props$
r
=
{
const
props$
s
=
{
for
:
{
type
:
String
,
default
:
""
}
};
var
index$
t
=
/* @__PURE__ */
defineBuiltInComponent
({
var
index$
u
=
/* @__PURE__ */
defineBuiltInComponent
({
name
:
"
Label
"
,
props
:
props$
r
,
props
:
props$
s
,
setup
(
props2
,
{
slots
})
{
...
...
@@ -1360,7 +1344,7 @@ function useProvideLabel() {
});
return
handlers
;
}
var
index$
s
=
/* @__PURE__ */
defineBuiltInComponent
({
var
index$
t
=
/* @__PURE__ */
defineBuiltInComponent
({
name
:
"
Button
"
,
props
:
{
id
:
{
...
...
@@ -1540,8 +1524,9 @@ function resolveColor(color) {
return
"
rgba(
"
+
color
.
join
(
"
,
"
)
+
"
)
"
;
}
function
processTouches
(
target
,
touches
)
{
return
[].
map
.
call
(
touches
,
(
touch
)
=>
{
var
boundingClientRect
=
target
.
getBoundingClientRect
();
const
eventTarget
=
target
;
return
Array
.
from
(
touches
).
map
((
touch
)
=>
{
let
boundingClientRect
=
eventTarget
.
getBoundingClientRect
();
return
{
identifier
:
touch
.
identifier
,
x
:
touch
.
clientX
-
boundingClientRect
.
left
,
...
...
@@ -1549,7 +1534,7 @@ function processTouches(target, touches) {
};
});
}
var
tempCanvas
;
let
tempCanvas
;
function
getTempCanvas
(
width
=
0
,
height
=
0
)
{
if
(
!
tempCanvas
)
{
tempCanvas
=
document
.
createElement
(
"
canvas
"
);
...
...
@@ -1558,492 +1543,497 @@ function getTempCanvas(width = 0, height = 0) {
tempCanvas
.
height
=
height
;
return
tempCanvas
;
}
var
_sfc_main$4
=
{
name
:
"
Canvas
"
,
const
props$r
=
{
canvasId
:
{
type
:
String
,
default
:
""
},
disableScroll
:
{
type
:
[
Boolean
,
String
],
default
:
false
}
};
var
index$s
=
/* @__PURE__ */
defineBuiltInComponent
({
inheritAttrs
:
false
,
name
:
"
Canvas
"
,
compatConfig
:
{
MODE
:
3
},
components
:
{
ResizeSensor
},
props
:
{
canvasId
:
{
type
:
String
,
default
:
""
},
disableScroll
:
{
type
:
[
Boolean
,
String
],
default
:
false
}
},
data
()
{
return
{
actionsWaiting
:
false
};
},
props
:
props$r
,
computed
:
{
id
()
{
return
this
.
canvasId
;
},
_listeners
()
{
let
events
=
[
"
touchstart
"
,
"
touchmove
"
,
"
touchend
"
];
let
_$listeners
=
this
.
Listeners
;
let
$listeners
=
Object
.
assign
({},
(()
=>
{
let
obj
=
{};
for
(
const
key
in
_$listeners
)
{
if
(
Object
.
prototype
.
hasOwnProperty
.
call
(
_$listeners
,
key
))
{
const
event
=
_$listeners
[
key
];
obj
[
key
.
replace
(
"
on
"
,
""
).
toLowerCase
()]
=
event
;
}
}
return
obj
;
})());
events
.
forEach
((
event
)
=>
{
let
existing
=
$listeners
[
event
];
let
eventHandler
=
[];
if
(
existing
)
{
eventHandler
.
push
(
withWebEvent
((
$event
)
=>
{
this
.
$trigger
(
event
,
Object
.
assign
({},
(()
=>
{
let
obj
=
{};
for
(
const
key
in
$event
)
{
obj
[
key
]
=
$event
[
key
];
}
return
obj
;
})(),
{
touches
:
processTouches
(
$event
.
currentTarget
,
$event
.
touches
),
changedTouches
:
processTouches
(
$event
.
currentTarget
,
$event
.
changedTouches
)
}));
}));
}
if
(
this
.
disableScroll
&&
event
===
"
touchmove
"
)
{
eventHandler
.
push
(
onEventPrevent
);
}
$listeners
[
event
]
=
eventHandler
;
});
return
$listeners
;
}
},
created
()
{
this
.
_actionsDefer
=
[];
this
.
_images
=
{};
const
id
=
useContextInfo
();
useSubscribe
(
this
.
_handleSubscribe
,
id
,
true
);
},
beforeMount
()
{
setup
(
props2
,
{
emit
:
emit2
,
slots
})
{
initHidpiOnce
();
},
mounted
()
{
this
.
$trigger
=
useNativeEvent
(
this
.
$emit
);
this
.
_resize
();
},
beforeUnmount
()
{
const
canvas
=
this
.
canvas
;
canvas
.
height
=
canvas
.
width
=
0
;
},
methods
:
{
_handleSubscribe
(
type
,
data
=
{})
{
var
method
=
this
[
type
];
if
(
type
.
indexOf
(
"
_
"
)
!==
0
&&
typeof
method
===
"
function
"
)
{
method
(
data
);
}
},
_resize
()
{
var
canvas
=
this
.
canvas
;
if
(
canvas
.
width
>
0
&&
canvas
.
height
>
0
)
{
var
context
=
canvas
.
getContext
(
"
2d
"
);
var
imageData
=
context
.
getImageData
(
0
,
0
,
canvas
.
width
,
canvas
.
height
);
wrapper
(
canvas
);
context
.
putImageData
(
imageData
,
0
,
0
);
}
else
{
wrapper
(
canvas
);
const
canvas
=
vue
.
ref
(
null
);
const
sensor
=
vue
.
ref
(
null
);
const
actionsWaiting
=
vue
.
ref
(
false
);
const
trigger
=
useNativeEvent
(
emit2
);
const
{
$attrs
,
$excludeAttrs
,
$listeners
}
=
useAttrs
({
excludeListeners
:
true
});
const
{
_listeners
}
=
useListeners
(
props2
,
$listeners
,
trigger
);
const
{
_handleSubscribe
,
_resize
}
=
useMethods
(
canvas
,
actionsWaiting
);
useSubscribe
(
_handleSubscribe
,
useContextInfo
(
props2
.
canvasId
),
true
);
return
()
=>
{
const
{
canvasId
,
disableScroll
}
=
props2
;
return
vue
.
createVNode
(
"
uni-canvas
"
,
vue
.
mergeProps
({
"
canvas-id
"
:
canvasId
,
"
disable-scroll
"
:
disableScroll
},
$attrs
.
value
,
$excludeAttrs
.
value
,
_listeners
.
value
),
[
vue
.
createVNode
(
"
canvas
"
,
{
"
ref
"
:
canvas
,
"
class
"
:
"
uni-canvas-canvas
"
,
"
width
"
:
"
300
"
,
"
height
"
:
"
150
"
},
null
,
512
),
vue
.
createVNode
(
"
div
"
,
{
"
style
"
:
"
position: absolute;top: 0;left: 0;width: 100%;height: 100%;overflow: hidden;
"
},
[
slots
.
default
&&
slots
.
default
()]),
vue
.
createVNode
(
ResizeSensor
,
{
"
ref
"
:
sensor
,
"
onResize
"
:
_resize
},
null
,
8
,
[
"
onResize
"
])],
16
,
[
"
canvas-id
"
,
"
disable-scroll
"
]);
};
}
});
function
useListeners
(
props2
,
Listeners
,
trigger
)
{
const
_listeners
=
vue
.
computed
(()
=>
{
let
events
=
[
"
onTouchstart
"
,
"
onTouchmove
"
,
"
onTouchend
"
];
let
_$listeners
=
Listeners
.
value
;
let
$listeners
=
Object
.
assign
({},
(()
=>
{
let
obj
=
{};
for
(
const
key
in
_$listeners
)
{
if
(
Object
.
prototype
.
hasOwnProperty
.
call
(
_$listeners
,
key
))
{
const
event
=
_$listeners
[
key
];
obj
[
key
]
=
event
;
}
}
},
actionsChanged
({
actions
,
reserve
,
callbackId
})
{
var
self
=
this
;
if
(
!
actions
)
{
return
;
return
obj
;
})());
events
.
forEach
((
event
)
=>
{
let
existing
=
$listeners
[
event
];
let
eventHandler
=
[];
if
(
existing
)
{
eventHandler
.
push
(
withWebEvent
((
$event
)
=>
{
trigger
(
event
.
replace
(
"
on
"
,
""
).
toLocaleLowerCase
(),
Object
.
assign
({},
(()
=>
{
let
obj
=
{};
for
(
const
key
in
$event
)
{
obj
[
key
]
=
$event
[
key
];
}
return
obj
;
})(),
{
touches
:
processTouches
(
$event
.
currentTarget
,
$event
.
touches
),
changedTouches
:
processTouches
(
$event
.
currentTarget
,
$event
.
changedTouches
)
}));
}));
}
if
(
this
.
actionsWaiting
)
{
this
.
_actionsDefer
.
push
([
actions
,
reserve
,
callbackId
]);
return
;
if
(
props2
.
disableScroll
&&
event
===
"
onTouchmove
"
)
{
eventHandler
.
push
(
onEventPrevent
);
}
var
canvas
=
this
.
canvas
;
var
c2d
=
canvas
.
getContext
(
"
2d
"
);
if
(
!
reserve
)
{
c2d
.
fillStyle
=
"
#000000
"
;
c2d
.
strokeStyle
=
"
#000000
"
;
c2d
.
shadowColor
=
"
#000000
"
;
c2d
.
shadowBlur
=
0
;
c2d
.
shadowOffsetX
=
0
;
c2d
.
shadowOffsetY
=
0
;
c2d
.
setTransform
(
1
,
0
,
0
,
1
,
0
,
0
);
c2d
.
clearRect
(
0
,
0
,
canvas
.
width
,
canvas
.
height
);
}
this
.
preloadImage
(
actions
);
for
(
let
index2
=
0
;
index2
<
actions
.
length
;
index2
++
)
{
const
action
=
actions
[
index2
];
let
method
=
action
.
method
;
const
data
=
action
.
data
;
if
(
/^set/
.
test
(
method
)
&&
method
!==
"
setTransform
"
)
{
const
method1
=
method
[
3
].
toLowerCase
()
+
method
.
slice
(
4
);
let
color
;
if
(
method1
===
"
fillStyle
"
||
method1
===
"
strokeStyle
"
)
{
if
(
data
[
0
]
===
"
normal
"
)
{
color
=
resolveColor
(
data
[
1
]);
}
else
if
(
data
[
0
]
===
"
linear
"
)
{
const
LinearGradient
=
c2d
.
createLinearGradient
(...
data
[
1
]);
data
[
2
].
forEach
(
function
(
data2
)
{
const
offset
=
data2
[
0
];
const
color2
=
resolveColor
(
data2
[
1
]);
LinearGradient
.
addColorStop
(
offset
,
color2
);
});
color
=
LinearGradient
;
}
else
if
(
data
[
0
]
===
"
radial
"
)
{
const
x
=
data
[
1
][
0
];
const
y
=
data
[
1
][
1
];
const
r
=
data
[
1
][
2
];
const
LinearGradient
=
c2d
.
createRadialGradient
(
x
,
y
,
0
,
x
,
y
,
r
);
data
[
2
].
forEach
(
function
(
data2
)
{
const
offset
=
data2
[
0
];
const
color2
=
resolveColor
(
data2
[
1
]);
LinearGradient
.
addColorStop
(
offset
,
color2
);
});
color
=
LinearGradient
;
}
else
if
(
data
[
0
]
===
"
pattern
"
)
{
const
loaded
=
this
.
checkImageLoaded
(
data
[
1
],
actions
.
slice
(
index2
+
1
),
callbackId
,
function
(
image
)
{
if
(
image
)
{
c2d
[
method1
]
=
c2d
.
createPattern
(
image
,
data
[
2
]);
}
});
if
(
!
loaded
)
{
break
;
$listeners
[
event
]
=
eventHandler
;
});
return
$listeners
;
});
return
{
_listeners
};
}
function
useMethods
(
canvasRef
,
actionsWaiting
)
{
let
_actionsDefer
=
[];
let
_images
=
{};
function
_resize
()
{
var
canvas
=
canvasRef
.
value
;
if
(
canvas
.
width
>
0
&&
canvas
.
height
>
0
)
{
var
context
=
canvas
.
getContext
(
"
2d
"
);
var
imageData
=
context
.
getImageData
(
0
,
0
,
canvas
.
width
,
canvas
.
height
);
wrapper
(
canvas
);
context
.
putImageData
(
imageData
,
0
,
0
);
}
else
{
wrapper
(
canvas
);
}
}
function
actionsChanged
({
actions
,
reserve
,
callbackId
})
{
if
(
!
actions
)
{
return
;
}
if
(
actionsWaiting
.
value
)
{
_actionsDefer
.
push
([
actions
,
reserve
,
callbackId
]);
return
;
}
var
canvas
=
canvasRef
.
value
;
var
c2d
=
canvas
.
getContext
(
"
2d
"
);
if
(
!
reserve
)
{
c2d
.
fillStyle
=
"
#000000
"
;
c2d
.
strokeStyle
=
"
#000000
"
;
c2d
.
shadowColor
=
"
#000000
"
;
c2d
.
shadowBlur
=
0
;
c2d
.
shadowOffsetX
=
0
;
c2d
.
shadowOffsetY
=
0
;
c2d
.
setTransform
(
1
,
0
,
0
,
1
,
0
,
0
);
c2d
.
clearRect
(
0
,
0
,
canvas
.
width
,
canvas
.
height
);
}
preloadImage
(
actions
);
for
(
let
index2
=
0
;
index2
<
actions
.
length
;
index2
++
)
{
const
action
=
actions
[
index2
];
let
method
=
action
.
method
;
const
data
=
action
.
data
;
if
(
/^set/
.
test
(
method
)
&&
method
!==
"
setTransform
"
)
{
const
method1
=
method
[
3
].
toLowerCase
()
+
method
.
slice
(
4
);
let
color
;
if
(
method1
===
"
fillStyle
"
||
method1
===
"
strokeStyle
"
)
{
if
(
data
[
0
]
===
"
normal
"
)
{
color
=
resolveColor
(
data
[
1
]);
}
else
if
(
data
[
0
]
===
"
linear
"
)
{
const
LinearGradient
=
c2d
.
createLinearGradient
(...
data
[
1
]);
data
[
2
].
forEach
(
function
(
data2
)
{
const
offset
=
data2
[
0
];
const
color2
=
resolveColor
(
data2
[
1
]);
LinearGradient
.
addColorStop
(
offset
,
color2
);
});
color
=
LinearGradient
;
}
else
if
(
data
[
0
]
===
"
radial
"
)
{
const
x
=
data
[
1
][
0
];
const
y
=
data
[
1
][
1
];
const
r
=
data
[
1
][
2
];
const
LinearGradient
=
c2d
.
createRadialGradient
(
x
,
y
,
0
,
x
,
y
,
r
);
data
[
2
].
forEach
(
function
(
data2
)
{
const
offset
=
data2
[
0
];
const
color2
=
resolveColor
(
data2
[
1
]);
LinearGradient
.
addColorStop
(
offset
,
color2
);
});
color
=
LinearGradient
;
}
else
if
(
data
[
0
]
===
"
pattern
"
)
{
const
loaded
=
checkImageLoaded
(
data
[
1
],
actions
.
slice
(
index2
+
1
),
callbackId
,
function
(
image
)
{
if
(
image
)
{
c2d
[
method1
]
=
c2d
.
createPattern
(
image
,
data
[
2
]);
}
continue
;
}
c2d
[
method1
]
=
color
;
}
else
if
(
method1
===
"
globalAlpha
"
)
{
c2d
[
method1
]
=
data
[
0
]
/
255
;
}
else
if
(
method1
===
"
shadow
"
)
{
var
_
=
[
"
shadowOffsetX
"
,
"
shadowOffsetY
"
,
"
shadowBlur
"
,
"
shadowColor
"
];
data
.
forEach
(
function
(
color_
,
method_
)
{
c2d
[
_
[
method_
]]
=
_
[
method_
]
===
"
shadowColor
"
?
resolveColor
(
color_
)
:
color_
;
});
}
else
if
(
method1
===
"
fontSize
"
)
{
const
font
=
c2d
.
__font__
||
c2d
.
font
;
c2d
.
__font__
=
c2d
.
font
=
font
.
replace
(
/
\d
+
\.?\d
*px/
,
data
[
0
]
+
"
px
"
);
}
else
if
(
method1
===
"
lineDash
"
)
{
c2d
.
setLineDash
(
data
[
0
]);
c2d
.
lineDashOffset
=
data
[
1
]
||
0
;
}
else
if
(
method1
===
"
textBaseline
"
)
{
if
(
data
[
0
]
===
"
normal
"
)
{
data
[
0
]
=
"
alphabetic
"
;
if
(
!
loaded
)
{
break
;
}
c2d
[
method1
]
=
data
[
0
];
}
else
if
(
method1
===
"
font
"
)
{
c2d
.
__font__
=
c2d
.
font
=
data
[
0
];
}
else
{
c2d
[
method1
]
=
data
[
0
];
continue
;
}
}
else
if
(
method
===
"
fillPath
"
||
method
===
"
strokePath
"
)
{
method
=
method
.
replace
(
/Path/
,
""
);
c2d
.
beginPath
();
data
.
forEach
(
function
(
data_
)
{
c2d
[
data_
.
method
].
apply
(
c2d
,
data_
.
data
);
c2d
[
method1
]
=
color
;
}
else
if
(
method1
===
"
globalAlpha
"
)
{
c2d
[
method1
]
=
Number
(
data
[
0
])
/
255
;
}
else
if
(
method1
===
"
shadow
"
)
{
var
_
=
[
"
shadowOffsetX
"
,
"
shadowOffsetY
"
,
"
shadowBlur
"
,
"
shadowColor
"
];
data
.
forEach
(
function
(
color_
,
method_
)
{
c2d
[
_
[
method_
]]
=
_
[
method_
]
===
"
shadowColor
"
?
resolveColor
(
color_
)
:
color_
;
});
c2d
[
method
]();
}
else
if
(
method
===
"
fillText
"
)
{
c2d
.
fillText
.
apply
(
c2d
,
data
);
}
else
if
(
method
===
"
drawImage
"
)
{
var
A
=
function
()
{
var
dataArray
=
[...
data
];
var
url
=
dataArray
[
0
];
var
otherData
=
dataArray
.
slice
(
1
);
self
.
_images
=
self
.
_images
||
{};
if
(
!
self
.
checkImageLoaded
(
url
,
actions
.
slice
(
index2
+
1
),
callbackId
,
function
(
image
)
{
if
(
image
)
{
c2d
.
drawImage
.
apply
(
c2d
,
[
image
].
concat
([...
otherData
.
slice
(
4
,
8
)],
[...
otherData
.
slice
(
0
,
4
)]));
}
}))
return
"
break
"
;
}();
if
(
A
===
"
break
"
)
{
break
;
}
else
if
(
method1
===
"
fontSize
"
)
{
const
font
=
c2d
.
__font__
||
c2d
.
font
;
c2d
.
__font__
=
c2d
.
font
=
font
.
replace
(
/
\d
+
\.?\d
*px/
,
data
[
0
]
+
"
px
"
);
}
else
if
(
method1
===
"
lineDash
"
)
{
c2d
.
setLineDash
(
data
[
0
]);
c2d
.
lineDashOffset
=
data
[
1
]
||
0
;
}
else
if
(
method1
===
"
textBaseline
"
)
{
if
(
data
[
0
]
===
"
normal
"
)
{
data
[
0
]
=
"
alphabetic
"
;
}
c2d
[
method1
]
=
data
[
0
];
}
else
if
(
method1
===
"
font
"
)
{
c2d
.
__font__
=
c2d
.
font
=
data
[
0
];
}
else
{
if
(
method
===
"
clip
"
)
{
data
.
forEach
(
function
(
data_
)
{
c2d
[
data_
.
method
].
apply
(
c2d
,
data_
.
data
);
});
c2d
.
clip
();
}
else
{
c2d
[
method
].
apply
(
c2d
,
data
);
}
c2d
[
method1
]
=
data
[
0
];
}
}
if
(
!
this
.
actionsWaiting
&&
callbackId
)
{
UniViewJSBridge
.
publishHandler
(
"
onCanvasMethodCallback
"
,
{
callbackId
,
data
:
{
errMsg
:
"
drawCanvas:ok
"
}
},
getCurrentPageId
());
}
},
preloadImage
:
function
(
actions
)
{
var
self
=
this
;
actions
.
forEach
(
function
(
action
)
{
var
method
=
action
.
method
;
var
data
=
action
.
data
;
var
src
=
""
;
if
(
method
===
"
drawImage
"
)
{
src
=
data
[
0
];
src
=
$getRealPath
(
src
);
data
[
0
]
=
src
;
}
else
if
(
method
===
"
setFillStyle
"
&&
data
[
0
]
===
"
pattern
"
)
{
src
=
data
[
1
];
src
=
$getRealPath
(
src
);
data
[
1
]
=
src
;
}
if
(
src
&&
!
self
.
_images
[
src
])
{
loadImage
();
}
else
if
(
method
===
"
fillPath
"
||
method
===
"
strokePath
"
)
{
method
=
method
.
replace
(
/Path/
,
""
);
c2d
.
beginPath
();
data
.
forEach
(
function
(
data_
)
{
c2d
[
data_
.
method
].
apply
(
c2d
,
data_
.
data
);
});
c2d
[
method
]();
}
else
if
(
method
===
"
fillText
"
)
{
c2d
.
fillText
.
apply
(
c2d
,
data
);
}
else
if
(
method
===
"
drawImage
"
)
{
var
A
=
function
()
{
var
dataArray
=
[...
data
];
var
url
=
dataArray
[
0
];
var
otherData
=
dataArray
.
slice
(
1
);
_images
=
_images
||
{};
if
(
checkImageLoaded
(
url
,
actions
.
slice
(
index2
+
1
),
callbackId
,
function
(
image
)
{
if
(
image
)
{
c2d
.
drawImage
.
apply
(
c2d
,
[
image
].
concat
([...
otherData
.
slice
(
4
,
8
)],
[...
otherData
.
slice
(
0
,
4
)]));
}
}))
return
"
break
"
;
}();
if
(
A
===
"
break
"
)
{
break
;
}
function
loadImage
()
{
const
image
=
self
.
_images
[
src
]
=
new
Image
();
image
.
onload
=
function
()
{
image
.
ready
=
true
;
};
getSameOriginUrl
(
src
).
then
((
src2
)
=>
{
image
.
src
=
src2
;
}).
catch
(()
=>
{
image
.
src
=
src
;
}
else
{
if
(
method
===
"
clip
"
)
{
data
.
forEach
(
function
(
data_
)
{
c2d
[
data_
.
method
].
apply
(
c2d
,
data_
.
data
);
});
c2d
.
clip
();
}
else
{
c2d
[
method
].
apply
(
c2d
,
data
);
}
});
},
checkImageLoaded
:
function
(
src
,
actions
,
callbackId
,
fn
)
{
var
self
=
this
;
var
image
=
this
.
_images
[
src
];
if
(
image
.
ready
)
{
fn
(
image
);
return
true
;
}
else
{
this
.
_actionsDefer
.
unshift
([
actions
,
true
]);
this
.
actionsWaiting
=
true
;
}
}
if
(
!
actionsWaiting
.
value
&&
callbackId
)
{
UniViewJSBridge
.
publishHandler
(
"
onCanvasMethodCallback
"
,
{
callbackId
,
data
:
{
errMsg
:
"
drawCanvas:ok
"
}
},
getCurrentPageId
());
}
}
function
preloadImage
(
actions
)
{
actions
.
forEach
(
function
(
action
)
{
var
method
=
action
.
method
;
var
data
=
action
.
data
;
var
src
=
""
;
if
(
method
===
"
drawImage
"
)
{
src
=
data
[
0
];
src
=
$getRealPath
(
src
);
data
[
0
]
=
src
;
}
else
if
(
method
===
"
setFillStyle
"
&&
data
[
0
]
===
"
pattern
"
)
{
src
=
data
[
1
];
src
=
$getRealPath
(
src
);
data
[
1
]
=
src
;
}
if
(
src
&&
!
_images
[
src
])
{
loadImage
();
}
function
loadImage
()
{
const
image
=
_images
[
src
]
=
new
Image
();
image
.
onload
=
function
()
{
image
.
ready
=
true
;
fn
(
image
);
self
.
actionsWaiting
=
false
;
var
actions2
=
self
.
_actionsDefer
.
slice
(
0
);
self
.
_actionsDefer
=
[];
for
(
var
action
=
actions2
.
shift
();
action
;
)
{
self
.
actionsChanged
({
actions
:
action
[
0
],
reserve
:
action
[
1
],
callbackId
});
action
=
actions2
.
shift
();
}
};
return
false
;
getSameOriginUrl
(
src
).
then
((
src2
)
=>
{
image
.
src
=
src2
;
}).
catch
(()
=>
{
image
.
src
=
src
;
});
}
},
getImageData
({
x
=
0
,
y
=
0
,
width
,
height
,
destWidth
,
destHeight
,
hidpi
=
true
,
dataType
:
dataType2
,
quality
=
1
,
type
=
"
png
"
,
callbackId
})
{
const
canvas
=
this
.
canvas
;
let
data
;
const
maxWidth
=
canvas
.
offsetWidth
-
x
;
width
=
width
?
Math
.
min
(
width
,
maxWidth
)
:
maxWidth
;
const
maxHeight
=
canvas
.
offsetHeight
-
y
;
height
=
height
?
Math
.
min
(
height
,
maxHeight
)
:
maxHeight
;
if
(
!
hidpi
)
{
if
(
!
destWidth
&&
!
destHeight
)
{
destWidth
=
Math
.
round
(
width
*
pixelRatio
);
destHeight
=
Math
.
round
(
height
*
pixelRatio
);
}
else
if
(
!
destWidth
)
{
destWidth
=
Math
.
round
(
width
/
height
*
destHeight
);
}
else
if
(
!
destHeight
)
{
destHeight
=
Math
.
round
(
height
/
width
*
destWidth
);
}
}
else
{
destWidth
=
width
;
destHeight
=
height
;
}
const
newCanvas
=
getTempCanvas
(
destWidth
,
destHeight
);
const
context
=
newCanvas
.
getContext
(
"
2d
"
);
if
(
type
===
"
jpeg
"
||
type
===
"
jpg
"
)
{
type
=
"
jpeg
"
;
context
.
fillStyle
=
"
#fff
"
;
context
.
fillRect
(
0
,
0
,
destWidth
,
destHeight
);
}
context
.
__hidpi__
=
true
;
context
.
drawImageByCanvas
(
canvas
,
x
,
y
,
width
,
height
,
0
,
0
,
destWidth
,
destHeight
,
false
);
let
result
;
try
{
let
compressed
;
if
(
dataType2
===
"
base64
"
)
{
data
=
newCanvas
.
toDataURL
(
`image/
${
type
}
`
,
quality
);
}
else
{
const
imgData
=
context
.
getImageData
(
0
,
0
,
destWidth
,
destHeight
);
if
(
false
)
;
else
{
data
=
Array
.
prototype
.
slice
.
call
(
imgData
.
data
);
}
});
}
function
checkImageLoaded
(
src
,
actions
,
callbackId
,
fn
)
{
var
image
=
_images
[
src
];
if
(
image
.
ready
)
{
fn
(
image
);
return
true
;
}
else
{
_actionsDefer
.
unshift
([
actions
,
true
]);
actionsWaiting
.
value
=
true
;
image
.
onload
=
function
()
{
image
.
ready
=
true
;
fn
(
image
);
actionsWaiting
.
value
=
false
;
var
actions2
=
_actionsDefer
.
slice
(
0
);
_actionsDefer
=
[];
for
(
var
action
=
actions2
.
shift
();
action
;
)
{
actionsChanged
({
actions
:
action
[
0
],
reserve
:
action
[
1
],
callbackId
});
action
=
actions2
.
shift
();
}
result
=
{
errMsg
:
"
canvasGetImageData:ok
"
,
data
,
compressed
,
width
:
destWidth
,
height
:
destHeight
};
}
catch
(
error
)
{
result
=
{
errMsg
:
`canvasGetImageData:fail
${
error
}
`
};
};
return
false
;
}
}
function
getImageData
({
x
=
0
,
y
=
0
,
width
,
height
,
destWidth
,
destHeight
,
hidpi
=
true
,
dataType
:
dataType2
,
quality
=
1
,
type
=
"
png
"
,
callbackId
})
{
const
canvas
=
canvasRef
.
value
;
let
data
;
const
maxWidth
=
canvas
.
offsetWidth
-
x
;
width
=
width
?
Math
.
min
(
width
,
maxWidth
)
:
maxWidth
;
const
maxHeight
=
canvas
.
offsetHeight
-
y
;
height
=
height
?
Math
.
min
(
height
,
maxHeight
)
:
maxHeight
;
if
(
!
hidpi
)
{
if
(
!
destWidth
&&
!
destHeight
)
{
destWidth
=
Math
.
round
(
width
*
pixelRatio
);
destHeight
=
Math
.
round
(
height
*
pixelRatio
);
}
else
if
(
!
destWidth
)
{
destWidth
=
Math
.
round
(
width
/
height
*
destHeight
);
}
else
if
(
!
destHeight
)
{
destHeight
=
Math
.
round
(
height
/
width
*
destWidth
);
}
newCanvas
.
height
=
newCanvas
.
width
=
0
;
context
.
__hidpi__
=
false
;
if
(
!
callbackId
)
{
return
result
;
}
else
{
destWidth
=
width
;
destHeight
=
height
;
}
const
newCanvas
=
getTempCanvas
(
destWidth
,
destHeight
);
const
context
=
newCanvas
.
getContext
(
"
2d
"
);
if
(
type
===
"
jpeg
"
||
type
===
"
jpg
"
)
{
type
=
"
jpeg
"
;
context
.
fillStyle
=
"
#fff
"
;
context
.
fillRect
(
0
,
0
,
destWidth
,
destHeight
);
}
context
.
__hidpi__
=
true
;
context
.
drawImageByCanvas
(
canvas
,
x
,
y
,
width
,
height
,
0
,
0
,
destWidth
,
destHeight
,
false
);
let
result
;
try
{
let
compressed
;
if
(
dataType2
===
"
base64
"
)
{
data
=
newCanvas
.
toDataURL
(
`image/
${
type
}
`
,
quality
);
}
else
{
UniViewJSBridge
.
publishHandler
(
"
onCanvasMethodCallback
"
,
{
callbackId
,
data
:
result
},
getCurrentPageId
());
}
},
putImageData
({
data
,
x
,
y
,
width
,
height
,
compressed
,
callbackId
})
{
try
{
if
(
!
height
)
{
height
=
Math
.
round
(
data
.
length
/
4
/
width
);
}
const
canvas
=
getTempCanvas
(
width
,
height
);
const
context
=
canvas
.
getContext
(
"
2d
"
);
const
imgData
=
context
.
getImageData
(
0
,
0
,
destWidth
,
destHeight
);
if
(
false
)
;
context
.
putImageData
(
new
ImageData
(
new
Uint8ClampedArray
(
data
),
width
,
height
),
0
,
0
);
this
.
canvas
.
getContext
(
"
2d
"
).
drawImage
(
canvas
,
x
,
y
,
width
,
height
);
canvas
.
height
=
canvas
.
width
=
0
;
}
catch
(
error
)
{
UniViewJSBridge
.
publishHandler
(
"
onCanvasMethodCallback
"
,
{
callbackId
,
data
:
{
errMsg
:
"
canvasPutImageData:fail
"
}
},
getCurrentPageId
());
return
;
else
{
data
=
Array
.
prototype
.
slice
.
call
(
imgData
.
data
);
}
}
result
=
{
errMsg
:
"
canvasGetImageData:ok
"
,
data
,
compressed
,
width
:
destWidth
,
height
:
destHeight
};
}
catch
(
error
)
{
result
=
{
errMsg
:
`canvasGetImageData:fail
${
error
}
`
};
}
newCanvas
.
height
=
newCanvas
.
width
=
0
;
context
.
__hidpi__
=
false
;
if
(
!
callbackId
)
{
return
result
;
}
else
{
UniViewJSBridge
.
publishHandler
(
"
onCanvasMethodCallback
"
,
{
callbackId
,
data
:
result
},
getCurrentPageId
());
}
}
function
putImageData
({
data
,
x
,
y
,
width
,
height
,
compressed
,
callbackId
})
{
try
{
if
(
!
height
)
{
height
=
Math
.
round
(
data
.
length
/
4
/
width
);
}
const
canvas
=
getTempCanvas
(
width
,
height
);
const
context
=
canvas
.
getContext
(
"
2d
"
);
if
(
false
)
;
context
.
putImageData
(
new
ImageData
(
new
Uint8ClampedArray
(
data
),
width
,
height
),
0
,
0
);
canvasRef
.
value
.
getContext
(
"
2d
"
).
drawImage
(
canvas
,
x
,
y
,
width
,
height
);
canvas
.
height
=
canvas
.
width
=
0
;
}
catch
(
error
)
{
UniViewJSBridge
.
publishHandler
(
"
onCanvasMethodCallback
"
,
{
callbackId
,
data
:
{
errMsg
:
"
canvasPutImageData:
ok
"
errMsg
:
"
canvasPutImageData:
fail
"
}
},
getCurrentPageId
());
},
toTempFilePath
({
x
=
0
,
y
=
0
,
return
;
}
UniViewJSBridge
.
publishHandler
(
"
onCanvasMethodCallback
"
,
{
callbackId
,
data
:
{
errMsg
:
"
canvasPutImageData:ok
"
}
},
getCurrentPageId
());
}
function
toTempFilePath
({
x
=
0
,
y
=
0
,
width
,
height
,
destWidth
,
destHeight
,
fileType
,
quality
,
dirname
,
callbackId
})
{
const
res
=
getImageData
({
x
,
y
,
width
,
height
,
destWidth
,
destHeight
,
fileType
,
quality
,
dirname
,
callbackId
})
{
const
res
=
this
.
getImageData
({
x
,
y
,
width
,
height
,
destWidth
,
destHeight
,
hidpi
:
false
,
dataType
:
"
base64
"
,
type
:
fileType
,
quality
});
if
(
!
res
.
data
||
!
res
.
data
.
length
)
{
UniViewJSBridge
.
publishHandler
(
"
onCanvasMethodCallback
"
,
{
callbackId
,
data
:
{
errMsg
:
res
.
errMsg
.
replace
(
"
canvasPutImageData
"
,
"
toTempFilePath
"
)
}
},
getCurrentPageId
());
return
;
}
saveImage
(
res
.
data
,
dirname
,
(
error
,
tempFilePath
)
=>
{
let
errMsg
=
`toTempFilePath:
${
error
?
"
fail
"
:
"
ok
"
}
`
;
if
(
error
)
{
errMsg
+=
`
${
error
.
message
}
`
;
hidpi
:
false
,
dataType
:
"
base64
"
,
type
:
fileType
,
quality
});
if
(
!
res
.
data
||
!
res
.
data
.
length
)
{
UniViewJSBridge
.
publishHandler
(
"
onCanvasMethodCallback
"
,
{
callbackId
,
data
:
{
errMsg
:
res
.
errMsg
.
replace
(
"
canvasPutImageData
"
,
"
toTempFilePath
"
)
}
UniViewJSBridge
.
publishHandler
(
"
onCanvasMethodCallback
"
,
{
callbackId
,
data
:
{
errMsg
,
tempFilePath
}
},
getCurrentPageId
());
});
},
getCurrentPageId
());
return
;
}
},
setup
()
{
const
canvas
=
vue
.
ref
(
null
);
const
sensor
=
vue
.
ref
(
null
);
const
{
$attrs
:
Attrs
,
$excludeAttrs
:
ExcludeAttrs
,
$listeners
:
Listeners
}
=
useAttrs
({
excludeListeners
:
true
saveImage
(
res
.
data
,
dirname
,
(
error
,
tempFilePath
)
=>
{
let
errMsg
=
`toTempFilePath:
${
error
?
"
fail
"
:
"
ok
"
}
`
;
if
(
error
)
{
errMsg
+=
`
${
error
.
message
}
`
;
}
UniViewJSBridge
.
publishHandler
(
"
onCanvasMethodCallback
"
,
{
callbackId
,
data
:
{
errMsg
,
tempFilePath
}
},
getCurrentPageId
());
});
return
{
canvas
,
sensor
,
Attrs
,
ExcludeAttrs
,
Listeners
};
}
};
const
_hoisted_1$3
=
{
class
:
"
uni-canvas-canvas
"
,
ref
:
"
canvas
"
,
width
:
"
300
"
,
height
:
"
150
"
};
const
_hoisted_2$2
=
{
style
:
{
"
position
"
:
"
absolute
"
,
"
top
"
:
"
0
"
,
"
left
"
:
"
0
"
,
"
width
"
:
"
100%
"
,
"
height
"
:
"
100%
"
,
"
overflow
"
:
"
hidden
"
}};
function
_sfc_render$4
(
_ctx
,
_cache
,
$props
,
$setup
,
$data
,
$options
)
{
const
_component_ResizeSensor
=
vue
.
resolveComponent
(
"
ResizeSensor
"
);
return
vue
.
openBlock
(),
vue
.
createBlock
(
"
uni-canvas
"
,
vue
.
mergeProps
({
"
canvas-id
"
:
$props
.
canvasId
,
"
disable-scroll
"
:
$props
.
disableScroll
},
__spreadValues
(
__spreadValues
({},
$setup
.
Attrs
),
$setup
.
ExcludeAttrs
),
vue
.
toHandlers
(
$options
.
_listeners
)),
[
vue
.
createVNode
(
"
canvas
"
,
_hoisted_1$3
,
null
,
512
),
vue
.
createVNode
(
"
div
"
,
_hoisted_2$2
,
[
vue
.
renderSlot
(
_ctx
.
$slots
,
"
default
"
)
]),
vue
.
createVNode
(
_component_ResizeSensor
,
{
ref
:
"
sensor
"
,
onResize
:
$options
.
_resize
},
null
,
8
,
[
"
onResize
"
])
],
16
,
[
"
canvas-id
"
,
"
disable-scroll
"
]);
const
methods
=
{
actionsChanged
,
getImageData
,
putImageData
,
toTempFilePath
};
function
_handleSubscribe
(
type
,
data
=
{})
{
let
method
=
methods
[
type
];
if
(
type
.
indexOf
(
"
_
"
)
!==
0
&&
typeof
method
===
"
function
"
)
{
method
(
data
);
}
}
return
shared
.
extend
(
methods
,
{
_resize
,
_handleSubscribe
});
}
_sfc_main$4
.
render
=
_sfc_render$4
;
const
uniCheckGroupKey
=
PolySymbol
(
process
.
env
.
NODE_ENV
!==
"
production
"
?
"
uniCheckGroup
"
:
"
ucg
"
);
const
props$q
=
{
name
:
{
...
...
@@ -7279,12 +7269,12 @@ function useSubscribe(callback, name, multiple) {
function
useOn
(
name
,
callback
)
{
}
let
index$9
=
0
;
function
useContextInfo
()
{
function
useContextInfo
(
_id
)
{
const
page
=
useCurrentPageId
();
const
instance
=
vue
.
getCurrentInstance
();
const
vm
=
instance
.
proxy
;
const
type
=
vm
.
$options
.
name
.
toLowerCase
();
const
id
=
vm
.
id
||
`context
${
index$9
++
}
`
;
const
id
=
_id
||
vm
.
id
||
`context
${
index$9
++
}
`
;
return
`
${
page
}
.
${
type
}
.
${
id
}
`
;
}
function
getContextInfo
(
el
)
{
...
...
@@ -11336,20 +11326,20 @@ var index = /* @__PURE__ */ defineSystemComponent({
});
exports
.
AsyncErrorComponent
=
index$1
;
exports
.
AsyncLoadingComponent
=
index
;
exports
.
Audio
=
_sfc_main$
5
;
exports
.
Button
=
index$
s
;
exports
.
Canvas
=
_sfc_main$4
;
exports
.
Audio
=
_sfc_main$
4
;
exports
.
Button
=
index$
t
;
exports
.
Canvas
=
index$s
;
exports
.
Checkbox
=
index$q
;
exports
.
CheckboxGroup
=
index$r
;
exports
.
CoverImage
=
index$3
;
exports
.
CoverView
=
index$4
;
exports
.
Editor
=
index$p
;
exports
.
Form
=
index$
u
;
exports
.
Form
=
index$
v
;
exports
.
Friction
=
Friction
;
exports
.
Icon
=
index$o
;
exports
.
Image
=
index$n
;
exports
.
Input
=
Input
;
exports
.
Label
=
index$
t
;
exports
.
Label
=
index$
u
;
exports
.
LayoutComponent
=
LayoutComponent
;
exports
.
Map
=
index$5
;
exports
.
MovableArea
=
index$m
;
...
...
packages/uni-h5/dist/uni-h5.es.js
浏览文件 @
460e0a99
import {isFunction, extend, hyphenate, isPlainObject, isString, isArray, hasOwn, isObject, capitalize, toRawType, makeMap as makeMap$1, isPromise, invokeArrayFns as invokeArrayFns$1} from "@vue/shared";
import {injectHook, withModifiers, createVNode, getCurrentInstance, inject, provide, reactive, openBlock, createBlock, mergeProps, toDisplayString, defineComponent, ref, computed, watch, onUnmounted, onBeforeUnmount, onActivated, onMounted, nextTick,
resolveComponent, toHandlers, renderSlot, onBeforeMount, withDirectives, vShow, shallowRef, watchEffect, isVNode, Fragment, markRaw, createCommentVNode, createTextVNode, onBeforeActivate, onBeforeDeactivate, renderList, onDeactivated, Teleport, createApp, Transition
, withCtx, KeepAlive, resolveDynamicComponent} from "vue";
import {injectHook, withModifiers, createVNode, getCurrentInstance, inject, provide, reactive, openBlock, createBlock, mergeProps, toDisplayString, defineComponent, ref, computed, watch, onUnmounted, onBeforeUnmount, onActivated, onMounted, nextTick,
onBeforeMount, withDirectives, vShow, shallowRef, watchEffect, isVNode, Fragment, markRaw, createCommentVNode, renderSlot, createTextVNode, onBeforeActivate, onBeforeDeactivate, renderList, onDeactivated, Teleport, createApp, Transition, resolveComponent
, withCtx, KeepAlive, resolveDynamicComponent} from "vue";
import {once, passive, normalizeTarget, isBuiltInComponent, initCostomDataset, invokeArrayFns, NAVBAR_HEIGHT, parseQuery, PRIMARY_COLOR, debounce, getCostomDataset, callOptions, removeLeadingSlash, getLen, ON_REACH_BOTTOM_DISTANCE, decodedQuery, updateElementStyle, addFont, scrollTo, formatDateTime} from "@dcloudio/uni-shared";
import {initVueI18n, LOCALE_EN, LOCALE_ES, LOCALE_FR, LOCALE_ZH_HANS, LOCALE_ZH_HANT} from "@dcloudio/uni-i18n";
import {useRoute, createRouter, createWebHistory, createWebHashHistory, useRouter, isNavigationFailure, RouterView} from "vue-router";
...
...
@@ -1828,7 +1828,7 @@ function throttle(fn, wait) {
};
return newFn;
}
const _sfc_main$
5
= {
const _sfc_main$
4
= {
name: "Audio",
mixins: [subscriber],
props: {
...
...
@@ -1947,13 +1947,13 @@ const _sfc_main$5 = {
}
}
};
const _hoisted_1$
4
= {class: "uni-audio-default"};
const _hoisted_2$
3
= {class: "uni-audio-right"};
const _hoisted_1$
3
= {class: "uni-audio-default"};
const _hoisted_2$
2
= {class: "uni-audio-right"};
const _hoisted_3$2 = {class: "uni-audio-time"};
const _hoisted_4$2 = {class: "uni-audio-info"};
const _hoisted_5$1 = {class: "uni-audio-name"};
const _hoisted_6$1 = {class: "uni-audio-author"};
function _sfc_render$
5
(_ctx, _cache, $props, $setup, $data, $options) {
function _sfc_render$
4
(_ctx, _cache, $props, $setup, $data, $options) {
return openBlock(), createBlock("uni-audio", mergeProps({
id: $props.id,
controls: !!$props.controls
...
...
@@ -1963,7 +1963,7 @@ function _sfc_render$5(_ctx, _cache, $props, $setup, $data, $options) {
loop: $props.loop,
style: {"display": "none"}
}, null, 8, ["loop"]),
createVNode("div", _hoisted_1$
4
, [
createVNode("div", _hoisted_1$
3
, [
createVNode("div", {
style: "background-image: url(" + _ctx.$getRealPath($props.poster) + ");",
class: "uni-audio-left"
...
...
@@ -1973,7 +1973,7 @@ function _sfc_render$5(_ctx, _cache, $props, $setup, $data, $options) {
onClick: _cache[1] || (_cache[1] = (...args) => $options.trigger && $options.trigger(...args))
}, null, 2)
], 4),
createVNode("div", _hoisted_2$
3
, [
createVNode("div", _hoisted_2$
2
, [
createVNode("div", _hoisted_3$2, toDisplayString($data.currentTime), 1),
createVNode("div", _hoisted_4$2, [
createVNode("div", _hoisted_5$1, toDisplayString($props.name), 1),
...
...
@@ -1983,7 +1983,7 @@ function _sfc_render$5(_ctx, _cache, $props, $setup, $data, $options) {
])
], 16, ["id", "controls"]);
}
_sfc_main$
5.render = _sfc_render$5
;
_sfc_main$
4.render = _sfc_render$4
;
function converPx(value) {
if (/^-?\d+[ur]px$/i.test(value)) {
return value.replace(/(^-?\d+)[ur]px$/i, (text2, num) => {
...
...
@@ -2215,7 +2215,7 @@ function normalizeCustomEvent(name, domEvt, el, detail) {
};
}
const uniFormKey = PolySymbol(process.env.NODE_ENV !== "production" ? "uniForm" : "uf");
var index$
r
= /* @__PURE__ */ defineBuiltInComponent({
var index$
s
= /* @__PURE__ */ defineBuiltInComponent({
name: "Form",
setup(_props, {
slots,
...
...
@@ -2255,15 +2255,15 @@ function provideForm(emit2) {
return fields2;
}
const uniLabelKey = PolySymbol(process.env.NODE_ENV !== "production" ? "uniLabel" : "ul");
const props$
y
= {
const props$
z
= {
for: {
type: String,
default: ""
}
};
var index$
q
= /* @__PURE__ */ defineBuiltInComponent({
var index$
r
= /* @__PURE__ */ defineBuiltInComponent({
name: "Label",
props: props$
y
,
props: props$
z
,
setup(props2, {
slots
}) {
...
...
@@ -2305,7 +2305,7 @@ function useProvideLabel() {
});
return handlers;
}
function useListeners(props2, listeners) {
function useListeners
$1
(props2, listeners) {
_addListeners(props2.id, listeners);
watch(() => props2.id, (newId, oldId) => {
_removeListeners(oldId, listeners, true);
...
...
@@ -2359,7 +2359,7 @@ function _removeListeners(id2, listeners, watch2) {
}
});
}
var index$
p
= /* @__PURE__ */ defineBuiltInComponent({
var index$
q
= /* @__PURE__ */ defineBuiltInComponent({
name: "Button",
props: {
id: {
...
...
@@ -2436,7 +2436,7 @@ var index$p = /* @__PURE__ */ defineBuiltInComponent({
uniLabel.removeHandler(onClick);
});
}
useListeners(props2, {
useListeners
$1
(props2, {
"label-click": onClick
});
return () => {
...
...
@@ -2666,8 +2666,9 @@ function resolveColor(color) {
return "rgba(" + color.join(",") + ")";
}
function processTouches(target, touches) {
return [].map.call(touches, (touch) => {
var boundingClientRect = target.getBoundingClientRect();
const eventTarget = target;
return Array.from(touches).map((touch) => {
let boundingClientRect = eventTarget.getBoundingClientRect();
return {
identifier: touch.identifier,
x: touch.clientX - boundingClientRect.left,
...
...
@@ -2675,7 +2676,7 @@ function processTouches(target, touches) {
};
});
}
var
tempCanvas;
let
tempCanvas;
function getTempCanvas(width = 0, height = 0) {
if (!tempCanvas) {
tempCanvas = document.createElement("canvas");
...
...
@@ -2684,492 +2685,500 @@ function getTempCanvas(width = 0, height = 0) {
tempCanvas.height = height;
return tempCanvas;
}
var _sfc_main$4 = {
name: "Canvas",
const props$y = {
canvasId: {
type: String,
default: ""
},
disableScroll: {
type: [Boolean, String],
default: false
}
};
var index$p = /* @__PURE__ */ defineBuiltInComponent({
inheritAttrs: false,
name: "Canvas",
compatConfig: {
MODE: 3
},
components: {
ResizeSensor
},
props: {
canvasId: {
type: String,
default: ""
},
disableScroll: {
type: [Boolean, String],
default: false
}
},
data() {
return {
actionsWaiting: false
};
},
props: props$y,
computed: {
id() {
return this.canvasId;
},
_listeners() {
let events = ["touchstart", "touchmove", "touchend"];
let _$listeners = this.Listeners;
let $listeners = Object.assign({}, (() => {
let obj = {};
for (const key in _$listeners) {
if (Object.prototype.hasOwnProperty.call(_$listeners, key)) {
const event = _$listeners[key];
obj[key.replace("on", "").toLowerCase()] = event;
}
}
return obj;
})());
events.forEach((event) => {
let existing = $listeners[event];
let eventHandler = [];
if (existing) {
eventHandler.push(withWebEvent(($event) => {
this.$trigger(event, Object.assign({}, (() => {
let obj = {};
for (const key in $event) {
obj[key] = $event[key];
}
return obj;
})(), {
touches: processTouches($event.currentTarget, $event.touches),
changedTouches: processTouches($event.currentTarget, $event.changedTouches)
}));
}));
}
if (this.disableScroll && event === "touchmove") {
eventHandler.push(onEventPrevent);
}
$listeners[event] = eventHandler;
});
return $listeners;
}
},
created() {
this._actionsDefer = [];
this._images = {};
const id2 = useContextInfo();
useSubscribe(this._handleSubscribe, id2, true);
},
beforeMount() {
setup(props2, {
emit: emit2,
slots
}) {
initHidpiOnce();
},
mounted() {
this.$trigger = useNativeEvent(this.$emit);
this._resize();
},
beforeUnmount() {
const canvas = this.canvas;
canvas.height = canvas.width = 0;
},
methods: {
_handleSubscribe(type, data = {}) {
var method = this[type];
if (type.indexOf("_") !== 0 && typeof method === "function") {
method(data);
}
},
_resize() {
var canvas = this.canvas;
if (canvas.width > 0 && canvas.height > 0) {
var context = canvas.getContext("2d");
var imageData = context.getImageData(0, 0, canvas.width, canvas.height);
wrapper(canvas);
context.putImageData(imageData, 0, 0);
} else {
wrapper(canvas);
const canvas = ref(null);
const sensor = ref(null);
const actionsWaiting = ref(false);
const trigger = useNativeEvent(emit2);
const {
$attrs,
$excludeAttrs,
$listeners
} = useAttrs({
excludeListeners: true
});
const {
_listeners
} = useListeners(props2, $listeners, trigger);
const {
_handleSubscribe,
_resize
} = useMethods(canvas, actionsWaiting);
useSubscribe(_handleSubscribe, useContextInfo(props2.canvasId), true);
onMounted(() => {
_resize();
});
return () => {
const {
canvasId,
disableScroll
} = props2;
return createVNode("uni-canvas", mergeProps({
"canvas-id": canvasId,
"disable-scroll": disableScroll
}, $attrs.value, $excludeAttrs.value, _listeners.value), [createVNode("canvas", {
"ref": canvas,
"class": "uni-canvas-canvas",
"width": "300",
"height": "150"
}, null, 512), createVNode("div", {
"style": "position: absolute;top: 0;left: 0;width: 100%;height: 100%;overflow: hidden;"
}, [slots.default && slots.default()]), createVNode(ResizeSensor, {
"ref": sensor,
"onResize": _resize
}, null, 8, ["onResize"])], 16, ["canvas-id", "disable-scroll"]);
};
}
});
function useListeners(props2, Listeners, trigger) {
const _listeners = computed(() => {
let events = ["onTouchstart", "onTouchmove", "onTouchend"];
let _$listeners = Listeners.value;
let $listeners = Object.assign({}, (() => {
let obj = {};
for (const key in _$listeners) {
if (Object.prototype.hasOwnProperty.call(_$listeners, key)) {
const event = _$listeners[key];
obj[key] = event;
}
}
},
actionsChanged({actions, reserve, callbackId}) {
var self = this;
if (!actions) {
return;
return obj;
})());
events.forEach((event) => {
let existing = $listeners[event];
let eventHandler = [];
if (existing) {
eventHandler.push(withWebEvent(($event) => {
trigger(event.replace("on", "").toLocaleLowerCase(), Object.assign({}, (() => {
let obj = {};
for (const key in $event) {
obj[key] = $event[key];
}
return obj;
})(), {
touches: processTouches($event.currentTarget, $event.touches),
changedTouches: processTouches($event.currentTarget, $event.changedTouches)
}));
}));
}
if (this.actionsWaiting) {
this._actionsDefer.push([actions, reserve, callbackId]);
return;
if (props2.disableScroll && event === "onTouchmove") {
eventHandler.push(onEventPrevent);
}
var canvas = this.canvas;
var c2d = canvas.getContext("2d");
if (!reserve) {
c2d.fillStyle = "#000000";
c2d.strokeStyle = "#000000";
c2d.shadowColor = "#000000";
c2d.shadowBlur = 0;
c2d.shadowOffsetX = 0;
c2d.shadowOffsetY = 0;
c2d.setTransform(1, 0, 0, 1, 0, 0);
c2d.clearRect(0, 0, canvas.width, canvas.height);
}
this.preloadImage(actions);
for (let index2 = 0; index2 < actions.length; index2++) {
const action = actions[index2];
let method = action.method;
const data = action.data;
if (/^set/.test(method) && method !== "setTransform") {
const method1 = method[3].toLowerCase() + method.slice(4);
let color;
if (method1 === "fillStyle" || method1 === "strokeStyle") {
if (data[0] === "normal") {
color = resolveColor(data[1]);
} else if (data[0] === "linear") {
const LinearGradient = c2d.createLinearGradient(...data[1]);
data[2].forEach(function(data2) {
const offset = data2[0];
const color2 = resolveColor(data2[1]);
LinearGradient.addColorStop(offset, color2);
});
color = LinearGradient;
} else if (data[0] === "radial") {
const x = data[1][0];
const y = data[1][1];
const r = data[1][2];
const LinearGradient = c2d.createRadialGradient(x, y, 0, x, y, r);
data[2].forEach(function(data2) {
const offset = data2[0];
const color2 = resolveColor(data2[1]);
LinearGradient.addColorStop(offset, color2);
});
color = LinearGradient;
} else if (data[0] === "pattern") {
const loaded = this.checkImageLoaded(data[1], actions.slice(index2 + 1), callbackId, function(image2) {
if (image2) {
c2d[method1] = c2d.createPattern(image2, data[2]);
}
});
if (!loaded) {
break;
$listeners[event] = eventHandler;
});
return $listeners;
});
return {
_listeners
};
}
function useMethods(canvasRef, actionsWaiting) {
let _actionsDefer = [];
let _images = {};
function _resize() {
var canvas = canvasRef.value;
if (canvas.width > 0 && canvas.height > 0) {
var context = canvas.getContext("2d");
var imageData = context.getImageData(0, 0, canvas.width, canvas.height);
wrapper(canvas);
context.putImageData(imageData, 0, 0);
} else {
wrapper(canvas);
}
}
function actionsChanged({
actions,
reserve,
callbackId
}) {
if (!actions) {
return;
}
if (actionsWaiting.value) {
_actionsDefer.push([actions, reserve, callbackId]);
return;
}
var canvas = canvasRef.value;
var c2d = canvas.getContext("2d");
if (!reserve) {
c2d.fillStyle = "#000000";
c2d.strokeStyle = "#000000";
c2d.shadowColor = "#000000";
c2d.shadowBlur = 0;
c2d.shadowOffsetX = 0;
c2d.shadowOffsetY = 0;
c2d.setTransform(1, 0, 0, 1, 0, 0);
c2d.clearRect(0, 0, canvas.width, canvas.height);
}
preloadImage(actions);
for (let index2 = 0; index2 < actions.length; index2++) {
const action = actions[index2];
let method = action.method;
const data = action.data;
if (/^set/.test(method) && method !== "setTransform") {
const method1 = method[3].toLowerCase() + method.slice(4);
let color;
if (method1 === "fillStyle" || method1 === "strokeStyle") {
if (data[0] === "normal") {
color = resolveColor(data[1]);
} else if (data[0] === "linear") {
const LinearGradient = c2d.createLinearGradient(...data[1]);
data[2].forEach(function(data2) {
const offset = data2[0];
const color2 = resolveColor(data2[1]);
LinearGradient.addColorStop(offset, color2);
});
color = LinearGradient;
} else if (data[0] === "radial") {
const x = data[1][0];
const y = data[1][1];
const r = data[1][2];
const LinearGradient = c2d.createRadialGradient(x, y, 0, x, y, r);
data[2].forEach(function(data2) {
const offset = data2[0];
const color2 = resolveColor(data2[1]);
LinearGradient.addColorStop(offset, color2);
});
color = LinearGradient;
} else if (data[0] === "pattern") {
const loaded = checkImageLoaded(data[1], actions.slice(index2 + 1), callbackId, function(image2) {
if (image2) {
c2d[method1] = c2d.createPattern(image2, data[2]);
}
continue;
}
c2d[method1] = color;
} else if (method1 === "globalAlpha") {
c2d[method1] = data[0] / 255;
} else if (method1 === "shadow") {
var _ = ["shadowOffsetX", "shadowOffsetY", "shadowBlur", "shadowColor"];
data.forEach(function(color_, method_) {
c2d[_[method_]] = _[method_] === "shadowColor" ? resolveColor(color_) : color_;
});
} else if (method1 === "fontSize") {
const font2 = c2d.__font__ || c2d.font;
c2d.__font__ = c2d.font = font2.replace(/\d+\.?\d*px/, data[0] + "px");
} else if (method1 === "lineDash") {
c2d.setLineDash(data[0]);
c2d.lineDashOffset = data[1] || 0;
} else if (method1 === "textBaseline") {
if (data[0] === "normal") {
data[0] = "alphabetic";
if (!loaded) {
break;
}
c2d[method1] = data[0];
} else if (method1 === "font") {
c2d.__font__ = c2d.font = data[0];
} else {
c2d[method1] = data[0];
continue;
}
} else if (method === "fillPath" || method === "strokePath") {
method = method.replace(/Path/, "");
c2d.beginPath();
data.forEach(function(data_) {
c2d[data_.method].apply(c2d, data_.data);
c2d[method1] = color;
} else if (method1 === "globalAlpha") {
c2d[method1] = Number(data[0]) / 255;
} else if (method1 === "shadow") {
var _ = ["shadowOffsetX", "shadowOffsetY", "shadowBlur", "shadowColor"];
data.forEach(function(color_, method_) {
c2d[_[method_]] = _[method_] === "shadowColor" ? resolveColor(color_) : color_;
});
c2d[method]();
} else if (method === "fillText") {
c2d.fillText.apply(c2d, data);
} else if (method === "drawImage") {
var A = function() {
var dataArray = [...data];
var url = dataArray[0];
var otherData = dataArray.slice(1);
self._images = self._images || {};
if (!self.checkImageLoaded(url, actions.slice(index2 + 1), callbackId, function(image2) {
if (image2) {
c2d.drawImage.apply(c2d, [image2].concat([...otherData.slice(4, 8)], [...otherData.slice(0, 4)]));
}
}))
return "break";
}();
if (A === "break") {
break;
} else if (method1 === "fontSize") {
const font2 = c2d.__font__ || c2d.font;
c2d.__font__ = c2d.font = font2.replace(/\d+\.?\d*px/, data[0] + "px");
} else if (method1 === "lineDash") {
c2d.setLineDash(data[0]);
c2d.lineDashOffset = data[1] || 0;
} else if (method1 === "textBaseline") {
if (data[0] === "normal") {
data[0] = "alphabetic";
}
c2d[method1] = data[0];
} else if (method1 === "font") {
c2d.__font__ = c2d.font = data[0];
} else {
if (method === "clip") {
data.forEach(function(data_) {
c2d[data_.method].apply(c2d, data_.data);
});
c2d.clip();
} else {
c2d[method].apply(c2d, data);
}
c2d[method1] = data[0];
}
}
if (!this.actionsWaiting && callbackId) {
UniViewJSBridge.publishHandler("onCanvasMethodCallback", {
callbackId,
data: {
errMsg: "drawCanvas:ok"
}
}, getCurrentPageId());
}
},
preloadImage: function(actions) {
var self = this;
actions.forEach(function(action) {
var method = action.method;
var data = action.data;
var src = "";
if (method === "drawImage") {
src = data[0];
src = $getRealPath(src);
data[0] = src;
} else if (method === "setFillStyle" && data[0] === "pattern") {
src = data[1];
src = $getRealPath(src);
data[1] = src;
}
if (src && !self._images[src]) {
loadImage();
} else if (method === "fillPath" || method === "strokePath") {
method = method.replace(/Path/, "");
c2d.beginPath();
data.forEach(function(data_) {
c2d[data_.method].apply(c2d, data_.data);
});
c2d[method]();
} else if (method === "fillText") {
c2d.fillText.apply(c2d, data);
} else if (method === "drawImage") {
var A = function() {
var dataArray = [...data];
var url = dataArray[0];
var otherData = dataArray.slice(1);
_images = _images || {};
if (checkImageLoaded(url, actions.slice(index2 + 1), callbackId, function(image2) {
if (image2) {
c2d.drawImage.apply(c2d, [image2].concat([...otherData.slice(4, 8)], [...otherData.slice(0, 4)]));
}
}))
return "break";
}();
if (A === "break") {
break;
}
function loadImage() {
const image2 = self._images[src] = new Image();
image2.onload = function() {
image2.ready = true;
};
getSameOriginUrl(src).then((src2) => {
image2.src = src2;
}).catch(() => {
image2.src = src;
} else {
if (method === "clip") {
data.forEach(function(data_) {
c2d[data_.method].apply(c2d, data_.data);
});
c2d.clip();
} else {
c2d[method].apply(c2d, data);
}
});
},
checkImageLoaded: function(src, actions, callbackId, fn) {
var self = this;
var image2 = this._images[src];
if (image2.ready) {
fn(image2);
return true;
} else {
this._actionsDefer.unshift([actions, true]);
this.actionsWaiting = true;
}
}
if (!actionsWaiting.value && callbackId) {
UniViewJSBridge.publishHandler("onCanvasMethodCallback", {
callbackId,
data: {
errMsg: "drawCanvas:ok"
}
}, getCurrentPageId());
}
}
function preloadImage(actions) {
actions.forEach(function(action) {
var method = action.method;
var data = action.data;
var src = "";
if (method === "drawImage") {
src = data[0];
src = $getRealPath(src);
data[0] = src;
} else if (method === "setFillStyle" && data[0] === "pattern") {
src = data[1];
src = $getRealPath(src);
data[1] = src;
}
if (src && !_images[src]) {
loadImage();
}
function loadImage() {
const image2 = _images[src] = new Image();
image2.onload = function() {
image2.ready = true;
fn(image2);
self.actionsWaiting = false;
var actions2 = self._actionsDefer.slice(0);
self._actionsDefer = [];
for (var action = actions2.shift(); action; ) {
self.actionsChanged({
actions: action[0],
reserve: action[1],
callbackId
});
action = actions2.shift();
}
};
return false;
getSameOriginUrl(src).then((src2) => {
image2.src = src2;
}).catch(() => {
image2.src = src;
});
}
},
getImageData({
x = 0,
y = 0,
width,
height,
destWidth,
destHeight,
hidpi = true,
dataType: dataType2,
quality = 1,
type = "png",
callbackId
}) {
const canvas = this.canvas;
let data;
const maxWidth = canvas.offsetWidth - x;
width = width ? Math.min(width, maxWidth) : maxWidth;
const maxHeight = canvas.offsetHeight - y;
height = height ? Math.min(height, maxHeight) : maxHeight;
if (!hidpi) {
if (!destWidth && !destHeight) {
destWidth = Math.round(width * pixelRatio);
destHeight = Math.round(height * pixelRatio);
} else if (!destWidth) {
destWidth = Math.round(width / height * destHeight);
} else if (!destHeight) {
destHeight = Math.round(height / width * destWidth);
}
} else {
destWidth = width;
destHeight = height;
}
const newCanvas = getTempCanvas(destWidth, destHeight);
const context = newCanvas.getContext("2d");
if (type === "jpeg" || type === "jpg") {
type = "jpeg";
context.fillStyle = "#fff";
context.fillRect(0, 0, destWidth, destHeight);
}
context.__hidpi__ = true;
context.drawImageByCanvas(canvas, x, y, width, height, 0, 0, destWidth, destHeight, false);
let result;
try {
let compressed;
if (dataType2 === "base64") {
data = newCanvas.toDataURL(`image/${type}`, quality);
} else {
const imgData = context.getImageData(0, 0, destWidth, destHeight);
if (false)
;
else {
data = Array.prototype.slice.call(imgData.data);
}
});
}
function checkImageLoaded(src, actions, callbackId, fn) {
var image2 = _images[src];
if (image2.ready) {
fn(image2);
return true;
} else {
_actionsDefer.unshift([actions, true]);
actionsWaiting.value = true;
image2.onload = function() {
image2.ready = true;
fn(image2);
actionsWaiting.value = false;
var actions2 = _actionsDefer.slice(0);
_actionsDefer = [];
for (var action = actions2.shift(); action; ) {
actionsChanged({
actions: action[0],
reserve: action[1],
callbackId
});
action = actions2.shift();
}
result = {
errMsg: "canvasGetImageData:ok",
data,
compressed,
width: destWidth,
height: destHeight
};
} catch (error) {
result = {
errMsg: `canvasGetImageData:fail ${error}`
};
};
return false;
}
}
function getImageData({
x = 0,
y = 0,
width,
height,
destWidth,
destHeight,
hidpi = true,
dataType: dataType2,
quality = 1,
type = "png",
callbackId
}) {
const canvas = canvasRef.value;
let data;
const maxWidth = canvas.offsetWidth - x;
width = width ? Math.min(width, maxWidth) : maxWidth;
const maxHeight = canvas.offsetHeight - y;
height = height ? Math.min(height, maxHeight) : maxHeight;
if (!hidpi) {
if (!destWidth && !destHeight) {
destWidth = Math.round(width * pixelRatio);
destHeight = Math.round(height * pixelRatio);
} else if (!destWidth) {
destWidth = Math.round(width / height * destHeight);
} else if (!destHeight) {
destHeight = Math.round(height / width * destWidth);
}
newCanvas.height = newCanvas.width = 0;
context.__hidpi__ = false;
if (!callbackId) {
return result;
} else {
destWidth = width;
destHeight = height;
}
const newCanvas = getTempCanvas(destWidth, destHeight);
const context = newCanvas.getContext("2d");
if (type === "jpeg" || type === "jpg") {
type = "jpeg";
context.fillStyle = "#fff";
context.fillRect(0, 0, destWidth, destHeight);
}
context.__hidpi__ = true;
context.drawImageByCanvas(canvas, x, y, width, height, 0, 0, destWidth, destHeight, false);
let result;
try {
let compressed;
if (dataType2 === "base64") {
data = newCanvas.toDataURL(`image/${type}`, quality);
} else {
UniViewJSBridge.publishHandler("onCanvasMethodCallback", {
callbackId,
data: result
}, getCurrentPageId());
}
},
putImageData({data, x, y, width, height, compressed, callbackId}) {
try {
if (!height) {
height = Math.round(data.length / 4 / width);
}
const canvas = getTempCanvas(width, height);
const context = canvas.getContext("2d");
const imgData = context.getImageData(0, 0, destWidth, destHeight);
if (false)
;
context.putImageData(new ImageData(new Uint8ClampedArray(data), width, height), 0, 0);
this.canvas.getContext("2d").drawImage(canvas, x, y, width, height);
canvas.height = canvas.width = 0;
} catch (error) {
UniViewJSBridge.publishHandler("onCanvasMethodCallback", {
callbackId,
data: {
errMsg: "canvasPutImageData:fail"
}
}, getCurrentPageId());
return;
else {
data = Array.prototype.slice.call(imgData.data);
}
}
result = {
errMsg: "canvasGetImageData:ok",
data,
compressed,
width: destWidth,
height: destHeight
};
} catch (error) {
result = {
errMsg: `canvasGetImageData:fail ${error}`
};
}
newCanvas.height = newCanvas.width = 0;
context.__hidpi__ = false;
if (!callbackId) {
return result;
} else {
UniViewJSBridge.publishHandler("onCanvasMethodCallback", {
callbackId,
data: result
}, getCurrentPageId());
}
}
function putImageData({
data,
x,
y,
width,
height,
compressed,
callbackId
}) {
try {
if (!height) {
height = Math.round(data.length / 4 / width);
}
const canvas = getTempCanvas(width, height);
const context = canvas.getContext("2d");
if (false)
;
context.putImageData(new ImageData(new Uint8ClampedArray(data), width, height), 0, 0);
canvasRef.value.getContext("2d").drawImage(canvas, x, y, width, height);
canvas.height = canvas.width = 0;
} catch (error) {
UniViewJSBridge.publishHandler("onCanvasMethodCallback", {
callbackId,
data: {
errMsg: "canvasPutImageData:
ok
"
errMsg: "canvasPutImageData:
fail
"
}
}, getCurrentPageId());
},
toTempFilePath({
x = 0,
y = 0,
return;
}
UniViewJSBridge.publishHandler("onCanvasMethodCallback", {
callbackId,
data: {
errMsg: "canvasPutImageData:ok"
}
}, getCurrentPageId());
}
function toTempFilePath({
x = 0,
y = 0,
width,
height,
destWidth,
destHeight,
fileType,
quality,
dirname,
callbackId
}) {
const res = getImageData({
x,
y,
width,
height,
destWidth,
destHeight,
fileType,
quality,
dirname,
callbackId
}) {
const res = this.getImageData({
x,
y,
width,
height,
destWidth,
destHeight,
hidpi: false,
dataType: "base64",
type: fileType,
quality
});
if (!res.data || !res.data.length) {
UniViewJSBridge.publishHandler("onCanvasMethodCallback", {
callbackId,
data: {
errMsg: res.errMsg.replace("canvasPutImageData", "toTempFilePath")
}
}, getCurrentPageId());
return;
}
saveImage(res.data, dirname, (error, tempFilePath) => {
let errMsg = `toTempFilePath:${error ? "fail" : "ok"}`;
if (error) {
errMsg += ` ${error.message}`;
hidpi: false,
dataType: "base64",
type: fileType,
quality
});
if (!res.data || !res.data.length) {
UniViewJSBridge.publishHandler("onCanvasMethodCallback", {
callbackId,
data: {
errMsg: res.errMsg.replace("canvasPutImageData", "toTempFilePath")
}
UniViewJSBridge.publishHandler("onCanvasMethodCallback", {
callbackId,
data: {
errMsg,
tempFilePath
}
}, getCurrentPageId());
});
}, getCurrentPageId());
return;
}
},
setup() {
const canvas = ref(null);
const sensor = ref(null);
const {
$attrs: Attrs,
$excludeAttrs: ExcludeAttrs,
$listeners: Listeners
} = useAttrs({
excludeListeners: true
saveImage(res.data, dirname, (error, tempFilePath) => {
let errMsg = `toTempFilePath:${error ? "fail" : "ok"}`;
if (error) {
errMsg += ` ${error.message}`;
}
UniViewJSBridge.publishHandler("onCanvasMethodCallback", {
callbackId,
data: {
errMsg,
tempFilePath
}
}, getCurrentPageId());
});
return {
canvas,
sensor,
Attrs,
ExcludeAttrs,
Listeners
};
}
};
const _hoisted_1$3 = {
class: "uni-canvas-canvas",
ref: "canvas",
width: "300",
height: "150"
};
const _hoisted_2$2 = {style: {"position": "absolute", "top": "0", "left": "0", "width": "100%", "height": "100%", "overflow": "hidden"}};
function _sfc_render$4(_ctx, _cache, $props, $setup, $data, $options) {
const _component_ResizeSensor = resolveComponent("ResizeSensor");
return openBlock(), createBlock("uni-canvas", mergeProps({
"canvas-id": $props.canvasId,
"disable-scroll": $props.disableScroll
}, {...$setup.Attrs, ...$setup.ExcludeAttrs}, toHandlers($options._listeners)), [
createVNode("canvas", _hoisted_1$3, null, 512),
createVNode("div", _hoisted_2$2, [
renderSlot(_ctx.$slots, "default")
]),
createVNode(_component_ResizeSensor, {
ref: "sensor",
onResize: $options._resize
}, null, 8, ["onResize"])
], 16, ["canvas-id", "disable-scroll"]);
const methods = {
actionsChanged,
getImageData,
putImageData,
toTempFilePath
};
function _handleSubscribe(type, data = {}) {
let method = methods[type];
if (type.indexOf("_") !== 0 && typeof method === "function") {
method(data);
}
}
return extend(methods, {
_resize,
_handleSubscribe
});
}
_sfc_main$4.render = _sfc_render$4;
const uniCheckGroupKey = PolySymbol(process.env.NODE_ENV !== "production" ? "uniCheckGroup" : "ucg");
const props$x = {
name: {
...
...
@@ -3285,7 +3294,7 @@ var index$n = /* @__PURE__ */ defineBuiltInComponent({
uniLabel.removeHandler(_onClick);
});
}
useListeners(props2, {
useListeners
$1
(props2, {
"label-click": _onClick
});
return () => {
...
...
@@ -7543,7 +7552,7 @@ var index$g = /* @__PURE__ */ defineBuiltInComponent({
uniLabel.removeHandler(_onClick);
});
}
useListeners(props2, {
useListeners
$1
(props2, {
"label-click": _onClick
});
return () => {
...
...
@@ -9240,7 +9249,7 @@ var index$e = /* @__PURE__ */ defineBuiltInComponent({
uniLabel.removeHandler(_onClick);
});
}
useListeners(props2, {
useListeners
$1
(props2, {
"label-click": _onClick
});
return () => {
...
...
@@ -9563,12 +9572,12 @@ function useOn(name, callback) {
onBeforeUnmount(() => UniViewJSBridge.off(name));
}
let index$a = 0;
function useContextInfo() {
function useContextInfo(
_id
) {
const page = useCurrentPageId();
const instance2 = getCurrentInstance();
const vm = instance2.proxy;
const type = vm.$options.name.toLowerCase();
const id2 = vm.id || `context${index$a++}`;
const id2 =
_id ||
vm.id || `context${index$a++}`;
onMounted(() => {
const el = vm.$el;
el.__uniContextInfo = {
...
...
@@ -20265,4 +20274,4 @@ var index = /* @__PURE__ */ defineSystemComponent({
return openBlock(), createBlock("div", clazz, [loadingVNode]);
}
});
export {$emit, $off, $on, $once, index$1 as AsyncErrorComponent, index as AsyncLoadingComponent, _sfc_main$
5 as Audio, index$p as Button, _sfc_main$4 as Canvas, index$n as Checkbox, index$o as CheckboxGroup, index$3 as CoverImage, index$4 as CoverView, index$m as Editor, index$r as Form, Friction, index$l as Icon, index$k as Image, Input, index$q
as Label, LayoutComponent, Map$1 as Map, MovableArea, MovableView, index$j as Navigator, index$2 as PageComponent, _sfc_main$1 as Picker, PickerView, PickerViewColumn, index$i as Progress, index$g as Radio, index$h as RadioGroup, ResizeSensor, _sfc_main$3 as RichText, _sfc_main$2 as ScrollView, Scroller, index$f as Slider, Spring, Swiper, SwiperItem, index$e as Switch, index$d as Text, index$c as Textarea, UniServiceJSBridge$1 as UniServiceJSBridge, UniViewJSBridge$1 as UniViewJSBridge, index$7 as Video, index$b as View, index$6 as WebView, addInterceptor, arrayBufferToBase64, base64ToArrayBuffer, canIUse, canvasGetImageData, canvasPutImageData, canvasToTempFilePath, chooseFile, chooseImage, chooseLocation, chooseVideo, clearStorage, clearStorageSync, closeSocket, connectSocket, createAnimation, createCanvasContext, createInnerAudioContext, createIntersectionObserver, createMapContext, createMediaQueryObserver, createSelectorQuery, createVideoContext, cssBackdropFilter, cssConstant, cssEnv, cssVar, defineBuiltInComponent, defineSystemComponent, disableScrollBounce, downloadFile, getApp$1 as getApp, getContextInfo, getCurrentPages$1 as getCurrentPages, getFileInfo, getImageInfo, getLocation, getNetworkType, getSelectedTextRange, getStorage, getStorageInfo, getStorageInfoSync, getStorageSync, getSystemInfo, getSystemInfoSync, getVideoInfo, hideKeyboard, hideLoading, hideNavigationBarLoading, hideTabBar, hideTabBarRedDot, hideToast, initScrollBounce, loadFontFace, makePhoneCall, navigateBack, navigateTo, offAccelerometerChange, offCompassChange, offNetworkStatusChange, offWindowResize, onAccelerometerChange, onCompassChange, onNetworkStatusChange, onSocketClose, onSocketError, onSocketMessage, onSocketOpen, onTabBarMidButtonTap, onWindowResize, openDocument, openLocation, pageScrollTo, index$8 as plugin, preloadPage, previewImage, promiseInterceptor, reLaunch, redirectTo, removeInterceptor, removeStorage, removeStorageSync, removeTabBarBadge, request, sendSocketMessage, setNavigationBarColor, setNavigationBarTitle, setStorage, setStorageSync, setTabBarBadge, setTabBarItem, setTabBarStyle, setupApp, setupPage, showActionSheet, showLoading, showModal, showNavigationBarLoading, showTabBar, showTabBarRedDot, showToast, startAccelerometer, startCompass, startPullDownRefresh, stopAccelerometer, stopCompass, stopPullDownRefresh, switchTab, uni$1 as uni, uniFormKey, uploadFile, upx2px, useAttrs, useBooleanAttr, useContextInfo, useCustomEvent, useNativeEvent, useOn, useScroller, useSubscribe, useTouchtrack, useUserAction, vibrateLong, vibrateShort, withWebEvent};
export {$emit, $off, $on, $once, index$1 as AsyncErrorComponent, index as AsyncLoadingComponent, _sfc_main$
4 as Audio, index$q as Button, index$p as Canvas, index$n as Checkbox, index$o as CheckboxGroup, index$3 as CoverImage, index$4 as CoverView, index$m as Editor, index$s as Form, Friction, index$l as Icon, index$k as Image, Input, index$r
as Label, LayoutComponent, Map$1 as Map, MovableArea, MovableView, index$j as Navigator, index$2 as PageComponent, _sfc_main$1 as Picker, PickerView, PickerViewColumn, index$i as Progress, index$g as Radio, index$h as RadioGroup, ResizeSensor, _sfc_main$3 as RichText, _sfc_main$2 as ScrollView, Scroller, index$f as Slider, Spring, Swiper, SwiperItem, index$e as Switch, index$d as Text, index$c as Textarea, UniServiceJSBridge$1 as UniServiceJSBridge, UniViewJSBridge$1 as UniViewJSBridge, index$7 as Video, index$b as View, index$6 as WebView, addInterceptor, arrayBufferToBase64, base64ToArrayBuffer, canIUse, canvasGetImageData, canvasPutImageData, canvasToTempFilePath, chooseFile, chooseImage, chooseLocation, chooseVideo, clearStorage, clearStorageSync, closeSocket, connectSocket, createAnimation, createCanvasContext, createInnerAudioContext, createIntersectionObserver, createMapContext, createMediaQueryObserver, createSelectorQuery, createVideoContext, cssBackdropFilter, cssConstant, cssEnv, cssVar, defineBuiltInComponent, defineSystemComponent, disableScrollBounce, downloadFile, getApp$1 as getApp, getContextInfo, getCurrentPages$1 as getCurrentPages, getFileInfo, getImageInfo, getLocation, getNetworkType, getSelectedTextRange, getStorage, getStorageInfo, getStorageInfoSync, getStorageSync, getSystemInfo, getSystemInfoSync, getVideoInfo, hideKeyboard, hideLoading, hideNavigationBarLoading, hideTabBar, hideTabBarRedDot, hideToast, initScrollBounce, loadFontFace, makePhoneCall, navigateBack, navigateTo, offAccelerometerChange, offCompassChange, offNetworkStatusChange, offWindowResize, onAccelerometerChange, onCompassChange, onNetworkStatusChange, onSocketClose, onSocketError, onSocketMessage, onSocketOpen, onTabBarMidButtonTap, onWindowResize, openDocument, openLocation, pageScrollTo, index$8 as plugin, preloadPage, previewImage, promiseInterceptor, reLaunch, redirectTo, removeInterceptor, removeStorage, removeStorageSync, removeTabBarBadge, request, sendSocketMessage, setNavigationBarColor, setNavigationBarTitle, setStorage, setStorageSync, setTabBarBadge, setTabBarItem, setTabBarStyle, setupApp, setupPage, showActionSheet, showLoading, showModal, showNavigationBarLoading, showTabBar, showTabBarRedDot, showToast, startAccelerometer, startCompass, startPullDownRefresh, stopAccelerometer, stopCompass, stopPullDownRefresh, switchTab, uni$1 as uni, uniFormKey, uploadFile, upx2px, useAttrs, useBooleanAttr, useContextInfo, useCustomEvent, useNativeEvent, useOn, useScroller, useSubscribe, useTouchtrack, useUserAction, vibrateLong, vibrateShort, withWebEvent};
packages/uni-h5/src/platform/saveImage.ts
浏览文件 @
460e0a99
export
function
saveImage
(
base64
:
string
,
dirname
:
string
,
callback
:
Function
)
{
export
function
saveImage
(
base64
:
string
,
dirname
:
string
,
callback
:
(
error
:
Error
|
null
,
tempFilePath
:
string
)
=>
void
)
{
callback
(
null
,
base64
)
}
编辑
预览
Markdown
is supported
0%
请重试
或
添加新附件
.
添加附件
取消
You are about to add
0
people
to the discussion. Proceed with caution.
先完成此消息的编辑!
取消
想要评论请
注册
或
登录