MicroSteemit on Wechat application - changing the sharing operation , showing the default image , adding key validity checking

in utopian-io •  7 years ago 

New Features


logo.png

Introduction

MicroSteemit is developed based on the wechat micro application which is maintained by the tencent company.

wechat micro application is an application that doesn't need to be downloaded and installed. It implements the dream of "reach within reach", and users scan or search can open the micro application through the wechat application. It also reflects the idea of "running away", and users don't have to worry about installing too many apps. Micro Applications will be ubiquitous, readily available, without installing uninstall. Suitable for life service offline shops and non-new low-frequency conversion. The micro application can realize seven functions such as message notification, offline scan code and public number association. Among them, the user can realize the mutual jump between the wechat public account and the micro application through wechat association.

In a word , MicroSteemit is an application which can be used without downloading while chatting with friends in wechat easily. Just by scanning the MicroSteemit QR code can we commodiously surf on the steemit community.


Repository

All source code about Microsteemit can be found in the below link :

https://github.com/Cha0s0000/MicroSteemit


New features

  • Change the way to open the shared link from Microsteemit

    When open the share page from Wechat friends , it used to directly redirect to the specified page like post detail page .However , after navigating to this page , it is impossible to go back to the home page of the Microsteemit.

    To solve this problem , it is a good idea to change the way to open the shared link .That is opening the home page in Microsteemit after clicking on the shared page ,then from the home page ,go further navigating to the specified page according to the shared page .

    Part of the code change :

    every pages need to be shared :

    path: '/pages/post/post?sharePage=detail&author=' + this.data.author + '&permlink=' + this.data.permlink

    deal with the sharing operation in the home page:

    if (options.sharePage){
          switch (options.sharePage){
            case 'detail':
              wx.navigateTo({
                url: '../detail/detail?author=' + options.author + '&permlink=' + options.permlink,
              })
              break;
            case 'profile':
              wx.navigateTo({
                url: '../profile/profile?account=' + options.account,
              })
              break;
          }
        }
    
  • Add voting and comment operation in detail page including voting/commenting on the post and also every depth of child comments

    In order to take good care of every depth child comments and consider the network loading , whenever clicking on the comment number of the specified content, the new child comments will be added into the array which belongs to same parent comments .And also whenever clicking on the comments number of the already shown child comments , the specified child comments will be removed from the existing array.

    Cause of this feature , before voting/commenting , we are supposed to classify which category the voting/commenting is on .

    After setting the voting weight on the slider , the voting weight will be saved in the specified item of the array .So the voting wight will match the right item of the child comment but not in mess .And also we are able to set several child comment items` voting wight at the same time .

    GIF.gif

    **Part of the code added ** :

    var name = wx.getStorageSync('name');
        if (name) {
          var voteOrNot = e.currentTarget.dataset.voteornot;
          if (voteOrNot != 2) {
            var index = e.currentTarget.dataset.index;
            var state = e.currentTarget.dataset.state;
            if (index == '-1') {
              console.log("showVotingSlider of detail");
              var addVoteToDetail = this.data.detail;
              addVoteToDetail.vote = (state == 1 ? 0 : 1);
              addVoteToDetail.voteWeight = 10000;
              console.log(state);
              this.setData({ detail: addVoteToDetail })
            }
            else {
              if (e.currentTarget.dataset.rootindex == '-1') {
                console.log(e.currentTarget.dataset.rootindex);
                console.log("showVotingSlider of comments");
                var addVoteWeightToComment = this.data.comments;
                addVoteWeightToComment[index].vote = (state == 1 ? 0 : 1);
                addVoteWeightToComment[index].voteWeight = 10000;
                this.setData({ comments: addVoteWeightToComment })
              }
              else {
    
                console.log("showVotingSlider of childcomments");
                var addVoteWeightToChildComment = this.data.comments;
                addVoteWeightToChildComment[e.currentTarget.dataset.rootindex].children[index].voteWeight = 10000;
                addVoteWeightToChildComment[e.currentTarget.dataset.rootindex].children[index].vote = (state == 1 ? 0 : 1);
                this.setData({ comments: addVoteWeightToChildComment })
              }
            }
          }
        }
    
  • Add Steemit account and posting key validity before showing account infos

    The old version of Microsteemit is just with the feature showing the account infos without inputing account posting key.So whoever have ever used the old version Microsteemit will be unable to go further operations like voting , commenting unless they log out .

    And considering that users will change their private keys whenever they want , we add the account-key validity every time the users opening Microsteemit.

    When the key is valid , Microsteemit will go on load more infos .

    When the key is outdated , it will show toast to notice the users:

    else {
                wx.showToast({
                  title: 'Login Fail',
                  icon: 'none',
                  duration: 2000
                })
                wx.redirectTo({
                  url: '../login/login',
                })
              }
    

    then navigate to login page :

  • Load the default image when fail to load the original image source

    The json meta from the api callback is quite different according to different categories of posts .

    For example , the thumbnail from a Dtube post will be with a different format from the normal Steemit post.

    So when Microsteemit fails to load the image source of fails to parse the thumbnail format , it will directly show the default image as its thumbnail .


Proof of work done


Roadmap

  • Add one more way to share the link from Microsteemit
  • Add Dtube theme
  • Add showing dynamic coins price
  • Perfect the UI

How to contribute?

Github: https://github.com/Cha0s0000/MicroSteemit

  • Fork it!
  • Create your feature branch: git checkout -b my-new-feature
  • Commit your changes: git commit -am 'Add some feature'
  • Push to the branch: git push origin my-new-feature
  • Submit a pull request.
Authors get paid when people like you upvote their post.
If you enjoyed what you read here, create your account today and start earning FREE STEEM!
Sort Order:  

Thanks for the contribution!

The roadmap is getting smaller and smaller! Keep up the good work!

Click here to see how your contribution was evaluated.


Need help? Write a ticket on https://support.utopian.io/.
Chat with us on Discord.
[utopian-moderator]

Thank you !
I haven`t got any new ideas yet to promote the application .
It will be very appreciated to provide me some good ideas! :D

Hey @cha0s0000
Thanks for contributing on Utopian.
We’re already looking forward to your next contribution!

Contributing on Utopian
Learn how to contribute on our website or by watching this tutorial on Youtube.

Want to chat? Join us on Discord https://discord.gg/h52nFrV.

Vote for Utopian Witness!

Nice work! Steemit in Wechat is a good idea.