update showLoadingToast and onPullDownRefresh()

Author: uniquexiaobai

.vscode/settings.json

@@ -1,3 +1,3 @@
 {
-    "files.associations": {"*.wxml":"html","*.wxss":"css"}
+    "files.associations": {"editor":{"fontFamily":"Consolas, 'Courier New', monospace","fontWeight":"normal","fontSize":14,"lineHeight":20,"lineNumbers":"on","rulers":[],"wordSeparators":"`~!@#$%^&*()-=+[{]}\\|;:'\",.<>/?","tabSize":2,"insertSpaces":true,"detectIndentation":true,"roundedSelection":true,"scrollBeyondLastLine":true,"wrappingColumn":300,"wordWrap":false,"wrappingIndent":"same","mouseWheelScrollSensitivity":1,"quickSuggestions":true,"quickSuggestionsDelay":10,"parameterHints":true,"autoClosingBrackets":true,"formatOnType":false,"suggestOnTriggerCharacters":true,"acceptSuggestionOnEnter":true,"snippetSuggestions":"bottom","emptySelectionClipboard":true,"wordBasedSuggestions":true,"suggestFontSize":0,"suggestLineHeight":0,"tabCompletion":false,"selectionHighlight":true,"overviewRulerLanes":3,"cursorBlinking":"blink","mouseWheelZoom":false,"cursorStyle":"line","fontLigatures":false,"hideCursorInOverviewRuler":false,"renderWhitespace":"none","renderControlCharacters":false,"renderIndentGuides":true,"renderLineHighlight":true,"codeLens":true,"folding":true,"glyphMargin":true,"useTabStops":true,"trimAutoWhitespace":true,"stablePeek":false,"formatOnSave":false},"diffEditor":{"renderSideBySide":true,"ignoreTrimWhitespace":true},"emmet":{"triggerExpansionOnTab":true,"preferences":{},"syntaxProfiles":{},"excludeLanguages":[]},"workbench":{"editor":{"showTabs":true,"showIcons":true,"enablePreview":true,"enablePreviewFromQuickOpen":true,"openPositioning":"right"},"quickOpen":{"closeOnFocusLost":true},"settings":{"openDefaultSettings":true},"sideBar":{"location":"left"},"statusBar":{"visible":true}},"window":{"openFilesInNewWindow":true,"reopenFolders":"one","restoreFullscreen":false,"zoomLevel":0},"files":{"exclude":{"**/.git":true,"**/.svn":true,"**/.hg":true,"**/.DS_Store":true},"associations":{"*.wxml":"html","*.wxss":"css"},"encoding":"utf8","eol":"\r\n","trimTrailingWhitespace":false,"autoSave":"off","autoSaveDelay":1000,"watcherExclude":{"**/.git/objects/**":true}},"explorer":{"openEditors":{"visible":9,"dynamicHeight":true},"autoReveal":true,"enableDragAndDrop":true},"search":{"exclude":{"**/node_modules":true,"**/bower_components":true},"quickOpen":{"includeSymbols":false}},"git":{"enabled":true,"path":null,"autorefresh":true,"autofetch":true,"enableLongCommitWarning":true,"allowLargeRepositories":false,"confirmSync":true,"countBadge":"all"},"http":{"proxy":"","proxyStrictSSL":true,"proxyAuthorization":null},"css":{"validate":true,"lint":{"compatibleVendorPrefixes":"ignore","vendorPrefix":"warning","duplicateProperties":"ignore","emptyRules":"warning","importStatement":"ignore","boxModel":"ignore","universalSelector":"ignore","zeroUnits":"ignore","fontFaceProperties":"warning","hexColorLength":"error","argumentsInColorFunction":"error","unknownProperties":"warning","ieHack":"ignore","unknownVendorSpecificProperties":"ignore","propertyIgnoredDueToDisplay":"warning","important":"ignore","float":"ignore","idSelector":"ignore"}},"scss":{"validate":true,"lint":{"compatibleVendorPrefixes":"ignore","vendorPrefix":"warning","duplicateProperties":"ignore","emptyRules":"warning","importStatement":"ignore","boxModel":"ignore","universalSelector":"ignore","zeroUnits":"ignore","fontFaceProperties":"warning","hexColorLength":"error","argumentsInColorFunction":"error","unknownProperties":"warning","ieHack":"ignore","unknownVendorSpecificProperties":"ignore","propertyIgnoredDueToDisplay":"warning","important":"ignore","float":"ignore","idSelector":"ignore"}},"less":{"validate":true,"lint":{"compatibleVendorPrefixes":"ignore","vendorPrefix":"warning","duplicateProperties":"ignore","emptyRules":"warning","importStatement":"ignore","boxModel":"ignore","universalSelector":"ignore","zeroUnits":"ignore","fontFaceProperties":"warning","hexColorLength":"error","argumentsInColorFunction":"error","unknownProperties":"warning","ieHack":"ignore","unknownVendorSpecificProperties":"ignore","propertyIgnoredDueToDisplay":"warning","important":"ignore","float":"ignore","idSelector":"ignore"}},"debug":{"allowBreakpointsEverywhere":false,"openExplorerOnEnd":false},"html":{"format":{"enable":true,"wrapLineLength":120,"unformatted":"a, abbr, acronym, b, bdo, big, br, button, cite, code, dfn, em, i, img, input, kbd, label, map, object, q, samp, script, select, small, span, strong, sub, sup, textarea, tt, var","indentInnerHtml":false,"preserveNewLines":true,"maxPreserveNewLines":null,"indentHandlebars":false,"endWithNewline":false,"extraLiners":"head, body, /html"},"suggest":{"angular1":true,"ionic":true,"html5":true}},"json":{"schemas":[],"format":{"enable":true}},"markdown":{"styles":[]},"php":{"validate":{"enable":true,"executablePath":null,"run":"onSave"}},"typescript":{"tsdk":"C:\\Users\\uniqu\\AppData\\Roaming\\npm\\node_modules\\typescript\\lib","check":{"workspaceVersion":true,"tscVersion":false},"tsserver":{"trace":"off"},"useCodeSnippetsOnMethodSuggest":false,"validate":{"enable":true},"format":{"enable":true,"insertSpaceAfterCommaDelimiter":true,"insertSpaceAfterSemicolonInForStatements":true,"insertSpaceBeforeAndAfterBinaryOperators":true,"insertSpaceAfterKeywordsInControlFlowStatements":true,"insertSpaceAfterFunctionKeywordForAnonymousFunctions":true,"insertSpaceAfterOpeningAndBeforeClosingNonemptyParenthesis":false,"insertSpaceAfterOpeningAndBeforeClosingNonemptyBrackets":false,"insertSpaceAfterOpeningAndBeforeClosingTemplateStringBraces":false,"insertSpaceAfterOpeningAndBeforeClosingJsxExpressionBraces":false,"placeOpenBraceOnNewLineForFunctions":false,"placeOpenBraceOnNewLineForControlBlocks":false}},"javascript":{"validate":{"enable":true},"format":{"enable":true,"insertSpaceAfterCommaDelimiter":true,"insertSpaceAfterSemicolonInForStatements":true,"insertSpaceBeforeAndAfterBinaryOperators":true,"insertSpaceAfterKeywordsInControlFlowStatements":true,"insertSpaceAfterFunctionKeywordForAnonymousFunctions":true,"insertSpaceAfterOpeningAndBeforeClosingNonemptyParenthesis":false,"insertSpaceAfterOpeningAndBeforeClosingNonemptyBrackets":false,"insertSpaceAfterOpeningAndBeforeClosingTemplateStringBraces":false,"insertSpaceAfterOpeningAndBeforeClosingJsxExpressionBraces":false,"placeOpenBraceOnNewLineForFunctions":false,"placeOpenBraceOnNewLineForControlBlocks":false}},"extensions":{"autoUpdate":false},"terminal":{"integrated":{"shell":{"linux":"sh","osx":"sh","windows":"C:\\WINDOWS\\system32\\cmd.exe"},"shellArgs":{"linux":[],"osx":[],"windows":[]},"fontFamily":"","fontLigatures":false,"fontSize":0,"lineHeight":1.2,"cursorBlinking":false,"setLocaleVariables":false,"commandsToSkipShell":["editor.action.toggleTabFocusMode","workbench.action.debug.continue","workbench.action.debug.restart","workbench.action.debug.run","workbench.action.debug.start","workbench.action.debug.stop","workbench.action.quickOpen","workbench.action.showCommands","workbench.action.terminal.clear","workbench.action.terminal.copySelection","workbench.action.terminal.focus","workbench.action.terminal.focusNext","workbench.action.terminal.focusPrevious","workbench.action.terminal.kill","workbench.action.terminal.new","workbench.action.terminal.paste","workbench.action.terminal.runSelectedText","workbench.action.terminal.scrollDown","workbench.action.terminal.scrollDownPage","workbench.action.terminal.scrollToBottom","workbench.action.terminal.scrollToTop","workbench.action.terminal.scrollUp","workbench.action.terminal.scrollUpPage","workbench.action.terminal.toggleTerminal"]},"external":{"windowsExec":"%COMSPEC%","osxExec":"Terminal.app","linuxExec":"xterm"}},"problems":{"autoReveal":true},"telemetry":{"enableTelemetry":true,"enableCrashReporter":true},"eslint":{"enable":true,"nodePath":null,"_legacyModuleResolve":false,"options":{},"trace":{"server":"off"},"run":"onType","autoFixOnSave":false},"react":{"beautify":{"onSave":false,"formatter":"prettydiff","configFilePath":".jsbeautifyrc"}},"color-highlight":{"enable":true,"languages":["javascript","scss","css","sass","less","php","xml","html","json"],"matchWords":true,"markerType":"background"},"csscomb":{"preset":{},"ignoreFilesOnSave":[],"supportEmbeddedStyles":true,"formatOnSave":false,"useLatestCore":false},"autoprefixer":{"findExternalAutoprefixer":false,"browsers":["last 2 versions","> 5%"],"formatOnSave":false},"path-autocomplete":{"extensionOnImport":false},"beautify":{"onSave":false,"onSaveIgnore":["**/*+(.|_|-)min.*"],"language":{"js":{"type":["javascript","json"],"filename":[".jshintrc",".jsbeautify"]},"css":["css","scss"],"html":["htm","html"]}},"*.wxml":"html","*.wxss":"css"}
 }

app.json

@@ -14,7 +14,8 @@
     "backgroundTextStyle": "light",
     "navigationBarTitleText": "wx-github-feed",
     "navigationBarTextStyle": "white",
-    "navigationBarBackgroundColor": "#4078C0"
+    "navigationBarBackgroundColor": "#4078C0",
+    "enablePullDownRefresh": true
   },
 
   "tabBar": {

pages/explore/explore.js

@@ -6,15 +6,18 @@ Page({
     languageArray: ['All Languages', 'C', 'CSS', 'Go', 'HTML', 'Java', 'JavaScript', 'Lua', 'Objective-C', 'Perl', 'PHP', 'Python', 'R', 'Ruby', 'Scala', 'Shell', 'Swift'],
     languageIndex: 0,
     tabArray: ['Daily', 'Weekly', 'Monthly'],
-    tabIndex: 0,
-    loading_hidden: true
+    tabIndex: 0
   },
 
   onLoad() {
     this.refreshData();
   },
 
-  _reloadUrl() {
+  onPullDownRefresh() {
+    this.refreshData();
+  },
+
+   _reloadUrl() {
     const basic_url = 'http://trending.codehub-app.com/v2/trending?since=';
 
     // locationIndex may be 0 or '0'
@@ -24,39 +27,47 @@ Page({
     return `${basic_url}${this.data.tabArray[this.data.tabIndex].toLowerCase()}&language=${this.data.languageArray[this.data.languageIndex].toLowerCase()}`;
   },
 
+  handleLanguagePickerChange(e) {
+    this.showLoadingToast();
+    this.setData({
+      languageIndex: e.detail.value
+    });
+    this.fetchReposData(this._reloadUrl());
+  },
+
+  handleTabPickerChange(e) {
+    this.showLoadingToast();
+    this.setData({
+      tabIndex: e.detail.value
+    });
+    this.fetchReposData(this._reloadUrl());
+  },
+
   fetchReposData(url) {
     services.fetch(url).then(res => {
       if (res.data) {
         this.setData({
           items: res.data
         });
       }
-      this.setData({
-        loading_hidden: true
-      });
+      this.hideLoadingToast();
     });
   },
 
-  handleLanguagePickerChange(e) {
-    this.setData({
-      languageIndex: e.detail.value,
-      loading_hidden: false
-    });
+  refreshData() {
+    this.showLoadingToast();
     this.fetchReposData(this._reloadUrl());
   },
 
-  handleTabPickerChange(e) {
-    this.setData({
-      tabIndex: e.detail.value,
-      loading_hidden: false
+  showLoadingToast() {
+    wx.showToast({
+      title: '玩命加载中...',
+      icon: 'loading', 
+      duration: 10000
     });
-    this.fetchReposData(this._reloadUrl());
   },
 
-  refreshData() {
-    this.setData({
-      loading_hidden: false
-    });
-    this.fetchReposData(this._reloadUrl());
+  hideLoadingToast() {
+    wx.hideToast();
   }
 });

pages/explore/explore.wxml

@@ -1,7 +1,4 @@
 <view class="container">
-  <loading hidden="{{loading_hidden}}">
-    玩命加载中...
-  </loading>
   <view class="col explore">
     <view class="col pickers">
       <picker bindchange="handleLanguagePickerChange" mode="selector" value="{{languageIndex}}" range="{{languageArray}}">
@@ -15,7 +12,7 @@
         </view>
       </picker>
     </view>
-    <scroll-view scroll-y="true" bindscrolltoupper="refreshData">
+    <scroll-view scroll-y="true">
       <block wx:for="{{items}}" wx:key="explore">
         <navigator url="../repo/repo?repo_full_name={{item.full_name}}">
           <view class="row repo_item">

pages/famous/famous.js

@@ -7,7 +7,6 @@ Page({
     locationIndex: 2,
     languageArray: ['All Languages', 'ActionScript', 'C', 'C#', 'C++', 'Clojure', 'CoffeeScript', 'CSS', 'Go', 'Haskell', 'HTML', 'Java', 'JavaScript', 'Lua', 'Matlab', 'Objective-C', 'Objective-C++', 'Perl', 'PHP', 'Python', 'R', 'Ruby', 'Scala', 'Shell', 'Swift', 'TeX', 'VimL'],
     languageIndex: 0,
-    loading_hidden: true,
     items: [],
     page: 1,
     incomplete_results: false
@@ -17,6 +16,10 @@ Page({
     this.refreshData();
   },
 
+  onPullDownRefresh() {
+    this.refreshData();
+  },
+
   _reloadUrl() {
     const basic_url = 'https://api.github.com/search/users?q=';
 
@@ -47,17 +50,15 @@ Page({
           incomplete_results: res.data.incomplete_results
         });
       }
-      this.setData({
-        loading_hidden: true
-      });
+      this.hideLoadingToast();
     });
   },
 
   handleLocationPickerChange(e) {
     if (this.data.languageIndex || e.detail.value) {
+      this.showLoadingToast();
       this.setData({
-        locationIndex: e.detail.value,
-        loading_hidden: false
+        locationIndex: e.detail.value
       });
       this._initData();
       this.fetchUsersData(this._reloadUrl());
@@ -66,9 +67,9 @@ Page({
 
   handleLanguagePickerChange(e) {
     if (this.data.locationIndex || e.detail.value) {
+      this.showLoadingToast();
       this.setData({
-        languageIndex: e.detail.value,
-        loading_hidden: false
+        languageIndex: e.detail.value
       });
       this._initData();
       this.fetchUsersData(this._reloadUrl());
@@ -77,18 +78,28 @@ Page({
 
   loadMoreData() {
     if (this.data.incomplete_results) return;
+    this.showLoadingToast();
     this.setData({
-      loading_hidden: false,
       page: ++this.data.page
     });
     this.fetchUsersData(this._reloadUrl());
   },
 
   refreshData() {
-    this.setData({
-      loading_hidden: false
-    });
+    this.showLoadingToast();
     this._initData();
     this.fetchUsersData(this._reloadUrl());
+  },
+
+  showLoadingToast() {
+    wx.showToast({
+      title: '玩命加载中...',
+      icon: 'loading', 
+      duration: 10000
+    });
+  },
+
+  hideLoadingToast() {
+    wx.hideToast();
   }
 });

pages/famous/famous.wxml

@@ -1,7 +1,4 @@
 <view class="container">
-  <loading hidden="{{loading_hidden}}">
-    玩命加载中...
-  </loading>
   <view class="col famous">
     <view class="col pickers">
       <picker bindchange="handleLocationPickerChange" value="{{locationIndex}}" range="{{locationArray}}">
@@ -15,7 +12,7 @@
         </view>
       </picker>
     </view>
-    <scroll-view scroll-y="true" bindscrolltolower="loadMoreData" bindscrolltoupper="refreshData">
+    <scroll-view scroll-y="true" bindscrolltolower="loadMoreData">
       <block wx:for="{{items}}" wx:key="famous">
         <navigator url="../user/user?user_name={{item.login}}">
           <view class="row user_item">

pages/index/index.js

@@ -5,15 +5,14 @@ import helpers from '../helpers/index';
 
 Page({
   data: {
-    loading_hidden: true,
     items: [],
     page: 1
   },
 
   onLoad() {
     const user = wx.getStorageSync('user');
 
-    console.log(user);
+    console.log('#user#', user);
     if (!user) {
       wx.navigateTo({
         url: '../auth/onboard/onboard'
@@ -22,6 +21,10 @@ Page({
     this.refreshData();
   },
 
+  onPullDownRefresh() {
+    this.refreshData();
+  },
+
   _reloadUrl() {
     const basic_url = 'https://api.github.com/users/uniquexiaobai/received_events?page=';
 
@@ -42,25 +45,35 @@ Page({
         item.created_at = util.timesAgo(item.created_at);
       });
       this.setData({
-        items: this.data.items.concat(res.data),
-        loading_hidden: true
+        items: this.data.items.concat(res.data)
       });
+      this.hideLoadingToast();
     });
   },
 
   loadMoreData() {
+    this.showLoadingToast();
     this.setData({
-      page: ++this.data.page,
-      loading_hidden: false
+      page: ++this.data.page
     });
     this.fetchEventsData(this._reloadUrl());
   },
 
   refreshData() {
-    this.setData({
-      loading_hidden: false
-    });
+    this.showLoadingToast();
     this._initData();
     this.fetchEventsData(this._reloadUrl());
+  },
+
+  showLoadingToast() {
+    wx.showToast({
+      title: '玩命加载中...',
+      icon: 'loading', 
+      duration: 10000
+    });
+  },
+
+  hideLoadingToast() {
+    wx.hideToast();
   }
 });

pages/index/index.wxml

@@ -1,8 +1,5 @@
 <view class="container">
-  <loading hidden="{{loading_hidden}}">
-    玩命加载中...
-  </loading>
-  <scroll-view scroll-y="true" bindscrolltolower="loadMoreData" bindscrolltoupper="refreshData">
+  <scroll-view scroll-y="true" bindscrolltolower="loadMoreData">
     <block wx:for="{{items}}" wx:key="received_events">
       <navigator url="../repo/repo?repo_full_name={{item.repo.name}}">
         <view class="col received_events">

pages/repo/repo.js

@@ -1,18 +1,20 @@
 import services from '../../utils/services';
 
 Page({
-  data: {
-    loading_hidden: true
-  },
-
   onLoad(options) {
+    this.showLoadingToast();
     this.setData({
-      repo_full_name: options.repo_full_name,
-      loading_hidden: false
+      repo_full_name: options.repo_full_name
     });
     this.fetchRepoData(this._reloadUrl());
   },
 
+  onReady() {
+    wx.setNavigationBarTitle({
+      title: this.data.repo_full_name
+    });
+  },
+
   _reloadUrl() {
     const basic_url = 'https://api.github.com/repos/';
 
@@ -22,15 +24,21 @@ Page({
   fetchRepoData(url) {
     services.fetch(url).then(res => {
       this.setData({
-        repo: res.data,
-        loading_hidden: true
+        repo: res.data
       });
+      this.hideLoadingToast();
     });
   },
 
-  onReady() {
-    wx.setNavigationBarTitle({
-      title: this.data.repo_full_name
+  showLoadingToast() {
+    wx.showToast({
+      title: '玩命加载中...',
+      icon: 'loading', 
+      duration: 10000
     });
+  },
+
+  hideLoadingToast() {
+    wx.hideToast();
   }
 });

pages/repo/repo.wxml

@@ -1,7 +1,4 @@
 <view class="container col">
-  <loading hidden="{{loading_hidden}}">
-    玩命加载中...
-  </loading>
   <view class="repo">
     <view class="row repo_header">
       <view class="row align_center repo_top_item">