Skip to content
Projects
Groups
Snippets
Help
Loading...
Help
Submit feedback
Contribute to GitLab
Sign in / Register
Toggle navigation
J
JM-15
Project
Project
Details
Activity
Releases
Cycle Analytics
Repository
Repository
Files
Commits
Branches
Tags
Contributors
Graph
Compare
Charts
Issues
0
Issues
0
List
Boards
Labels
Milestones
Merge Requests
0
Merge Requests
0
CI / CD
CI / CD
Pipelines
Jobs
Schedules
Charts
Wiki
Wiki
Snippets
Snippets
Members
Members
Collapse sidebar
Close sidebar
Activity
Graph
Charts
Create a new issue
Jobs
Commits
Issue Boards
Open sidebar
template admin
JM-15
Commits
8fe25eee
Commit
8fe25eee
authored
Sep 26, 2021
by
limingzhe
Browse files
Options
Browse Files
Download
Email Patches
Plain Diff
fix:滚动异常 添加数据上报
parent
e74399ed
Changes
3
Show whitespace changes
Inline
Side-by-side
Showing
3 changed files
with
143 additions
and
35 deletions
+143
-35
form.component.ts
src/app/form/form.component.ts
+1
-1
Unit.ts
src/app/play/Unit.ts
+33
-12
play.component.ts
src/app/play/play.component.ts
+109
-22
No files found.
src/app/form/form.component.ts
View file @
8fe25eee
...
@@ -31,7 +31,7 @@ export class FormComponent implements OnInit, OnChanges, OnDestroy {
...
@@ -31,7 +31,7 @@ export class FormComponent implements OnInit, OnChanges, OnDestroy {
{
label
:
'
电器
'
,
value
:
'
device
'
},
{
label
:
'
电器
'
,
value
:
'
device
'
},
{
label
:
'
方位
'
,
value
:
'
side
'
},
{
label
:
'
方位
'
,
value
:
'
side
'
},
{
label
:
'
工作
'
,
value
:
'
work
'
},
{
label
:
'
工作
'
,
value
:
'
work
'
},
{
label
:
'
动
词
'
,
value
:
'
adj
'
},
{
label
:
'
形容
词
'
,
value
:
'
adj
'
},
{
label
:
'
单词
'
,
value
:
'
word
'
},
{
label
:
'
单词
'
,
value
:
'
word
'
},
],
],
label
:
'
比对
'
,
label
:
'
比对
'
,
...
...
src/app/play/Unit.ts
View file @
8fe25eee
...
@@ -92,6 +92,8 @@ export class MySprite extends Sprite {
...
@@ -92,6 +92,8 @@ export class MySprite extends Sprite {
this
.
width
=
this
.
img
.
width
;
this
.
width
=
this
.
img
.
width
;
this
.
height
=
this
.
img
.
height
;
this
.
height
=
this
.
img
.
height
;
// this.img.setAttribute("crossOrigin",'Anonymous')
}
}
this
.
anchorX
=
anchorX
;
this
.
anchorX
=
anchorX
;
...
@@ -2209,7 +2211,6 @@ export class ScrollView extends MySprite {
...
@@ -2209,7 +2211,6 @@ export class ScrollView extends MySprite {
// console.log('children: ', children);
// console.log('children: ', children);
let
maxW
=
0
;
let
maxW
=
0
;
let
maxH
=
0
;
let
maxH
=
0
;
for
(
let
i
=
0
;
i
<
children
.
length
;
i
++
)
{
for
(
let
i
=
0
;
i
<
children
.
length
;
i
++
)
{
...
@@ -2219,7 +2220,7 @@ export class ScrollView extends MySprite {
...
@@ -2219,7 +2220,7 @@ export class ScrollView extends MySprite {
const
box
=
children
[
i
].
getBoundingBox
();
const
box
=
children
[
i
].
getBoundingBox
();
// console.log('box: ', box);
// console.log('box: ', box);
const
boxEdgeX
=
box
.
x
+
box
.
width
;
const
boxEdgeX
=
box
.
x
+
box
.
width
;
const
boxEdgeY
=
this
.
y
+
box
.
y
+
box
.
height
;
const
boxEdgeY
=
box
.
y
+
box
.
height
;
// console.log('boxEdgeY: ', boxEdgeY);
// console.log('boxEdgeY: ', boxEdgeY);
if
(
boxEdgeX
>
maxW
)
{
if
(
boxEdgeX
>
maxW
)
{
...
@@ -2231,10 +2232,14 @@ export class ScrollView extends MySprite {
...
@@ -2231,10 +2232,14 @@ export class ScrollView extends MySprite {
}
}
// console.log('maxW: ', maxW);
// console.log('maxW: ', maxW);
// console.log('maxH: ', maxH);
console
.
log
(
'
maxH:
'
,
maxH
);
// console.log('this.y: ', this.y);
// console.log(this.getBoundingBox().height);
this
.
content
.
width
=
maxW
;
this
.
content
.
width
=
maxW
;
this
.
content
.
height
=
maxH
;
this
.
content
.
height
=
maxH
;
this
.
refreshScrollBar
();
this
.
refreshScrollBar
();
}
}
...
@@ -2258,8 +2263,8 @@ export class ScrollView extends MySprite {
...
@@ -2258,8 +2263,8 @@ export class ScrollView extends MySprite {
const
rect1
=
this
.
getBoundingBox
();
const
rect1
=
this
.
getBoundingBox
();
const
rect2
=
this
.
content
.
getBoundingBox
();
const
rect2
=
this
.
content
.
getBoundingBox
();
let
rate
=
rect1
.
height
/
rect2
.
height
;
//
let rate = rect1.height / rect2.height;
//
let rate = this.height / this.content.height;
let
rate
=
this
.
height
/
this
.
content
.
height
;
// let rate = this.height * this.scaleY / this.content.height / this.content.scaleY;
// let rate = this.height * this.scaleY / this.content.height / this.content.scaleY;
if
(
rate
>=
1
)
{
if
(
rate
>=
1
)
{
this
.
_scrollBar
.
visible
=
false
;
this
.
_scrollBar
.
visible
=
false
;
...
@@ -2275,7 +2280,12 @@ export class ScrollView extends MySprite {
...
@@ -2275,7 +2280,12 @@ export class ScrollView extends MySprite {
}
}
refreshScrollBarPos
()
{
refreshScrollBarPos
()
{
this
.
_scrollBar
.
y
=
-
this
.
content
.
y
*
(
this
.
height
/
this
.
content
.
height
);
const
rect1
=
this
.
getBoundingBox
();
const
rect2
=
this
.
content
.
getBoundingBox
();
let
rate
=
rect1
.
height
/
rect2
.
height
;
this
.
_scrollBar
.
y
=
-
rect2
.
y
*
(
rate
);
}
}
...
@@ -2305,9 +2315,12 @@ export class ScrollView extends MySprite {
...
@@ -2305,9 +2315,12 @@ export class ScrollView extends MySprite {
}
}
onTouchMove
(
x
,
y
)
{
onTouchMove
(
x
,
y
)
{
if
(
!
this
.
touchStartPos
)
{
if
(
!
this
.
touchStartPos
)
{
return
;
return
;
}
}
if
(
!
this
.
touchStartContentPos
)
{
if
(
!
this
.
touchStartContentPos
)
{
return
;
return
;
}
}
...
@@ -2315,10 +2328,12 @@ export class ScrollView extends MySprite {
...
@@ -2315,10 +2328,12 @@ export class ScrollView extends MySprite {
const
offsetX
=
x
-
this
.
touchStartPos
.
x
;
const
offsetX
=
x
-
this
.
touchStartPos
.
x
;
const
offsetY
=
y
-
this
.
touchStartPos
.
y
;
const
offsetY
=
y
-
this
.
touchStartPos
.
y
;
const
rect
=
this
.
getBoundingBox
();
if
(
this
.
scrollSide
==
ScrollView
.
ScrollSideType
.
VERTICAL
)
{
if
(
this
.
scrollSide
==
ScrollView
.
ScrollSideType
.
VERTICAL
)
{
this
.
content
.
y
=
between
(
this
.
touchStartContentPos
.
y
+
offsetY
,
0
,
this
.
getBoundingBox
()
.
height
-
this
.
content
.
height
);
this
.
content
.
y
=
between
(
this
.
touchStartContentPos
.
y
+
offsetY
,
0
,
-
rect
.
y
+
rect
.
height
-
this
.
content
.
height
);
}
else
{
}
else
{
this
.
content
.
x
=
between
(
this
.
touchStartContentPos
.
x
+
offsetX
,
0
,
this
.
getBoundingBox
().
width
-
this
.
content
.
width
);
this
.
content
.
x
=
between
(
this
.
touchStartContentPos
.
x
+
offsetX
,
0
,
-
rect
.
x
+
rect
.
width
-
this
.
content
.
width
);
}
}
this
.
refreshScrollBarPos
();
this
.
refreshScrollBarPos
();
}
}
...
@@ -2332,10 +2347,12 @@ export class ScrollView extends MySprite {
...
@@ -2332,10 +2347,12 @@ export class ScrollView extends MySprite {
if
(
!
this
.
_scrollBar
.
visible
)
{
if
(
!
this
.
_scrollBar
.
visible
)
{
return
;
return
;
}
}
const
rect
=
this
.
getBoundingBox
();
if
(
this
.
scrollSide
==
ScrollView
.
ScrollSideType
.
VERTICAL
)
{
if
(
this
.
scrollSide
==
ScrollView
.
ScrollSideType
.
VERTICAL
)
{
this
.
content
.
y
=
between
(
this
.
content
.
y
+
40
,
0
,
this
.
getBoundingBox
()
.
height
-
this
.
content
.
height
);
this
.
content
.
y
=
between
(
this
.
content
.
y
+
40
,
0
,
-
rect
.
y
+
rect
.
height
-
this
.
content
.
height
);
}
else
{
}
else
{
this
.
content
.
x
=
between
(
this
.
content
.
x
+
40
,
0
,
this
.
getBoundingBox
()
.
width
-
this
.
content
.
width
);
this
.
content
.
x
=
between
(
this
.
content
.
x
+
40
,
0
,
-
rect
.
x
+
rect
.
width
-
this
.
content
.
width
);
}
}
this
.
refreshScrollBarPos
();
this
.
refreshScrollBarPos
();
...
@@ -2345,10 +2362,13 @@ export class ScrollView extends MySprite {
...
@@ -2345,10 +2362,13 @@ export class ScrollView extends MySprite {
if
(
!
this
.
_scrollBar
.
visible
)
{
if
(
!
this
.
_scrollBar
.
visible
)
{
return
;
return
;
}
}
const
rect
=
this
.
getBoundingBox
();
if
(
this
.
scrollSide
==
ScrollView
.
ScrollSideType
.
VERTICAL
)
{
if
(
this
.
scrollSide
==
ScrollView
.
ScrollSideType
.
VERTICAL
)
{
this
.
content
.
y
=
between
(
this
.
content
.
y
-
40
,
0
,
this
.
getBoundingBox
()
.
height
-
this
.
content
.
height
);
this
.
content
.
y
=
between
(
this
.
content
.
y
-
40
,
0
,
-
rect
.
y
+
rect
.
height
-
this
.
content
.
height
);
}
else
{
}
else
{
this
.
content
.
x
=
between
(
this
.
content
.
x
-
40
,
0
,
this
.
getBoundingBox
()
.
width
-
this
.
content
.
width
);
this
.
content
.
x
=
between
(
this
.
content
.
x
-
40
,
0
,
-
rect
.
x
+
rect
.
width
-
this
.
content
.
width
);
}
}
this
.
refreshScrollBarPos
();
this
.
refreshScrollBarPos
();
...
@@ -2409,5 +2429,6 @@ export function between(a, b, c) {
...
@@ -2409,5 +2429,6 @@ export function between(a, b, c) {
// --------------- custom class --------------------
// --------------- custom class --------------------
src/app/play/play.component.ts
View file @
8fe25eee
...
@@ -21,6 +21,7 @@ import { loadFonts } from './Util'
...
@@ -21,6 +21,7 @@ import { loadFonts } from './Util'
import
{
faTshirt
}
from
'
@fortawesome/free-solid-svg-icons
'
;
import
{
faTshirt
}
from
'
@fortawesome/free-solid-svg-icons
'
;
import
{
DomSanitizer
}
from
'
@angular/platform-browser
'
;
import
{
DomSanitizer
}
from
'
@angular/platform-browser
'
;
import
{
checkAnswer
}
from
'
./checker
'
;
import
{
checkAnswer
}
from
'
./checker
'
;
import
{
HttpClient
}
from
'
@angular/common/http
'
;
...
@@ -133,7 +134,7 @@ export class PlayComponent implements OnInit, OnDestroy {
...
@@ -133,7 +134,7 @@ export class PlayComponent implements OnInit, OnDestroy {
}
}
constructor
(
private
sanitizer
:
DomSanitizer
,
private
appRef
:
ApplicationRef
)
{
constructor
(
private
http
:
HttpClient
,
private
sanitizer
:
DomSanitizer
,
private
appRef
:
ApplicationRef
)
{
}
}
...
@@ -295,6 +296,9 @@ export class PlayComponent implements OnInit, OnDestroy {
...
@@ -295,6 +296,9 @@ export class PlayComponent implements OnInit, OnDestroy {
scrollView
;
scrollView
;
resultSv
;
resultSv
;
userResultPic
;
userResultData
;
uploadUrl
;
initData
()
{
initData
()
{
...
@@ -319,10 +323,13 @@ export class PlayComponent implements OnInit, OnDestroy {
...
@@ -319,10 +323,13 @@ export class PlayComponent implements OnInit, OnDestroy {
// this.mapScale = this.canvasHeight / this.canvasBaseH;
// this.mapScale = this.canvasHeight / this.canvasBaseH;
this
.
renderArr
=
[];
this
.
renderArr
=
[];
this
.
topArr
=
[];
this
.
topArr
=
[];
this
.
userResultPic
=
null
;
this
.
userResultData
=
null
;
console
.
log
(
'
in initData
'
,
this
.
data
);
console
.
log
(
'
in initData
'
,
this
.
data
);
this
.
uploadUrl
=
(
<
any
>
window
).
courseware
.
uploadUrl
();
...
@@ -649,7 +656,8 @@ export class PlayComponent implements OnInit, OnDestroy {
...
@@ -649,7 +656,8 @@ export class PlayComponent implements OnInit, OnDestroy {
this
.
initMaskPic
();
this
.
initMaskPic
();
this
.
relink
();
this
.
relink
();
// this.gameStart();
this
.
gameStart
();
// this.initBtn();
// this.initBtn();
...
@@ -823,7 +831,8 @@ export class PlayComponent implements OnInit, OnDestroy {
...
@@ -823,7 +831,8 @@ export class PlayComponent implements OnInit, OnDestroy {
this
.
setRectRight
(
data
);
this
.
setRectRight
(
data
);
}
else
{
}
else
{
const
resultData
=
this
.
getResultData
();
const
resultData
=
this
.
getResultData
();
this
.
sendResult
(
resultData
);
this
.
userResultData
=
resultData
;
this
.
sendResult
();
this
.
setStoreData
(
'
resultData
'
,
resultData
);
this
.
setStoreData
(
'
resultData
'
,
resultData
);
}
}
...
@@ -932,6 +941,7 @@ export class PlayComponent implements OnInit, OnDestroy {
...
@@ -932,6 +941,7 @@ export class PlayComponent implements OnInit, OnDestroy {
resultSv
.
y
=
-
this
.
resultPanel
.
height
/
2
+
120
;
resultSv
.
y
=
-
this
.
resultPanel
.
height
/
2
+
120
;
resultSv
.
setScrollBarSize
(
20
*
this
.
mapScale
,
5
);
resultSv
.
setScrollBarSize
(
20
*
this
.
mapScale
,
5
);
// resultSv.setContentScale(this.mapScale);
// resultSv.setContentScale(this.mapScale);
this
.
resultPanel
.
addChild
(
resultSv
);
this
.
resultPanel
.
addChild
(
resultSv
);
this
.
resultSv
=
resultSv
;
this
.
resultSv
=
resultSv
;
...
@@ -1046,6 +1056,7 @@ export class PlayComponent implements OnInit, OnDestroy {
...
@@ -1046,6 +1056,7 @@ export class PlayComponent implements OnInit, OnDestroy {
}
}
}
}
...
@@ -1226,21 +1237,21 @@ export class PlayComponent implements OnInit, OnDestroy {
...
@@ -1226,21 +1237,21 @@ export class PlayComponent implements OnInit, OnDestroy {
const
subH
=
row
*
this
.
btnDisH
;
const
subH
=
row
*
this
.
btnDisH
;
const
sv
=
new
ScrollView
();
const
sv
=
new
ScrollView
();
sv
.
setShowSize
(
this
.
panel
.
width
,
900
-
subH
);
//
sv.setShowSize(this.panel.width, 900 - subH);
sv
.
x
=
-
this
.
panel
.
width
/
2
;
//
sv.x = -this.panel.width / 2;
sv
.
y
=
-
395
+
subH
;
//
sv.y = -395 + subH;
sv
.
setBgColor
(
'
#faf7ee
'
)
//
sv.setBgColor('#faf7ee')
// sv.setMapScale(this.mapScale);
//
//
sv.setMapScale(this.mapScale);
// sv.content.setScaleXY(1/this.mapScale);
//
//
sv.content.setScaleXY(1/this.mapScale);
sv
.
setScrollBarSize
(
20
*
this
.
mapScale
,
5
)
//
sv.setScrollBarSize(20 * this.mapScale, 5)
// this.renderArr.push(sv);
//
//
this.renderArr.push(sv);
// sv.setScaleXY(this.mapScale);
//
//
sv.setScaleXY(this.mapScale);
// sv.x = 0;
//
//
sv.x = 0;
// sv.y = 200;
//
//
sv.y = 200;
sv
.
setContentScale
(
this
.
mapScale
);
//
sv.setContentScale(this.mapScale);
this
.
panel
.
addChild
(
sv
);
//
this.panel.addChild(sv);
this
.
scrollView
=
sv
;
//
this.scrollView = sv;
...
@@ -1527,6 +1538,7 @@ export class PlayComponent implements OnInit, OnDestroy {
...
@@ -1527,6 +1538,7 @@ export class PlayComponent implements OnInit, OnDestroy {
sv
.
setBgColor
(
'
#ffffff
'
)
sv
.
setBgColor
(
'
#ffffff
'
)
sv
.
setScrollBarSize
(
20
*
this
.
mapScale
,
5
)
sv
.
setScrollBarSize
(
20
*
this
.
mapScale
,
5
)
// sv.refreshContentSize();
// sv.setContentScale(this.mapScale);
// sv.setContentScale(this.mapScale);
this
.
renderArr
.
push
(
sv
);
this
.
renderArr
.
push
(
sv
);
...
@@ -1578,6 +1590,8 @@ export class PlayComponent implements OnInit, OnDestroy {
...
@@ -1578,6 +1590,8 @@ export class PlayComponent implements OnInit, OnDestroy {
okBtnClick
()
{
okBtnClick
()
{
this
.
convertCanvasToImage
();
this
.
checkPanel
.
visible
=
false
;
this
.
checkPanel
.
visible
=
false
;
this
.
initResultView
();
this
.
initResultView
();
}
}
...
@@ -1668,8 +1682,6 @@ export class PlayComponent implements OnInit, OnDestroy {
...
@@ -1668,8 +1682,6 @@ export class PlayComponent implements OnInit, OnDestroy {
}
}
}
}
console
.
log
(
'
aaaa 6
'
)
...
@@ -1997,6 +2009,7 @@ export class PlayComponent implements OnInit, OnDestroy {
...
@@ -1997,6 +2009,7 @@ export class PlayComponent implements OnInit, OnDestroy {
// this.submitCount ++;
// this.submitCount ++;
const
btnBaseY
=
this
.
submitBtn
.
y
;
const
btnBaseY
=
this
.
submitBtn
.
y
;
const
btnTargetY
=
btnBaseY
+
5
*
this
.
mapScale
;
const
btnTargetY
=
btnBaseY
+
5
*
this
.
mapScale
;
...
@@ -2072,13 +2085,17 @@ export class PlayComponent implements OnInit, OnDestroy {
...
@@ -2072,13 +2085,17 @@ export class PlayComponent implements OnInit, OnDestroy {
}
}
sendResult
(
data
)
{
sendResult
()
{
if
(
this
.
userResultPic
&&
this
.
userResultData
)
{
const
sendResult
=
(
<
any
>
window
).
courseware
.
sendResult
;
if
(
sendResult
)
{
sendResult
({
resultData
:
this
.
userResultData
,
resultPic
:
this
.
userResultPic
});
}
}
// const sendResult = (<any>window).courseware.sendResult;
// sendResult(data);
}
}
...
@@ -3067,6 +3084,8 @@ export class PlayComponent implements OnInit, OnDestroy {
...
@@ -3067,6 +3084,8 @@ export class PlayComponent implements OnInit, OnDestroy {
const
p
=
this
.
preload
(
value
)
const
p
=
this
.
preload
(
value
)
.
then
(
img
=>
{
.
then
(
img
=>
{
img
[
'
setAttribute
'
](
"
crossOrigin
"
,
'
Anonymous
'
)
this
.
images
.
set
(
key
,
img
);
this
.
images
.
set
(
key
,
img
);
})
})
.
catch
(
err
=>
console
.
log
(
err
));
.
catch
(
err
=>
console
.
log
(
err
));
...
@@ -3220,4 +3239,72 @@ export class PlayComponent implements OnInit, OnDestroy {
...
@@ -3220,4 +3239,72 @@ export class PlayComponent implements OnInit, OnDestroy {
return
len
;
return
len
;
}
}
b64ToUint8Array
(
b64Image
)
{
var
img
=
atob
(
b64Image
.
split
(
'
,
'
)[
1
]);
var
img_buffer
=
[];
var
i
=
0
;
while
(
i
<
img
.
length
)
{
img_buffer
.
push
(
img
.
charCodeAt
(
i
));
i
++
;
}
return
new
Uint8Array
(
img_buffer
);
}
convertCanvasToImage
()
{
console
.
log
(
'
1
'
);
console
.
log
(
'
2 uploadUrl:
'
,
this
.
uploadUrl
.
toString
());
const
src
=
this
.
canvas
.
nativeElement
.
toDataURL
(
"
image/png
"
);
const
arr
=
src
.
split
(
'
,
'
),
mime
=
arr
[
0
].
match
(
/:
(
.*
?)
;/
)[
1
],
bstr
=
atob
(
arr
[
1
]);
let
n
=
bstr
.
length
;
const
u8arr
=
new
Uint8Array
(
n
);
while
(
n
--
)
{
u8arr
[
n
]
=
bstr
.
charCodeAt
(
n
);
}
const
obj
=
new
Blob
([
u8arr
],
{
type
:
mime
});
const
fd
=
new
FormData
();
fd
.
append
(
"
file
"
,
obj
,
"
cw_cover.png
"
);
// 上传截图
this
.
http
.
post
(
this
.
uploadUrl
,
fd
).
subscribe
((
res
)
=>
{
// 存储服务器的截图url
if
(
res
[
'
url
'
])
{
console
.
log
(
'
res url:
'
,
res
[
'
url
'
]);
this
.
userResultPic
=
res
[
'
url
'
];
this
.
sendResult
();
}
});
}
httpServer
(
type
,
url
,
options
,
cb
)
{
this
.
http
[
type
](
url
,
options
)
.
subscribe
(
val
=>
{
console
.
log
(
"
Post call successful value returned in body
"
,
val
);
cb
(
val
);
},
error
=>
{
console
.
log
(
"
Post call in error
"
,
error
);
cb
(
error
);
},
()
=>
{
console
.
log
(
"
The Post observable is now completed.
"
);
cb
(
null
);
}
);
}
}
}
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment