The dog egg TV

Dogegg TV is an App based on wechat small program development. Every day gordanLee recommends a song, an article, a short video, and a small amount of time for ten minutes a day to light up your heart. At present, it is divided into three modules: music, short video and film review.

  • Online open source address github.com/lishuaixing… Give it a like!
  • Applets development documentation

All of the following apis are provided by the product company and obtained from the Internet. The acquisition and sharing may infringe the rights and interests of the product. If told to stop sharing and using, I will delete this page and the whole project in time. Please understand the situation and abide by the product agreement.

In order to facilitate your learning and testing, we provide HTTPS interface for you to use, and use and cherish. Please add the request legitimate domain name in the wechat development Settings, or select not to verify the legitimate domain name, Web-view (service domain name), TLS version, and HTTPS certificate in the development Settings.

Thanks and support

- Dogegg TVapi: https://api.gordantv.top - Douban API: https://api.douban.com - QQ Music API: https://y.qq.comCopy the code

Project introduction

Guodan TV is based on wechat small program +ES6 development, can run in Android, iOS environment. Covers music, short video, film review three sections.

  • Open screen boot diagram
    1. Call wechat Wx. onAccelerometerChange gravity sensing equipment API, to achieve ripples.
    2. Call wx.getUserInfo to get the user profile picture.
  • Utility class
    1. Wrapping wx.request() with a Promise simplifies the code structure:
const $get = (url, data) => {
  return new Promise((resolve, reject) => {
    wx.request({
      url,
      data,
      header: { 'Content-Type': 'json' },
      success: resolve,
      fail: reject
    })
  })
}
Copy the code
  1. Movie scoring implementation
const convertToStarsArray = (average) => {
  const LENGTH = 5;
  const CLS_ON = 'on'; // all-star const CLS_HALF ='half'; // const CLS_OFF ='off'; / / no starlet result = [];
  let score = Math.round(average) / 2;
  lethasDecimal = score % 1 ! = = 0let integer = Math.floor(score)
  for (let i = 0; i < integer; i++) {
    result.push(CLS_ON)
  }
  if (hasDecimal) {
    result.push(CLS_HALF)
  }
  while (result.length < LENGTH) {
    result.push(CLS_OFF)
  }
  return result;
}
Copy the code
  • Small program internal components to achieve pull up refresh, pull down load
Method 1: Scroll view component method 2: onPullDownRefresh and onReachBottom methods to implement small program pull-down loading and pull-up refreshCopy the code

  • Reading module

    1. Wechat applet uses wxParse to parse HTML
    In the project, we encountered the need to display the content of music article in wechat applet. The content of the article is the rich text content in the server read through the interface, which is in HTML format. The applet does not support the display of HTML content by default.Copy the code

Project installation

    git clone [email protected]:lishuaixingNewBee/gordanTv.git
Copy the code

The directory structure

| -- - | utils & Public Function of general Function - components & components Public View components and the template template | - images & Img Resources image Resources | - pages & View Dir pageCopy the code

○ Update records

2018.5.17

- Fixed IOS incompatibility with date.parse () in wechat applet (IOS is NaN)Copy the code

2018.5.25

- wechat discards obtaining wx.getUserInfo interface will no longer appear authorization popup, upgrade to < Button class="getUserInfo_btn" open-type="getUserInfo" lang="zh_CN" bindgetuserinfo="onGotUserInfo"> allow < / button >Copy the code