update: 0.3.18

2025-06-09 10:34:17 +00:00 · 2020-04-20 12:21:40 +02:00 · 2020-04-20 12:21:40 +02:00 · 3e403ff990
commit 3e403ff990
parent e2b3f0b69b
16 changed files with 230 additions and 157 deletions
--- a/package.json
+++ b/package.json
@ -3,7 +3,7 @@
  "UUID": "C8mVSr-4nmPp2-pr5Vrz-CU4kg4",
  "title": "Comty™",
  "DevBuild": true,
-  "version": "0.3.13",
+  "version": "0.3.18",
  "stage": "dev-pre",
  "description": "",
  "author": "RageStudio",
--- a/src/@ycore/libs/comty_ng/comty_user.js
+++ b/src/@ycore/libs/comty_ng/comty_user.js
@ -3,6 +3,22 @@ import { comty_rsa } from '../rs_cloud/pre'

 export const comty_user = {
  setData: () => {},
+  getFollowers: (callback, payload) => {
+    if (!payload)return false
+    const { user_id } = payload
+
+    let formdata = new FormData()
+    formdata.append('user_id', user_id)
+    formdata.append('fetch', 'followers')
+
+    API_Call(
+      (err,res) => {
+        return callback(err,res)
+      },
+      comty_rsa.endpoint('get-user-data'),
+      formdata
+    )
+  },
  follow: (callback, payload) => {
    if (!payload) {
      return false
--- a/src/components/Layout/Secondary/components/__sec.less
+++ b/src/components/Layout/Secondary/components/__sec.less
@ -26,11 +26,12 @@
      opacity: 0;
  
      top: unset;
-      overflow: hidden;
     
+      transform: translate(0, 86%);
      border-radius: 12px 12px 0 0;
      flex-direction: column;
-      overflow-y: scroll;
+
+      overflow-y: overlay;
      overflow-x: hidden;
  
      touch-action: none;
@ -56,7 +57,6 @@
      &.active {
        opacity: 1;
        height: 100%;
-        transform: translate(0, 86%);
      }
  
      &.full_open {
--- a/src/components/Layout/Secondary/components/__sec.tsx
+++ b/src/components/Layout/Secondary/components/__sec.tsx
@ -23,9 +23,6 @@ const isOpen = (props: __sec_props) => {
    }
    return false
 }
-const isMobile = (props: __sec_props) => {
-    props.isMobile? true : false
-} 

 const renderExit = (props: __sec_props) => {
    const {functs} = props
@ -38,9 +35,9 @@ const renderExit = (props: __sec_props) => {
 }

 const __sec = (props: __sec_props) => {
-    const { render, getRef, y, type } = props
-    const t_full = type === 'full_open'? true : false
-    const t_def = type === 'active'? true: false 
+    const { render, getRef, y, type, isMobile } = props
+    const t_full = type == 'full_open'? true : false
+    const t_def = type == 'active'? true: false 
    return (
        <div
            id="secondary_layout__sec"
@ -50,7 +47,6 @@ const __sec = (props: __sec_props) => {
                [styles.full_open]: t_full,
            })}
            style={{
-                position: 'relative',
                top: y,
            }}
            ref={getRef}
--- a/src/components/Layout/Secondary/index.js
+++ b/src/components/Layout/Secondary/index.js
@ -13,6 +13,7 @@ import {
  __priSearch,
  __trendings,
  __pro,
+  __footer
 } from './renders.js'

 export const SwapMode = {
@ -185,9 +186,17 @@ export default class Secondary extends React.PureComponent {

  componentDidMount() {
    this.handle_genData()
+    if(this.props.isMobile){
+      window.addEventListener('popstate', function(event) {
+        SwapMode.close()
+      }, false);
+    }
  }

  componentWillUnmount() {
+    if(this.props.isMobile){
+      document.removeEventListener('popstate', null)
+    }
    document.removeEventListener('keydown', this.handle_Exit, false)
  }

@ -203,10 +212,15 @@ export default class Secondary extends React.PureComponent {
    try {
      const trending_data = JSON.parse(this.state.gen_data)['trending_hashtag']
      return (
+        <>
        <div className={styles.secondary_main}>
          {ycore.IsThisUser.pro() ? <__pro /> : <__pro />}
          <__trendings data={trending_data} />
+          
+          {__footer()}
        </div>
+         
+        </>
      )
    } catch (error) {
      return null
@ -271,6 +285,7 @@ export default class Secondary extends React.PureComponent {
  render() {
    const { userData, isMobile } = this.props
    const __sec_functs = (this.Swapper)
+    
    if (!this.state.loading)
      return (
        <>
@ -307,7 +322,7 @@ export default class Secondary extends React.PureComponent {
                {this.renderTarget('__pri')}
              </div>
            </div>
-            <__sec render={this.renderTarget('__sec')} isMobile={this.state.isMobile} functs={__sec_functs} type={this.state.__sec_full? "full_open" : this.state.__sec_active? "active" : null} />
+            <__sec render={this.renderTarget('__sec')} isMobile={isMobile} functs={__sec_functs} type={this.state.__sec_full? "full_open" : this.state.__sec_active? "active" : null} />
            
      

--- a/src/components/Layout/Secondary/index.less
+++ b/src/components/Layout/Secondary/index.less
@ -131,9 +131,7 @@
   
    border-radius: 12px 12px 0 0;
    flex-direction: column;
-    overflow-y: scroll;
-    overflow-x: hidden;
-
+ 
    :global{
      .comments_body {
        padding: 30px 10px 10px 10px;
@ -151,7 +149,7 @@

    &.half {
      opacity: 1;
-      height: 75vh;
+      height: 95vh;
    }

  }
--- a/src/components/Layout/Secondary/renders.js
+++ b/src/components/Layout/Secondary/renders.js
@ -25,25 +25,10 @@ export class __priPost extends React.PureComponent {
  renderContent(payload) {
    const { id, postText, postFile_full, post_time, publisher } = payload
    const {isMobile}= this.props
-    if (!postFile_full) {
-      return (
-        <div className={styles.contentWrapper}>
-        {postText ? (
-          <div className={styles.postContent}>
-            <h3 dangerouslySetInnerHTML={{ __html: postText }} />{' '}
-          </div>
-        ) : null}
-      </div>
-      )
-    }
+
    return (
      <div className={styles.contentWrapper}>
        {postFile_full ? <MediaPlayer isMobile={isMobile} entire={true} file={postFile_full} /> : null}
-        {postText ? (
-          <div className={styles.postContent}>
-            <h3 dangerouslySetInnerHTML={{ __html: postText }} />{' '}
-          </div>
-        ) : null}
      </div>
    )
  }
@ -333,4 +318,12 @@ export class __pro extends React.PureComponent {
      </div>
    )
  }
+}
+
+const _info = ycore.AppInfo
+
+export const __footer = () =>{
+  return <div className={styles.__footer}>
+    v{ycore.AppInfo.version}  |  About  |  Legal  |  Help
+  </div>
 }
--- a/src/components/Layout/Secondary/renders.less
+++ b/src/components/Layout/Secondary/renders.less
@ -93,7 +93,7 @@
  position: absolute;
  vertical-align: bottom;
  border-radius: 7px;
-  bottom: 0;
+  top: 0;
  max-width: 50vw;

  background-color: #2d2d2d4b;
@ -145,13 +145,14 @@

  .comments_cards_wrapper {
    z-index: 50;
-    overflow: scroll;
+    overflow-y: scroll!important;
    height: 84%;
    :global {
-      overflow: scroll;
+      overflow-y: scroll!important;
    }

    .comment_card {
+      overflow-y: scroll!important;
      position: relative;
      width: 100%;
      background-color: #ffffff;
@ -353,4 +354,14 @@
      font-weight: 600;
    }
  }
+}
+
+.__footer{
+  position: absolute;
+  bottom: 0;
+  font-size: 11px;
+  margin-bottom: 10px;
+  color: #f3f3f3;
+  letter-spacing: 2px;
+  width: 100%;
 }
--- a/src/components/MediaPlayer/index.less
+++ b/src/components/MediaPlayer/index.less
@ -19,8 +19,8 @@


  &.entire {
-    max-width: 52vw;
-    max-height: 80vh;
+    max-width: 52%;
+    max-height: 80%;
    position: fixed;
    top: 50%;
    left: 50%;
@ -49,19 +49,23 @@
  }

  &.mobile {
-    max-width: 52vw;
-    max-height: 80vh;
-    position: fixed;
-    top: 50%;
-    left: 50%;
-    transform: translate(-50%, -50%);
+    max-width: unset;
+    max-height: unset;
+    top: unset;
+    left: unset;
+    transform: unset;
    
+    width: 100%;
+    position: relative;
+    height: 60vh;
+    display: flex;
+
    img {
      object-fit: contain;
-      height: 100%;
+      height: auto;
      width: 100%;
-      max-width: 52vw;
-      max-height: 80vh;
+      max-width: unset;
+      max-height: unset;
    }

    audio {
@ -71,10 +75,10 @@

    video {
      object-fit: contain;
-      height: 100%;
+      height: auto;
      width: 100%;
-      max-width: 52vw;
-      max-height: 80vh;
+      max-width: unset;
+      max-height: unset;
    }
  }
 }
--- a/src/components/UserProfile/index.js
+++ b/src/components/UserProfile/index.js
@ -10,7 +10,7 @@ import Follow_btn from './components/Follow_btn.js'
 import { BadgesType } from 'globals/badges_list'
 import classnames from 'classnames'

-const isMobile = localStorage.getItem('mobile_src')
+import * as reducers from './reducers.js'

 class UserProfile extends React.PureComponent {
  constructor(props) {
@ -93,6 +93,15 @@ class UserProfile extends React.PureComponent {
          Followed: ycore.booleanFix(rp['0'].is_following),
        })

+        reducers.get.followers((res)=>{
+          try {
+            this.setState({followers_data: res, followers: res.length})
+          } catch (error) {
+            return false
+          }
+
+        },rp['0'].user_id)
+
        ycore.comty_user.__tags(
          (err, res) => {
            if (err) return false
@ -125,104 +134,100 @@ class UserProfile extends React.PureComponent {
    
 const moreMenu = (
  <antd.Menu>
-    <antd.Menu.Item>1st antd.Menu item</antd.Menu.Item>
-    <antd.Menu.Item>2nd antd.Menu item</antd.Menu.Item>
+    <antd.Menu.Item>__</antd.Menu.Item>
+    <antd.Menu.Item>__set2</antd.Menu.Item>
  </antd.Menu>
 );

-    const { loading, UUID, invalid, RenderValue } = this.state
+    const { loading, UUID, invalid, RenderValue, followers } = this.state
+    const { isMobile } = this.props
+    if(loading) return <antd.Skeleton active />
+    if(invalid) return null
    return (
      <div>
-        {loading ? (
-          <antd.Skeleton active />
-        ) : (
-          <div>
-            {invalid ? null : (
-              <div
-                className={classnames(styles.userWrapper, {
-                  [styles.mobile]: isMobile,
-                })}
-              >
-                <div className={styles.UserCover}>
-                  <img src={RenderValue.cover} />
-                </div>
+            <div
+className={classnames(styles.userWrapper, {
+  [styles.mobile]: isMobile,
+})}
+>

-                <div>
-                  
-                    <div className={styles.pageHeaderContent}>
-                      <div className={styles.avatar}>
-                        <antd.Avatar shape="square" src={RenderValue.avatar} />
-                      </div>
-                      <div className={styles.content}>
-                        <div className={styles.TagWrappers}>
-                          {this.state.UserTags.length > 0 ? (
-                            <antd.List
-                              dataSource={this.state.UserTags}
-                              renderItem={item => (
-                                <antd.Tooltip title={item.tip}>
-                                  <antd.Tag id={item.id} color={item.color}>
-                                    {item.title} {item.icon}
-                                  </antd.Tag>
-                                </antd.Tooltip>
-                              )}
-                            />
-                          ) : null}
-                        </div>
-                        {ycore.IsThisUser.same(RenderValue.id) ? null : (
-                          <div
-                            className={styles.follow_wrapper}
-                            onClick={() => this.handleFollowUser()}
-                          >
-                            <Follow_btn
-                              followed={this.state.Followed ? true : false}
-                            />
-                          </div>
-                        )}
-                        <div className={styles.contentTitle}>
-                          <h1 style={{ marginBottom: '0px' }}>
-                            {RenderValue.username}
-                            <antd.Tooltip title="User Verified">
-                              {ycore.booleanFix(RenderValue.verified) ? (
-                                <Icon
-                                  style={{
-                                    color: 'blue',
-                                    verticalAlign: 'top',
-                                  }}
-                                  component={CustomIcons.VerifiedBadge}
-                                />
-                              ) : null}
-                            </antd.Tooltip>
-                            
-                            { ycore.IsThisUser.same(UUID)? 
-                            <antd.Dropdown overlay={moreMenu}>
-                              <Icons.MoreOutlined className={styles.user_more_menu} />
-                            </antd.Dropdown> 
-                            : null }
+<div className={styles.UserCover}>
+  <img src={RenderValue.cover} />
+</div>

-                          </h1>
-                          <span
-                            style={{
-                              fontSize: '14px',
-                              fontWeight: '100',
-                              lineHeight: '0',
-                              marginBottom: '5px',
-                            }}
-                            dangerouslySetInnerHTML={{
-                              __html: RenderValue.about,
-                            }}
-                          />
-                        </div>
-                      </div>
-                    </div>
-                </div>
-              </div>
-            )}
-            {ycore.IsThisUser.same(UUID) ? (
-              <PostCreator userData={ycore.userData()} />
-            ) : null}
-            <MainFeed get="user" uid={UUID} />
+  
+    <div className={styles.pageHeaderContent}>
+      <div className={classnames(styles.avatar, {[styles.mobile]: isMobile})}>
+        <antd.Avatar shape="square" src={RenderValue.avatar} />
+      </div>
+      <div className={styles.content}>
+        <div className={styles.TagWrappers}>
+          {this.state.UserTags.length > 0 ? (
+            <antd.List
+              dataSource={this.state.UserTags}
+              renderItem={item => (
+                <antd.Tooltip title={item.tip}>
+                  <antd.Tag id={item.id} color={item.color}>
+                    {item.title} {item.icon}
+                  </antd.Tag>
+                </antd.Tooltip>
+              )}
+            />
+          ) : null}
+        </div>
+        {ycore.IsThisUser.same(RenderValue.id) ? null : (
+          <div
+            className={styles.follow_wrapper}
+            onClick={() => this.handleFollowUser()}
+          >
+            <Follow_btn
+              followed={this.state.Followed ? true : false}
+            />
          </div>
        )}
+      
+        <div className={styles.contentTitle}>
+          <h1 style={{ marginBottom: '0px' }}>
+            
+            <antd.Tooltip title={`${this.state.followers} Followers`}>
+              {RenderValue.username}
+            </antd.Tooltip>
+
+            <antd.Tooltip title="User Verified">
+              {ycore.booleanFix(RenderValue.verified) ? (
+                <Icon
+                  style={{
+                    color: 'blue',
+                    verticalAlign: 'top',
+                  }}
+                  component={CustomIcons.VerifiedBadge}
+                />
+              ) : null}
+            </antd.Tooltip>
+          
+            { ycore.IsThisUser.same(UUID)? 
+            <antd.Dropdown overlay={moreMenu}>
+              <Icons.MoreOutlined className={styles.user_more_menu} />
+            </antd.Dropdown> 
+            : null }
+          </h1>
+          <span
+            style={{
+              fontSize: '14px',
+              fontWeight: '100',
+              lineHeight: '0',
+              marginBottom: '5px',
+            }}
+            dangerouslySetInnerHTML={{
+              __html: RenderValue.about,
+            }}
+          />
+        </div>
+      </div>
+    </div>
+</div>
+            {ycore.IsThisUser.same(UUID) ? (<PostCreator userData={ycore.userData()} />) : null}
+            <MainFeed get="user" uid={UUID} />
      </div>
    )
  }
--- a/src/components/UserProfile/reducers.js
+++ b/src/components/UserProfile/reducers.js
@ -0,0 +1,18 @@
+import * as ycore from 'ycore'
+
+// REDUCERS, USERPROFILE
+export const get = {
+    followers: (callback,id) => {
+        const payload = { user_id: id }
+        ycore.comty_user.getFollowers((err,res) => {
+           try {
+            const a = JSON.parse(res)['followers']
+            callback(a)
+            return false
+           } catch (error) {
+             callback(false)
+             return false
+           }
+        }, payload)
+    },
+}
--- a/src/components/UserProfile/styles.less
+++ b/src/components/UserProfile/styles.less
@ -29,26 +29,20 @@
 .userWrapper {
  padding: 0 68px 15px 68px;
  margin: auto;
+  background-color: #ffffff;
+  border-radius: 0 0 20px 20px;
+  padding: 20px 0 3px 0;
+ 
+  padding-top: 0;
+  overflow: initial !important;
+  
  &.mobile{
    max-width: 510px;
    min-width: 265px;
    width: auto;
-    padding: 0 15px 0 15px;
-  }
-  :global {
-    .ant-page-header-content {
-      padding-top: 0;
-      overflow: initial !important;
-    }

-    .ant-page-header {
-      padding: 20px 0 3px 0;
-    }
-
-    .ant-pro-page-header-wrap-page-header-warp {
-      border-radius: 0 0 20px 20px;
-    }
  }
+
 }

 .TagWrappers {
@ -58,6 +52,19 @@
  margin: 0 0 7px 0 !important;
 }

+.followers_count{
+  float: right;
+  font-size: 14px;
+  width: auto;
+  max-width: 200px;
+  padding: 0 20px;
+  background-color: #f3f3f3;
+  text-align: center;
+  border-radius: 8px;
+  transform: translate(90px, -64px);
+  
+}
+
 .UserCover {
  border-radius: 15px 15px 0 0;
  position: relative;
@ -90,6 +97,11 @@
    height: 100%;
  }

+  &.mobile{
+    transform: translate(0,-90px);
+    margin: auto;
+  }
+
  :global {
    .ant-avatar {
      box-shadow: 13px 13px 17px 4px rgba(69, 69, 69, 0.151);
@ -105,6 +117,7 @@
 .pageHeaderContent {
  vertical-align: top;
  display: flex;
+  padding: 20px;

  .content {
    font-family: "Poppins", sans-serif;
--- a/src/layouts/PrimaryLayout.js
+++ b/src/layouts/PrimaryLayout.js
@ -91,7 +91,7 @@ class PrimaryLayout extends React.Component {
    return (
      <React.Fragment>
          {/* {isMobile ? <MobileWarning /> : null} */}
-          <div className={styles.__ControlBar}>
+          <div className={classnames(styles.__ControlBar, {[styles.mobile]: isMobile})}>
            <Control mobile={isMobile} />
          </div>
          <antd.Layout id="primaryLayout" className={classnames(styles.primary_layout, {[styles.mobile]: isMobile})}>
--- a/src/layouts/PrimaryLayout.less
+++ b/src/layouts/PrimaryLayout.less
@ -5,6 +5,10 @@
  position: absolute;
  bottom: 0;
  z-index: 30;
+  &.mobile{
+    top: 0;
+    bottom: unset;
+  }
 }

 .primary_layout {
--- a/src/pages/$page/index.js
+++ b/src/pages/$page/index.js
@ -15,7 +15,7 @@ class PageIndexer extends PureComponent {
      ycore.yconsole.log(`User matched!  ${location.pathname}`)
      return (
        <div>
-          <UserProfile regx={matchUser} />
+          <UserProfile {...this.props} regx={matchUser} />
        </div>
      )
    }
--- a/src/themes/base/index.less
+++ b/src/themes/base/index.less
@ -138,7 +138,7 @@ body {
 // .secondary_*
@__secondary_colider_width: 31.2vw;
@secondary_wrapper_hidden_width: 22vw;
-@secondary_wrapper_showFull_width: 94.2vw;
+@secondary_wrapper_showFull_width: 94.2%;
@secondary_wrapper_showHalf_width: 35vw;
@secondary_container_bg_background: #201F23;
@secondary_container_1_color: #fff;
@ -161,7 +161,7 @@ body {
 // .post_card*
@post_card_general_border-rd: 7px;
@post_card_wrapper_shadow: 0 1px 3px rgba(0, 0, 0, 0.15);
-@post_card_wrapper_actions_backgroud: rgba(235, 235, 235, 0.815);
+@post_card_wrapper_actions_backgroud: rgb(235, 235, 235);
@post_card_wrapper_actions_icon_backgroud: #fff;

@post_card_wrapper_tags_color_default: rgb(249, 179, 64);