├── README.md └── wejoke ├── app.js ├── app.json ├── app.wxss ├── images ├── res │ └── charming.jpg └── tabbar │ ├── tabbar_contacts.png │ ├── tabbar_contactshl.png │ ├── tabbar_discover.png │ ├── tabbar_discoverhl.png │ ├── tabbar_mainframe.png │ ├── tabbar_mainframehl.png │ ├── tabbar_me.png │ └── tabbar_mehl.png ├── pages ├── imageJoke │ ├── imageJoke.js │ ├── imageJoke.json │ ├── imageJoke.wxml │ └── imageJoke.wxss ├── joke │ ├── joke.js │ ├── joke.json │ ├── joke.wxml │ └── joke.wxss └── video │ ├── video.js │ ├── video.json │ ├── video.wxml │ └── video.wxss └── utils └── util.js /README.md: -------------------------------------------------------------------------------- 1 | # wejoke 2 | 微笑话--微信小程序 3 | 4 | ##一个非常简单的微信小程序实例 5 | - 包括三个模块 6 | - 文字笑话 7 | - 图片笑话 8 | - 搞笑视频 9 | 10 | --- 11 | 12 | - Api 来源 13 | - [ShowAPI ](https://www.showapi.com/api/lookPoint/341) 14 | 15 | 16 | 17 | ## 文字笑话 ## 18 | 19 | - ![](http://ww2.sinaimg.cn/large/81eeb0fcgw1fbmh0xictpj20f00qo76m.jpg) 20 | 21 | ## 图片笑话 ## 22 | ![](http://ww2.sinaimg.cn/large/81eeb0fcgw1fbmh204xrxj20f00qota1.jpg) 23 | 24 | ## 搞笑视频 ## 25 | 26 | ![](http://ww2.sinaimg.cn/large/81eeb0fcgw1fbmh2lx0juj20f00qogm4.jpg) -------------------------------------------------------------------------------- /wejoke/app.js: -------------------------------------------------------------------------------- 1 | //app.js 2 | App({ 3 | onLaunch: function () { 4 | //调用API从本地缓存中获取数据 5 | var logs = wx.getStorageSync('logs') || [] 6 | logs.unshift(Date.now()) 7 | wx.setStorageSync('logs', logs) 8 | }, 9 | getUserInfo:function(cb){ 10 | var that = this 11 | if(this.globalData.userInfo){ 12 | typeof cb == "function" && cb(this.globalData.userInfo) 13 | }else{ 14 | //调用登录接口 15 | wx.login({ 16 | success: function () { 17 | wx.getUserInfo({ 18 | success: function (res) { 19 | that.globalData.userInfo = res.userInfo 20 | typeof cb == "function" && cb(that.globalData.userInfo) 21 | } 22 | }) 23 | } 24 | }) 25 | } 26 | }, 27 | globalData:{ 28 | userInfo:null 29 | } 30 | }) -------------------------------------------------------------------------------- /wejoke/app.json: -------------------------------------------------------------------------------- 1 | { 2 | "pages":[ 3 | "pages/joke/joke", 4 | "pages/imageJoke/imageJoke", 5 | "pages/video/video" 6 | ], 7 | "window":{ 8 | "backgroundTextStyle":"light", 9 | "navigationBarBackgroundColor": "#fff", 10 | "navigationBarTitleText": "WeChat", 11 | "navigationBarTextStyle":"black" 12 | },"tabBar": { 13 | "selectedColor": "#d18914", 14 | "color": "#999999", 15 | "list": [ 16 | 17 | { 18 | "pagePath": "pages/joke/joke", 19 | "text": "文字笑话", 20 | "iconPath": "images/tabbar/tabbar_contacts.png", 21 | "selectedIconPath": "images/tabbar/tabbar_contactshl.png" 22 | } 23 | ,{ 24 | "pagePath": "pages/imageJoke/imageJoke", 25 | "text": "图片笑话", 26 | "iconPath": "images/tabbar/tabbar_contacts.png", 27 | "selectedIconPath": "images/tabbar/tabbar_contactshl.png" 28 | } ,{ 29 | "pagePath": "pages/video/video", 30 | "text": "视频笑话", 31 | "iconPath": "images/tabbar/tabbar_contacts.png", 32 | "selectedIconPath": "images/tabbar/tabbar_contactshl.png" 33 | } 34 | 35 | 36 | 37 | ] 38 | 39 | } 40 | } 41 | -------------------------------------------------------------------------------- /wejoke/app.wxss: -------------------------------------------------------------------------------- 1 | /**app.wxss**/ 2 | .container { 3 | height: 100%; 4 | display: flex; 5 | flex-direction: column; 6 | align-items: center; 7 | justify-content: space-between; 8 | padding: 200rpx 0; 9 | box-sizing: border-box; 10 | } 11 | -------------------------------------------------------------------------------- /wejoke/images/res/charming.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/zszdevelop/wejoke/a1149498c6c160cf4e43dac86188d7760a9d66a4/wejoke/images/res/charming.jpg -------------------------------------------------------------------------------- /wejoke/images/tabbar/tabbar_contacts.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/zszdevelop/wejoke/a1149498c6c160cf4e43dac86188d7760a9d66a4/wejoke/images/tabbar/tabbar_contacts.png -------------------------------------------------------------------------------- /wejoke/images/tabbar/tabbar_contactshl.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/zszdevelop/wejoke/a1149498c6c160cf4e43dac86188d7760a9d66a4/wejoke/images/tabbar/tabbar_contactshl.png -------------------------------------------------------------------------------- /wejoke/images/tabbar/tabbar_discover.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/zszdevelop/wejoke/a1149498c6c160cf4e43dac86188d7760a9d66a4/wejoke/images/tabbar/tabbar_discover.png -------------------------------------------------------------------------------- /wejoke/images/tabbar/tabbar_discoverhl.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/zszdevelop/wejoke/a1149498c6c160cf4e43dac86188d7760a9d66a4/wejoke/images/tabbar/tabbar_discoverhl.png -------------------------------------------------------------------------------- /wejoke/images/tabbar/tabbar_mainframe.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/zszdevelop/wejoke/a1149498c6c160cf4e43dac86188d7760a9d66a4/wejoke/images/tabbar/tabbar_mainframe.png -------------------------------------------------------------------------------- /wejoke/images/tabbar/tabbar_mainframehl.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/zszdevelop/wejoke/a1149498c6c160cf4e43dac86188d7760a9d66a4/wejoke/images/tabbar/tabbar_mainframehl.png -------------------------------------------------------------------------------- /wejoke/images/tabbar/tabbar_me.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/zszdevelop/wejoke/a1149498c6c160cf4e43dac86188d7760a9d66a4/wejoke/images/tabbar/tabbar_me.png -------------------------------------------------------------------------------- /wejoke/images/tabbar/tabbar_mehl.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/zszdevelop/wejoke/a1149498c6c160cf4e43dac86188d7760a9d66a4/wejoke/images/tabbar/tabbar_mehl.png -------------------------------------------------------------------------------- /wejoke/pages/imageJoke/imageJoke.js: -------------------------------------------------------------------------------- 1 | //logs.js 2 | var util = require('../../utils/util.js') 3 | var page = 1 4 | Page({ 5 | data: { 6 | logs: [], 7 | array: [] 8 | }, 9 | onLoad: function () { 10 | var that = this 11 | this.setData({ 12 | 13 | // map(function (log) { 14 | // return util.formatTime(new Date(log)) 15 | }) 16 | this.requestNet(); 17 | }, 18 | 19 | requestNet: function () { 20 | console.log('请求网络数据开始'); 21 | var that = this 22 | let _artArray =[]; 23 | wx.request({ 24 | url: 'https://route.showapi.com/341-2?showapi_sign=ef07e49819e24259a37cebf35a208135&showapi_appid=27240&page='+page++, 25 | data: { 26 | // showapi_appid: '27240', 27 | // showapi_sign: 'ef07e49819e24259a37cebf35a208135' 28 | }, 29 | method: 'GET', // OPTIONS, GET, HEAD, POST, PUT, DELETE, TRACE, CONNECT 30 | // header: {}, // 设置请求的 header 31 | success: function (res) { 32 | // success 33 | var s = res.data; 34 | var v = s.showapi_res_code; 35 | var datas = s.showapi_res_body; 36 | var contentlists = datas.contentlist; 37 | contentlists.map(function (num) { 38 | return _artArray.push({message:num.title,content:num.text,src:num.img}); 39 | } 40 | ); 41 | that.setData({ 42 | array:_artArray 43 | }) 44 | 45 | 46 | }, 47 | fail: function () { 48 | // fail 49 | }, 50 | complete: function () { 51 | // complete 52 | } 53 | }) 54 | }, 55 | 56 | 57 | 58 | addNumberToFront: function(e){ 59 | 60 | // this.data.numberArray = [ this.data.numberArray.length + 1 ].concat(this.data.numberArray) 61 | // this.setData({ 62 | // numberArray: this.data.numberArray 63 | // }) 64 | }, 65 | 66 | upper: function(e) { 67 | console.log("upper>>>>>>>>>"+e) 68 | this.requestNet(); 69 | }, 70 | lower: function(e) { 71 | console.log("lower>>>>>>>>>"+e) 72 | this.requestNet(); 73 | }, 74 | scroll: function(e) { 75 | console.log("scroll>>>>>>>>>"+e) 76 | }, 77 | tap: function(e) { 78 | console.log("tap>>>>>>>>>"+e) 79 | for (var i = 0; i < order.length; ++i) { 80 | if (order[i] === this.data.toView) { 81 | this.setData({ 82 | toView: order[i + 1] 83 | }) 84 | break 85 | } 86 | } 87 | }, 88 | tapMove: function(e) { 89 | console.log("tapMove>>>>>>>>>"+e) 90 | this.setData({ 91 | scrollTop: this.data.scrollTop + 10 92 | }) 93 | } 94 | 95 | }) 96 | -------------------------------------------------------------------------------- /wejoke/pages/imageJoke/imageJoke.json: -------------------------------------------------------------------------------- 1 | { 2 | "navigationBarTitleText": "图片笑话" 3 | } -------------------------------------------------------------------------------- /wejoke/pages/imageJoke/imageJoke.wxml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 8 | 9 | 10 | 11 | {{index}}: {{item.message}}:{{item.content}} 12 | 13 | \n\n\n 14 | 15 | 16 | 17 | 21 | 22 | -------------------------------------------------------------------------------- /wejoke/pages/imageJoke/imageJoke.wxss: -------------------------------------------------------------------------------- 1 | .log-list { 2 | display: flex; 3 | flex-direction: column; 4 | padding: 40rpx; 5 | } 6 | .log-item { 7 | margin: 10rpx; 8 | } 9 | -------------------------------------------------------------------------------- /wejoke/pages/joke/joke.js: -------------------------------------------------------------------------------- 1 | //logs.js 2 | var util = require('../../utils/util.js') 3 | var page = 1 4 | Page({ 5 | data: { 6 | logs: [], 7 | array: [] 8 | }, 9 | onLoad: function () { 10 | var that = this 11 | 12 | this.setData({ 13 | 14 | // map(function (log) { 15 | // return util.formatTime(new Date(log)) 16 | }) 17 | console.log('onLoad 方法执行了吗'); 18 | this.requestNet(); 19 | }, 20 | upper: function(e) { 21 | console.log("upper>>>>>>>>>"+e) 22 | this.requestNet(); 23 | }, 24 | lower: function(e) { 25 | console.log("lower>>>>>>>>>"+e) 26 | this.requestNet(); 27 | }, 28 | scroll: function(e) { 29 | console.log("scroll>>>>>>>>>"+e) 30 | }, 31 | tap: function(e) { 32 | console.log("tap>>>>>>>>>"+e) 33 | for (var i = 0; i < order.length; ++i) { 34 | if (order[i] === this.data.toView) { 35 | this.setData({ 36 | toView: order[i + 1] 37 | }) 38 | break 39 | } 40 | } 41 | }, 42 | tapMove: function(e) { 43 | console.log("tapMove>>>>>>>>>"+e) 44 | this.setData({ 45 | scrollTop: this.data.scrollTop + 10 46 | }) 47 | }, 48 | // onShow:function(){ 49 | // console.log('onShow 方法执行了吗'); 50 | // this.requestNet(); 51 | // }, 52 | 53 | requestNet: function () { 54 | console.log('请求网络数据开始'); 55 | // wx.showToast({ 56 | // title:'加载中...' 57 | // }) 58 | var that = this 59 | let _artArray =[]; 60 | wx.request({ 61 | url: 'https://route.showapi.com/341-1?showapi_sign=ef07e49819e24259a37cebf35a208135&showapi_appid=27240&page='+page++, 62 | data: { 63 | // showapi_appid: '27240', 64 | // showapi_sign: 'ef07e49819e24259a37cebf35a208135' 65 | }, 66 | method: 'GET', // OPTIONS, GET, HEAD, POST, PUT, DELETE, TRACE, CONNECT 67 | // header: {}, // 设置请求的 header 68 | success: function (res) { 69 | // success 70 | var s = res.data; 71 | var v = s.showapi_res_code; 72 | var datas = s.showapi_res_body; 73 | var contentlists = datas.contentlist; 74 | contentlists.map(function (num) { 75 | return _artArray.push({message:num.title,content:num.text}); 76 | } 77 | ); 78 | that.setData({ 79 | array:_artArray 80 | }) 81 | 82 | 83 | }, 84 | fail: function () { 85 | // fail 86 | }, 87 | complete: function () { 88 | // complete 89 | } 90 | }) 91 | } 92 | }) 93 | -------------------------------------------------------------------------------- /wejoke/pages/joke/joke.json: -------------------------------------------------------------------------------- 1 | { 2 | "navigationBarTitleText": "文字笑话" 3 | } -------------------------------------------------------------------------------- /wejoke/pages/joke/joke.wxml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 5 | 8 | 9 | 10 | 11 | 12 | {{index}}: {{item.message}}:{{item.content}} 13 | \n\n\n\n 14 | 15 | 16 | 17 | 21 | 22 | -------------------------------------------------------------------------------- /wejoke/pages/joke/joke.wxss: -------------------------------------------------------------------------------- 1 | .log-list { 2 | display: flex; 3 | flex-direction: column; 4 | padding: 40rpx; 5 | } 6 | .log-item { 7 | margin: 10rpx; 8 | } 9 | -------------------------------------------------------------------------------- /wejoke/pages/video/video.js: -------------------------------------------------------------------------------- 1 | //logs.js 2 | var util = require('../../utils/util.js') 3 | function getRandomColor () { 4 | let rgb = [] 5 | for (let i = 0 ; i < 3; ++i){ 6 | let color = Math.floor(Math.random() * 256).toString(16) 7 | color = color.length == 1 ? '0' + color : color 8 | rgb.push(color) 9 | } 10 | return '#' + rgb.join('') 11 | } 12 | Page({ 13 | data: { 14 | logs: [] 15 | }, 16 | onLoad: function () { 17 | this.setData({ 18 | logs: (wx.getStorageSync('logs') || []).map(function (log) { 19 | return util.formatTime(new Date(log)) 20 | }) 21 | }) 22 | }, 23 | 24 | 25 | onReady: function (res) { 26 | this.videoContext = wx.createVideoContext('myVideo') 27 | }, 28 | inputValue: '', 29 | data: { 30 | src: '', 31 | danmuList: [ 32 | { 33 | text: '第 1s 出现的弹幕', 34 | color: '#ff0000', 35 | time: 1 36 | }, 37 | { 38 | text: '第 3s 出现的弹幕', 39 | color: '#ff00ff', 40 | time: 3 41 | } 42 | ] 43 | }, 44 | bindInputBlur: function(e) { 45 | this.inputValue = e.detail.value 46 | }, 47 | bindButtonTap: function() { 48 | var that = this 49 | wx.chooseVideo({ 50 | sourceType: ['album', 'camera'], 51 | maxDuration: 60, 52 | camera: ['front','back'], 53 | success: function(res) { 54 | that.setData({ 55 | src: res.tempFilePath 56 | }) 57 | } 58 | }) 59 | }, 60 | bindSendDanmu: function () { 61 | this.videoContext.sendDanmu({ 62 | text: this.inputValue, 63 | color: getRandomColor() 64 | }) 65 | }, 66 | videoErrorCallback: function(e) { 67 | console.log('视频错误信息:') 68 | console.log(e.detail.errMsg) 69 | } 70 | 71 | } 72 | ) 73 | -------------------------------------------------------------------------------- /wejoke/pages/video/video.json: -------------------------------------------------------------------------------- 1 | { 2 | "navigationBarTitleText": "搞笑视频" 3 | } -------------------------------------------------------------------------------- /wejoke/pages/video/video.wxml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 16 | -------------------------------------------------------------------------------- /wejoke/pages/video/video.wxss: -------------------------------------------------------------------------------- 1 | .log-list { 2 | display: flex; 3 | flex-direction: column; 4 | padding: 40rpx; 5 | } 6 | .log-item { 7 | margin: 10rpx; 8 | } 9 | -------------------------------------------------------------------------------- /wejoke/utils/util.js: -------------------------------------------------------------------------------- 1 | function formatTime(date) { 2 | var year = date.getFullYear() 3 | var month = date.getMonth() + 1 4 | var day = date.getDate() 5 | 6 | var hour = date.getHours() 7 | var minute = date.getMinutes() 8 | var second = date.getSeconds() 9 | 10 | 11 | return [year, month, day].map(formatNumber).join('/') + ' ' + [hour, minute, second].map(formatNumber).join(':') 12 | } 13 | 14 | function formatNumber(n) { 15 | n = n.toString() 16 | return n[1] ? n : '0' + n 17 | } 18 | 19 | module.exports = { 20 | formatTime: formatTime 21 | } 22 | --------------------------------------------------------------------------------