Commit fda77d27 authored by 邵世尧's avatar 邵世尧

提交

parent d381f1ce
<div class="model-content">
<div style="position: absolute;left: 100px;top:20px;width: 500px;">
<nz-radio-group [(ngModel)]="side">
<label nz-radio nzValue="A"(click)="sideB()">默认背面</label>
<label nz-radio nzValue="B"(click)="sideA()">默认正面</label>
<nz-radio-group [(ngModel)]="side" (ngModelChange)="sidec()">
<label nz-radio nzValue="A">默认背面</label>
<label nz-radio nzValue="B">默认正面</label>
</nz-radio-group>
<div *ngFor="let it of picArr; let i = index" class="card-item" style="padding: 0.5vw;">
......@@ -27,7 +27,7 @@
<div *ngIf="it.optionTypeA == 'A'" style="width: 60%">
<input style="width: 80%; margin-bottom: 0.5vw" type="text" nz-input placeholder="" [(ngModel)]="it.title" (blur)="saveItem()">
<input style="width: 80%; margin-bottom: 0.5vw" type="text" nz-input placeholder="" [(ngModel)]="it.title" (blur)="save()">
</div>
......
import {Component, EventEmitter, Input, OnDestroy, OnChanges, OnInit, Output, ApplicationRef, ChangeDetectorRef} from '@angular/core';
import {Component, EventEmitter, Input, OnDestroy, OnChanges, OnInit, Output, ApplicationRef, ChangeDetectorRef, ViewChild, ElementRef} from '@angular/core';
import { NzMessageService } from 'ng-zorro-antd';
......@@ -8,194 +9,162 @@ import {Component, EventEmitter, Input, OnDestroy, OnChanges, OnInit, Output, Ap
styleUrls: ['./form.component.css']
})
export class FormComponent implements OnInit, OnChanges, OnDestroy {
// @Input()
item;
@ViewChild('videoContainer')
videoContainer: ElementRef;
@ViewChild('videoNode')
videoNode: ElementRef;
@Output()
update = new EventEmitter();
picArr = [];
_item: any;
saveKey = 'ssy003';
radioValue;
intervalId;
picArr;
side
saveKey = 'ssy003';
// @Input()
set item(item) {
this._item = item;
// this.init();
}
get item() {
return this._item;
}
@Output()
update = new EventEmitter();
constructor(private nzMessageService: NzMessageService,
private appRef: ApplicationRef,
public changeDetectorRef: ChangeDetectorRef) {
}
ngOnChanges() {
constructor(private appRef: ApplicationRef,private changeDetectorRef: ChangeDetectorRef) {
}
ngOnInit() {
this.item = {};
this.item.contentObj = {};
const getData = (<any> window).courseware.getData;
getData((data) => {
if (data) {
this.item = data;
} else {
this.item = {};
}
if ( !this.item.contentObj ) {
this.item.contentObj = {};
}
if(this.item.sideA==1){
this.side='B';
}
else if(this.item.sideB==1){
this.side='A';
}
console.log('~data:', data);
this.init();
this.changeDetectorRef.markForCheck();
this.changeDetectorRef.detectChanges();
this.refresh();
this.initDefaultData();
// this.initDefaultData();
console.log('data:', data);
this.init();
this.changeDetectorRef.markForCheck();
this.changeDetectorRef.detectChanges();
this.refresh();
}, this.saveKey);
// this.initData();
}
ngOnChanges() {
}
ngOnDestroy() {
}
sidec(){
if(this.side=="A"){
this.item.sideA=0;
this.item.sideB=1;
init() {
if (this.item.contentObj.picArr) {
this.picArr = this.item.contentObj.picArr;
} else {
this.picArr = this.getDefaultPicArr();
this.item.contentObj.picArr = this.picArr;
}
if(this.side=="B"){
this.item.sideA=1;
this.item.sideB=0;
}
this.save();
}
console.log('item:' , this.item);
// this.picArr = this.getDefaultPicArr();
// this.item.contentObj.picArr = this.picArr;
// console.log('this.item:;', this.picArr);
initDefaultData() {
}
cardItemData(){
return {
title: "",
pic_url: "",
audio_url: ""
const picArr = this.item.contentObj.picArr;
if (!picArr) {
};
const picArr = [];
for (let i = 0; i < 6; i ++) {
picArr.push({
pic_url: '',
audio_url: '',
title:'',
sideA:'',
sideB:''
});
}
sideA(){
this.item.sideA=1;
this.item.sideB=0;
this.picArr=[];
this.item.contentObj.picArr = this.picArr;
for(let i=0;i<6;i++){
let item = this.cardItemData();
this.picArr.push(item);
this.item.contentObj.picArr = picArr;
}
this.saveItem();
}
sideB(){
this.item.sideB=1;
this.item.sideA=0;
this.picArr=[];
this.item.contentObj.picArr = this.picArr;
for(let i=0;i<6;i++){
let item = this.cardItemData();
this.picArr.push(item);
}
this.saveItem();
console.log('init~data:', this.picArr);
}
getDefaultPicArr() {
let arr = [];
return arr;
ngOnDestroy() {
console.log('in ngOnDestory');
}
init() {
this.picArr = this.item.contentObj.picArr || [];
addItem6() {
this.picArr=[];
this.item.contentObj.picArr = this.picArr;
for(let i=0;i<6;i++){
let item = this.cardItemData();
this.picArr.push(item);
}
this.saveItem();
console.log('init~data:', this.picArr);
}
onImageUploadSuccessByItem(e, item) {
onImageUploadSuccessByItem(e, item, id = null) {
if (id != null) {
item[id + '_pic_url'] = e.url;
} else {
item.pic_url = e.url;
this.save();
}
onAudioUploadSuccessByItem(e, item) {
item.audio_url = e.url;
this.save();
}
radioClick(it, radioValue) {
it.radioValue = radioValue;
// this.update.emit(this.item);
this.saveItem();
// console.log('this.item: ', this.item);
}
clickCheckBox() {
console.log(' in clickCheckBox');
this.saveItem();
}
saveItem() {
onAudioUploadSuccessByItem(e, item, id = null) {
console.log(' in saveItem');
if (id != null) {
item[id + '_audio_url'] = e.url;
} else {
item.audio_url = e.url;
}
// this.update.emit(this.item);
this.save();
}
save() {
(<any> window).courseware.setData(this.item, null, this.saveKey);
console.log('side'+this.item);
this.refresh();
}
......@@ -203,8 +172,7 @@ export class FormComponent implements OnInit, OnChanges, OnDestroy {
setTimeout(() => {
this.appRef.tick();
}, 1);
console.log("===========================================================================================");
}
}
......@@ -28,7 +28,6 @@ export class PlayComponent implements OnInit, OnDestroy {
// 数据
data;
ctx;
canvasWidth = 1280; // canvas实际宽度
......@@ -60,14 +59,11 @@ export class PlayComponent implements OnInit, OnDestroy {
saveKey = 'ssy003';
picIndex = 0;
cardArr = [];
picArr
canTouch = true;
canTouch =true;
curPic;
......@@ -130,9 +126,8 @@ export class PlayComponent implements OnInit, OnDestroy {
this.initCtx();
this.initData();
// this.randomItemCard();
this.initView();
console.log("qqqqqqqqqqqqqqqqqq");
}
......@@ -577,6 +572,8 @@ initImg() {
/**
* 初始化数据
*/
......@@ -629,9 +626,9 @@ initImg() {
//声明骰子
this.stouzi();
//骰子呼吸动画
}
}
a
a
big(){
const tween=tweenChange(this.tz, {scaleX: 1.1, scaleY: 1.1}, 1 , ()=>{
......@@ -667,9 +664,12 @@ stouzi(){
this.t.init(this.images.get("t1"));
this.startBorder.addChild(this.tz);
// this.startBorder.addChild(this.tz);
this.tz.setScaleXY(this.mapScale/1.2);
this.tz.y=-50;
this.tz.y=this.canvasHeight/2.5;
this.tz.x=this.canvasWidth/2;
this.renderArr.push(this.tz);
}
......@@ -690,12 +690,15 @@ startBtn(){
this.Btn.addChild(this.stn);
this.Btn.addChild(this.retn);
this.startBorder.addChild(this.Btn);
// this.startBorder.addChild(this.Btn);
this.stn.visible=true;
this.retn.visible=false;
this.Btn.setScaleXY(this.mapScale/1.5);
this.b=0;
this.Btn.y=200;
this.Btn.y=this.canvasHeight/1.2;
this.Btn.x=this.canvasWidth/2;
this.renderArr.push(this.Btn);
......@@ -779,52 +782,34 @@ getPetal() {
bg
startBorder
bgLayer
initBg() {
this.bgLayer = new MySprite();
this.renderArr.push(this.bgLayer);
const bg = new ShapeRect();
bg.fillColor = '#75d100';
bg.setSize(this.canvasWidth, this.canvasHeight);
this.renderArr.push(bg);
this.bg = bg;
//把图片填充入背景,全覆盖
this.startBorder = new MySprite();
this.startBorder.init(this.images.get('BG'));
this.startBorder.x = this.canvasWidth / 2 ;
this.startBorder.y = this.canvasHeight / 2 ;
const sx = this.canvasWidth / this.startBorder.width;
const sy = this.canvasHeight / this.startBorder.height;
const s=Math.max(sx,sy);
console.log(s+"s");
this.startBorder.setScaleXY(s);
this.renderArr.push(this.startBorder);
}
count=0;
active=1;
last
count=0;
active=1;
last
mapDown(event) {
if (!this.canTouch) {
return;
}
//点击按钮,骰子竖直跳下来,卡片弹出来
//点击开始按钮,骰子竖直跳下来,卡片弹出来
if (this.checkClickTarget(this.stn)&&(this.b==0)) {
this.canTouch=false;
this.big();
this.startGame();
setTimeout(() => {
this.canTouch=true;
}, 1600);
return;
}
//点击重新开始按钮
if (this.checkClickTarget(this.retn)&&(this.b==1)) {
console.log("bbbbb"+this.b);
this.canTouch = false;
this.canTouch=false;
for(let i=0;i<this.cardArr.length;i++){
tweenChange(this.cardArr[i], {scaleX: 0, scaleY: 0}, 0.3, ()=>{
});
......@@ -834,26 +819,35 @@ last
this.tz.setScaleXY(this.mapScale/1.5);
this.tz.y=-50;
// this.big();
this.startGame();
setTimeout(() => {
this.canTouch=true;
}, 1600);
}
//点击骰子,随机选卡]
if (this.checkClickTarget( this.t)) {
this.canTouch=false;
console.log(this.canTouch+"-----00000000000");
this.a.stop();
this.w.stop();
this.canTouch = false;
console.log(this.canTouch+"-----0000000000011111111");
this.starttouzi();
setTimeout(() => {
this.canTouch=true;
}, 1900);
return;
......@@ -918,16 +912,17 @@ last
this.canTouch = false;
this.tAnimation();
if(this.count!=1){
hideItem(this.faguang[this.last]);
hideItem(this.faguang[this.last]);
}
if(this.count==6){
this.canTouch = false;
this.count=0;
setTimeout(() => {
//骰子消失
console.log("消失骰子数"+this.t);
// hideItem(this.tz);
......@@ -942,7 +937,7 @@ last
});
}, 180);
}, 1800);
}, 1300);
}
......@@ -951,14 +946,14 @@ last
b
btnIn1(item){
this.playAudio("sm-in");
tweenChange(item, {y: 200}, .3);
tweenChange(item, {y: this.canvasHeight-100*this.mapScale}, .3);
}
btnOut(item){
this.playAudio("sm-out");
let out = this.canvasWidth+200*this.mapScale;
tweenChange(item, {y: out}, 3);
}
//开始游戏
//开始游戏
startGame(){
this.canTouch = false;
this.playAudio("start");
......@@ -978,10 +973,12 @@ last
//卡片弹出来
setTimeout(() => {
this.initCard();
}, 180);
//骰子掉下来
setTimeout(() => {
this.touzi();
}, 300);
}
......@@ -1005,14 +1002,14 @@ last
this.randomt = this.newball[0];
this.playAudio("touzi");
this.canTouch = false;
console.log("this.a"+this.a);
console.log(this.t[this.randomt]+"kongmei22222222");
const animation=new MyAnimation();
for(let j=0;j<2;j++){
for(let i=0;i<6;i++){
......@@ -1036,7 +1033,8 @@ last
this.bs[ this.randomt]=1;
}
animation.stop();
console.log("---------"+this.randomt);
let x=3;
// this.t.init(this.images.get("t"+x));
this.t.init(this.images.get("t"+(this.randomt+1)));
......@@ -1057,9 +1055,6 @@ last
rect.y=this.cardArr[this.randomt].y-140;
rect.width=250;
rect.height=250;
console.log("rect"+rect.width);
console.log("cardx"+this.cardArr[this.randomt].x);
console.log("cardy"+this.cardArr[this.randomt].y);
showBlingBling(this.images.get('ss'), rect, this.bgLayer, this.mapScale*1.5, 1, 0.05, 1.5);
});
......@@ -1069,6 +1064,7 @@ last
this.a.start();
this.w.start();
};
......@@ -1081,8 +1077,8 @@ last
ss4
oldball
newball
oldball
newball
randomtz(){
this.oldball=[0,1,2,3,4,5];
this.oldball=randomSortByArr(this.oldball);
......@@ -1108,48 +1104,39 @@ newball
const picLength = this.cardArr.length;
const top = (120)*this.mapScale;//第一排
const top2 = (212+160)*this.mapScale;//第二排
const top = (120)*this.mapScale;//卡片第一排距离头顶的距离
const top2 = (212+160)*this.mapScale;//卡片第二排距离头顶的距离
const allWidth = ((picLength/2)*280+(picLength/2-1)*80)*this.mapScale;
const allWidth = ((picLength/2)*280+(picLength/2-1)*80)*this.mapScale;//卡片总宽
const drawItem = (index)=>{
//设置卡片间距
let itemBack = this.cardArr[index];
itemBack.x = (this.canvasWidth-allWidth)/2+((Math.floor(index/2)*(253+55))+200)*this.mapScale;
if(index%2==0){
if(index<3){
itemBack.y = top;
itemBack.x = (this.canvasWidth-allWidth)/2+(((index)*(253+55))+200)*this.mapScale;//剩余的宽加
}else{
itemBack.y = top2;
}
itemBack.setScaleXY(this.mapScale);
this.renderArr.push(itemBack);
itemBack.x = (this.canvasWidth-allWidth)/2+(((index-3)*(253+55))+200)*this.mapScale;//剩余的宽加
};
const drawItem2 = (index)=>{
let itemBack = this.cardArr[index];
//itemBack.x = ((this.canvasWidth-allWidth)/2)*this.mapScale;
if(index%2==0){
itemBack.x = top*2+100;
}else{
itemBack.x = top2*2-170;
}
itemBack.y = top*2-30;
}
itemBack.setScaleXY(this.mapScale);
this.renderArr.push(itemBack);
};
if(picLength==2){
for(let i=0;i<picLength;i++){
drawItem2(i);
}
}else{
for(let i=0;i<picLength;i++){
for(let i=0;i<6;i++){
drawItem(i);
}
}
}
......@@ -1191,10 +1178,10 @@ newball
});
}
q
front=[]
back=[]
bs=[];
faguang=[]
front=[]
back=[]
bs=[];
faguang=[]
randomItemCard(){
this.cardArr = [];
......@@ -1318,6 +1305,33 @@ faguang=[]
this.front[3].init(this.images.get("front2"));
this.front[2].init(this.images.get("front2"));
}
initBg() {
this.bgLayer = new MySprite();
this.renderArr.push(this.bgLayer);
const bg = new ShapeRect();
bg.fillColor = '#75d100';
bg.setSize(this.canvasWidth, this.canvasHeight);
this.renderArr.push(bg);
this.bg = bg;
//把图片填充入背景,全覆盖
this.startBorder = new MySprite();
this.startBorder.init(this.images.get('BG'));
this.startBorder.x = this.canvasWidth / 2 ;
this.startBorder.y = this.canvasHeight / 2 ;
const sx = this.canvasWidth / this.startBorder.width;
const sy = this.canvasHeight / this.startBorder.height;
const s=Math.max(sx,sy);
console.log(s+"s");
this.startBorder.setScaleXY(s);
this.renderArr.push(this.startBorder);
}
mapMove(event) {
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment