1.3.5 • Published 8 years ago
timepack-album v1.3.5
timepack-album
timepack相簿组件包和工具类
Build Setup
# install dependencies
npm install 'timepack-album' --save组件API
AlbumGlobal
相簿全局预览组件
使用
import {AlbumGlobal} from 'timepack-album'入参
| 名称 | 类型 | 含义 |
|---|---|---|
| product | Object | 产品参数(包含产品类型:相簿/台历) |
| layout | Array | 容器数据 |
| photoList | Array | 相簿数据 |
方法
| 名称 | 参数 | 含义 |
|---|---|---|
| change | (photoList,layout) | 数据结构变更,反馈变更数据,供父组件处理 |
| upload | 无 | 触发上传事件 |
AlbumGallery
照片库组件,提供图片的修改删除上传和选择操作
使用
import {AlbumGallery} from 'timepack-album'入参
| 名称 | 类型 | 含义 |
|---|---|---|
| layout | Array | 容器数据 |
| photoList | Array | 相簿数据 |
| mode | String | 上传模式,有group,single |
方法
| 名称 | 参数 | 含义 |
|---|---|---|
| load | 无 | 懒加载图片列表的请求 |
| pageChange | 无 | 懒加载图片列表页数变更 |
| delete | (ids,groupIndex,imageIndex) | 删除图片 |
| upload | 无 | 安卓端图片上传 |
| save | data源图片信息数据 | 图片上传保存到服务端 |
| confirm | data相簿图片信息数据 | 点击确认按钮,同步图片数据结构 |
| afterImageLoaded | (page,data) | 由父组件触发,图片加载完成后调用 |
| afterTokenCreated | uptoken | 由父组件触发,获取到七牛token后调用 |
| afterImageDeleted | (groupIndex,imageIndex) | 由父组件触发,图片删除后调用 |
| afterImageSaved | data源图片信息数据 | 由父组件触发,图片保存完成后调用 |
工具API
TimepackQiniu
使用
import {TimepackQiniu} from 'timepack-album'TimepackUtil
使用
import {TimepackUtil} from 'timepack-album'方法
| method | return | description |
|---|---|---|
| getQueryByName(str) | String or Null | get url query-value by query-key |
| isTelephone(str) | Boolean | judge string is telephone or not |
| dateFormat(date,fmt) | String | format date |
| removeArrayItem(array,index) | String | remove item from an array |
| browser().isIE() | Boolean | judge current browser is ie or not |
| browser().isFirefox() | Boolean | judge current browser is firefox or not |
| browser().isChrome() | Boolean | judge current browser is chrome or not |
| browser().isAndroid() | Boolean | judge current browser is android or not |
| browser().isIOS() | Boolean | judge current browser is ios or not |
| browser().isWeixin() | Boolean | judge current browser is wechat or not |
| string().trim(str) | String | trim string |
| string().isEmpty(str) | String | judge the input string is empty |
| string().isNotEmpty(str) | String | judge the input string is not empty |
| string().isBlank(str) | String | judge the input string is blank |
| string().isNotBlank(str) | String | judge the input string is blank |
| fileUploader(param,callback) | No Return | upload a file to server through qiniu |
fileUploader method statement
| param | default | required |
|---|---|---|
| fileType | jpg,png,jpeg | false |
| buttonId | null | true |
| uptoken | null | true |
| domain | https://images.cache.timepack.cn/ | true |
| size | 4mb | false |
| callback | description | required |
|---|---|---|
| added | trigger when files have been added | false |
| progress | trigger when a file were uploading | false |
| complete | trigger when a file uploading event completed | false |
| uploaded | trigger when a file uploading successfully | true |
| error | trigger when a file uploading event came across an error | false |
AlbumCanvas
相簿图片自动合成,拖拽,旋转,删除核心模块
render(photo,layout,temp)
init()
初始化相簿数据
compatable()
跨设备分享,数据兼容处理
getter()
template(index):模板图片photo(pageIndex,imageIndex):radio(index):获取容器的长宽比rest():获取整页剩余的未填充数量pageRest(index):获取指定页数空区域的数量(即未填充的数量)
setter()
editPageStyle(pageIndex,imageIndex,editWidth,editable):单页容器模板样式photoStyle(pageIndex,imageIndex):单页图片样式groupImage($list): 用jquery对象列表批量填充图片listImage(list):用图片数据列表填充图片fillImageByPage($list,page):根据页数填充图片indexImage($list, page, index):单页内根据下标填充图片
operate()
exchange(pageIndex,lastIndex,currentIndex):更换图片间顺序rotate(pageIndex,imageIndex):顺时针旋转图片90度zoomImage(pageIndex,index,type):放大或缩小图片,type-1放大,type-2缩小convert($list):图片jquery对象转换为可用的数据结构changeLayout(index):修改容器模板
delete()
deleteImageByIndex(pageIndex,imageIndex):删除指定页内指定图片
event
touchstart(e,target):touchmove(e, startPosition, position, target):touchend(e, page, index, position, target):
1.3.5
8 years ago
1.3.4
8 years ago
1.3.3
8 years ago
1.3.2
8 years ago
1.3.1
8 years ago
1.3.0
8 years ago
1.2.9
8 years ago
1.2.8
8 years ago
1.2.7
8 years ago
1.2.6
8 years ago
1.2.5
8 years ago
1.2.4
8 years ago
1.2.3
8 years ago
1.2.2
8 years ago
1.2.1
8 years ago
1.2.0
8 years ago
1.1.30
8 years ago
1.1.29
8 years ago
1.1.28
8 years ago
1.1.27
8 years ago
1.1.26
8 years ago
1.1.25
8 years ago
1.1.24
8 years ago
1.1.23
8 years ago
1.1.22
8 years ago
1.1.21
8 years ago
1.1.20
8 years ago
1.1.19
8 years ago
1.1.18
8 years ago
1.1.17
8 years ago
1.1.16
8 years ago
1.1.15
8 years ago
1.1.14
8 years ago
1.1.13
8 years ago
1.1.12
8 years ago
1.1.11
8 years ago
1.1.10
8 years ago
1.1.9
8 years ago
1.1.8
8 years ago
1.1.7
8 years ago
1.1.6
8 years ago
1.1.5
8 years ago
1.1.4
8 years ago
1.1.3
8 years ago
1.1.2
8 years ago
1.1.1
8 years ago
1.1.0
8 years ago