add page 1,2,3
@ -38,7 +38,8 @@ module.exports = {
|
||||
'vue/eqeqeq': 'error',
|
||||
'vue/key-spacing': 'error',
|
||||
'vue/match-component-file-name': 'error',
|
||||
'vue/object-curly-spacing': 'error'
|
||||
'vue/object-curly-spacing': 'error',
|
||||
'@typescript-eslint/no-this-alias': ['off']
|
||||
},
|
||||
overrides: [
|
||||
{
|
||||
|
@ -1,34 +0,0 @@
|
||||
module.exports = {
|
||||
"plugins": {
|
||||
"postcss-import": {},
|
||||
"postcss-url": {},
|
||||
// to edit target browsers: use "browserslist" field in package.json
|
||||
// "autoprefixer": {},
|
||||
"postcss-aspect-ratio-mini": {},
|
||||
"postcss-write-svg": {
|
||||
utf8: false
|
||||
},
|
||||
"postcss-cssnext": {},
|
||||
"postcss-px-to-viewport": {
|
||||
// 视窗的宽度,对应的是我们设计稿的宽度,移动端一般是750,如果是pc端那就是类似1920这样的尺寸
|
||||
viewportWidth: 1920,
|
||||
viewportHeight: 1080, // 视窗的高度,也可以不配置
|
||||
unitPrecision: 3, // 指定`px`转换为视窗单位值的小数位数(很多时候无法整除)
|
||||
viewportUnit: "vw", // 指定需要转换成的视窗单位,建议使用vw
|
||||
// 过滤掉不转换为视窗单位的class类名,可以自定义,可以无限添加,建议定义一至两个通用的类名
|
||||
selectorBlackList: [".ignore", ".hairlines"],
|
||||
minPixelValue: 1, // 小于或等于`1px`不转换为视窗单位,你也可以设置为你想要的值
|
||||
mediaQuery: false // 允许在媒体查询中转换`px`
|
||||
},
|
||||
"postcss-viewport-units": {
|
||||
filterRule: rule => rule.selector.indexOf("::after") === -1 &&
|
||||
rule.selector.indexOf("::before") === -1 &&
|
||||
rule.selector.indexOf(":after") === -1 &&
|
||||
rule.selector.indexOf(":before") === -1
|
||||
},
|
||||
"cssnano": {
|
||||
preset: "default", // 设置成default将不会启用autoprefixer
|
||||
"postcss-zindex": false
|
||||
}
|
||||
}
|
||||
};
|
100
package-lock.json
generated
@ -1485,7 +1485,7 @@
|
||||
},
|
||||
"@types/parse-json": {
|
||||
"version": "4.0.0",
|
||||
"resolved": "https://registry.npmmirror.com/@types/parse-json/download/@types/parse-json-4.0.0.tgz?cache=0&sync_timestamp=1637269948744&other_urls=https%3A%2F%2Fregistry.npmmirror.com%2F%40types%2Fparse-json%2Fdownload%2F%40types%2Fparse-json-4.0.0.tgz",
|
||||
"resolved": "https://registry.npmmirror.com/@types/parse-json/download/@types/parse-json-4.0.0.tgz?cache=0&sync_timestamp=1637284065529&other_urls=https%3A%2F%2Fregistry.npmmirror.com%2F%40types%2Fparse-json%2Fdownload%2F%40types%2Fparse-json-4.0.0.tgz",
|
||||
"integrity": "sha1-L4u0QUNNFjs1+4/9zNcTiSf/uMA=",
|
||||
"dev": true,
|
||||
"optional": true
|
||||
@ -2889,7 +2889,7 @@
|
||||
},
|
||||
"at-least-node": {
|
||||
"version": "1.0.0",
|
||||
"resolved": "https://registry.npm.taobao.org/at-least-node/download/at-least-node-1.0.0.tgz",
|
||||
"resolved": "https://registry.npmmirror.com/at-least-node/download/at-least-node-1.0.0.tgz",
|
||||
"integrity": "sha1-YCzUtG6EStTv/JKoARo8RuAjjcI=",
|
||||
"dev": true,
|
||||
"optional": true
|
||||
@ -4375,7 +4375,7 @@
|
||||
},
|
||||
"cosmiconfig": {
|
||||
"version": "6.0.0",
|
||||
"resolved": "https://registry.nlark.com/cosmiconfig/download/cosmiconfig-6.0.0.tgz?cache=0&sync_timestamp=1629586206512&other_urls=https%3A%2F%2Fregistry.nlark.com%2Fcosmiconfig%2Fdownload%2Fcosmiconfig-6.0.0.tgz",
|
||||
"resolved": "https://registry.npmmirror.com/cosmiconfig/download/cosmiconfig-6.0.0.tgz",
|
||||
"integrity": "sha1-2k/uhTxS9rHmk19BwaL8UL1KmYI=",
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
@ -4389,7 +4389,7 @@
|
||||
"dependencies": {
|
||||
"path-type": {
|
||||
"version": "4.0.0",
|
||||
"resolved": "https://registry.npm.taobao.org/path-type/download/path-type-4.0.0.tgz",
|
||||
"resolved": "https://registry.npmmirror.com/path-type/download/path-type-4.0.0.tgz",
|
||||
"integrity": "sha1-hO0BwKe6OAr+CdkKjBgNzZ0DBDs=",
|
||||
"dev": true,
|
||||
"optional": true
|
||||
@ -4797,7 +4797,7 @@
|
||||
},
|
||||
"deepmerge": {
|
||||
"version": "4.2.2",
|
||||
"resolved": "https://registry.npm.taobao.org/deepmerge/download/deepmerge-4.2.2.tgz",
|
||||
"resolved": "https://registry.npmmirror.com/deepmerge/download/deepmerge-4.2.2.tgz",
|
||||
"integrity": "sha1-RNLqNnm49NT/ujPwPYZfwee/SVU=",
|
||||
"dev": true,
|
||||
"optional": true
|
||||
@ -6004,15 +6004,15 @@
|
||||
"dev": true
|
||||
},
|
||||
"eslint-plugin-vue": {
|
||||
"version": "7.20.0",
|
||||
"resolved": "https://registry.npmmirror.com/eslint-plugin-vue/download/eslint-plugin-vue-7.20.0.tgz",
|
||||
"integrity": "sha1-mMIYhaa/3wcTw6kpV6Wv6q7tklM=",
|
||||
"version": "7.0.0-beta.4",
|
||||
"resolved": "https://registry.npmmirror.com/eslint-plugin-vue/download/eslint-plugin-vue-7.0.0-beta.4.tgz",
|
||||
"integrity": "sha1-qhO5RnAsTeG498NGdpgYV3WxH9s=",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"eslint-utils": "^2.1.0",
|
||||
"natural-compare": "^1.4.0",
|
||||
"semver": "^6.3.0",
|
||||
"vue-eslint-parser": "^7.10.0"
|
||||
"semver": "^7.3.2",
|
||||
"vue-eslint-parser": "^7.1.0"
|
||||
},
|
||||
"dependencies": {
|
||||
"eslint-utils": {
|
||||
@ -6029,6 +6029,30 @@
|
||||
"resolved": "https://registry.npmmirror.com/eslint-visitor-keys/download/eslint-visitor-keys-1.3.0.tgz?cache=0&sync_timestamp=1636378502272&other_urls=https%3A%2F%2Fregistry.npmmirror.com%2Feslint-visitor-keys%2Fdownload%2Feslint-visitor-keys-1.3.0.tgz",
|
||||
"integrity": "sha1-MOvR73wv3/AcOk8VEESvJfqwUj4=",
|
||||
"dev": true
|
||||
},
|
||||
"lru-cache": {
|
||||
"version": "6.0.0",
|
||||
"resolved": "https://registry.npmmirror.com/lru-cache/download/lru-cache-6.0.0.tgz",
|
||||
"integrity": "sha1-bW/mVw69lqr5D8rR2vo7JWbbOpQ=",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"yallist": "^4.0.0"
|
||||
}
|
||||
},
|
||||
"semver": {
|
||||
"version": "7.3.5",
|
||||
"resolved": "https://registry.npmmirror.com/semver/download/semver-7.3.5.tgz?cache=0&sync_timestamp=1632475048843&other_urls=https%3A%2F%2Fregistry.npmmirror.com%2Fsemver%2Fdownload%2Fsemver-7.3.5.tgz",
|
||||
"integrity": "sha1-C2Ich5NI2JmOSw5L6Us/EuYBjvc=",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"lru-cache": "^6.0.0"
|
||||
}
|
||||
},
|
||||
"yallist": {
|
||||
"version": "4.0.0",
|
||||
"resolved": "https://registry.npmmirror.com/yallist/download/yallist-4.0.0.tgz",
|
||||
"integrity": "sha1-m7knkNnA7/7GO+c1GeEaNQGaOnI=",
|
||||
"dev": true
|
||||
}
|
||||
}
|
||||
},
|
||||
@ -6721,7 +6745,7 @@
|
||||
"dependencies": {
|
||||
"ansi-styles": {
|
||||
"version": "4.3.0",
|
||||
"resolved": "https://registry.nlark.com/ansi-styles/download/ansi-styles-4.3.0.tgz?cache=0&sync_timestamp=1618995651629&other_urls=https%3A%2F%2Fregistry.nlark.com%2Fansi-styles%2Fdownload%2Fansi-styles-4.3.0.tgz",
|
||||
"resolved": "https://registry.npmmirror.com/ansi-styles/download/ansi-styles-4.3.0.tgz",
|
||||
"integrity": "sha1-7dgDYornHATIWuegkG7a00tkiTc=",
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
@ -6752,21 +6776,21 @@
|
||||
},
|
||||
"color-name": {
|
||||
"version": "1.1.4",
|
||||
"resolved": "http://registry.npm.taobao.org/color-name/download/color-name-1.1.4.tgz",
|
||||
"resolved": "https://registry.npmmirror.com/color-name/download/color-name-1.1.4.tgz",
|
||||
"integrity": "sha1-wqCah6y95pVD3m9j+jmVyCbFNqI=",
|
||||
"dev": true,
|
||||
"optional": true
|
||||
},
|
||||
"has-flag": {
|
||||
"version": "4.0.0",
|
||||
"resolved": "https://registry.nlark.com/has-flag/download/has-flag-4.0.0.tgz",
|
||||
"resolved": "https://registry.npmmirror.com/has-flag/download/has-flag-4.0.0.tgz",
|
||||
"integrity": "sha1-lEdx/ZyByBJlxNaUGGDaBrtZR5s=",
|
||||
"dev": true,
|
||||
"optional": true
|
||||
},
|
||||
"lru-cache": {
|
||||
"version": "6.0.0",
|
||||
"resolved": "https://registry.npm.taobao.org/lru-cache/download/lru-cache-6.0.0.tgz",
|
||||
"resolved": "https://registry.npmmirror.com/lru-cache/download/lru-cache-6.0.0.tgz",
|
||||
"integrity": "sha1-bW/mVw69lqr5D8rR2vo7JWbbOpQ=",
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
@ -6776,7 +6800,7 @@
|
||||
},
|
||||
"schema-utils": {
|
||||
"version": "2.7.0",
|
||||
"resolved": "https://registry.npmmirror.com/schema-utils/download/schema-utils-2.7.0.tgz?cache=0&sync_timestamp=1637075905726&other_urls=https%3A%2F%2Fregistry.npmmirror.com%2Fschema-utils%2Fdownload%2Fschema-utils-2.7.0.tgz",
|
||||
"resolved": "https://registry.npmmirror.com/schema-utils/download/schema-utils-2.7.0.tgz?cache=0&sync_timestamp=1637076384813&other_urls=https%3A%2F%2Fregistry.npmmirror.com%2Fschema-utils%2Fdownload%2Fschema-utils-2.7.0.tgz",
|
||||
"integrity": "sha1-FxUfdtjq5n+793lgwzxnatn078c=",
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
@ -6788,7 +6812,7 @@
|
||||
},
|
||||
"semver": {
|
||||
"version": "7.3.5",
|
||||
"resolved": "https://registry.npm.taobao.org/semver/download/semver-7.3.5.tgz?cache=0&sync_timestamp=1616463608061&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fsemver%2Fdownload%2Fsemver-7.3.5.tgz",
|
||||
"resolved": "https://registry.npmmirror.com/semver/download/semver-7.3.5.tgz?cache=0&sync_timestamp=1632475048843&other_urls=https%3A%2F%2Fregistry.npmmirror.com%2Fsemver%2Fdownload%2Fsemver-7.3.5.tgz",
|
||||
"integrity": "sha1-C2Ich5NI2JmOSw5L6Us/EuYBjvc=",
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
@ -6808,7 +6832,7 @@
|
||||
},
|
||||
"yallist": {
|
||||
"version": "4.0.0",
|
||||
"resolved": "https://registry.npm.taobao.org/yallist/download/yallist-4.0.0.tgz",
|
||||
"resolved": "https://registry.npmmirror.com/yallist/download/yallist-4.0.0.tgz",
|
||||
"integrity": "sha1-m7knkNnA7/7GO+c1GeEaNQGaOnI=",
|
||||
"dev": true,
|
||||
"optional": true
|
||||
@ -6859,7 +6883,7 @@
|
||||
},
|
||||
"fs-extra": {
|
||||
"version": "9.1.0",
|
||||
"resolved": "https://registry.nlark.com/fs-extra/download/fs-extra-9.1.0.tgz",
|
||||
"resolved": "https://registry.npmmirror.com/fs-extra/download/fs-extra-9.1.0.tgz?cache=0&sync_timestamp=1632739240201&other_urls=https%3A%2F%2Fregistry.npmmirror.com%2Ffs-extra%2Fdownload%2Ffs-extra-9.1.0.tgz",
|
||||
"integrity": "sha1-WVRGDHZKjaIJS6NVS/g55rmnyG0=",
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
@ -6872,7 +6896,7 @@
|
||||
},
|
||||
"fs-monkey": {
|
||||
"version": "1.0.3",
|
||||
"resolved": "https://registry.npm.taobao.org/fs-monkey/download/fs-monkey-1.0.3.tgz?cache=0&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Ffs-monkey%2Fdownload%2Ffs-monkey-1.0.3.tgz",
|
||||
"resolved": "https://registry.npmmirror.com/fs-monkey/download/fs-monkey-1.0.3.tgz",
|
||||
"integrity": "sha1-rjrJLVO7Mo7+DpodlUH2rY1I4tM=",
|
||||
"dev": true,
|
||||
"optional": true
|
||||
@ -8258,7 +8282,7 @@
|
||||
},
|
||||
"is-resolvable": {
|
||||
"version": "1.1.0",
|
||||
"resolved": "http://registry.npm.taobao.org/is-resolvable/download/is-resolvable-1.1.0.tgz",
|
||||
"resolved": "https://registry.npmmirror.com/is-resolvable/download/is-resolvable-1.1.0.tgz",
|
||||
"integrity": "sha1-+xj4fOH+uSUWnJpAfBkxijIG7Yg=",
|
||||
"dev": true
|
||||
},
|
||||
@ -8462,7 +8486,7 @@
|
||||
},
|
||||
"jsonfile": {
|
||||
"version": "6.1.0",
|
||||
"resolved": "https://registry.npm.taobao.org/jsonfile/download/jsonfile-6.1.0.tgz?cache=0&sync_timestamp=1604161917513&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fjsonfile%2Fdownload%2Fjsonfile-6.1.0.tgz",
|
||||
"resolved": "https://registry.npmmirror.com/jsonfile/download/jsonfile-6.1.0.tgz",
|
||||
"integrity": "sha1-vFWyY0eTxnnsZAMJTrE2mKbsCq4=",
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
@ -8524,11 +8548,6 @@
|
||||
"type-check": "~0.4.0"
|
||||
}
|
||||
},
|
||||
"lib-flexible": {
|
||||
"version": "0.3.2",
|
||||
"resolved": "https://registry.npmmirror.com/lib-flexible/download/lib-flexible-0.3.2.tgz",
|
||||
"integrity": "sha1-BvWnSDIxSi01wSA5vJw8otrqpCY="
|
||||
},
|
||||
"lines-and-columns": {
|
||||
"version": "1.2.4",
|
||||
"resolved": "https://registry.npmmirror.com/lines-and-columns/download/lines-and-columns-1.2.4.tgz",
|
||||
@ -9484,7 +9503,8 @@
|
||||
"object-assign": {
|
||||
"version": "4.1.1",
|
||||
"resolved": "http://registry.npm.taobao.org/object-assign/download/object-assign-4.1.1.tgz",
|
||||
"integrity": "sha1-IQmtx5ZYh8/AXLvUQsrIv7s2CGM="
|
||||
"integrity": "sha1-IQmtx5ZYh8/AXLvUQsrIv7s2CGM=",
|
||||
"dev": true
|
||||
},
|
||||
"object-copy": {
|
||||
"version": "0.1.0",
|
||||
@ -10043,6 +10063,7 @@
|
||||
"version": "7.0.39",
|
||||
"resolved": "https://registry.npmmirror.com/postcss/download/postcss-7.0.39.tgz",
|
||||
"integrity": "sha512-yioayjNbHn6z1/Bywyb2Y4s3yvDAeXGOyxqD+LnVOinq6Mdmd++SW2wUNVzavyyHxd6+DxzWGIuosg6P1Rj8uA==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"picocolors": "^0.2.1",
|
||||
"source-map": "^0.6.1"
|
||||
@ -10051,12 +10072,14 @@
|
||||
"picocolors": {
|
||||
"version": "0.2.1",
|
||||
"resolved": "https://registry.npmmirror.com/picocolors/download/picocolors-0.2.1.tgz?cache=0&sync_timestamp=1634093339035&other_urls=https%3A%2F%2Fregistry.npmmirror.com%2Fpicocolors%2Fdownload%2Fpicocolors-0.2.1.tgz",
|
||||
"integrity": "sha1-VwZw95NkaFHRuhNZlpYqutWHhZ8="
|
||||
"integrity": "sha1-VwZw95NkaFHRuhNZlpYqutWHhZ8=",
|
||||
"dev": true
|
||||
},
|
||||
"source-map": {
|
||||
"version": "0.6.1",
|
||||
"resolved": "http://registry.npm.taobao.org/source-map/download/source-map-0.6.1.tgz",
|
||||
"integrity": "sha1-dHIq8y6WFOnCh6jQu95IteLxomM="
|
||||
"integrity": "sha1-dHIq8y6WFOnCh6jQu95IteLxomM=",
|
||||
"dev": true
|
||||
}
|
||||
}
|
||||
},
|
||||
@ -10576,15 +10599,6 @@
|
||||
}
|
||||
}
|
||||
},
|
||||
"postcss-px-to-viewport": {
|
||||
"version": "1.1.1",
|
||||
"resolved": "https://registry.npmmirror.com/postcss-px-to-viewport/download/postcss-px-to-viewport-1.1.1.tgz",
|
||||
"integrity": "sha1-olykELVTyYksyLUlzHENpHvxqlU=",
|
||||
"requires": {
|
||||
"object-assign": ">=4.0.1",
|
||||
"postcss": ">=5.0.2"
|
||||
}
|
||||
},
|
||||
"postcss-reduce-initial": {
|
||||
"version": "4.0.3",
|
||||
"resolved": "https://registry.npmmirror.com/postcss-reduce-initial/download/postcss-reduce-initial-4.0.3.tgz",
|
||||
@ -13164,7 +13178,7 @@
|
||||
},
|
||||
"universalify": {
|
||||
"version": "2.0.0",
|
||||
"resolved": "https://registry.npm.taobao.org/universalify/download/universalify-2.0.0.tgz",
|
||||
"resolved": "https://registry.npmmirror.com/universalify/download/universalify-2.0.0.tgz",
|
||||
"integrity": "sha1-daSYTv7cSwiXXFrrc/Uw0C3yVxc=",
|
||||
"dev": true,
|
||||
"optional": true
|
||||
@ -13475,7 +13489,7 @@
|
||||
"dependencies": {
|
||||
"ansi-styles": {
|
||||
"version": "4.3.0",
|
||||
"resolved": "https://registry.nlark.com/ansi-styles/download/ansi-styles-4.3.0.tgz?cache=0&sync_timestamp=1618995651629&other_urls=https%3A%2F%2Fregistry.nlark.com%2Fansi-styles%2Fdownload%2Fansi-styles-4.3.0.tgz",
|
||||
"resolved": "https://registry.npmmirror.com/ansi-styles/download/ansi-styles-4.3.0.tgz",
|
||||
"integrity": "sha1-7dgDYornHATIWuegkG7a00tkiTc=",
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
@ -13506,14 +13520,14 @@
|
||||
},
|
||||
"color-name": {
|
||||
"version": "1.1.4",
|
||||
"resolved": "http://registry.npm.taobao.org/color-name/download/color-name-1.1.4.tgz",
|
||||
"resolved": "https://registry.npmmirror.com/color-name/download/color-name-1.1.4.tgz",
|
||||
"integrity": "sha1-wqCah6y95pVD3m9j+jmVyCbFNqI=",
|
||||
"dev": true,
|
||||
"optional": true
|
||||
},
|
||||
"has-flag": {
|
||||
"version": "4.0.0",
|
||||
"resolved": "https://registry.nlark.com/has-flag/download/has-flag-4.0.0.tgz",
|
||||
"resolved": "https://registry.npmmirror.com/has-flag/download/has-flag-4.0.0.tgz",
|
||||
"integrity": "sha1-lEdx/ZyByBJlxNaUGGDaBrtZR5s=",
|
||||
"dev": true,
|
||||
"optional": true
|
||||
@ -14395,7 +14409,7 @@
|
||||
},
|
||||
"yaml": {
|
||||
"version": "1.10.2",
|
||||
"resolved": "https://registry.npmmirror.com/yaml/download/yaml-1.10.2.tgz?cache=0&sync_timestamp=1636797230771&other_urls=https%3A%2F%2Fregistry.npmmirror.com%2Fyaml%2Fdownload%2Fyaml-1.10.2.tgz",
|
||||
"resolved": "https://registry.npmmirror.com/yaml/download/yaml-1.10.2.tgz",
|
||||
"integrity": "sha1-IwHF/78StGfejaIzOkWeKeeSDks=",
|
||||
"dev": true,
|
||||
"optional": true
|
||||
|
23
package.json
@ -9,20 +9,18 @@
|
||||
},
|
||||
"dependencies": {
|
||||
"core-js": "^3.6.5",
|
||||
"js-cookie": "^2.2.1",
|
||||
"lib-flexible": "^0.3.2",
|
||||
"postcss-px-to-viewport": "^1.1.1",
|
||||
"vue": "^2.6.11",
|
||||
"vue-class-component": "^7.2.3",
|
||||
"vue-property-decorator": "^9.1.2",
|
||||
"vue-router": "^3.2.0",
|
||||
"vuex": "^3.4.0",
|
||||
"vuex-module-decorators": "^2.0.0"
|
||||
"vuex-module-decorators": "^2.0.0",
|
||||
"js-cookie": "^2.2.1"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@types/js-cookie": "^2.2.6",
|
||||
"@typescript-eslint/eslint-plugin": "^4.18.0",
|
||||
"@typescript-eslint/parser": "^4.18.0",
|
||||
"@types/js-cookie": "^2.2.6",
|
||||
"@vue/cli-plugin-babel": "~4.5.0",
|
||||
"@vue/cli-plugin-eslint": "~4.5.0",
|
||||
"@vue/cli-plugin-router": "~4.5.0",
|
||||
@ -30,14 +28,14 @@
|
||||
"@vue/cli-plugin-vuex": "~4.5.0",
|
||||
"@vue/cli-service": "~4.5.0",
|
||||
"@vue/eslint-config-prettier": "^6.0.0",
|
||||
"@vue/eslint-config-typescript": "^7.0.0",
|
||||
"@vue/eslint-config-standard": "^5.1.2",
|
||||
"@vue/eslint-config-typescript": "^7.0.0",
|
||||
"eslint": "^7.12.1",
|
||||
"eslint-plugin-import": "^2.22.1",
|
||||
"eslint-plugin-node": "^11.1.0",
|
||||
"eslint-plugin-promise": "^4.2.1",
|
||||
"eslint-plugin-standard": "^4.0.2",
|
||||
"eslint-plugin-vue": "^7.1.0",
|
||||
"eslint-plugin-vue": "^7.0.0-beta.4",
|
||||
"node-sass": "^4.12.0",
|
||||
"prettier": "^2.2.1",
|
||||
"sass-loader": "^8.0.2",
|
||||
@ -48,14 +46,5 @@
|
||||
"> 1%",
|
||||
"last 2 versions",
|
||||
"not dead"
|
||||
],
|
||||
"postcss": {
|
||||
"plugins": {
|
||||
"autoprefixer": {},
|
||||
"postcss-px-to-viewport": {
|
||||
"viewportWidth": 750,
|
||||
"minPixelValue": 1
|
||||
}
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
|
8716
public/assets/libs/spine-webgl.js
Executable file
1
public/assets/libs/spine-webgl.js.map
Executable file
153
public/assets/spines/guang_texiao.atlas
Executable file
@ -0,0 +1,153 @@
|
||||
|
||||
guang_texiao.png
|
||||
size: 1024,1024
|
||||
format: RGBA8888
|
||||
filter: Linear,Linear
|
||||
repeat: none
|
||||
jineng_0001
|
||||
rotate: false
|
||||
xy: 2, 802
|
||||
size: 143, 198
|
||||
orig: 143, 198
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
jineng_0002
|
||||
rotate: false
|
||||
xy: 2, 602
|
||||
size: 143, 198
|
||||
orig: 143, 198
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
jineng_0003
|
||||
rotate: false
|
||||
xy: 147, 802
|
||||
size: 143, 198
|
||||
orig: 143, 198
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
jineng_0004
|
||||
rotate: false
|
||||
xy: 2, 402
|
||||
size: 143, 198
|
||||
orig: 143, 198
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
jineng_0005
|
||||
rotate: false
|
||||
xy: 147, 602
|
||||
size: 143, 198
|
||||
orig: 143, 198
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
jineng_0006
|
||||
rotate: false
|
||||
xy: 292, 802
|
||||
size: 143, 198
|
||||
orig: 143, 198
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
jineng_0007
|
||||
rotate: false
|
||||
xy: 2, 202
|
||||
size: 143, 198
|
||||
orig: 143, 198
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
jineng_0008
|
||||
rotate: false
|
||||
xy: 147, 402
|
||||
size: 143, 198
|
||||
orig: 143, 198
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
jineng_0009
|
||||
rotate: false
|
||||
xy: 292, 602
|
||||
size: 143, 198
|
||||
orig: 143, 198
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
jineng_0010
|
||||
rotate: false
|
||||
xy: 437, 802
|
||||
size: 143, 198
|
||||
orig: 143, 198
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
jineng_0011
|
||||
rotate: false
|
||||
xy: 2, 2
|
||||
size: 143, 198
|
||||
orig: 143, 198
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
jineng_0012
|
||||
rotate: false
|
||||
xy: 147, 202
|
||||
size: 143, 198
|
||||
orig: 143, 198
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
jineng_0013
|
||||
rotate: false
|
||||
xy: 292, 402
|
||||
size: 143, 198
|
||||
orig: 143, 198
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
jineng_0014
|
||||
rotate: false
|
||||
xy: 437, 602
|
||||
size: 143, 198
|
||||
orig: 143, 198
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
jineng_0015
|
||||
rotate: false
|
||||
xy: 582, 802
|
||||
size: 143, 198
|
||||
orig: 143, 198
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
jineng_0016
|
||||
rotate: false
|
||||
xy: 147, 2
|
||||
size: 143, 198
|
||||
orig: 143, 198
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
jineng_0017
|
||||
rotate: false
|
||||
xy: 292, 202
|
||||
size: 143, 198
|
||||
orig: 143, 198
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
jineng_0018
|
||||
rotate: false
|
||||
xy: 437, 402
|
||||
size: 143, 198
|
||||
orig: 143, 198
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
jineng_0019
|
||||
rotate: false
|
||||
xy: 582, 602
|
||||
size: 143, 198
|
||||
orig: 143, 198
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
jineng_0020
|
||||
rotate: false
|
||||
xy: 727, 802
|
||||
size: 143, 198
|
||||
orig: 143, 198
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
jineng_0021
|
||||
rotate: false
|
||||
xy: 292, 2
|
||||
size: 143, 198
|
||||
orig: 143, 198
|
||||
offset: 0, 0
|
||||
index: -1
|
1
public/assets/spines/guang_texiao.json
Executable file
@ -0,0 +1 @@
|
||||
{"skeleton":{"hash":"kCrtIhpwYzozmGuey+YX/gCe1VI","spine":"3.5.51","width":481.71,"height":691.03,"images":"./images/"},"bones":[{"name":"root"},{"name":"jinneng","parent":"root","x":0.29,"y":-15.24,"scaleX":3.369,"scaleY":3.49}],"slots":[{"name":"jineng_0001","bone":"jinneng","attachment":"jineng_0001"},{"name":"jineng_1","bone":"jinneng","attachment":"jineng_0001","blend":"additive"}],"skins":{"default":{"jineng_0001":{"jineng_0001":{"y":82.52,"width":143,"height":198},"jineng_0002":{"y":81.63,"width":143,"height":198},"jineng_0003":{"y":81.63,"width":143,"height":198},"jineng_0004":{"y":81.63,"width":143,"height":198},"jineng_0005":{"y":81.63,"width":143,"height":198},"jineng_0006":{"y":81.63,"width":143,"height":198},"jineng_0007":{"y":81.63,"width":143,"height":198},"jineng_0008":{"y":81.63,"width":143,"height":198},"jineng_0009":{"y":81.63,"width":143,"height":198},"jineng_0010":{"y":81.63,"width":143,"height":198},"jineng_0011":{"y":81.63,"width":143,"height":198},"jineng_0012":{"y":81.63,"width":143,"height":198},"jineng_0013":{"y":81.63,"width":143,"height":198},"jineng_0014":{"y":81.63,"width":143,"height":198},"jineng_0015":{"y":81.63,"width":143,"height":198},"jineng_0016":{"y":81.63,"width":143,"height":198},"jineng_0017":{"y":81.63,"width":143,"height":198},"jineng_0018":{"y":81.63,"width":143,"height":198},"jineng_0019":{"y":81.63,"width":143,"height":198},"jineng_0020":{"y":81.63,"width":143,"height":198},"jineng_0021":{"y":81.63,"width":143,"height":198}},"jineng_1":{"jineng_0001":{"y":82.52,"width":143,"height":198},"jineng_0002":{"y":81.63,"width":143,"height":198},"jineng_0003":{"y":81.63,"width":143,"height":198},"jineng_0004":{"y":81.63,"width":143,"height":198},"jineng_0005":{"y":81.63,"width":143,"height":198},"jineng_0006":{"y":81.63,"width":143,"height":198},"jineng_0007":{"y":81.63,"width":143,"height":198},"jineng_0008":{"y":81.63,"width":143,"height":198},"jineng_0009":{"y":81.63,"width":143,"height":198},"jineng_0010":{"y":81.63,"width":143,"height":198},"jineng_0011":{"y":81.63,"width":143,"height":198},"jineng_0012":{"y":81.63,"width":143,"height":198},"jineng_0013":{"y":81.63,"width":143,"height":198},"jineng_0014":{"y":81.63,"width":143,"height":198},"jineng_0015":{"y":81.63,"width":143,"height":198},"jineng_0016":{"y":81.63,"width":143,"height":198},"jineng_0017":{"y":81.63,"width":143,"height":198},"jineng_0018":{"y":81.63,"width":143,"height":198},"jineng_0019":{"y":81.63,"width":143,"height":198},"jineng_0020":{"y":81.63,"width":143,"height":198},"jineng_0021":{"y":81.63,"width":143,"height":198}}}},"events":{"play_end":{}},"animations":{"animation":{"slots":{"jineng_0001":{"attachment":[{"time":0,"name":"jineng_0001"},{"time":0.0333,"name":"jineng_0002"},{"time":0.0667,"name":"jineng_0003"},{"time":0.1,"name":"jineng_0004"},{"time":0.1333,"name":"jineng_0005"},{"time":0.1667,"name":"jineng_0006"},{"time":0.2,"name":"jineng_0007"},{"time":0.2333,"name":"jineng_0008"},{"time":0.2667,"name":"jineng_0009"},{"time":0.3,"name":"jineng_0010"},{"time":0.3333,"name":"jineng_0011"},{"time":0.3667,"name":"jineng_0012"},{"time":0.4,"name":"jineng_0013"},{"time":0.4333,"name":"jineng_0014"},{"time":0.4667,"name":"jineng_0015"},{"time":0.5,"name":"jineng_0016"},{"time":0.5333,"name":"jineng_0017"},{"time":0.5667,"name":"jineng_0018"},{"time":0.6,"name":"jineng_0019"},{"time":0.6333,"name":"jineng_0020"},{"time":0.6667,"name":"jineng_0021"}]},"jineng_1":{"attachment":[{"time":0,"name":"jineng_0001"},{"time":0.0333,"name":"jineng_0002"},{"time":0.0667,"name":"jineng_0003"},{"time":0.1,"name":"jineng_0004"},{"time":0.1333,"name":"jineng_0005"},{"time":0.1667,"name":"jineng_0006"},{"time":0.2,"name":"jineng_0007"},{"time":0.2333,"name":"jineng_0008"},{"time":0.2667,"name":"jineng_0009"},{"time":0.3,"name":"jineng_0010"},{"time":0.3333,"name":"jineng_0011"},{"time":0.3667,"name":"jineng_0012"},{"time":0.4,"name":"jineng_0013"},{"time":0.4333,"name":"jineng_0014"},{"time":0.4667,"name":"jineng_0015"},{"time":0.5,"name":"jineng_0016"},{"time":0.5333,"name":"jineng_0017"},{"time":0.5667,"name":"jineng_0018"},{"time":0.6,"name":"jineng_0019"},{"time":0.6333,"name":"jineng_0020"},{"time":0.6667,"name":"jineng_0021"}]}},"bones":{"jinneng":{"scale":[{"time":0,"x":1.653,"y":1.561}]}},"events":[{"time":0.6667,"name":"play_end"}]}}}
|
BIN
public/assets/spines/guang_texiao.png
Executable file
After Width: | Height: | Size: 365 KiB |
363
public/assets/spines/pic_hero1.atlas
Executable file
@ -0,0 +1,363 @@
|
||||
|
||||
pic_hero1.png
|
||||
size: 1024,1024
|
||||
format: RGBA8888
|
||||
filter: Linear,Linear
|
||||
repeat: none
|
||||
XINGXING
|
||||
rotate: false
|
||||
xy: 415, 588
|
||||
size: 39, 39
|
||||
orig: 39, 39
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
huli_10
|
||||
rotate: false
|
||||
xy: 2, 629
|
||||
size: 276, 392
|
||||
orig: 276, 392
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
huli_11
|
||||
rotate: true
|
||||
xy: 520, 406
|
||||
size: 176, 126
|
||||
orig: 176, 126
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
huli_12
|
||||
rotate: false
|
||||
xy: 278, 294
|
||||
size: 76, 333
|
||||
orig: 76, 333
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
huli_13
|
||||
rotate: false
|
||||
xy: 280, 717
|
||||
size: 191, 304
|
||||
orig: 191, 304
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
huli_14
|
||||
rotate: false
|
||||
xy: 479, 270
|
||||
size: 36, 120
|
||||
orig: 36, 120
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
huli_15
|
||||
rotate: false
|
||||
xy: 416, 629
|
||||
size: 46, 86
|
||||
orig: 46, 86
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
huli_16
|
||||
rotate: false
|
||||
xy: 112, 231
|
||||
size: 128, 110
|
||||
orig: 128, 110
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
huli_17
|
||||
rotate: false
|
||||
xy: 942, 755
|
||||
size: 80, 266
|
||||
orig: 80, 266
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
huli_18
|
||||
rotate: false
|
||||
xy: 700, 773
|
||||
size: 31, 22
|
||||
orig: 31, 22
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
huli_19
|
||||
rotate: false
|
||||
xy: 758, 506
|
||||
size: 18, 19
|
||||
orig: 18, 19
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
huli_20
|
||||
rotate: false
|
||||
xy: 385, 590
|
||||
size: 28, 39
|
||||
orig: 28, 39
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
huli_21
|
||||
rotate: true
|
||||
xy: 280, 631
|
||||
size: 84, 134
|
||||
orig: 84, 134
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
huli_22
|
||||
rotate: true
|
||||
xy: 670, 575
|
||||
size: 65, 79
|
||||
orig: 65, 79
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
huli_23
|
||||
rotate: true
|
||||
xy: 931, 780
|
||||
size: 15, 9
|
||||
orig: 15, 9
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
huli_24
|
||||
rotate: true
|
||||
xy: 343, 276
|
||||
size: 16, 11
|
||||
orig: 16, 11
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
huli_25
|
||||
rotate: false
|
||||
xy: 520, 396
|
||||
size: 9, 8
|
||||
orig: 9, 8
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
huli_26
|
||||
rotate: false
|
||||
xy: 715, 408
|
||||
size: 8, 9
|
||||
orig: 8, 9
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
huli_27
|
||||
rotate: false
|
||||
xy: 648, 405
|
||||
size: 65, 79
|
||||
orig: 65, 79
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
huli_28
|
||||
rotate: true
|
||||
xy: 733, 779
|
||||
size: 16, 15
|
||||
orig: 16, 15
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
huli_29
|
||||
rotate: false
|
||||
xy: 323, 275
|
||||
size: 18, 17
|
||||
orig: 18, 17
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
huli_30
|
||||
rotate: false
|
||||
xy: 826, 642
|
||||
size: 16, 13
|
||||
orig: 16, 13
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
huli_31
|
||||
rotate: true
|
||||
xy: 826, 657
|
||||
size: 16, 11
|
||||
orig: 16, 11
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
huli_32
|
||||
rotate: true
|
||||
xy: 931, 763
|
||||
size: 15, 9
|
||||
orig: 15, 9
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
huli_33
|
||||
rotate: true
|
||||
xy: 758, 527
|
||||
size: 50, 41
|
||||
orig: 50, 41
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
huli_34
|
||||
rotate: true
|
||||
xy: 750, 642
|
||||
size: 31, 74
|
||||
orig: 31, 74
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
huli_35
|
||||
rotate: false
|
||||
xy: 273, 252
|
||||
size: 48, 40
|
||||
orig: 48, 40
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
huli_36
|
||||
rotate: false
|
||||
xy: 715, 494
|
||||
size: 41, 79
|
||||
orig: 41, 79
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
huli_37
|
||||
rotate: true
|
||||
xy: 839, 671
|
||||
size: 31, 61
|
||||
orig: 31, 61
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
huli_38
|
||||
rotate: false
|
||||
xy: 356, 584
|
||||
size: 27, 45
|
||||
orig: 27, 45
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
huli_39
|
||||
rotate: false
|
||||
xy: 715, 419
|
||||
size: 49, 73
|
||||
orig: 49, 73
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
huli_4
|
||||
rotate: false
|
||||
xy: 473, 773
|
||||
size: 225, 248
|
||||
orig: 225, 248
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
huli_40
|
||||
rotate: false
|
||||
xy: 839, 704
|
||||
size: 77, 91
|
||||
orig: 77, 91
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
huli_41
|
||||
rotate: false
|
||||
xy: 918, 749
|
||||
size: 11, 46
|
||||
orig: 11, 46
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
huli_42
|
||||
rotate: false
|
||||
xy: 751, 579
|
||||
size: 53, 61
|
||||
orig: 53, 61
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
huli_43
|
||||
rotate: false
|
||||
xy: 2, 217
|
||||
size: 108, 410
|
||||
orig: 108, 410
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
huli_44
|
||||
rotate: true
|
||||
xy: 356, 280
|
||||
size: 110, 121
|
||||
orig: 110, 121
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
huli_45
|
||||
rotate: false
|
||||
xy: 112, 343
|
||||
size: 164, 284
|
||||
orig: 164, 284
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
huli_46
|
||||
rotate: false
|
||||
xy: 670, 642
|
||||
size: 78, 129
|
||||
orig: 78, 129
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
huli_47
|
||||
rotate: true
|
||||
xy: 112, 218
|
||||
size: 11, 54
|
||||
orig: 11, 54
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
huli_48
|
||||
rotate: false
|
||||
xy: 242, 255
|
||||
size: 29, 86
|
||||
orig: 29, 86
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
huli_49
|
||||
rotate: false
|
||||
xy: 758, 494
|
||||
size: 17, 10
|
||||
orig: 17, 10
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
huli_5
|
||||
rotate: true
|
||||
xy: 473, 584
|
||||
size: 187, 195
|
||||
orig: 187, 195
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
huli_50
|
||||
rotate: false
|
||||
xy: 806, 589
|
||||
size: 26, 51
|
||||
orig: 26, 51
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
huli_51
|
||||
rotate: true
|
||||
xy: 931, 746
|
||||
size: 15, 9
|
||||
orig: 15, 9
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
huli_52
|
||||
rotate: false
|
||||
xy: 385, 584
|
||||
size: 14, 4
|
||||
orig: 14, 4
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
huli_53
|
||||
rotate: false
|
||||
xy: 648, 486
|
||||
size: 65, 87
|
||||
orig: 65, 87
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
huli_6
|
||||
rotate: false
|
||||
xy: 2, 2
|
||||
size: 199, 213
|
||||
orig: 199, 213
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
huli_7
|
||||
rotate: false
|
||||
xy: 700, 797
|
||||
size: 240, 224
|
||||
orig: 240, 224
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
huli_8
|
||||
rotate: false
|
||||
xy: 356, 392
|
||||
size: 162, 190
|
||||
orig: 162, 190
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
huli_9
|
||||
rotate: false
|
||||
xy: 750, 675
|
||||
size: 87, 120
|
||||
orig: 87, 120
|
||||
offset: 0, 0
|
||||
index: -1
|
1
public/assets/spines/pic_hero1.json
Executable file
BIN
public/assets/spines/pic_hero1.png
Executable file
After Width: | Height: | Size: 356 KiB |
286
public/assets/spines/pic_hero10.atlas
Executable file
@ -0,0 +1,286 @@
|
||||
|
||||
pic_hero10.png
|
||||
size: 1998,551
|
||||
format: RGBA8888
|
||||
filter: Linear,Linear
|
||||
repeat: none
|
||||
hore10_1
|
||||
rotate: false
|
||||
xy: 1612, 143
|
||||
size: 384, 406
|
||||
orig: 384, 406
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
hore10_10
|
||||
rotate: true
|
||||
xy: 1580, 52
|
||||
size: 19, 91
|
||||
orig: 19, 91
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
hore10_11
|
||||
rotate: true
|
||||
xy: 440, 2
|
||||
size: 245, 567
|
||||
orig: 245, 567
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
hore10_12
|
||||
rotate: true
|
||||
xy: 1387, 231
|
||||
size: 57, 168
|
||||
orig: 57, 168
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
hore10_13
|
||||
rotate: true
|
||||
xy: 1581, 73
|
||||
size: 68, 92
|
||||
orig: 68, 92
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
hore10_14
|
||||
rotate: true
|
||||
xy: 1035, 290
|
||||
size: 259, 575
|
||||
orig: 259, 575
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
hore10_15
|
||||
rotate: true
|
||||
xy: 1387, 182
|
||||
size: 47, 173
|
||||
orig: 47, 173
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
hore10_16
|
||||
rotate: false
|
||||
xy: 1411, 2
|
||||
size: 38, 14
|
||||
orig: 38, 14
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
hore10_17
|
||||
rotate: false
|
||||
xy: 1009, 2
|
||||
size: 99, 245
|
||||
orig: 99, 245
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
hore10_18
|
||||
rotate: true
|
||||
xy: 1387, 139
|
||||
size: 41, 103
|
||||
orig: 41, 103
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
hore10_19
|
||||
rotate: false
|
||||
xy: 1769, 69
|
||||
size: 83, 72
|
||||
orig: 83, 72
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
hore10_2
|
||||
rotate: false
|
||||
xy: 1110, 14
|
||||
size: 186, 274
|
||||
orig: 186, 274
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
hore10_20
|
||||
rotate: true
|
||||
xy: 1854, 102
|
||||
size: 39, 93
|
||||
orig: 39, 93
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
hore10_21
|
||||
rotate: true
|
||||
xy: 1298, 15
|
||||
size: 112, 111
|
||||
orig: 112, 111
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
hore10_22
|
||||
rotate: false
|
||||
xy: 1557, 234
|
||||
size: 22, 54
|
||||
orig: 22, 54
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
hore10_23
|
||||
rotate: true
|
||||
xy: 1035, 263
|
||||
size: 25, 64
|
||||
orig: 25, 64
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
hore10_24
|
||||
rotate: false
|
||||
xy: 1411, 34
|
||||
size: 83, 103
|
||||
orig: 83, 103
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
hore10_25
|
||||
rotate: false
|
||||
xy: 1055, 253
|
||||
size: 17, 8
|
||||
orig: 17, 8
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
hore10_26
|
||||
rotate: false
|
||||
xy: 1581, 245
|
||||
size: 16, 9
|
||||
orig: 16, 9
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
hore10_27
|
||||
rotate: false
|
||||
xy: 1496, 77
|
||||
size: 83, 103
|
||||
orig: 83, 103
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
hore10_28
|
||||
rotate: false
|
||||
xy: 1035, 249
|
||||
size: 18, 12
|
||||
orig: 18, 12
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
hore10_29
|
||||
rotate: false
|
||||
xy: 1949, 128
|
||||
size: 17, 13
|
||||
orig: 17, 13
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
hore10_3
|
||||
rotate: false
|
||||
xy: 2, 3
|
||||
size: 436, 546
|
||||
orig: 436, 546
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
hore10_30
|
||||
rotate: true
|
||||
xy: 1101, 280
|
||||
size: 8, 7
|
||||
orig: 8, 7
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
hore10_31
|
||||
rotate: false
|
||||
xy: 1101, 272
|
||||
size: 7, 6
|
||||
orig: 7, 6
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
hore10_32
|
||||
rotate: false
|
||||
xy: 1381, 5
|
||||
size: 18, 8
|
||||
orig: 18, 8
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
hore10_33
|
||||
rotate: false
|
||||
xy: 1387, 129
|
||||
size: 19, 8
|
||||
orig: 19, 8
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
hore10_34
|
||||
rotate: false
|
||||
xy: 1769, 58
|
||||
size: 19, 9
|
||||
orig: 19, 9
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
hore10_35
|
||||
rotate: false
|
||||
xy: 1580, 42
|
||||
size: 19, 8
|
||||
orig: 19, 8
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
hore10_36
|
||||
rotate: true
|
||||
xy: 1949, 102
|
||||
size: 24, 5
|
||||
orig: 24, 5
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
hore10_37
|
||||
rotate: false
|
||||
xy: 1110, 4
|
||||
size: 26, 8
|
||||
orig: 26, 8
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
hore10_38
|
||||
rotate: true
|
||||
xy: 1581, 256
|
||||
size: 32, 17
|
||||
orig: 32, 17
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
hore10_39
|
||||
rotate: false
|
||||
xy: 1675, 58
|
||||
size: 92, 83
|
||||
orig: 92, 83
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
hore10_4
|
||||
rotate: false
|
||||
xy: 1451, 2
|
||||
size: 33, 14
|
||||
orig: 33, 14
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
hore10_40
|
||||
rotate: true
|
||||
xy: 440, 249
|
||||
size: 300, 593
|
||||
orig: 300, 593
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
hore10_5
|
||||
rotate: false
|
||||
xy: 1298, 129
|
||||
size: 87, 159
|
||||
orig: 87, 159
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
hore10_6
|
||||
rotate: true
|
||||
xy: 1411, 18
|
||||
size: 14, 81
|
||||
orig: 14, 81
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
hore10_7
|
||||
rotate: true
|
||||
xy: 1496, 41
|
||||
size: 34, 82
|
||||
orig: 34, 82
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
hore10_8
|
||||
rotate: true
|
||||
xy: 1298, 2
|
||||
size: 11, 81
|
||||
orig: 11, 81
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
hore10_9
|
||||
rotate: true
|
||||
xy: 1854, 76
|
||||
size: 24, 101
|
||||
orig: 24, 101
|
||||
offset: 0, 0
|
||||
index: -1
|
1
public/assets/spines/pic_hero10.json
Executable file
BIN
public/assets/spines/pic_hero10.png
Executable file
After Width: | Height: | Size: 615 KiB |
286
public/assets/spines/pic_hero2.atlas
Executable file
@ -0,0 +1,286 @@
|
||||
|
||||
pic_hero2.png
|
||||
size: 1024,512
|
||||
format: RGBA8888
|
||||
filter: Linear,Linear
|
||||
repeat: none
|
||||
BBBBB3
|
||||
rotate: false
|
||||
xy: 2, 6
|
||||
size: 21, 6
|
||||
orig: 21, 6
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
bbbbb2
|
||||
rotate: true
|
||||
xy: 1015, 455
|
||||
size: 22, 7
|
||||
orig: 22, 7
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
huanxiong_1
|
||||
rotate: false
|
||||
xy: 815, 284
|
||||
size: 50, 58
|
||||
orig: 50, 58
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
huanxiong_10
|
||||
rotate: true
|
||||
xy: 983, 402
|
||||
size: 32, 39
|
||||
orig: 32, 39
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
huanxiong_11
|
||||
rotate: true
|
||||
xy: 873, 373
|
||||
size: 61, 108
|
||||
orig: 61, 108
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
huanxiong_12
|
||||
rotate: false
|
||||
xy: 302, 79
|
||||
size: 31, 45
|
||||
orig: 31, 45
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
huanxiong_13
|
||||
rotate: true
|
||||
xy: 873, 436
|
||||
size: 71, 117
|
||||
orig: 71, 117
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
huanxiong_14
|
||||
rotate: false
|
||||
xy: 2, 14
|
||||
size: 131, 85
|
||||
orig: 131, 85
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
huanxiong_15
|
||||
rotate: false
|
||||
xy: 611, 346
|
||||
size: 133, 161
|
||||
orig: 133, 161
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
huanxiong_16
|
||||
rotate: false
|
||||
xy: 435, 82
|
||||
size: 31, 24
|
||||
orig: 31, 24
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
huanxiong_17
|
||||
rotate: false
|
||||
xy: 216, 200
|
||||
size: 260, 307
|
||||
orig: 260, 307
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
huanxiong_18
|
||||
rotate: false
|
||||
xy: 2, 101
|
||||
size: 212, 406
|
||||
orig: 212, 406
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
huanxiong_19
|
||||
rotate: true
|
||||
xy: 337, 108
|
||||
size: 41, 81
|
||||
orig: 41, 81
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
huanxiong_2
|
||||
rotate: true
|
||||
xy: 478, 174
|
||||
size: 57, 106
|
||||
orig: 57, 106
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
huanxiong_20
|
||||
rotate: true
|
||||
xy: 738, 286
|
||||
size: 56, 75
|
||||
orig: 56, 75
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
huanxiong_21
|
||||
rotate: false
|
||||
xy: 746, 396
|
||||
size: 125, 111
|
||||
orig: 125, 111
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
huanxiong_22
|
||||
rotate: true
|
||||
xy: 856, 344
|
||||
size: 27, 29
|
||||
orig: 27, 29
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
huanxiong_23
|
||||
rotate: true
|
||||
xy: 983, 373
|
||||
size: 27, 32
|
||||
orig: 27, 32
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
huanxiong_24
|
||||
rotate: false
|
||||
xy: 135, 15
|
||||
size: 67, 84
|
||||
orig: 67, 84
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
huanxiong_25
|
||||
rotate: true
|
||||
xy: 856, 373
|
||||
size: 21, 15
|
||||
orig: 21, 15
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
huanxiong_26
|
||||
rotate: true
|
||||
xy: 867, 305
|
||||
size: 37, 16
|
||||
orig: 37, 16
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
huanxiong_27
|
||||
rotate: false
|
||||
xy: 992, 479
|
||||
size: 30, 28
|
||||
orig: 30, 28
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
huanxiong_28
|
||||
rotate: true
|
||||
xy: 204, 2
|
||||
size: 67, 84
|
||||
orig: 67, 84
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
huanxiong_29
|
||||
rotate: true
|
||||
xy: 204, 90
|
||||
size: 9, 10
|
||||
orig: 9, 10
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
huanxiong_3
|
||||
rotate: true
|
||||
xy: 216, 126
|
||||
size: 72, 119
|
||||
orig: 72, 119
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
huanxiong_30
|
||||
rotate: false
|
||||
xy: 887, 347
|
||||
size: 22, 24
|
||||
orig: 22, 24
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
huanxiong_31
|
||||
rotate: true
|
||||
xy: 466, 189
|
||||
size: 9, 10
|
||||
orig: 9, 10
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
huanxiong_32
|
||||
rotate: false
|
||||
xy: 911, 350
|
||||
size: 22, 21
|
||||
orig: 22, 21
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
huanxiong_33
|
||||
rotate: true
|
||||
xy: 1017, 391
|
||||
size: 9, 5
|
||||
orig: 9, 5
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
huanxiong_34
|
||||
rotate: true
|
||||
xy: 420, 108
|
||||
size: 41, 50
|
||||
orig: 41, 50
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
huanxiong_35
|
||||
rotate: true
|
||||
xy: 337, 151
|
||||
size: 47, 127
|
||||
orig: 47, 127
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
huanxiong_36
|
||||
rotate: true
|
||||
xy: 335, 64
|
||||
size: 42, 53
|
||||
orig: 42, 53
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
huanxiong_37
|
||||
rotate: true
|
||||
xy: 586, 183
|
||||
size: 48, 7
|
||||
orig: 48, 7
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
huanxiong_38
|
||||
rotate: true
|
||||
xy: 611, 312
|
||||
size: 32, 125
|
||||
orig: 32, 125
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
huanxiong_4
|
||||
rotate: true
|
||||
xy: 478, 233
|
||||
size: 63, 128
|
||||
orig: 63, 128
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
huanxiong_5
|
||||
rotate: true
|
||||
xy: 216, 71
|
||||
size: 53, 84
|
||||
orig: 53, 84
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
huanxiong_6
|
||||
rotate: false
|
||||
xy: 478, 298
|
||||
size: 131, 209
|
||||
orig: 131, 209
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
huanxiong_7
|
||||
rotate: false
|
||||
xy: 746, 344
|
||||
size: 108, 50
|
||||
orig: 108, 50
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
huanxiong_8
|
||||
rotate: true
|
||||
xy: 390, 78
|
||||
size: 28, 43
|
||||
orig: 28, 43
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
huanxiong_9
|
||||
rotate: false
|
||||
xy: 992, 436
|
||||
size: 21, 41
|
||||
orig: 21, 41
|
||||
offset: 0, 0
|
||||
index: -1
|
1
public/assets/spines/pic_hero2.json
Executable file
BIN
public/assets/spines/pic_hero2.png
Executable file
After Width: | Height: | Size: 302 KiB |
426
public/assets/spines/pic_hero3.atlas
Executable file
@ -0,0 +1,426 @@
|
||||
|
||||
pic_hero3.png
|
||||
size: 1024,1024
|
||||
format: RGBA8888
|
||||
filter: Linear,Linear
|
||||
repeat: none
|
||||
hroe3_1
|
||||
rotate: false
|
||||
xy: 2, 590
|
||||
size: 259, 432
|
||||
orig: 259, 432
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
hroe3_10
|
||||
rotate: false
|
||||
xy: 1012, 1011
|
||||
size: 10, 11
|
||||
orig: 10, 11
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
hroe3_11
|
||||
rotate: false
|
||||
xy: 1012, 998
|
||||
size: 10, 11
|
||||
orig: 10, 11
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
hroe3_12
|
||||
rotate: false
|
||||
xy: 291, 480
|
||||
size: 61, 108
|
||||
orig: 61, 108
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
hroe3_13
|
||||
rotate: false
|
||||
xy: 2, 2
|
||||
size: 38, 33
|
||||
orig: 38, 33
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
hroe3_14
|
||||
rotate: false
|
||||
xy: 207, 172
|
||||
size: 88, 65
|
||||
orig: 88, 65
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
hroe3_15
|
||||
rotate: true
|
||||
xy: 278, 328
|
||||
size: 17, 9
|
||||
orig: 17, 9
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
hroe3_16
|
||||
rotate: false
|
||||
xy: 1012, 989
|
||||
size: 10, 7
|
||||
orig: 10, 7
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
hroe3_17
|
||||
rotate: false
|
||||
xy: 974, 950
|
||||
size: 11, 9
|
||||
orig: 11, 9
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
hroe3_18
|
||||
rotate: false
|
||||
xy: 218, 59
|
||||
size: 15, 4
|
||||
orig: 15, 4
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
hroe3_19
|
||||
rotate: false
|
||||
xy: 407, 663
|
||||
size: 19, 13
|
||||
orig: 19, 13
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
hroe3_2
|
||||
rotate: false
|
||||
xy: 2, 165
|
||||
size: 203, 423
|
||||
orig: 203, 423
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
hroe3_20
|
||||
rotate: false
|
||||
xy: 383, 623
|
||||
size: 20, 16
|
||||
orig: 20, 16
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
hroe3_21
|
||||
rotate: false
|
||||
xy: 459, 683
|
||||
size: 20, 16
|
||||
orig: 20, 16
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
hroe3_22
|
||||
rotate: false
|
||||
xy: 96, 2
|
||||
size: 16, 14
|
||||
orig: 16, 14
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
hroe3_23
|
||||
rotate: false
|
||||
xy: 942, 757
|
||||
size: 17, 16
|
||||
orig: 17, 16
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
hroe3_24
|
||||
rotate: false
|
||||
xy: 196, 38
|
||||
size: 17, 15
|
||||
orig: 17, 15
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
hroe3_25
|
||||
rotate: true
|
||||
xy: 155, 38
|
||||
size: 15, 39
|
||||
orig: 15, 39
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
hroe3_26
|
||||
rotate: true
|
||||
xy: 377, 678
|
||||
size: 21, 49
|
||||
orig: 21, 49
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
hroe3_27
|
||||
rotate: true
|
||||
xy: 855, 672
|
||||
size: 24, 62
|
||||
orig: 24, 62
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
hroe3_28
|
||||
rotate: true
|
||||
xy: 938, 840
|
||||
size: 46, 25
|
||||
orig: 46, 25
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
hroe3_29
|
||||
rotate: true
|
||||
xy: 342, 622
|
||||
size: 53, 39
|
||||
orig: 53, 39
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
hroe3_3
|
||||
rotate: true
|
||||
xy: 942, 800
|
||||
size: 38, 20
|
||||
orig: 38, 20
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
hroe3_30
|
||||
rotate: true
|
||||
xy: 490, 694
|
||||
size: 49, 99
|
||||
orig: 49, 99
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
hroe3_31
|
||||
rotate: true
|
||||
xy: 591, 694
|
||||
size: 11, 36
|
||||
orig: 11, 36
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
hroe3_32
|
||||
rotate: false
|
||||
xy: 289, 400
|
||||
size: 46, 46
|
||||
orig: 46, 46
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
hroe3_33
|
||||
rotate: false
|
||||
xy: 942, 775
|
||||
size: 18, 23
|
||||
orig: 18, 23
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
hroe3_34
|
||||
rotate: false
|
||||
xy: 855, 667
|
||||
size: 15, 3
|
||||
orig: 15, 3
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
hroe3_35
|
||||
rotate: true
|
||||
xy: 346, 465
|
||||
size: 13, 6
|
||||
orig: 13, 6
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
hroe3_36
|
||||
rotate: true
|
||||
xy: 591, 707
|
||||
size: 36, 40
|
||||
orig: 36, 40
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
hroe3_37
|
||||
rotate: false
|
||||
xy: 938, 888
|
||||
size: 31, 58
|
||||
orig: 31, 58
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
hroe3_38
|
||||
rotate: false
|
||||
xy: 289, 349
|
||||
size: 32, 49
|
||||
orig: 32, 49
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
hroe3_39
|
||||
rotate: false
|
||||
xy: 207, 448
|
||||
size: 82, 140
|
||||
orig: 82, 140
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
hroe3_4
|
||||
rotate: true
|
||||
xy: 633, 667
|
||||
size: 171, 220
|
||||
orig: 171, 220
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
hroe3_40
|
||||
rotate: true
|
||||
xy: 633, 948
|
||||
size: 74, 339
|
||||
orig: 74, 339
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
hroe3_41
|
||||
rotate: false
|
||||
xy: 377, 701
|
||||
size: 111, 321
|
||||
orig: 111, 321
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
hroe3_42
|
||||
rotate: false
|
||||
xy: 2, 37
|
||||
size: 151, 126
|
||||
orig: 151, 126
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
hroe3_43
|
||||
rotate: true
|
||||
xy: 207, 167
|
||||
size: 3, 8
|
||||
orig: 3, 8
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
hroe3_44
|
||||
rotate: false
|
||||
xy: 96, 18
|
||||
size: 46, 17
|
||||
orig: 46, 17
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
hroe3_45
|
||||
rotate: false
|
||||
xy: 383, 641
|
||||
size: 22, 35
|
||||
orig: 22, 35
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
hroe3_46
|
||||
rotate: false
|
||||
xy: 263, 677
|
||||
size: 112, 345
|
||||
orig: 112, 345
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
hroe3_47
|
||||
rotate: true
|
||||
xy: 218, 65
|
||||
size: 11, 74
|
||||
orig: 11, 74
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
hroe3_48
|
||||
rotate: false
|
||||
xy: 218, 78
|
||||
size: 74, 92
|
||||
orig: 74, 92
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
hroe3_49
|
||||
rotate: true
|
||||
xy: 291, 448
|
||||
size: 30, 53
|
||||
orig: 30, 53
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
hroe3_5
|
||||
rotate: false
|
||||
xy: 919, 672
|
||||
size: 21, 24
|
||||
orig: 21, 24
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
hroe3_50
|
||||
rotate: false
|
||||
xy: 942, 739
|
||||
size: 15, 16
|
||||
orig: 15, 16
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
hroe3_51
|
||||
rotate: true
|
||||
xy: 342, 591
|
||||
size: 29, 32
|
||||
orig: 29, 32
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
hroe3_52
|
||||
rotate: false
|
||||
xy: 974, 961
|
||||
size: 36, 61
|
||||
orig: 36, 61
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
hroe3_53
|
||||
rotate: true
|
||||
xy: 114, 2
|
||||
size: 14, 9
|
||||
orig: 14, 9
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
hroe3_54
|
||||
rotate: true
|
||||
xy: 428, 674
|
||||
size: 25, 29
|
||||
orig: 25, 29
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
hroe3_55
|
||||
rotate: false
|
||||
xy: 207, 347
|
||||
size: 80, 99
|
||||
orig: 80, 99
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
hroe3_56
|
||||
rotate: true
|
||||
xy: 633, 840
|
||||
size: 106, 303
|
||||
orig: 106, 303
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
hroe3_57
|
||||
rotate: false
|
||||
xy: 207, 239
|
||||
size: 69, 106
|
||||
orig: 69, 106
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
hroe3_58
|
||||
rotate: false
|
||||
xy: 490, 745
|
||||
size: 141, 277
|
||||
orig: 141, 277
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
hroe3_59
|
||||
rotate: true
|
||||
xy: 42, 5
|
||||
size: 30, 52
|
||||
orig: 30, 52
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
hroe3_6
|
||||
rotate: false
|
||||
xy: 855, 698
|
||||
size: 85, 140
|
||||
orig: 85, 140
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
hroe3_60
|
||||
rotate: true
|
||||
xy: 263, 590
|
||||
size: 85, 77
|
||||
orig: 85, 77
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
hroe3_7
|
||||
rotate: false
|
||||
xy: 155, 55
|
||||
size: 61, 108
|
||||
orig: 61, 108
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
hroe3_8
|
||||
rotate: true
|
||||
xy: 323, 382
|
||||
size: 16, 12
|
||||
orig: 16, 12
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
hroe3_9
|
||||
rotate: false
|
||||
xy: 407, 648
|
||||
size: 18, 13
|
||||
orig: 18, 13
|
||||
offset: 0, 0
|
||||
index: -1
|
1
public/assets/spines/pic_hero3.json
Executable file
BIN
public/assets/spines/pic_hero3.png
Executable file
After Width: | Height: | Size: 413 KiB |
251
public/assets/spines/pic_hero9.atlas
Executable file
@ -0,0 +1,251 @@
|
||||
|
||||
pic_hero9.png
|
||||
size: 1024,512
|
||||
format: RGBA8888
|
||||
filter: Linear,Linear
|
||||
repeat: none
|
||||
biyan_1
|
||||
rotate: false
|
||||
xy: 790, 446
|
||||
size: 14, 6
|
||||
orig: 14, 6
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
biyan_2
|
||||
rotate: true
|
||||
xy: 198, 2
|
||||
size: 9, 4
|
||||
orig: 9, 4
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
erduo_1
|
||||
rotate: false
|
||||
xy: 578, 333
|
||||
size: 24, 23
|
||||
orig: 24, 23
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
erduo_2
|
||||
rotate: false
|
||||
xy: 293, 154
|
||||
size: 19, 24
|
||||
orig: 19, 24
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
face_1
|
||||
rotate: true
|
||||
xy: 790, 454
|
||||
size: 56, 75
|
||||
orig: 56, 75
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
face_2
|
||||
rotate: true
|
||||
xy: 867, 454
|
||||
size: 56, 75
|
||||
orig: 56, 75
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
ling_1
|
||||
rotate: true
|
||||
xy: 190, 76
|
||||
size: 67, 47
|
||||
orig: 67, 47
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
mao
|
||||
rotate: false
|
||||
xy: 239, 97
|
||||
size: 32, 26
|
||||
orig: 32, 26
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
meimao_1
|
||||
rotate: false
|
||||
xy: 514, 320
|
||||
size: 17, 11
|
||||
orig: 17, 11
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
meimao_2
|
||||
rotate: false
|
||||
xy: 2, 2
|
||||
size: 11, 3
|
||||
orig: 11, 3
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
shenti
|
||||
rotate: true
|
||||
xy: 2, 7
|
||||
size: 136, 186
|
||||
orig: 136, 186
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
shoubi
|
||||
rotate: true
|
||||
xy: 703, 446
|
||||
size: 64, 85
|
||||
orig: 64, 85
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
shoubi_1
|
||||
rotate: false
|
||||
xy: 514, 429
|
||||
size: 187, 81
|
||||
orig: 187, 81
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
shoubi_2
|
||||
rotate: false
|
||||
xy: 456, 232
|
||||
size: 53, 85
|
||||
orig: 53, 85
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
toufa_1
|
||||
rotate: false
|
||||
xy: 239, 125
|
||||
size: 52, 53
|
||||
orig: 52, 53
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
toufa_2
|
||||
rotate: false
|
||||
xy: 190, 13
|
||||
size: 35, 61
|
||||
orig: 35, 61
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
toufa_3
|
||||
rotate: false
|
||||
xy: 944, 459
|
||||
size: 69, 51
|
||||
orig: 69, 51
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
xiashen
|
||||
rotate: false
|
||||
xy: 2, 145
|
||||
size: 235, 365
|
||||
orig: 235, 365
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
yan_1
|
||||
rotate: false
|
||||
xy: 1015, 489
|
||||
size: 7, 6
|
||||
orig: 7, 6
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
yan_2
|
||||
rotate: false
|
||||
xy: 696, 422
|
||||
size: 5, 5
|
||||
orig: 5, 5
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
yanbai_1
|
||||
rotate: true
|
||||
xy: 502, 217
|
||||
size: 13, 6
|
||||
orig: 13, 6
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
yanbai_2
|
||||
rotate: false
|
||||
xy: 239, 89
|
||||
size: 11, 6
|
||||
orig: 11, 6
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
yankuang_1
|
||||
rotate: false
|
||||
xy: 652, 360
|
||||
size: 14, 6
|
||||
orig: 14, 6
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
yankuang_2
|
||||
rotate: true
|
||||
xy: 204, 2
|
||||
size: 9, 4
|
||||
orig: 9, 4
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
yanpi_1
|
||||
rotate: true
|
||||
xy: 227, 61
|
||||
size: 13, 10
|
||||
orig: 13, 10
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
yanpi_2
|
||||
rotate: true
|
||||
xy: 190, 2
|
||||
size: 9, 6
|
||||
orig: 9, 6
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
yifu_1
|
||||
rotate: false
|
||||
xy: 239, 319
|
||||
size: 273, 191
|
||||
orig: 273, 191
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
yifu_2
|
||||
rotate: false
|
||||
xy: 456, 191
|
||||
size: 44, 39
|
||||
orig: 44, 39
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
yifu_3
|
||||
rotate: false
|
||||
xy: 578, 358
|
||||
size: 72, 69
|
||||
orig: 72, 69
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
yifu_4
|
||||
rotate: false
|
||||
xy: 703, 431
|
||||
size: 11, 13
|
||||
orig: 11, 13
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
yifu_5
|
||||
rotate: true
|
||||
xy: 652, 368
|
||||
size: 59, 42
|
||||
orig: 59, 42
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
yifu_7
|
||||
rotate: false
|
||||
xy: 376, 185
|
||||
size: 78, 132
|
||||
orig: 78, 132
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
yifu_8
|
||||
rotate: false
|
||||
xy: 239, 180
|
||||
size: 135, 137
|
||||
orig: 135, 137
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
yifu_9
|
||||
rotate: false
|
||||
xy: 514, 333
|
||||
size: 62, 94
|
||||
orig: 62, 94
|
||||
offset: 0, 0
|
||||
index: -1
|
||||
zui
|
||||
rotate: true
|
||||
xy: 1015, 497
|
||||
size: 13, 7
|
||||
orig: 13, 7
|
||||
offset: 0, 0
|
||||
index: -1
|
1
public/assets/spines/pic_hero9.json
Executable file
BIN
public/assets/spines/pic_hero9.png
Executable file
After Width: | Height: | Size: 220 KiB |
@ -8,6 +8,7 @@
|
||||
<meta name="viewport" content="width=device-width,initial-scale=1.0">
|
||||
<link rel="icon" href="<%= BASE_URL %>favicon.ico">
|
||||
<title><%= htmlWebpackPlugin.options.title %></title>
|
||||
<script src="assets/libs/spine-webgl.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<noscript>
|
||||
|
@ -1,450 +0,0 @@
|
||||
[
|
||||
{
|
||||
"__type__": "cc.Prefab",
|
||||
"_name": "",
|
||||
"_objFlags": 0,
|
||||
"_native": "",
|
||||
"data": {
|
||||
"__id__": 1
|
||||
},
|
||||
"optimizationPolicy": 0,
|
||||
"asyncLoadAssets": false,
|
||||
"readonly": false
|
||||
},
|
||||
{
|
||||
"__type__": "cc.Node",
|
||||
"_name": "p2",
|
||||
"_objFlags": 0,
|
||||
"_parent": null,
|
||||
"_children": [
|
||||
{
|
||||
"__id__": 2
|
||||
},
|
||||
{
|
||||
"__id__": 5
|
||||
},
|
||||
{
|
||||
"__id__": 8
|
||||
}
|
||||
],
|
||||
"_active": true,
|
||||
"_components": [
|
||||
{
|
||||
"__id__": 11
|
||||
}
|
||||
],
|
||||
"_prefab": {
|
||||
"__id__": 12
|
||||
},
|
||||
"_opacity": 255,
|
||||
"_color": {
|
||||
"__type__": "cc.Color",
|
||||
"r": 255,
|
||||
"g": 255,
|
||||
"b": 255,
|
||||
"a": 255
|
||||
},
|
||||
"_contentSize": {
|
||||
"__type__": "cc.Size",
|
||||
"width": 1920,
|
||||
"height": 1037
|
||||
},
|
||||
"_anchorPoint": {
|
||||
"__type__": "cc.Vec2",
|
||||
"x": 0.5,
|
||||
"y": 0.5
|
||||
},
|
||||
"_trs": {
|
||||
"__type__": "TypedArray",
|
||||
"ctor": "Float64Array",
|
||||
"array": [
|
||||
0,
|
||||
0,
|
||||
0,
|
||||
0,
|
||||
0,
|
||||
0,
|
||||
1,
|
||||
1,
|
||||
1,
|
||||
1
|
||||
]
|
||||
},
|
||||
"_eulerAngles": {
|
||||
"__type__": "cc.Vec3",
|
||||
"x": 0,
|
||||
"y": 0,
|
||||
"z": 0
|
||||
},
|
||||
"_skewX": 0,
|
||||
"_skewY": 0,
|
||||
"_is3DNode": false,
|
||||
"_groupIndex": 0,
|
||||
"groupIndex": 0,
|
||||
"_id": ""
|
||||
},
|
||||
{
|
||||
"__type__": "cc.Node",
|
||||
"_name": "txt_gameplay",
|
||||
"_objFlags": 0,
|
||||
"_parent": {
|
||||
"__id__": 1
|
||||
},
|
||||
"_children": [],
|
||||
"_active": true,
|
||||
"_components": [
|
||||
{
|
||||
"__id__": 3
|
||||
}
|
||||
],
|
||||
"_prefab": {
|
||||
"__id__": 4
|
||||
},
|
||||
"_opacity": 255,
|
||||
"_color": {
|
||||
"__type__": "cc.Color",
|
||||
"r": 255,
|
||||
"g": 255,
|
||||
"b": 255,
|
||||
"a": 255
|
||||
},
|
||||
"_contentSize": {
|
||||
"__type__": "cc.Size",
|
||||
"width": 571,
|
||||
"height": 99
|
||||
},
|
||||
"_anchorPoint": {
|
||||
"__type__": "cc.Vec2",
|
||||
"x": 0.5,
|
||||
"y": 0.5
|
||||
},
|
||||
"_trs": {
|
||||
"__type__": "TypedArray",
|
||||
"ctor": "Float64Array",
|
||||
"array": [
|
||||
0,
|
||||
288.923,
|
||||
0,
|
||||
0,
|
||||
0,
|
||||
0,
|
||||
1,
|
||||
1,
|
||||
1,
|
||||
1
|
||||
]
|
||||
},
|
||||
"_eulerAngles": {
|
||||
"__type__": "cc.Vec3",
|
||||
"x": 0,
|
||||
"y": 0,
|
||||
"z": 0
|
||||
},
|
||||
"_skewX": 0,
|
||||
"_skewY": 0,
|
||||
"_is3DNode": false,
|
||||
"_groupIndex": 0,
|
||||
"groupIndex": 0,
|
||||
"_id": ""
|
||||
},
|
||||
{
|
||||
"__type__": "cc.Sprite",
|
||||
"_name": "",
|
||||
"_objFlags": 0,
|
||||
"node": {
|
||||
"__id__": 2
|
||||
},
|
||||
"_enabled": true,
|
||||
"_materials": [
|
||||
{
|
||||
"__uuid__": "eca5d2f2-8ef6-41c2-bbe6-f9c79d09c432"
|
||||
}
|
||||
],
|
||||
"_srcBlendFactor": 770,
|
||||
"_dstBlendFactor": 771,
|
||||
"_spriteFrame": {
|
||||
"__uuid__": "b3495436-a00a-4edd-a8de-c2adefcdaeaf"
|
||||
},
|
||||
"_type": 0,
|
||||
"_sizeMode": 1,
|
||||
"_fillType": 0,
|
||||
"_fillCenter": {
|
||||
"__type__": "cc.Vec2",
|
||||
"x": 0,
|
||||
"y": 0
|
||||
},
|
||||
"_fillStart": 0,
|
||||
"_fillRange": 0,
|
||||
"_isTrimmedMode": true,
|
||||
"_atlas": null,
|
||||
"_id": ""
|
||||
},
|
||||
{
|
||||
"__type__": "cc.PrefabInfo",
|
||||
"root": {
|
||||
"__id__": 1
|
||||
},
|
||||
"asset": {
|
||||
"__uuid__": "2b6194a6-8a92-4796-9271-cffeb3ca995a"
|
||||
},
|
||||
"fileId": "87vb53UvpOj5ar5es6Wyxz",
|
||||
"sync": false
|
||||
},
|
||||
{
|
||||
"__type__": "cc.Node",
|
||||
"_name": "txt_battle",
|
||||
"_objFlags": 0,
|
||||
"_parent": {
|
||||
"__id__": 1
|
||||
},
|
||||
"_children": [],
|
||||
"_active": true,
|
||||
"_components": [
|
||||
{
|
||||
"__id__": 6
|
||||
}
|
||||
],
|
||||
"_prefab": {
|
||||
"__id__": 7
|
||||
},
|
||||
"_opacity": 255,
|
||||
"_color": {
|
||||
"__type__": "cc.Color",
|
||||
"r": 255,
|
||||
"g": 255,
|
||||
"b": 255,
|
||||
"a": 255
|
||||
},
|
||||
"_contentSize": {
|
||||
"__type__": "cc.Size",
|
||||
"width": 392,
|
||||
"height": 36
|
||||
},
|
||||
"_anchorPoint": {
|
||||
"__type__": "cc.Vec2",
|
||||
"x": 0.5,
|
||||
"y": 0.5
|
||||
},
|
||||
"_trs": {
|
||||
"__type__": "TypedArray",
|
||||
"ctor": "Float64Array",
|
||||
"array": [
|
||||
228.887,
|
||||
127.576,
|
||||
0,
|
||||
0,
|
||||
0,
|
||||
0,
|
||||
1,
|
||||
1,
|
||||
1,
|
||||
1
|
||||
]
|
||||
},
|
||||
"_eulerAngles": {
|
||||
"__type__": "cc.Vec3",
|
||||
"x": 0,
|
||||
"y": 0,
|
||||
"z": 0
|
||||
},
|
||||
"_skewX": 0,
|
||||
"_skewY": 0,
|
||||
"_is3DNode": false,
|
||||
"_groupIndex": 0,
|
||||
"groupIndex": 0,
|
||||
"_id": ""
|
||||
},
|
||||
{
|
||||
"__type__": "cc.Sprite",
|
||||
"_name": "",
|
||||
"_objFlags": 0,
|
||||
"node": {
|
||||
"__id__": 5
|
||||
},
|
||||
"_enabled": true,
|
||||
"_materials": [
|
||||
{
|
||||
"__uuid__": "eca5d2f2-8ef6-41c2-bbe6-f9c79d09c432"
|
||||
}
|
||||
],
|
||||
"_srcBlendFactor": 770,
|
||||
"_dstBlendFactor": 771,
|
||||
"_spriteFrame": {
|
||||
"__uuid__": "5253ea61-3bc7-44d9-aed5-42f11ff236c4"
|
||||
},
|
||||
"_type": 0,
|
||||
"_sizeMode": 1,
|
||||
"_fillType": 0,
|
||||
"_fillCenter": {
|
||||
"__type__": "cc.Vec2",
|
||||
"x": 0,
|
||||
"y": 0
|
||||
},
|
||||
"_fillStart": 0,
|
||||
"_fillRange": 0,
|
||||
"_isTrimmedMode": true,
|
||||
"_atlas": null,
|
||||
"_id": ""
|
||||
},
|
||||
{
|
||||
"__type__": "cc.PrefabInfo",
|
||||
"root": {
|
||||
"__id__": 1
|
||||
},
|
||||
"asset": {
|
||||
"__uuid__": "2b6194a6-8a92-4796-9271-cffeb3ca995a"
|
||||
},
|
||||
"fileId": "67NCHChWZLTI7Yt67XExvJ",
|
||||
"sync": false
|
||||
},
|
||||
{
|
||||
"__type__": "cc.Node",
|
||||
"_name": "btn_watch",
|
||||
"_objFlags": 0,
|
||||
"_parent": {
|
||||
"__id__": 1
|
||||
},
|
||||
"_children": [],
|
||||
"_active": true,
|
||||
"_components": [
|
||||
{
|
||||
"__id__": 9
|
||||
}
|
||||
],
|
||||
"_prefab": {
|
||||
"__id__": 10
|
||||
},
|
||||
"_opacity": 255,
|
||||
"_color": {
|
||||
"__type__": "cc.Color",
|
||||
"r": 255,
|
||||
"g": 255,
|
||||
"b": 255,
|
||||
"a": 255
|
||||
},
|
||||
"_contentSize": {
|
||||
"__type__": "cc.Size",
|
||||
"width": 295,
|
||||
"height": 100
|
||||
},
|
||||
"_anchorPoint": {
|
||||
"__type__": "cc.Vec2",
|
||||
"x": 0.5,
|
||||
"y": 0.5
|
||||
},
|
||||
"_trs": {
|
||||
"__type__": "TypedArray",
|
||||
"ctor": "Float64Array",
|
||||
"array": [
|
||||
291,
|
||||
-20.5,
|
||||
0,
|
||||
0,
|
||||
0,
|
||||
0,
|
||||
1,
|
||||
1,
|
||||
1,
|
||||
1
|
||||
]
|
||||
},
|
||||
"_eulerAngles": {
|
||||
"__type__": "cc.Vec3",
|
||||
"x": 0,
|
||||
"y": 0,
|
||||
"z": 0
|
||||
},
|
||||
"_skewX": 0,
|
||||
"_skewY": 0,
|
||||
"_is3DNode": false,
|
||||
"_groupIndex": 0,
|
||||
"groupIndex": 0,
|
||||
"_id": ""
|
||||
},
|
||||
{
|
||||
"__type__": "cc.Sprite",
|
||||
"_name": "",
|
||||
"_objFlags": 0,
|
||||
"node": {
|
||||
"__id__": 8
|
||||
},
|
||||
"_enabled": true,
|
||||
"_materials": [
|
||||
{
|
||||
"__uuid__": "eca5d2f2-8ef6-41c2-bbe6-f9c79d09c432"
|
||||
}
|
||||
],
|
||||
"_srcBlendFactor": 770,
|
||||
"_dstBlendFactor": 771,
|
||||
"_spriteFrame": {
|
||||
"__uuid__": "fb8a39ba-c5a8-43c1-b649-d2ce64d35046"
|
||||
},
|
||||
"_type": 0,
|
||||
"_sizeMode": 1,
|
||||
"_fillType": 0,
|
||||
"_fillCenter": {
|
||||
"__type__": "cc.Vec2",
|
||||
"x": 0,
|
||||
"y": 0
|
||||
},
|
||||
"_fillStart": 0,
|
||||
"_fillRange": 0,
|
||||
"_isTrimmedMode": true,
|
||||
"_atlas": null,
|
||||
"_id": ""
|
||||
},
|
||||
{
|
||||
"__type__": "cc.PrefabInfo",
|
||||
"root": {
|
||||
"__id__": 1
|
||||
},
|
||||
"asset": {
|
||||
"__uuid__": "2b6194a6-8a92-4796-9271-cffeb3ca995a"
|
||||
},
|
||||
"fileId": "5769gtX85I/oulvb/CzGmI",
|
||||
"sync": false
|
||||
},
|
||||
{
|
||||
"__type__": "cc.Sprite",
|
||||
"_name": "",
|
||||
"_objFlags": 0,
|
||||
"node": {
|
||||
"__id__": 1
|
||||
},
|
||||
"_enabled": true,
|
||||
"_materials": [
|
||||
{
|
||||
"__uuid__": "eca5d2f2-8ef6-41c2-bbe6-f9c79d09c432"
|
||||
}
|
||||
],
|
||||
"_srcBlendFactor": 770,
|
||||
"_dstBlendFactor": 771,
|
||||
"_spriteFrame": {
|
||||
"__uuid__": "95ed6133-8c38-4789-9717-e058180ceb6d"
|
||||
},
|
||||
"_type": 0,
|
||||
"_sizeMode": 1,
|
||||
"_fillType": 0,
|
||||
"_fillCenter": {
|
||||
"__type__": "cc.Vec2",
|
||||
"x": 0,
|
||||
"y": 0
|
||||
},
|
||||
"_fillStart": 0,
|
||||
"_fillRange": 0,
|
||||
"_isTrimmedMode": true,
|
||||
"_atlas": null,
|
||||
"_id": ""
|
||||
},
|
||||
{
|
||||
"__type__": "cc.PrefabInfo",
|
||||
"root": {
|
||||
"__id__": 1
|
||||
},
|
||||
"asset": {
|
||||
"__uuid__": "2b6194a6-8a92-4796-9271-cffeb3ca995a"
|
||||
},
|
||||
"fileId": "",
|
||||
"sync": false
|
||||
}
|
||||
]
|
BIN
src/assets/main/p3/bg_card_corner.png
Normal file
After Width: | Height: | Size: 985 B |
BIN
src/assets/main/p3/bg_card_t.png
Normal file
After Width: | Height: | Size: 685 B |
106
src/components/main/Card.vue
Normal file
@ -0,0 +1,106 @@
|
||||
<template>
|
||||
<div class="card">
|
||||
<img class="bg-img" src="@/assets/main/p3/bg_card.png">
|
||||
<div class="anim-border">
|
||||
<spine-view class="hero-anim" :data="data" :key="data.id"></spine-view>
|
||||
<img class="corner" src="@/assets/main/p3/bg_card_corner.png">
|
||||
<div class="info-div">
|
||||
<img class="name-img" src="@/assets/main/p3/racoon.png">
|
||||
<span class="index-label">#01</span>
|
||||
<span class="price-label">100 USD</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import { Component, Vue } from 'vue-property-decorator'
|
||||
import { ISpineData } from '@/utils/SpineRender'
|
||||
import SpineView from '@/components/main/SpineView.vue'
|
||||
|
||||
declare module 'vue/types/vue' {
|
||||
interface Vue {
|
||||
data: ISpineData
|
||||
}
|
||||
}
|
||||
|
||||
@Component({
|
||||
name: 'Card',
|
||||
components: {
|
||||
SpineView
|
||||
},
|
||||
props: ['data']
|
||||
})
|
||||
export default class extends Vue {
|
||||
private hero: ISpineData = { id: 'hero2_10', skelName: 'pic_hero9', animName: 'animation', repeat: true, scale: 1.4 }
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.card{
|
||||
position: relative;
|
||||
}
|
||||
.bg-img {
|
||||
width: 297px;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
margin: auto;
|
||||
}
|
||||
.anim-border {
|
||||
width: 287px;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
height: 465px;
|
||||
margin-left: 13px;
|
||||
overflow: hidden;
|
||||
}
|
||||
.corner {
|
||||
position: absolute;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
}
|
||||
.hero-anim{
|
||||
width: 500px;
|
||||
height: 700px;
|
||||
position: absolute;
|
||||
left: -100px;
|
||||
top: -100px;
|
||||
right: 0;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
}
|
||||
.info-div {
|
||||
background-image: url('~@/assets/main//p3/btn_name.png');
|
||||
width: 270px;
|
||||
height: 115px;
|
||||
position: absolute;
|
||||
bottom: 10px;
|
||||
left: 0;
|
||||
right: 0;
|
||||
margin-right: auto;
|
||||
margin-left: auto;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
}
|
||||
.name-img {
|
||||
height: 39px;
|
||||
width: auto;
|
||||
}
|
||||
.index-label {
|
||||
color: #8FFCEF;
|
||||
font-weight: bold;
|
||||
text-shadow: 0 0 10px #8FFCEF,0 0 20px #8FFCEF,0 0 30px #8FFCEF,0 0 40px #8FFCEF;
|
||||
}
|
||||
.price-label {
|
||||
color: black;
|
||||
font-size: 24px;
|
||||
margin-top: 13px;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
</style>
|
193
src/components/main/CardScroller.vue
Normal file
@ -0,0 +1,193 @@
|
||||
<template>
|
||||
<div class="nft-list">
|
||||
<div class="list-container" id="list-container" ref="listContainer">
|
||||
<div class="scroll-content"
|
||||
:style="scrollStyle"
|
||||
>
|
||||
<div v-for="(datas, index) in cardDatas" :key="index"
|
||||
class="card-container"
|
||||
>
|
||||
<card v-for="data in datas" :data="data" :key="data.id"></card>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="action-bar">
|
||||
<img class="left-btn" src="@/assets/main/p3/icon_left.png" @click="toLeft">
|
||||
<div class="page-ctrl">
|
||||
<div class="page-icon"
|
||||
v-for="(datas, index) in cardDatas"
|
||||
@click="toPage(index)"
|
||||
:key="index" :class="index===currentPage? 'selected': ''"></div>
|
||||
</div>
|
||||
<img class="right-btn" src="@/assets/main/p3/icon_left.png" @click="toRight">
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import { Component, Vue } from 'vue-property-decorator'
|
||||
import Card from '@/components/main/Card.vue'
|
||||
import { ISpineData } from '@/utils/SpineRender'
|
||||
|
||||
@Component({
|
||||
name: 'CardScroller',
|
||||
props: ['datas'],
|
||||
components: {
|
||||
Card
|
||||
}
|
||||
})
|
||||
export default class extends Vue {
|
||||
private heros: ISpineData[] = [
|
||||
{ id: 'hero_n1', skelName: 'pic_hero2', animName: 'animation', repeat: true, scale: 1.4 },
|
||||
{ id: 'hero_n2', skelName: 'pic_hero3', animName: 'animation', repeat: true, scale: 1.4 },
|
||||
{ id: 'hero_n3', skelName: 'pic_hero9', animName: 'animation', repeat: true, scale: 1.4 },
|
||||
{ id: 'hero_n4', skelName: 'pic_hero1', animName: 'animation', repeat: true, scale: 1.4 },
|
||||
{ id: 'hero_n5', skelName: 'pic_hero10', animName: 'animation', repeat: true, scale: 1.4 }
|
||||
]
|
||||
|
||||
private cardDatas: ISpineData[][] = []
|
||||
private currentPage = 0
|
||||
private totalPage = 1
|
||||
private pageSize = 4
|
||||
private scrollWidth = 100
|
||||
private scrollLeft = 0
|
||||
private scrolling = false
|
||||
private scrollTime = 1
|
||||
|
||||
created() {
|
||||
let count = 0
|
||||
// this.scrollWidth = window.getComputedStyle(this.$refs.listContainer).width
|
||||
this.totalPage = Math.ceil(this.heros.length / this.pageSize)
|
||||
let datas: ISpineData[] = []
|
||||
for (let i = 0; i < this.heros.length; i++) {
|
||||
if (count++ < this.pageSize) {
|
||||
datas.push(this.heros[i])
|
||||
} else {
|
||||
count = 0
|
||||
this.cardDatas.push(datas)
|
||||
datas = []
|
||||
datas.push(this.heros[i])
|
||||
}
|
||||
}
|
||||
this.cardDatas.push(datas)
|
||||
const self = this
|
||||
Vue.nextTick(function() {
|
||||
self.scrollWidth = self.$refs.listContainer?.offsetWidth
|
||||
console.log('scrollWidth:', self.scrollWidth)
|
||||
})
|
||||
}
|
||||
|
||||
get scrollStyle() {
|
||||
return {
|
||||
left: this.scrollLeft + 'px',
|
||||
'-webkit-transition': `left ${this.scrollTime}s`,
|
||||
transition: `left ${this.scrollTime}s`
|
||||
}
|
||||
}
|
||||
|
||||
toLeft() {
|
||||
if (!this.scrolling && this.currentPage > 0) {
|
||||
this.currentPage--
|
||||
this.scrolling = true
|
||||
const self = this
|
||||
const target = -(this.currentPage * this.scrollWidth)
|
||||
this.changePos(target, 20, function() {
|
||||
console.log('toLeft end:', self.scrollLeft)
|
||||
self.scrolling = false
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
toRight() {
|
||||
if (!this.scrolling && this.currentPage < this.totalPage - 1) {
|
||||
this.currentPage++
|
||||
const self = this
|
||||
this.scrolling = true
|
||||
const target = -(this.currentPage * this.scrollWidth)
|
||||
this.changePos(target, -20, function() {
|
||||
console.log('toRight end:', self.scrollLeft)
|
||||
self.scrolling = false
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
toPage(index: number) {
|
||||
if (index === this.currentPage || this.scrolling) {
|
||||
return
|
||||
}
|
||||
this.scrolling = true
|
||||
const self = this
|
||||
const target = -(index * this.scrollWidth)
|
||||
const step = index > this.currentPage ? -20 : 20
|
||||
this.currentPage = index
|
||||
this.changePos(target, step, function() {
|
||||
console.log('toPage end:', self.scrollLeft)
|
||||
self.scrolling = false
|
||||
})
|
||||
}
|
||||
|
||||
changePos(target: number, step: number, cb: ()=>void) {
|
||||
this.scrollLeft = target
|
||||
setTimeout(function() {
|
||||
cb()
|
||||
}, this.scrollTime * 1000)
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.nft-list {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
height: 766px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
}
|
||||
.list-container {
|
||||
width: 80vw;
|
||||
height: 570px;
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
}
|
||||
.scroll-content {
|
||||
display: flex;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
}
|
||||
.card-container{
|
||||
display: flex;
|
||||
width: 80vw;
|
||||
}
|
||||
.card{
|
||||
width: 320px;
|
||||
height: 550px;
|
||||
flex: 0 0 auto;
|
||||
}
|
||||
.action-bar {
|
||||
display: flex;
|
||||
width: 90vw;
|
||||
justify-content: space-between;
|
||||
}
|
||||
.right-btn {
|
||||
transform: rotateY(180deg);
|
||||
}
|
||||
.page-ctrl {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
.page-icon{
|
||||
height: 45px;
|
||||
width: 221px;
|
||||
background-image: url('~@/assets/main/p3/icon_deselect.png');
|
||||
background-repeat: no-repeat;
|
||||
background-position: center;
|
||||
}
|
||||
.page-icon.selected{
|
||||
background-image: url('~@/assets/main/p3/icon_selected.png');
|
||||
}
|
||||
|
||||
</style>
|
@ -1,22 +1,112 @@
|
||||
<template>
|
||||
<section id="gameplay_section" data-anchor="gameplay"></section>
|
||||
<section id="gameplay_section" data-anchor="gameplay">
|
||||
<div class="title">
|
||||
<img src="@/assets/main/p2/txt_gameplay.png">
|
||||
<span class="tips">hi you ar</span>
|
||||
</div>
|
||||
<div class="color-view">
|
||||
<img class="logo_t" src="@/assets/main/p1/icon_logo_t.png">
|
||||
<img class="logo_b" src="@/assets/main/p2/txt_battle.png">
|
||||
<span class="text">some thing error</span>
|
||||
<img class="watch_btn" src="@/assets/main/p2/btn_watch.png">
|
||||
</div>
|
||||
<spine-view class="hero-anim" :data="hero" :key="hero.id"></spine-view>
|
||||
<div class="bottom-cover"></div>
|
||||
</section>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import { Component, Vue } from 'vue-property-decorator'
|
||||
import { ISpineData } from '@/utils/SpineRender'
|
||||
import SpineView from '@/components/main/SpineView.vue'
|
||||
|
||||
@Component({
|
||||
name: 'GamePlaySection',
|
||||
components: {
|
||||
SpineView
|
||||
|
||||
}
|
||||
})
|
||||
export default class extends Vue {
|
||||
private hero: ISpineData = { id: 'hero10', skelName: 'pic_hero10', animName: 'animation', repeat: true, scale: 1.2 }
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
#gameplay_section {
|
||||
background-image: url('~@/assets/main//p2/bg_p2.png');
|
||||
background-image: url('~@/assets/main/p2/bg_p2.png');
|
||||
position: relative;
|
||||
}
|
||||
.title {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 38px;
|
||||
right: 0;
|
||||
margin: auto;
|
||||
width: 50vw;
|
||||
height: 200px;
|
||||
}
|
||||
.title img{
|
||||
width: 545px;
|
||||
height: auto;
|
||||
left: 0;
|
||||
right: 0;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
}
|
||||
.title .tips {
|
||||
color: white;
|
||||
font-size: 28px;
|
||||
}
|
||||
.color-view {
|
||||
background-image: url('~@/assets/main/p2/bg_watch.png');
|
||||
background-repeat: no-repeat;
|
||||
width: 78vw;
|
||||
height: 30vw;
|
||||
right: 0;
|
||||
bottom: 18vh;
|
||||
position: absolute;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
padding-bottom: 77px;
|
||||
padding-top: 20px;
|
||||
}
|
||||
.logo_t {
|
||||
width: 151px;
|
||||
height: 112px;
|
||||
}
|
||||
.logo_b{
|
||||
width: 392px;
|
||||
height: 36px;
|
||||
}
|
||||
.color-view .text{
|
||||
color: white;
|
||||
font-size: 28px;
|
||||
}
|
||||
.watch_btn {
|
||||
width: 300px;
|
||||
height: 104px;
|
||||
z-index: 10;
|
||||
}
|
||||
|
||||
.hero-anim {
|
||||
width: 600px;
|
||||
height: 800px;
|
||||
position: absolute;
|
||||
left: 100px;
|
||||
bottom: 10px;
|
||||
}
|
||||
.bottom-cover{
|
||||
position: absolute;
|
||||
left: 0;
|
||||
right: 0;
|
||||
height: 50vh;
|
||||
bottom: 0;
|
||||
background-image: url('~@/assets/main/p2/bg_bottom.png');
|
||||
background-repeat: repeat-x;
|
||||
}
|
||||
</style>
|
||||
|
@ -11,23 +11,32 @@
|
||||
</div>
|
||||
</div>
|
||||
<div class="home_right_panel">
|
||||
<canvas id="home_canvas">
|
||||
|
||||
</canvas>
|
||||
<div class="spine-list">
|
||||
<spine-view class="hero-anim" v-for="hero in heros" :data="hero" :key="hero.id"></spine-view>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import { Component, Vue } from 'vue-property-decorator'
|
||||
import SpineView from '@/components/main/SpineView.vue'
|
||||
import { ISpineData } from '@/utils/SpineRender'
|
||||
|
||||
@Component({
|
||||
name: 'HomeSection',
|
||||
components: {
|
||||
SpineView
|
||||
|
||||
}
|
||||
})
|
||||
export default class extends Vue {
|
||||
private heros: ISpineData[] = [
|
||||
{ id: 'hero1', skelName: 'pic_hero2', animName: 'animation', repeat: true },
|
||||
{ id: 'hero2', skelName: 'pic_hero3', animName: 'animation', repeat: true },
|
||||
{ id: 'hero3', skelName: 'pic_hero9', animName: 'animation', repeat: true },
|
||||
{ id: 'hero4', skelName: 'pic_hero1', animName: 'animation', repeat: true }
|
||||
]
|
||||
}
|
||||
</script>
|
||||
|
||||
@ -38,4 +47,42 @@ export default class extends Vue {
|
||||
flex-direction: row;
|
||||
justify-content: space-between;
|
||||
}
|
||||
.home_left_panel{
|
||||
/* position: absolute;
|
||||
left: 20px;
|
||||
top: 60px;*/
|
||||
width: 686px;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
transform: scale(0.8);
|
||||
|
||||
}
|
||||
.home_left_panel .one_row{
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
.home_left_panel .one_row:first-child{
|
||||
margin-left: -43px;
|
||||
}
|
||||
.version_list_panel {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: space-between;
|
||||
padding-right: 30px;
|
||||
}
|
||||
.home_right_panel {
|
||||
width: 60%;
|
||||
position: relative;
|
||||
display: flex;
|
||||
flex-direction: column-reverse;
|
||||
}
|
||||
.spine-list{
|
||||
display: flex;
|
||||
}
|
||||
.hero-anim {
|
||||
width: 400px;
|
||||
height: 800px;
|
||||
margin-left: -90px;
|
||||
margin-right: -90px;
|
||||
}
|
||||
</style>
|
||||
|
@ -98,10 +98,7 @@ export default class extends Vue {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
.menu_fullpage ul li {
|
||||
padding-top: 28px;
|
||||
padding-left: 10px;
|
||||
padding-right: 10px;
|
||||
padding-bottom: 0;
|
||||
padding: 28px 10px 0;
|
||||
display: list-item;
|
||||
text-align: -webkit-match-parent;
|
||||
margin-left: 30px;
|
||||
|
@ -1,22 +1,58 @@
|
||||
<template>
|
||||
<section id="nft_section" data-anchor="nft"></section>
|
||||
<section id="nft_section" data-anchor="nft">
|
||||
<div class="title">
|
||||
<img src="@/assets/main/p3/txt_title.png">
|
||||
<span class="text">how old are you</span>
|
||||
</div>
|
||||
<card-scroller class="card-scroller"></card-scroller>
|
||||
</section>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import { Component, Vue } from 'vue-property-decorator'
|
||||
import CardScroller from '@/components/main/CardScroller.vue'
|
||||
import { ISpineData } from '@/utils/SpineRender'
|
||||
|
||||
@Component({
|
||||
name: 'NftSection',
|
||||
components: {
|
||||
CardScroller
|
||||
|
||||
}
|
||||
})
|
||||
export default class extends Vue {
|
||||
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
#nft_section {
|
||||
background-image: url('~@/assets/main//p3/bg_p3.png');
|
||||
position: relative;
|
||||
}
|
||||
.title {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
}
|
||||
.title img {
|
||||
width: 562px;
|
||||
height: auto;
|
||||
}
|
||||
.title .text{
|
||||
color: white;
|
||||
font-size: 28px;
|
||||
}
|
||||
.card-scroller {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
height: 766px;
|
||||
}
|
||||
|
||||
</style>
|
||||
|
49
src/components/main/SpineView.vue
Normal file
@ -0,0 +1,49 @@
|
||||
<template>
|
||||
<canvas class="spine-canvas" :id="data.id"></canvas>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import { Component, Vue } from 'vue-property-decorator'
|
||||
import { ISpineData, SpineRender } from '@/utils/SpineRender'
|
||||
|
||||
declare module 'vue/types/vue' {
|
||||
interface Vue {
|
||||
data: ISpineData
|
||||
}
|
||||
}
|
||||
|
||||
@Component({
|
||||
name: 'SpineView',
|
||||
props: ['data'],
|
||||
components: {
|
||||
|
||||
}
|
||||
})
|
||||
export default class extends Vue {
|
||||
created() {
|
||||
this.showAnim((canvas: HTMLCanvasElement) => {
|
||||
const spineCard = new SpineRender(canvas)
|
||||
spineCard.init(this.data)
|
||||
})
|
||||
}
|
||||
|
||||
showAnim(cb: (result: HTMLCanvasElement) => void) {
|
||||
const self = this
|
||||
const canvas = document.getElementById(this.data!.id) as HTMLCanvasElement
|
||||
if (!canvas) {
|
||||
setTimeout(function() {
|
||||
self.showAnim(cb)
|
||||
}, 1000)
|
||||
} else {
|
||||
cb(canvas)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.spine-canvas{
|
||||
width: 100px;
|
||||
height: 200px;
|
||||
}
|
||||
</style>
|
1596
src/spine-webgl.d.ts
vendored
Executable file
185
src/utils/SpineRender.ts
Normal file
@ -0,0 +1,185 @@
|
||||
export interface ISpineData {
|
||||
id: string
|
||||
skelName: string
|
||||
animName: string
|
||||
repeat: boolean
|
||||
scale?: number
|
||||
}
|
||||
|
||||
export class SpineRender {
|
||||
private mvp : spine.webgl.Matrix4
|
||||
private canvas: HTMLCanvasElement
|
||||
private lastFrameTime: number
|
||||
private skeletons: any = {}
|
||||
private pathBase: string
|
||||
private gl: WebGLRenderingContext
|
||||
private skelName = ''
|
||||
private animName = ''
|
||||
private shader: spine.webgl.Shader
|
||||
private batcher: spine.webgl.PolygonBatcher
|
||||
private skeletonRenderer
|
||||
private shapes
|
||||
private assetManager
|
||||
private scale = 1.5
|
||||
|
||||
constructor(canvas: HTMLCanvasElement) {
|
||||
const config = { alpha: true }
|
||||
this.mvp = new spine.webgl.Matrix4()
|
||||
this.lastFrameTime = Date.now() / 1000
|
||||
this.canvas = canvas
|
||||
this.skeletons = {}
|
||||
this.pathBase = 'assets/spines/'
|
||||
this.gl = this.canvas.getContext('webgl', config) as WebGLRenderingContext || this.canvas.getContext('experimental-webgl', config) as WebGLRenderingContext
|
||||
if (!this.gl) {
|
||||
alert('WebGL is unavailable.')
|
||||
}
|
||||
this.shader = spine.webgl.Shader.newTwoColoredTextured(this.gl)
|
||||
this.batcher = new spine.webgl.PolygonBatcher(this.gl)
|
||||
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
|
||||
// @ts-ignore
|
||||
this.skeletonRenderer = new spine.webgl.SkeletonRenderer(this.gl)
|
||||
|
||||
this.shapes = new spine.webgl.ShapeRenderer(this.gl)
|
||||
this.assetManager = new spine.webgl.AssetManager(this.gl)
|
||||
}
|
||||
|
||||
init({ skelName, animName, scale, repeat }: ISpineData) {
|
||||
this.skelName = skelName
|
||||
this.animName = animName
|
||||
this.scale = scale || this.scale
|
||||
// Create a simple shader, mesh, model-view-projection matrix and SkeletonRenderer.
|
||||
this.mvp.ortho2d(0, 0, this.canvas.width - 1, this.canvas.height - 1)
|
||||
this.assetManager.loadText(this.pathBase + skelName + '.json')
|
||||
this.assetManager.loadText(this.pathBase + skelName + '.atlas')
|
||||
this.assetManager.loadTexture(this.pathBase + skelName + '.png')
|
||||
|
||||
requestAnimationFrame(this.load.bind(this))
|
||||
}
|
||||
|
||||
load() {
|
||||
// Wait until the AssetManager has loaded all resources, then load the skeletons.
|
||||
if (this.assetManager.isLoadingComplete()) {
|
||||
this.skeletons[this.skelName] = this.loadSkeleton(this.skelName, this.animName, true)
|
||||
|
||||
requestAnimationFrame(this.render.bind(this))
|
||||
} else {
|
||||
requestAnimationFrame(this.load.bind(this))
|
||||
}
|
||||
}
|
||||
|
||||
loadSkeleton(name: string, initialAnimation: string, premultipliedAlpha: boolean, skin = 'default') {
|
||||
// Load the texture atlas using name.atlas and name.png from the AssetManager.
|
||||
// The function passed to TextureAtlas is used to resolve relative paths.
|
||||
const self = this
|
||||
const atlas = new spine.TextureAtlas(this.assetManager.get(this.pathBase + name + '.atlas'), function(path: string) {
|
||||
return self.assetManager.get(self.pathBase + path)
|
||||
})
|
||||
|
||||
// Create a AtlasAttachmentLoader that resolves region, mesh, boundingbox and path attachments
|
||||
const atlasLoader = new spine.AtlasAttachmentLoader(atlas)
|
||||
|
||||
// Create a SkeletonJson instance for parsing the .json file.
|
||||
const skeletonJson = new spine.SkeletonJson(atlasLoader)
|
||||
|
||||
// Set the scale to apply during parsing, parse the file, and create a new skeleton.
|
||||
const skeletonData = skeletonJson.readSkeletonData(this.assetManager.get(this.pathBase + name + '.json'))
|
||||
const skeleton = new spine.Skeleton(skeletonData)
|
||||
skeleton.setSkinByName(skin)
|
||||
const bounds = this.calculateBounds(skeleton)
|
||||
|
||||
// Create an AnimationState, and set the initial animation in looping mode.
|
||||
const animationStateData = new spine.AnimationStateData(skeleton.data)
|
||||
const animationState = new spine.AnimationState(animationStateData)
|
||||
animationState.setAnimation(0, initialAnimation, true)
|
||||
animationState.addListener({
|
||||
start: function(track: spine.TrackEntry) {
|
||||
console.log('Animation on track ' + track.trackIndex + ' started')
|
||||
},
|
||||
interrupt: function(track: spine.TrackEntry) {
|
||||
console.log('Animation on track ' + track.trackIndex + ' interrupted')
|
||||
},
|
||||
end: function(track: spine.TrackEntry) {
|
||||
console.log('Animation on track ' + track.trackIndex + ' ended')
|
||||
},
|
||||
dispose: function(track: spine.TrackEntry) {
|
||||
console.log('Animation on track ' + track.trackIndex + ' disposed')
|
||||
},
|
||||
complete: function(track: spine.TrackEntry) {
|
||||
console.log('Animation on track ' + track.trackIndex + ' completed')
|
||||
},
|
||||
event: function(track: spine.TrackEntry, event: spine.Event) {
|
||||
console.log('Event on track ' + track.trackIndex + ': ' + JSON.stringify(event))
|
||||
}
|
||||
})
|
||||
|
||||
// Pack everything up and return to caller.
|
||||
return { skeleton: skeleton, state: animationState, bounds: bounds, premultipliedAlpha: premultipliedAlpha }
|
||||
}
|
||||
|
||||
calculateBounds(skeleton: any) {
|
||||
skeleton.setToSetupPose()
|
||||
skeleton.updateWorldTransform()
|
||||
const offset = new spine.Vector2()
|
||||
const size = new spine.Vector2()
|
||||
skeleton.getBounds(offset, size, [])
|
||||
return { offset: offset, size: size }
|
||||
}
|
||||
|
||||
render() {
|
||||
const now = Date.now() / 1000
|
||||
const delta = now - this.lastFrameTime
|
||||
this.lastFrameTime = now
|
||||
|
||||
// Update the MVP matrix to adjust for canvas size changes
|
||||
this.resize()
|
||||
|
||||
this.gl.clearColor(0, 0, 0, 0)
|
||||
this.gl.clear(this.gl.COLOR_BUFFER_BIT)
|
||||
|
||||
// Apply the animation state based on the delta time.
|
||||
const state = this.skeletons[this.skelName].state
|
||||
const skeleton = this.skeletons[this.skelName].skeleton
|
||||
const premultipliedAlpha = this.skeletons[this.skelName].premultipliedAlpha
|
||||
state.update(delta)
|
||||
state.apply(skeleton)
|
||||
skeleton.updateWorldTransform()
|
||||
|
||||
// Bind the shader and set the texture and model-view-projection matrix.
|
||||
this.shader.bind()
|
||||
this.shader.setUniformi(spine.webgl.Shader.SAMPLER, 0)
|
||||
this.shader.setUniform4x4f(spine.webgl.Shader.MVP_MATRIX, this.mvp.values)
|
||||
|
||||
// Start the batch and tell the SkeletonRenderer to render the active skeleton.
|
||||
this.batcher.begin(this.shader)
|
||||
this.skeletonRenderer.premultipliedAlpha = premultipliedAlpha
|
||||
this.skeletonRenderer.draw(this.batcher, skeleton)
|
||||
this.batcher.end()
|
||||
|
||||
this.shader.unbind()
|
||||
|
||||
requestAnimationFrame(this.render.bind(this))
|
||||
}
|
||||
|
||||
resize() {
|
||||
const w = this.canvas.clientWidth
|
||||
const h = this.canvas.clientHeight
|
||||
const bounds = this.skeletons[this.skelName].bounds
|
||||
if (this.canvas.width !== w || this.canvas.height !== h) {
|
||||
this.canvas.width = w
|
||||
this.canvas.height = h
|
||||
}
|
||||
|
||||
// magic
|
||||
const centerX = bounds.offset.x + bounds.size.x / 2
|
||||
const centerY = bounds.offset.y + bounds.size.y / 2
|
||||
const scaleX = bounds.size.x / this.canvas.width
|
||||
const scaleY = bounds.size.y / this.canvas.height
|
||||
let scale = Math.max(scaleX, scaleY) * this.scale
|
||||
if (scale < 1) scale = 1
|
||||
const width = this.canvas.width * scale
|
||||
const height = this.canvas.height * scale
|
||||
|
||||
this.mvp.ortho2d(centerX - width / 2, centerY - height / 2, width, height)
|
||||
this.gl.viewport(0, 0, this.canvas.width, this.canvas.height)
|
||||
}
|
||||
}
|
@ -12,6 +12,7 @@
|
||||
"allowSyntheticDefaultImports": true,
|
||||
"sourceMap": true,
|
||||
"baseUrl": ".",
|
||||
"allowJs": true,
|
||||
"types": [
|
||||
"webpack-env"
|
||||
],
|
||||
|