mirror of
https://github.com/ragestudio/comty.git
synced 2025-06-09 02:24:16 +00:00
0.2.10A1
This commit is contained in:
srgooglo
parent
d7abb0c4a9
commit
dd577c7968
@ -20,5 +20,7 @@ export var DevOptions = {
|
||||
MaxJWTexpire: '1556952',
|
||||
MaxLengthPosts: '512',
|
||||
CurrentBundle: 'light_ng',
|
||||
MaximunAPIPayload: '101376'
|
||||
// In KB
|
||||
MaximunAPIPayload: '101376',
|
||||
limit_post_catch: ReturnDevOption('limit_post_catch')
|
||||
}
|
||||
8
globals/badges_list.js
Normal file
8
globals/badges_list.js
Normal file
@ -0,0 +1,8 @@
|
||||
export var BadgesType = [
|
||||
{
|
||||
"id": "alpha_test",
|
||||
"title": "Alpha Tester",
|
||||
"color": "volcano",
|
||||
"tip": "Oh yeah!"
|
||||
},
|
||||
]
|
||||
@ -1,5 +1,7 @@
|
||||
module.exports = {
|
||||
Endpoints: {
|
||||
get_user_tags: "https://api.ragestudio.net/RSA-COMTY/r/user_tags?access_token=",
|
||||
get_general_data: "https://api.ragestudio.net/RSA-COMTY/r/get-general-data?access_token=",
|
||||
follow_user: "https://api.ragestudio.net/RSA-COMTY/r/follow-user?access_token=",
|
||||
action_post: "https://api.ragestudio.net/RSA-COMTY/r/post-actions?access_token=",
|
||||
get_posts: "https://api.ragestudio.net/RSA-COMTY/r/posts?access_token=",
|
||||
|
||||
@ -4,56 +4,65 @@ const fromStorage = JSON.parse(localStorage.getItem('app_settings'))
|
||||
export var AppSettings = [
|
||||
{
|
||||
"SettingID": "strict_lightMode",
|
||||
"type" : "switch",
|
||||
"title": "Strict Light Mode",
|
||||
"description": "Force the app to apply full light mode theme when the light mode is activated... (Experimental)",
|
||||
"value": fromStorage? ycore.StorageValued('strict_lightMode') : false
|
||||
},
|
||||
{
|
||||
"SettingID": "default_collapse_sider",
|
||||
"type" : "switch",
|
||||
"title": "Default Collapse Sider",
|
||||
"description": "Force the app to apply collapsed mode theme when the app is mounted...",
|
||||
"value": fromStorage? ycore.StorageValued('default_collapse_sider') : true
|
||||
},
|
||||
{
|
||||
"SettingID": "auto_feedrefresh",
|
||||
"type" : "switch",
|
||||
"title": "Auto Feed Refresh",
|
||||
"description": "Force the app to auto refresh the posts feed when exist news posts for update",
|
||||
"value": fromStorage? ycore.StorageValued('auto_feedrefresh') : false
|
||||
},
|
||||
{
|
||||
"SettingID": "force_showDevLogs",
|
||||
"type" : "switch",
|
||||
"title": "Show Functions Logs",
|
||||
"description": "Show all console logs... [Developer]",
|
||||
"value": fromStorage? ycore.StorageValued('force_showDevLogs') : false
|
||||
},
|
||||
{
|
||||
"SettingID": "sessions_noexpire",
|
||||
"type" : "switch",
|
||||
"title": "No expire session",
|
||||
"description": "Force the app to not expire any session... [Developer]",
|
||||
"value": fromStorage? ycore.StorageValued('sessions_noexpire') : false
|
||||
},
|
||||
{
|
||||
"SettingID": "auto_search_ontype",
|
||||
"type" : "switch",
|
||||
"title": "Auto search",
|
||||
"description": "Force the app to automaticly search when a type input is detected... [Developer]",
|
||||
"value": fromStorage? ycore.StorageValued('auto_search_ontype') : false
|
||||
},
|
||||
{
|
||||
"SettingID": "default_showpostcreator",
|
||||
"type" : "switch",
|
||||
"title": "Show default Post Creator",
|
||||
"description": "Force the app to automaticly search when a type input is detected... [Developer]",
|
||||
"value": fromStorage? ycore.StorageValued('default_showpostcreator') : false
|
||||
},
|
||||
{
|
||||
"SettingID": "force_show_postactions",
|
||||
"type" : "switch",
|
||||
"title": "Not auto hide Posts Actions",
|
||||
"description": "Force the app to dont hide the post actions (likes, comments ...etc) automaticly... [Developer]",
|
||||
"value": fromStorage? ycore.StorageValued('force_show_postactions') : false
|
||||
},
|
||||
{
|
||||
"SettingID": "use_dev_server",
|
||||
"type" : "switch",
|
||||
"title": "Use Comty™ Development Server",
|
||||
"description": "Force the app to connect to an development server... [High Recomended]",
|
||||
"value": fromStorage? ycore.StorageValued('use_dev_server') : false
|
||||
}
|
||||
},
|
||||
]
|
||||
|
||||
@ -2,7 +2,7 @@
|
||||
"name": "comty-development",
|
||||
"title": "Comty™",
|
||||
"DevBuild": true,
|
||||
"version": "0.2.08",
|
||||
"version": "0.2.10",
|
||||
"description": "",
|
||||
"main": "index.js",
|
||||
"author": "RageStudio",
|
||||
@ -53,6 +53,7 @@
|
||||
"react-helmet": "^5.2.1",
|
||||
"react-iframe": "^1.8.0",
|
||||
"react-image": "^2.4.0",
|
||||
"react-infinite-scroller": "^1.2.4",
|
||||
"react-modal": "^3.11.1",
|
||||
"react-new-window": "^0.1.2",
|
||||
"react-notifications": "^1.4.3",
|
||||
@ -63,6 +64,7 @@
|
||||
"react-select-country-list": "^2.1.2",
|
||||
"react-sound": "^1.2.0",
|
||||
"react-transition-group": "^4.3.0",
|
||||
"react-virtualized": "^9.21.2",
|
||||
"recompose": "^0.30.0",
|
||||
"sqlite": "^3.0.3",
|
||||
"store": "^2.0.12",
|
||||
|
||||
@ -2,6 +2,28 @@ import * as ycore from 'ycore'
|
||||
var jquery = require("jquery");
|
||||
import * as Icons from '@ant-design/icons'
|
||||
|
||||
|
||||
export function GetGeneralData(callback){
|
||||
let formdata = new FormData();
|
||||
formdata.append("user_id", id);
|
||||
formdata.append("server_key", ycore.yConfig.server_key);
|
||||
const requestOptions = {
|
||||
method: 'POST',
|
||||
body: formdata,
|
||||
redirect: 'follow'
|
||||
};
|
||||
const urlObj = `${ycore.endpoints.get_general_data}${ycore.GetUserToken.decrypted().UserToken}`
|
||||
fetch(urlObj, requestOptions)
|
||||
.then(response => {
|
||||
ycore.yconsole.log(response)
|
||||
return callback(false, response)
|
||||
})
|
||||
.catch(error => {
|
||||
console.log('error', error)
|
||||
return callback(true, error)
|
||||
});
|
||||
}
|
||||
|
||||
export function follow_user(id, callback) {
|
||||
let formdata = new FormData();
|
||||
formdata.append("user_id", id);
|
||||
@ -165,9 +187,38 @@ export function ActionPost(type, id, value, callback){
|
||||
return callback(true, `[Server error] We couldnt ${type} this post`);
|
||||
})
|
||||
}
|
||||
export function GetPosts(userid, type, callback) {
|
||||
export function GetUserTags(id, callback){
|
||||
if (!id) {
|
||||
return false
|
||||
}
|
||||
let formdata = new FormData();
|
||||
formdata.append("server_key", ycore.yConfig.server_key);
|
||||
formdata.append("user_id", id )
|
||||
|
||||
const urlOBJ = `${ycore.endpoints.get_user_tags}${ycore.GetUserToken.decrypted().UserToken}`
|
||||
const settings = {
|
||||
"url": urlOBJ,
|
||||
"method": "POST",
|
||||
"timeout": 0,
|
||||
"processData": false,
|
||||
"mimeType": "multipart/form-data",
|
||||
"contentType": false,
|
||||
"data": formdata
|
||||
};
|
||||
jquery.ajax(settings)
|
||||
.done(function (response) {
|
||||
return callback(null, response);
|
||||
})
|
||||
.fail(function (response) {
|
||||
const exception = 'Request Failed';
|
||||
return callback(exception, response);
|
||||
})
|
||||
}
|
||||
export function GetPosts(userid, type, fkey, callback) {
|
||||
let formdata = new FormData();
|
||||
formdata.append("server_key", ycore.yConfig.server_key);
|
||||
formdata.append("after_post_id", (fkey || 0))
|
||||
formdata.append("limit", ycore.DevOptions.limit_post_catch || 20)
|
||||
switch (type) {
|
||||
case 'feed':
|
||||
formdata.append("type", "get_news_feed");
|
||||
@ -211,7 +262,6 @@ export const get_app_session = {
|
||||
redirect: 'follow'
|
||||
};
|
||||
const uriObj = `${ycore.endpoints.get_sessions}${ycore.GetUserToken.decrypted().UserToken}`
|
||||
ycore.notifyProccess('Getting session data...')
|
||||
fetch(uriObj, requestOptions)
|
||||
.then(response => response.text())
|
||||
.then(result => {
|
||||
|
||||
@ -1,14 +1,19 @@
|
||||
import React from 'react'
|
||||
import {AppSettings} from '../../globals/settings.js'
|
||||
import {Endpoints} from 'globals/endpoints.js'
|
||||
import umiRouter from 'umi/router';
|
||||
import * as antd from "antd"
|
||||
import * as Icons from '@ant-design/icons';
|
||||
import Icon from '@ant-design/icons'
|
||||
/**
|
||||
* @yCore_Worker
|
||||
*
|
||||
* @author rStudio© 2020
|
||||
* @licensed Pending...
|
||||
*/
|
||||
|
||||
import config from 'config'
|
||||
import './libs.js'
|
||||
import * as sw from '../../service-worker.js'
|
||||
import React from "react";
|
||||
import {AppSettings} from "../../globals/settings.js";
|
||||
import {Endpoints} from "globals/endpoints.js";
|
||||
import umiRouter from "umi/router";
|
||||
import * as antd from "antd";
|
||||
import * as Icons from '@ant-design/icons';
|
||||
|
||||
import config from "config"
|
||||
import "./libs.js"
|
||||
|
||||
export * from "./libs.js"
|
||||
export * from "../../config/app.settings.js"
|
||||
@ -51,6 +56,11 @@ export function b64toBlob(b64Data, contentType, sliceSize) {
|
||||
return blob;
|
||||
}
|
||||
|
||||
/**
|
||||
* Return parsed some information about this App
|
||||
*
|
||||
* @return {object}
|
||||
*/
|
||||
export const AppInfo = {
|
||||
name: package_json.title,
|
||||
version: package_json.version,
|
||||
@ -58,11 +68,12 @@ export const AppInfo = {
|
||||
logo_dark: config.DarkFullLogoPath
|
||||
}
|
||||
|
||||
export function RegSW(){
|
||||
yconsole.log('Registering Service Worker...')
|
||||
sw.register()
|
||||
}
|
||||
|
||||
/**
|
||||
* Convert the localStorage values (AppSettings) parsed
|
||||
*
|
||||
* @param e {String} String of SettingID for search
|
||||
* @return {string} Boolean value
|
||||
*/
|
||||
export function StorageValued(e){
|
||||
try {
|
||||
const fromStorage = JSON.parse(localStorage.getItem('app_settings'))
|
||||
@ -77,6 +88,12 @@ export function StorageValued(e){
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Return the values as alias (AppSettings, DevOptions)
|
||||
*
|
||||
* @param e {String} String of SettingID for search
|
||||
* @return {string} Boolean value
|
||||
*/
|
||||
export function ReturnDevOption(e){
|
||||
const Ite = AppSettings.map(item => {
|
||||
return item.SettingID === e? item.value : null
|
||||
@ -85,12 +102,23 @@ export function ReturnDevOption(e){
|
||||
return fr.toString()
|
||||
}
|
||||
|
||||
/**
|
||||
* Global fix for convert '1, 0' to string boolean 'true, false'
|
||||
*
|
||||
* @param e {int} Numeric boolean reference
|
||||
* @return {bool} Boolean value
|
||||
*/
|
||||
export function booleanFix(e){
|
||||
if(e == 1){
|
||||
return true
|
||||
}
|
||||
return false
|
||||
}
|
||||
|
||||
/**
|
||||
* Framework functionality for navigate between pages (Router)
|
||||
*
|
||||
*/
|
||||
export const crouter = {
|
||||
native: (e) =>{
|
||||
umiRouter.push({
|
||||
@ -102,6 +130,11 @@ export const crouter = {
|
||||
router.push(e)
|
||||
}
|
||||
}
|
||||
/**
|
||||
* Render User Notification about an Error
|
||||
*
|
||||
* @param err {String} String of error for show
|
||||
*/
|
||||
export function notifyError(err){
|
||||
antd.notification.error({
|
||||
message: 'Wopss',
|
||||
@ -109,6 +142,11 @@ export function notifyError(err){
|
||||
placement: 'bottomLeft'
|
||||
})
|
||||
}
|
||||
/**
|
||||
* Render User Notification about an proccess
|
||||
*
|
||||
* @param cust {String} String of proccess for show
|
||||
*/
|
||||
export function notifyProccess(cust){
|
||||
antd.notification.open({
|
||||
icon: <Icons.LoadingOutlined style={{ color: '#108ee9' }} />,
|
||||
@ -117,6 +155,10 @@ export function notifyProccess(cust){
|
||||
placement: 'bottomLeft'
|
||||
})
|
||||
}
|
||||
/**
|
||||
* Request FullScreen mode
|
||||
*
|
||||
*/
|
||||
export function requestFullscreen(){
|
||||
var elem = document.documentElement;
|
||||
if (elem.requestFullscreen) {
|
||||
@ -129,6 +171,13 @@ export function requestFullscreen(){
|
||||
elem.msRequestFullscreen();
|
||||
}
|
||||
}
|
||||
/**
|
||||
* Async get/set localStorage method
|
||||
*
|
||||
* @param key {string} String for search
|
||||
* @param value {string} Value for set
|
||||
* @return {any} An callback for async/await
|
||||
*/
|
||||
export const asyncLocalStorage = {
|
||||
setItem: function (key, value) {
|
||||
return Promise.resolve().then(function () {
|
||||
@ -141,6 +190,13 @@ export const asyncLocalStorage = {
|
||||
});
|
||||
}
|
||||
};
|
||||
/**
|
||||
* Async get/set sessionStorage method
|
||||
*
|
||||
* @param key {string} String for search
|
||||
* @param value {string} Value for set
|
||||
* @return {any} An callback for async/await
|
||||
*/
|
||||
export const asyncSessionStorage = {
|
||||
setItem: function (key, value) {
|
||||
return Promise.resolve().then(function () {
|
||||
@ -153,11 +209,19 @@ export const asyncSessionStorage = {
|
||||
});
|
||||
}
|
||||
};
|
||||
|
||||
/**
|
||||
* Request browser for refresh the windows
|
||||
*
|
||||
*/
|
||||
export function RefreshONCE(){
|
||||
window.location.reload();
|
||||
}
|
||||
|
||||
/**
|
||||
* Parse information about this App
|
||||
*
|
||||
* @param e1 {string} Declare type
|
||||
* @return {any} JSX Component / Object information
|
||||
*/
|
||||
export function DetectNoNStableBuild(e1) {
|
||||
switch (e1) {
|
||||
case 'TagComponent':
|
||||
@ -184,7 +248,11 @@ export function DetectNoNStableBuild(e1) {
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* User console with setting user permissions
|
||||
*
|
||||
* @param ... {any} Use for type of console
|
||||
*/
|
||||
export const yconsole = {
|
||||
log: (...cont)=>{
|
||||
ReturnDevOption('force_showDevLogs')? console.log(...cont) : null
|
||||
|
||||
@ -52,9 +52,9 @@ class Control extends React.Component {
|
||||
return(
|
||||
Show? (
|
||||
<StyleRoot>
|
||||
<div style={FadeIN? animationStyles.fadeInUp : animationStyles.bounceOutDown }>
|
||||
<antd.Card bordered={false} className={styles.ControlCard}>
|
||||
<React.Fragment>{RenderFragment} </React.Fragment>
|
||||
<div key={Math.random()} style={FadeIN? animationStyles.fadeInUp : animationStyles.bounceOutDown }>
|
||||
<antd.Card key={Math.random()} bordered={false} className={styles.ControlCard}>
|
||||
<React.Fragment>{RenderFragment}</React.Fragment>
|
||||
</antd.Card>
|
||||
</div>
|
||||
</StyleRoot>
|
||||
|
||||
@ -141,10 +141,6 @@ class Sider extends PureComponent {
|
||||
{collapsed ? null : <Trans>Logout</Trans>}
|
||||
</antd.Menu.Item>
|
||||
</antd.Menu>
|
||||
<div className={styles.siderhead}>
|
||||
<antd.Avatar onClick={() => ycore.crouter.native(`@${userData.username}`)} size={collapsed? "small" : "large"} shape={collapsed? "circle" : "square"} src={userData.avatar} className={collapsed? styles.avatar : styles.avatarFull} />
|
||||
</div>
|
||||
{collapsed? null : <div className={styles.userInfo}><a onClick={() => ycore.crouter.native(`@${userData.username}`)} ><h2>@{userData.username}</h2></a></div> }
|
||||
</div>
|
||||
</ScrollBar>
|
||||
</div>
|
||||
|
||||
@ -1,6 +1,9 @@
|
||||
import React from 'react'
|
||||
import * as antd from 'antd'
|
||||
import * as ycore from 'ycore'
|
||||
|
||||
import InfiniteScroll from 'react-infinite-scroller';
|
||||
|
||||
import {PostCard} from 'components'
|
||||
|
||||
var userData = ycore.SDCP()
|
||||
@ -15,30 +18,38 @@ class MainFeed extends React.Component {
|
||||
super(props)
|
||||
window.MainFeedComponent = this;
|
||||
this.state = {
|
||||
feedRaw: [],
|
||||
loading: true,
|
||||
hasMore: true,
|
||||
}
|
||||
}
|
||||
|
||||
toogleLoader(){
|
||||
this.setState({ loading: !this.state.loading })
|
||||
}
|
||||
componentDidMount(){
|
||||
const { get, uid, filters } = this.props
|
||||
|
||||
GetPostsData(fkey){
|
||||
const { get, uid, filters } = this.props;
|
||||
if (!get) {
|
||||
console.error('Please, fill params with an catch type...')
|
||||
ycore.yconsole.error('Please, fill params with an catch type...')
|
||||
return
|
||||
}
|
||||
ycore.GetPosts(uid, get, (err, result) => this.setState({ feedRaw: result, loading: false }))
|
||||
}
|
||||
handleRefreshList(){
|
||||
const { get, uid, filters } = this.props
|
||||
if (!get) {
|
||||
console.error('Please, fill params with an catch type...')
|
||||
return
|
||||
if (!fkey) {
|
||||
ycore.yconsole.warn('Please, provide a fkey for offset the feed, default using => 0');
|
||||
|
||||
}
|
||||
this.toogleLoader()
|
||||
ycore.GetPosts(uid, get, (err, result) => this.setState({ feedRaw: result, loading: false }))
|
||||
ycore.GetPosts(uid, get, (fkey || '0'), (err, result) => {
|
||||
this.setState({ feedRaw: result, loading: false })
|
||||
})
|
||||
}
|
||||
renderFeedPosts(e){
|
||||
|
||||
componentDidMount(){
|
||||
this.GetPostsData()
|
||||
|
||||
}
|
||||
|
||||
renderFeedPosts = (e) =>{
|
||||
const {feedRaw} = this.state
|
||||
const { get, filters } = this.props
|
||||
try {
|
||||
@ -71,18 +82,68 @@ class MainFeed extends React.Component {
|
||||
const paylodd = {user: '', ago: '', avatar: '', content: '', publisher: '' }
|
||||
return <PostCard payload={paylodd} />
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
handleInfiniteOnLoad = () => {
|
||||
const { get, uid, filters } = this.props;
|
||||
let { feedRaw } = this.state;
|
||||
this.setState({
|
||||
loading: true,
|
||||
});
|
||||
if (feedRaw.length > 300) {
|
||||
antd.message.warning('Infinite List loaded all');
|
||||
this.setState({
|
||||
hasMore: false,
|
||||
loading: false,
|
||||
});
|
||||
return;
|
||||
}
|
||||
console.log('LENGTHT', feedRaw.length)
|
||||
ycore.GetPostsData(uid, get, feedRaw.length, (err, res) => {
|
||||
feedRaw = feedRaw.concat(res.results);
|
||||
this.setState({
|
||||
feedRaw,
|
||||
loading: false,
|
||||
});
|
||||
});
|
||||
};
|
||||
|
||||
|
||||
|
||||
render(){
|
||||
const { loading } = this.state;
|
||||
const { loading, feedRaw } = this.state;
|
||||
const loaderCard = ( <antd.Card style={{ maxWidth: '26.5vw', margin: 'auto' }} >
|
||||
<antd.Skeleton avatar paragraph={{ rows: 4 }} active />
|
||||
</antd.Card>)
|
||||
|
||||
return (
|
||||
<div>
|
||||
{loading?
|
||||
<antd.Card style={{ maxWidth: '26.5vw', margin: 'auto' }} >
|
||||
<antd.Skeleton avatar paragraph={{ rows: 4 }} active />
|
||||
</antd.Card> :
|
||||
this.renderFeedPosts()
|
||||
}
|
||||
<div>
|
||||
<InfiniteScroll
|
||||
initialLoad={false}
|
||||
pageStart={0}
|
||||
loadMore={this.handleInfiniteOnLoad}
|
||||
hasMore={!this.state.loading && this.state.hasMore}
|
||||
useWindow={false}
|
||||
>
|
||||
<List
|
||||
dataSource={this.state.feedRaw}
|
||||
renderItem={item => (
|
||||
<List.Item key={item.id}>
|
||||
<List.Item.Meta
|
||||
avatar={
|
||||
<Avatar src="https://zos.alipayobjects.com/rmsportal/ODTLcjxAfvqbxHnVXCYX.png" />
|
||||
}
|
||||
title={<a href="https://ant.design">{item.name.last}</a>}
|
||||
description={item.email}
|
||||
/>
|
||||
<div>Content</div>
|
||||
</List.Item>
|
||||
)}
|
||||
>
|
||||
{this.state.loading && this.state.hasMore && (loaderCard)}
|
||||
</List>
|
||||
</InfiniteScroll>
|
||||
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
@ -16,8 +16,7 @@ function getBase64(img, callback) {
|
||||
const reader = new FileReader();
|
||||
reader.addEventListener('load', () => callback(reader.result));
|
||||
reader.readAsDataURL(img);
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
export function HandleVisibility(){
|
||||
window.PostCreatorComponent.ToogleVisibility();
|
||||
@ -30,13 +29,14 @@ class PostCreator extends React.PureComponent{
|
||||
this.state = {
|
||||
visible: true,
|
||||
FadeIN: true,
|
||||
keys_remaining: '512',
|
||||
keys_remaining: ycore.DevOptions.MaxLengthPosts,
|
||||
toolbox_open: false,
|
||||
rawtext: '',
|
||||
posting: false,
|
||||
posting_ok: false,
|
||||
shareWith: 'any',
|
||||
UploadActive: false,
|
||||
dragging: false,
|
||||
}
|
||||
}
|
||||
renderPostPlayer(payload){
|
||||
@ -46,7 +46,13 @@ class PostCreator extends React.PureComponent{
|
||||
if (imagefilter) {
|
||||
return (
|
||||
<div className={styles.imagePreviewWrapper}>
|
||||
<img className={styles.imagePreview} src={fileURL} />
|
||||
<div className={styles.imageOverlay}>
|
||||
<antd.Button onClick={() => null} icon={<Icons.DeleteOutlined />} />
|
||||
</div>
|
||||
<div className={styles.imagePreview}>
|
||||
<img className={styles.imagePreview} src={fileURL} />
|
||||
</div>
|
||||
|
||||
</div>
|
||||
)
|
||||
}
|
||||
@ -54,7 +60,7 @@ class PostCreator extends React.PureComponent{
|
||||
return (
|
||||
<div className={styles.imagePreviewWrapper}>
|
||||
<video id="player" playsInline controls >
|
||||
<source className={styles.imagePreview} src={file} type={file.type}/>
|
||||
<source className={styles.imagePreview} src={fileURL} type={file.type}/>
|
||||
</video>
|
||||
</div>
|
||||
)
|
||||
@ -90,11 +96,11 @@ class PostCreator extends React.PureComponent{
|
||||
beforeUpload(file) {
|
||||
const filter = file.type === 'image/jpeg' || file.type === 'image/png' || file.type === 'video/mp4';
|
||||
if (!filter) {
|
||||
antd.message.error('Invalid File!');
|
||||
antd.message.error(`${file.type} This file is not valid!`);
|
||||
}
|
||||
const maxsize = file.size / 1024 / 1024 < ycore.DevOptions.MaximunAPIPayload;
|
||||
if (!maxsize) {
|
||||
antd.message.error('Image must smaller than 99MB!');
|
||||
antd.message.error(`Image must smaller than ${ycore.DevOptions.MaximunAPIPayload} KB!`);
|
||||
}
|
||||
return filter && maxsize;
|
||||
}
|
||||
@ -105,7 +111,7 @@ class PostCreator extends React.PureComponent{
|
||||
|
||||
handleKeysProgressBar(){
|
||||
const { keys_remaining } = this.state;
|
||||
if (keys_remaining <= 80) {
|
||||
if (keys_remaining <= (ycore.DevOptions.MaxLengthPosts/100*30)) {
|
||||
return 'exception'
|
||||
}else return('active')
|
||||
}
|
||||
@ -132,7 +138,7 @@ class PostCreator extends React.PureComponent{
|
||||
if(!rawtext || !file){
|
||||
return null
|
||||
}
|
||||
this.setState({ posting: true, keys_remaining: '512' })
|
||||
this.setState({ posting: true, keys_remaining: ycore.DevOptions.MaxLengthPosts })
|
||||
ycore.PublishPost(ycore.GetPostPrivacy.bool(shareWith), rawtext, file, (err, res) => {
|
||||
if (err) {
|
||||
ycore.notifyError(err)
|
||||
@ -142,8 +148,46 @@ class PostCreator extends React.PureComponent{
|
||||
|
||||
})
|
||||
}
|
||||
|
||||
dropRef = React.createRef()
|
||||
|
||||
handleDragIn = (e) => {
|
||||
console.log(' DRAG IN ')
|
||||
e.preventDefault()
|
||||
e.stopPropagation()
|
||||
this.dragCounter++
|
||||
if (e.dataTransfer.items && e.dataTransfer.items.length > 0) {
|
||||
this.setState({dragging: true})
|
||||
}
|
||||
}
|
||||
handleDragOut = (e) => {
|
||||
console.log(' DRAG OUT ')
|
||||
e.preventDefault()
|
||||
e.stopPropagation()
|
||||
this.dragCounter--
|
||||
if (this.dragCounter > 0) return
|
||||
this.setState({dragging: false})
|
||||
}
|
||||
handleDrop = (e) => {
|
||||
console.log(' DRAG DROP ')
|
||||
e.preventDefault()
|
||||
e.stopPropagation()
|
||||
}
|
||||
|
||||
componentDidMount() {
|
||||
this.dragCounter = 0
|
||||
let div = this.dropRef.current
|
||||
div.addEventListener('dragenter', this.handleDragIn)
|
||||
div.addEventListener('dragleave', this.handleDragOut)
|
||||
div.addEventListener('drop', this.handleDrop)
|
||||
}
|
||||
componentWillUnmount() {
|
||||
let div = this.dropRef.current
|
||||
div.removeEventListener('dragenter', this.handleDragIn)
|
||||
div.removeEventListener('dragleave', this.handleDragOut)
|
||||
div.removeEventListener('dragover', this.handleDrag)
|
||||
div.removeEventListener('drop', this.handleDrop)
|
||||
|
||||
}
|
||||
render(){
|
||||
const { keys_remaining, visible } = this.state;
|
||||
const percent = (((keys_remaining/ycore.DevOptions.MaxLengthPosts) * 100).toFixed(2) )
|
||||
@ -164,39 +208,36 @@ class PostCreator extends React.PureComponent{
|
||||
return(
|
||||
<div className={styles.cardWrapper}>
|
||||
<antd.Card bordered="false">
|
||||
<div className={styles.inputWrapper}>
|
||||
{this.state.UploadActive?
|
||||
|
||||
<div ref={this.dropRef} className={styles.inputWrapper}>
|
||||
|
||||
{this.state.dragging?
|
||||
<div className={styles.uploader}>
|
||||
|
||||
<antd.Upload.Dragger
|
||||
multiple={false}
|
||||
multiple={true}
|
||||
listType="picture"
|
||||
showUploadList={false}
|
||||
showUploadList={true}
|
||||
beforeUpload={this.beforeUpload}
|
||||
onChange={this.handleFileUpload}
|
||||
>
|
||||
<div>
|
||||
<p className="ant-upload-drag-icon">
|
||||
<Icons.InboxOutlined />
|
||||
</p>
|
||||
<p className="ant-upload-text">Click or drag file to this area to upload</p>
|
||||
<span>*Allowed PNG, JPG, MP4 </span>
|
||||
</div>
|
||||
|
||||
</antd.Upload.Dragger>
|
||||
</div>
|
||||
:
|
||||
<>
|
||||
</div>
|
||||
: <>
|
||||
<div className={styles.titleAvatar}><img src={userData.avatar} /></div>
|
||||
<antd.Input.TextArea disabled={this.state.posting? true : false} onPressEnter={this.handlePublishPost} value={this.state.rawtext} autoSize={{ minRows: 3, maxRows: 5 }} dragable="false" placeholder="What are you thinking?" onChange={this.handleChanges} allowClear maxLength={ycore.DevOptions.MaxLengthPosts} rows={4} />
|
||||
<div><antd.Button disabled={this.state.posting? true : (keys_remaining < 512? false : true)} onClick={this.handlePublishPost} type="primary" icon={this.state.posting_ok? <Icons.CheckCircleOutlined/> : (this.state.posting? <Icons.LoadingOutlined /> : <Icons.ExportOutlined /> )} /></div>
|
||||
</>}
|
||||
<antd.Input.TextArea disabled={this.state.posting? true : false} onPressEnter={this.handlePublishPost} value={this.state.rawtext} autoSize={{ minRows: 3, maxRows: 5 }} dragable="false" placeholder="What are you thinking?" onChange={this.handleChanges} allowClear maxLength={ycore.DevOptions.MaxLengthPosts} rows={8} />
|
||||
<div><antd.Button disabled={this.state.posting? true : (keys_remaining < ycore.DevOptions.MaxLengthPosts? false : true)} onClick={this.handlePublishPost} type="primary" icon={this.state.posting_ok? <Icons.CheckCircleOutlined/> : (this.state.posting? <Icons.LoadingOutlined /> : <Icons.ExportOutlined /> )} /></div>
|
||||
</> }
|
||||
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
<div className={styles.progressHandler}><antd.Progress strokeWidth="4px" className={this.state.posting? styles.proccessUnset : (keys_remaining < 512? styles.proccessSet : styles.proccessUnset)} status={this.handleKeysProgressBar()} showInfo={false} percent={percent} /></div>
|
||||
<div className={styles.progressHandler}><antd.Progress strokeWidth="4px" className={this.state.posting? styles.proccessUnset : (keys_remaining < 512? styles.proccessSet : styles.proccessUnset)} status={this.handleKeysProgressBar()} showInfo={false} percent={percent} /></div>
|
||||
|
||||
<div className={styles.postExtra} >
|
||||
{ this.state.file?
|
||||
this.renderPostPlayer() : null
|
||||
}
|
||||
<antd.Button type="ghost" onClick={() => this.ToogleUpload()} > <MICONS.AddCircle /></antd.Button>
|
||||
<antd.Button type="ghost" onClick={() => this.ToogleUpload()} > {this.state.UploadActive? <MICONS.Cancel /> : <MICONS.AddCircle />} </antd.Button>
|
||||
<antd.Button type="ghost" onClick={this.handleToggleToolbox} ><MICONS.Tune /></antd.Button>
|
||||
<antd.Dropdown overlay={shareOptionsMenu}>
|
||||
<a className={styles.shareWith} onClick={e => e.preventDefault()}>
|
||||
|
||||
@ -82,11 +82,14 @@
|
||||
.inputWrapper{
|
||||
display: flex;
|
||||
z-index: 10;
|
||||
position: relative;
|
||||
width: 100%;
|
||||
padding: 18px 7px 0 7px;
|
||||
transition: height 150ms linear;
|
||||
:global{
|
||||
.ant-btn-primary {
|
||||
z-index: 10;
|
||||
position: relative;
|
||||
border-radius: 0 10px 10px 0;
|
||||
height: 100%;
|
||||
vertical-align: bottom;
|
||||
@ -94,6 +97,8 @@
|
||||
box-shadow: none;
|
||||
}
|
||||
.ant-input {
|
||||
z-index: 10;
|
||||
position: relative;
|
||||
border-color: transparent !important;
|
||||
box-shadow: none;
|
||||
border-radius: 3px 0 0 0;
|
||||
@ -113,6 +118,8 @@
|
||||
}
|
||||
|
||||
.progressHandler{
|
||||
z-index: 10;
|
||||
position: relative;
|
||||
margin: 0 7px 0 7px;
|
||||
:global{
|
||||
.ant-progress-bg{
|
||||
@ -182,18 +189,39 @@
|
||||
}
|
||||
|
||||
.imagePreviewWrapper{
|
||||
display: flex;
|
||||
position: relative;
|
||||
z-index: 30;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
margin: 15px 0 15px 0;
|
||||
// top: -100px;
|
||||
margin: 0 0 15px 0;
|
||||
.imagePreview{
|
||||
z-index: 5;
|
||||
position: relative;
|
||||
margin: auto;
|
||||
max-width: 300px;
|
||||
object-fit: cover;
|
||||
border-radius: 8px;
|
||||
img{
|
||||
width: 100%;
|
||||
border: 0.5px rgba(56, 56, 56, 0.459) solid;
|
||||
}
|
||||
transition: all 150ms linear;
|
||||
|
||||
}
|
||||
.imageOverlay{
|
||||
z-index: 10;
|
||||
position: relative;
|
||||
opacity: 0;
|
||||
transition: all 150ms linear;
|
||||
|
||||
}
|
||||
}
|
||||
.imagePreviewWrapper:hover .imagePreview{
|
||||
opacity: 0.5;
|
||||
transition: all 150ms linear;
|
||||
}
|
||||
.imagePreviewWrapper:hover .imageOverlay{
|
||||
opacity: 1;
|
||||
transition: all 150ms linear;
|
||||
|
||||
}
|
||||
|
||||
.proccessUnset{
|
||||
|
||||
19
src/components/UserBadges/index.js
Normal file
19
src/components/UserBadges/index.js
Normal file
@ -0,0 +1,19 @@
|
||||
import React from 'react'
|
||||
import styles from './index.less'
|
||||
import * as antd from 'antd'
|
||||
import * as ycore from 'ycore'
|
||||
import { BadgesType } from 'globals/badges_list'
|
||||
|
||||
export default class UserBadges extends React.Component {
|
||||
render(){
|
||||
const { values } = this.props;
|
||||
console.log(BadgesType)
|
||||
return(
|
||||
<div className={styles.TagWrappers}>
|
||||
{ycore.booleanFix(values.nsfw_flag)? <antd.Tag color="volcano" >NSFW</antd.Tag> : null}
|
||||
{ycore.booleanFix(values.is_pro)? <antd.Tag color="purple">CPRO™ <Icons.RocketOutlined /></antd.Tag> : null}
|
||||
{ycore.booleanFix(values.dev)? <antd.Tag color="default">DEVELOPER <Icons.CodeOutlined /></antd.Tag> : null}
|
||||
</div>
|
||||
)
|
||||
}
|
||||
}
|
||||
0
src/components/UserBadges/index.less
Normal file
0
src/components/UserBadges/index.less
Normal file
@ -42,9 +42,8 @@ class UserProfile extends React.Component {
|
||||
const { regx } = this.props
|
||||
this.initUser(regx)
|
||||
SetHeaderSearchType.disable()
|
||||
// console.log('%c Halo, sabias que el gatitos es gai? ', 'font-weight: bold; font-size: 50px;color: red; text-shadow: 3px 3px 0 rgb(217,31,38) , 6px 6px 0 rgb(226,91,14) , 9px 9px 0 rgb(245,221,8) , 12px 12px 0 rgb(5,148,68) , 15px 15px 0 rgb(2,135,206) , 18px 18px 0 rgb(4,77,145) , 21px 21px 0 rgb(42,21,113)')
|
||||
}
|
||||
|
||||
|
||||
initUser = (e) => {
|
||||
const parsed = e.shift()
|
||||
const raw = parsed.toString()
|
||||
@ -67,6 +66,12 @@ class UserProfile extends React.Component {
|
||||
ycore.yconsole.log(`Using aproximate user! => ${c1} / ${c2}`)
|
||||
ycore.crouter.native(`@${c1}`)
|
||||
}
|
||||
ycore.GetUserTags(rp['0'].user_id, (err, res) => {
|
||||
if (err) {
|
||||
ycore.notifyError(err)
|
||||
return
|
||||
}
|
||||
})
|
||||
this.setState({ UUID: rp['0'].user_id, RenderValue: rp['0'], loading: false , Followed: ycore.booleanFix(rp['0'].is_following)})
|
||||
} catch (err) {
|
||||
ycore.notifyError(err)
|
||||
@ -92,8 +97,8 @@ class UserProfile extends React.Component {
|
||||
{ycore.booleanFix(values.nsfw_flag)? <antd.Tag color="volcano" >NSFW</antd.Tag> : null}
|
||||
{ycore.booleanFix(values.is_pro)? <antd.Tag color="purple">CPRO™ <Icons.RocketOutlined /></antd.Tag> : null}
|
||||
{ycore.booleanFix(values.dev)? <antd.Tag color="default">DEVELOPER <Icons.CodeOutlined /></antd.Tag> : null}
|
||||
{isOwnProfile(values.id)? null : <div className={styles.follow_wrapper} onClick={() => this.handleFollowUser()} ><Follow_btn followed={this.state.Followed? true : false} /></div>}
|
||||
</div>
|
||||
{isOwnProfile(values.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' }} >{values.username}<antd.Tooltip title="User Verified">{ycore.booleanFix(values.verified)? <Icon style={{ color: 'blue', verticalAlign:'top' }} component={CustomIcons.VerifiedBadge} /> : null}</antd.Tooltip></h1>
|
||||
<span style={{ fontSize: '14px', fontWeight: '100', lineHeight: '0', marginBottom: '5px' }} dangerouslySetInnerHTML={{__html: values.about }} />
|
||||
|
||||
@ -1,19 +1,50 @@
|
||||
// @alias from 'components'
|
||||
|
||||
// Helpers & Misc
|
||||
import CustomIcons from './CustomIcons'
|
||||
import PageTransition from './PageTransition'
|
||||
import MainFeed from './MainFeed'
|
||||
import YulioID from './YulioID'
|
||||
import SearchCard from './SearchCard'
|
||||
import LikeBTN from './LikeBtn'
|
||||
import UserProfile from './UserProfile'
|
||||
import MainSidebar from './MainSidebar'
|
||||
import PostCard from './PostCard'
|
||||
import PostCreator from './PostCreator'
|
||||
import Loader from './Loader/Loader.js'
|
||||
import ScrollBar from './ScrollBar'
|
||||
import * as MyLayout from './Layout/index.js'
|
||||
import Page from './Page'
|
||||
import CoreLoader from './CoreLoader'
|
||||
|
||||
// App Layout Components
|
||||
import * as MyLayout from './Layout/index.js'
|
||||
import MicroHeader from './MicroHeader'
|
||||
import HeaderSearch from './HeaderSearch'
|
||||
import MainSidebar from './MainSidebar'
|
||||
import PageTransition from './PageTransition'
|
||||
import YulioID from './YulioID'
|
||||
|
||||
export { PageTransition, SearchCard, HeaderSearch, YulioID, UserProfile, MyLayout, Loader, Page, ScrollBar, CoreLoader, PostCard, PostCreator, CustomIcons, MainSidebar, LikeBTN, MainFeed, MicroHeader}
|
||||
// User Components
|
||||
import UserBadges from './UserBadges'
|
||||
import UserProfile from './UserProfile'
|
||||
import SearchCard from './SearchCard'
|
||||
|
||||
// Post Components
|
||||
import PostCard from './PostCard'
|
||||
import LikeBTN from './LikeBtn'
|
||||
import MainFeed from './MainFeed'
|
||||
import PostCreator from './PostCreator'
|
||||
|
||||
// Mix & Export all
|
||||
export
|
||||
{
|
||||
UserBadges,
|
||||
PageTransition,
|
||||
SearchCard,
|
||||
HeaderSearch,
|
||||
YulioID,
|
||||
UserProfile,
|
||||
MyLayout,
|
||||
Loader,
|
||||
Page,
|
||||
ScrollBar,
|
||||
CoreLoader,
|
||||
PostCard,
|
||||
PostCreator,
|
||||
CustomIcons,
|
||||
MainSidebar,
|
||||
LikeBTN,
|
||||
MainFeed,
|
||||
MicroHeader
|
||||
}
|
||||
|
||||
@ -165,7 +165,7 @@ class PrimaryLayout extends PureComponent {
|
||||
<Sider {...SiderProps}/>
|
||||
|
||||
<div id="primaryLayout" className={styles.leftContainer}>
|
||||
<PageTransition preset="moveToLeftFromRight" id="scroller" transitionKey={location.pathname}>
|
||||
<PageTransition preset="moveToRightScaleUp" id="scroller" transitionKey={location.pathname}>
|
||||
|
||||
<Content {...ContainerProps} className={classnames(styles.content, {[styles.collapsed]: !collapsed} )}>
|
||||
<HeaderSearch />
|
||||
@ -175,15 +175,15 @@ class PrimaryLayout extends PureComponent {
|
||||
</div>
|
||||
|
||||
<div id="secondaryLayout" className={styles.rightContainer}>
|
||||
<PageTransition preset="moveToLeftFromRight" transitionKey={location.pathname}>
|
||||
|
||||
<div className={styles.SecondHeader}>
|
||||
<div className={styles.notif_box}></div>
|
||||
<img src={userData.avatar} />
|
||||
<img onClick={() => ycore.crouter.native(`@${userData.username}`)} src={userData.avatar} />
|
||||
</div>
|
||||
<Fragment>
|
||||
{this.state.ContentSecondLayer}
|
||||
</Fragment>
|
||||
</PageTransition>
|
||||
|
||||
</div>
|
||||
|
||||
</Layout>
|
||||
|
||||
@ -6,7 +6,15 @@
|
||||
img {
|
||||
border-radius: 15px;
|
||||
width: 40px;
|
||||
transition: all 150ms linear;
|
||||
box-shadow: 0px 0px 0 0px rgba(255, 255, 255, 0);
|
||||
|
||||
}
|
||||
img:hover{
|
||||
box-shadow: 0px 0px 10px 0px rgba(255, 255, 255, 0.205);
|
||||
transition: all 150ms linear;
|
||||
}
|
||||
transition: all 150ms linear;
|
||||
.notif_box {
|
||||
margin: 0 15px 0 5px;
|
||||
width: 40px;
|
||||
|
||||
@ -3,18 +3,21 @@ import React from 'react';
|
||||
import * as ycore from 'ycore'
|
||||
import * as antd from 'antd'
|
||||
import * as Icons from '@ant-design/icons';
|
||||
import $ from 'jquery'
|
||||
import Icon from '@ant-design/icons'
|
||||
|
||||
import styles from './style.less'
|
||||
import { GridContent } from '@ant-design/pro-layout';
|
||||
import { json } from 'body-parser';
|
||||
|
||||
|
||||
const UserData = ycore.SDCP()
|
||||
|
||||
export default class __m extends React.Component {
|
||||
constructor(props){
|
||||
super(props),
|
||||
this.state = {
|
||||
s_id: '',
|
||||
coninfo: 'Getting info...',
|
||||
};
|
||||
}
|
||||
|
||||
@ -33,43 +36,57 @@ export default class __m extends React.Component {
|
||||
this.setState({ s_id: response})
|
||||
})
|
||||
}
|
||||
DescompileSDCP(){
|
||||
let result = {};
|
||||
for (var i = 0; i < UserData.length; i++) {
|
||||
result[UserData[i].key] = UserData[i].value;
|
||||
}
|
||||
console.log([result])
|
||||
}
|
||||
|
||||
render() {
|
||||
return (
|
||||
<GridContent>
|
||||
<React.Fragment>
|
||||
<div className={styles.titleHeader}>
|
||||
<h1><Icons.ApartmentOutlined /> Administration</h1>
|
||||
</div>
|
||||
const arrayOfSDCP = Object.entries(UserData).map((e) => ( { [e[0]]: e[1] } ));
|
||||
|
||||
<div className={styles.titleHeader}>
|
||||
<h1><Icons.BugOutlined /> Debug</h1>
|
||||
</div>
|
||||
<div className={styles.sectionWrapper}>
|
||||
<div>
|
||||
<antd.Button onClick={() => this.handleSID()} > Refresh Session ID</antd.Button>
|
||||
<span> {this.state.s_id} </span>
|
||||
</div>
|
||||
</div>
|
||||
<antd.Row
|
||||
gutter={24}
|
||||
type="flex"
|
||||
style={{
|
||||
marginTop: 24,
|
||||
}}
|
||||
>
|
||||
|
||||
<antd.Col xl={12} lg={24} md={24} sm={24} xs={24}>
|
||||
|
||||
<h1>__m2</h1>
|
||||
|
||||
</antd.Col>
|
||||
</antd.Row>
|
||||
|
||||
<h1>__m3 offline</h1>
|
||||
|
||||
</React.Fragment>
|
||||
</GridContent>
|
||||
);
|
||||
return (
|
||||
<div className={styles.Wrapper}>
|
||||
<div className={styles.titleHeader}>
|
||||
<h1><Icons.DeploymentUnitOutlined /> yCore™ Server</h1>
|
||||
</div>
|
||||
<div className={styles.sectionWrapper}>
|
||||
<antd.Card>
|
||||
<h2><Icons.CloudServerOutlined /> Server UID</h2>
|
||||
<span> {ycore.yConfig.server_key} </span>
|
||||
</antd.Card>
|
||||
<antd.Card>
|
||||
<h2><Icons.UserOutlined /> Your SID</h2>
|
||||
<span> {this.state.s_id} </span>
|
||||
</antd.Card>
|
||||
<antd.Card>
|
||||
<span> Using v{ycore.AppInfo.version} | User @{UserData.username}#{UserData.id} | </span>
|
||||
</antd.Card>
|
||||
</div>
|
||||
|
||||
<div className={styles.titleHeader}>
|
||||
<h1><Icons.DatabaseOutlined /> SDCP™</h1>
|
||||
</div>
|
||||
<div className={styles.sectionWrapper}>
|
||||
<antd.Card>
|
||||
<h2><Icons.CloudServerOutlined /> UserData</h2>
|
||||
<antd.Collapse>
|
||||
<antd.Collapse.Panel header="WARNING: High Heap when descompile data! " key="1">
|
||||
{ JSON.stringify(arrayOfSDCP) }
|
||||
</antd.Collapse.Panel>
|
||||
</antd.Collapse>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
</antd.Card>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
)
|
||||
}
|
||||
}
|
||||
|
||||
@ -1,5 +1,8 @@
|
||||
@import '~themes/vars.less';
|
||||
|
||||
.Wrapper{
|
||||
padding: 10px;
|
||||
}
|
||||
.titleHeader{
|
||||
position: relative;
|
||||
width: 100%;
|
||||
@ -16,8 +19,9 @@
|
||||
|
||||
}
|
||||
.sectionWrapper{
|
||||
display: flex;
|
||||
position: relative;
|
||||
word-break: break-all;
|
||||
max-width: 100%;
|
||||
text-overflow: clip;
|
||||
margin: 15px auto 15px 0;
|
||||
padding: 15px;
|
||||
background-color: rgb(236, 236, 236);
|
||||
|
||||
@ -1,9 +1,9 @@
|
||||
import React, { Component, Fragment } from 'react';
|
||||
import { Icon as LegacyIcon } from '@ant-design/compatible';
|
||||
import { List, Switch, Button, notification } from 'antd';
|
||||
import { List, Switch, Button, notification, InputNumber } from 'antd';
|
||||
import { AppSettings } from '../../../../globals/settings.js'
|
||||
import { DevOptions, ControlBar } from 'ycore'
|
||||
import * as ycore from "ycore"
|
||||
import * as Icons from '@ant-design/icons'
|
||||
import { CustomIcons } from 'components'
|
||||
|
||||
class Base extends Component {
|
||||
@ -20,6 +20,19 @@ class Base extends Component {
|
||||
ycore.yconsole.warn('The settings for this app in your Account isnt set yet, Using stock settings...')
|
||||
}
|
||||
}
|
||||
|
||||
rendersets = (item) => {
|
||||
let e = item.type
|
||||
switch (e) {
|
||||
case 'switch':
|
||||
return <Switch checkedChildren={'Enabled'} unCheckedChildren={'Disabled'} checked={item.value} onChange={() => this.onChangeSwitch(item)} />
|
||||
case 'numeric':
|
||||
return <InputNumber min={1} max={50} defaultValue={item.value} onChange={() => this.onChangeNumeric(item, value)} />
|
||||
default:
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
SettingRender = data =>{
|
||||
try{
|
||||
return(
|
||||
@ -28,30 +41,29 @@ class Base extends Component {
|
||||
itemLayout="horizontal"
|
||||
dataSource={data}
|
||||
renderItem={item => (
|
||||
<List.Item actions={item.actions} >
|
||||
<List.Item actions={item.actions} key={item.SettingID} >
|
||||
<List.Item.Meta title={item.title} description={item.description} />
|
||||
<Switch checkedChildren={'Enabled'} unCheckedChildren={'Disabled'} checked={item.value} onChange={() => this.onChange(item)} />
|
||||
{ this.rendersets(item) }
|
||||
</List.Item>
|
||||
)}
|
||||
/>
|
||||
<Button onClick={() => ycore.RegSW()} > Upload Service Worker </Button>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
catch (err){
|
||||
return console.log(err)
|
||||
return ycore.yconsole.log(err)
|
||||
}
|
||||
}
|
||||
handleControlBar(){
|
||||
const ListControls = [
|
||||
(<div>
|
||||
<Button type="done" icon={<LegacyIcon type='save' />} onClick={() => this.saveChanges()} >Save</Button>
|
||||
<Button type="done" icon={<Icons.SaveOutlined />} onClick={() => this.saveChanges()} >Save</Button>
|
||||
</div>
|
||||
)
|
||||
]
|
||||
ControlBar.set(ListControls)
|
||||
}
|
||||
|
||||
|
||||
saveChanges(){
|
||||
localStorage.setItem('app_settings', JSON.stringify(this.state.SettingRepo))
|
||||
this.setState({ forSave: false })
|
||||
@ -62,24 +74,39 @@ class Base extends Component {
|
||||
setTimeout((ycore.RefreshONCE()), 1000)
|
||||
ControlBar.close()
|
||||
}
|
||||
onChange(item) {
|
||||
|
||||
onChangeSwitch(item) {
|
||||
try {
|
||||
this.handleControlBar()
|
||||
const to = !item.value
|
||||
const updatedValue = [...this.state.SettingRepo]
|
||||
.map(ita => ita === item? Object.assign(ita, { "value": to }) : ita);
|
||||
this.setState({SettingRepo: updatedValue, forSave: true})
|
||||
yconsole.log(`Changing ${item.SettingID} to value ${to}`)
|
||||
ycore.yconsole.log(`Changing ${item.SettingID} to value ${to}`)
|
||||
} catch (err) {
|
||||
console.log(err)
|
||||
}
|
||||
}
|
||||
onChangeNumeric(value, item) {
|
||||
this.HandleChangeNumeric(value)
|
||||
}
|
||||
HandleChangeNumeric(item, value) {
|
||||
try {
|
||||
this.handleControlBar()
|
||||
console.log(item.SettingID, value)
|
||||
const updatedValue = [...this.state.SettingRepo]
|
||||
.map(ita => ita === item? Object.assign(ita, { "value": value }) : ita);
|
||||
this.setState({SettingRepo: updatedValue, forSave: true})
|
||||
ycore.yconsole.log(`Changing ${item.SettingID} to value ${to}`)
|
||||
} catch (err) {
|
||||
console.log(err)
|
||||
}
|
||||
}
|
||||
|
||||
render() {
|
||||
return (
|
||||
<Fragment>
|
||||
<div>
|
||||
<h1><CustomIcons.RobotOutlined /> Behaviors</h1>
|
||||
<h1><Icons.PullRequestOutlined /> Behaviors</h1>
|
||||
{this.SettingRender(this.state.SettingRepo)}
|
||||
</div>
|
||||
</Fragment>
|
||||
|
||||
@ -1,9 +1,9 @@
|
||||
import React from 'react';
|
||||
import { GridContent } from '@ant-design/pro-layout';
|
||||
import { Icon as LegacyIcon } from '@ant-design/compatible';
|
||||
import { Menu, Typography } from 'antd';
|
||||
import * as antd from 'antd'
|
||||
import * as ycore from 'ycore'
|
||||
import * as Icons from '@ant-design/icons'
|
||||
import styles from './style.less';
|
||||
|
||||
import NotificationView from './components/notification.js';
|
||||
@ -60,7 +60,7 @@ class GeneralSettings extends React.Component {
|
||||
const { mode, selectKey } = this.state;
|
||||
return (
|
||||
<div>
|
||||
<Title className={styles.titleHead}><LegacyIcon type="setting" /> Settings</Title>
|
||||
<Title className={styles.titleHead}><Icons.SettingOutlined /> Settings</Title>
|
||||
<GridContent>
|
||||
<div
|
||||
className={styles.main}
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user