Working on shop javascript & fixed assettypeids.
This commit is contained in:
Graphictoria
parent
0a2f41131b
commit
c0461f57c0
|
|
@ -10,61 +10,77 @@ namespace App\Helpers;
|
|||
class AssetHelper
|
||||
{
|
||||
public static $assetTypes = [
|
||||
[0] = 'Image',
|
||||
[1] = 'TShirt',
|
||||
[2] = 'Audio',
|
||||
[3] = 'Mesh',
|
||||
[4] = 'Lua',
|
||||
[5] = 'HTML',
|
||||
[6] = 'Text',
|
||||
[7] = 'Hat',
|
||||
[8] = 'Place',
|
||||
[9] = 'Model',
|
||||
[10] = 'Shirt',
|
||||
[11] = 'Pants',
|
||||
[12] = 'Decal',
|
||||
[13] = 'Avatar',
|
||||
[14] = 'Head',
|
||||
[15] = 'Face',
|
||||
[16] = 'Gear',
|
||||
[17] = 'Badge',
|
||||
[18] = 'GroupEmblem',
|
||||
[19] = 'Animation',
|
||||
[20] = 'Arms',
|
||||
[21] = 'Legs',
|
||||
[22] = 'Torso',
|
||||
[23] = 'RightArm',
|
||||
[24] = 'LeftArm',
|
||||
[25] = 'LeftLeg',
|
||||
[26] = 'RightLeg',
|
||||
[27] = 'Package',
|
||||
[28] = 'YouTubeVideo',
|
||||
[29] = 'GamePass',
|
||||
[30] = 'App',
|
||||
[31] = 'Code',
|
||||
[32] = 'Plugin',
|
||||
[33] = 'SolidModel',
|
||||
[34] = 'MeshPart',
|
||||
[35] = 'HairAccessory',
|
||||
[36] = 'FaceAccessory',
|
||||
[37] = 'NeckAccessory',
|
||||
[38] = 'ShoulderAccessory',
|
||||
[39] = 'FrontAccessory',
|
||||
[40] = 'BackAccessory',
|
||||
[41] = 'WaistAccessory',
|
||||
[42] = 'ClimbAnimation',
|
||||
[43] = 'DeathAnimation',
|
||||
[44] = 'FallAnimation',
|
||||
[45] = 'IdleAnimation',
|
||||
[46] = 'JumpAnimation',
|
||||
[47] = 'RunAnimation',
|
||||
[48] = 'SwimAnimation',
|
||||
[49] = 'WalkAnimation',
|
||||
[50] = 'PoseAnimation',
|
||||
[51] = 'LocalizationTableManifest',
|
||||
[52] = 'LocalizationTableTranslation',
|
||||
[53] = 'EmoteAnimation',
|
||||
[54] = 'Video',
|
||||
[55] = 'TexturePack'
|
||||
[1] = 'Image',
|
||||
[2] = 'T-Shirt',
|
||||
[3] = 'Audio',
|
||||
[4] = 'Mesh',
|
||||
[5] = 'Lua',
|
||||
[6] = 'HTML',
|
||||
[7] = 'Text',
|
||||
[8] = 'Hat',
|
||||
[9] = 'Place',
|
||||
[10] = 'Model',
|
||||
[11] = 'Shirt',
|
||||
[12] = 'Pants',
|
||||
[13] = 'Decal',
|
||||
[14] = null, // Doesn't exist on Roblox.
|
||||
[15] = null, // Doesn't exist on Roblox.
|
||||
[16] = 'Avatar',
|
||||
[17] = 'Head',
|
||||
[18] = 'Face',
|
||||
[19] = 'Gear',
|
||||
[20] = null, // Doesn't exist on Roblox.
|
||||
[21] = 'Badge',
|
||||
[22] = 'Group Emblem',
|
||||
[23] = null, // Doesn't exist on Roblox.
|
||||
[24] = 'Animation',
|
||||
[25] = 'Arms',
|
||||
[26] = 'Legs',
|
||||
[27] = 'Torso',
|
||||
[28] = 'Right Arm',
|
||||
[29] = 'Left Arm',
|
||||
[30] = 'Left Leg',
|
||||
[31] = 'Right Leg',
|
||||
[32] = 'Package',
|
||||
[33] = 'YouTubeVideo',
|
||||
[34] = 'Game Pass',
|
||||
[35] = 'App',
|
||||
[36] = null, // Doesn't exist on Roblox.
|
||||
[37] = 'Code',
|
||||
[38] = 'Plugin',
|
||||
[39] = 'SolidModel',
|
||||
[40] = 'MeshPart',
|
||||
[41] = 'Hair Accessory',
|
||||
[42] = 'Face Accessory',
|
||||
[43] = 'Neck Accessory',
|
||||
[44] = 'Shoulder Accessory',
|
||||
[45] = 'Front Accessory',
|
||||
[46] = 'Back Accessory',
|
||||
[47] = 'Waist Accessory',
|
||||
[48] = 'Climb Animation',
|
||||
[49] = 'Death Animation',
|
||||
[50] = 'Fall Animation',
|
||||
[51] = 'Idle Animation',
|
||||
[52] = 'Jump Animation',
|
||||
[53] = 'Run Animation',
|
||||
[54] = 'Swim Animation',
|
||||
[55] = 'Walk Animation',
|
||||
[56] = 'Pose Animation',
|
||||
[57] = 'Ear Accessory',
|
||||
[58] = 'Eye Accessory',
|
||||
[59] = 'LocalizationTableManifest',
|
||||
[60] = 'LocalizationTableTranslation',
|
||||
[61] = 'Emote Animation',
|
||||
[62] = 'Video',
|
||||
[63] = 'TexturePack',
|
||||
[64] = 'T-Shirt Accessory',
|
||||
[65] = 'Shirt Accessory',
|
||||
[66] = 'Pants Accessory',
|
||||
[67] = 'Jacket Accessory',
|
||||
[68] = 'Sweater Accessory',
|
||||
[69] = 'Shorts Accessory',
|
||||
[70] = 'Left Shoe Accessory',
|
||||
[71] = 'Right Shoe Accessory',
|
||||
[72] = 'Dress Skirt Accessory'
|
||||
];
|
||||
}
|
||||
|
|
|
|||
|
|
@ -0,0 +1,134 @@
|
|||
// © XlXi 2021
|
||||
// Graphictoria 5
|
||||
|
||||
import { Component, createRef } from 'react';
|
||||
|
||||
import axios from 'axios';
|
||||
|
||||
import Twemoji from 'react-twemoji';
|
||||
|
||||
import { buildGenericApiUrl } from '../util/HTTP.js';
|
||||
import Loader from './Loader';
|
||||
|
||||
axios.defaults.withCredentials = true;
|
||||
|
||||
const shopCategories = [
|
||||
['Clothing'] = [
|
||||
{
|
||||
label: 'Hats',
|
||||
assetTypeId: 0
|
||||
}
|
||||
]
|
||||
];
|
||||
|
||||
class Shop extends Component {
|
||||
constructor(props) {
|
||||
super(props);
|
||||
this.state = {
|
||||
|
||||
};
|
||||
}
|
||||
|
||||
render() {
|
||||
return (
|
||||
<div className="container-lg my-2">
|
||||
<div className="row">
|
||||
<div className="col d-flex">
|
||||
<h4 className="my-auto">Shop</h4>
|
||||
</div>
|
||||
<div className="col-lg-5 my-2 my-lg-0 mb-lg-2 d-flex">
|
||||
<button className="btn btn-secondary me-2"><i className="fa-solid fa-gear"></i></button>
|
||||
<div className="input-group">
|
||||
<input type="text" className="form-control d-lg-flex" placeholder="Item name" />
|
||||
<button className="btn btn-primary">Search</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="row">
|
||||
<div className="col-md-2">
|
||||
<div className="graphictoria-shop-categories">
|
||||
<h5>Category</h5>
|
||||
<a href="#" className="text-decoration-none">All Items</a>
|
||||
<ul className="list-unstyled ps-0">
|
||||
<li className="mb-1">
|
||||
<a className="text-decoration-none fw-normal align-items-center graphictoria-list-dropdown" data-bs-toggle="collapse" data-bs-target="#shop-clothing-collapse" aria-expanded="true" href="#">Clothing</a>
|
||||
<div className="collapse show" id="shop-clothing-collapse">
|
||||
<ul className="btn-toggle-nav list-unstyled fw-normal small">
|
||||
<li><a href="#" className="text-decoration-none ms-2">All Clothing</a></li>
|
||||
<li><a href="#" className="fw-bold text-decoration-none ms-2">Hats</a></li>
|
||||
<li><a href="#" className="text-decoration-none ms-2">Shirts</a></li>
|
||||
<li><a href="#" className="text-decoration-none ms-2">T-Shirts</a></li>
|
||||
<li><a href="#" className="text-decoration-none ms-2">Pants</a></li>
|
||||
<li><a href="#" className="text-decoration-none ms-2">Packages</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</li>
|
||||
<li className="mb-1">
|
||||
<a className="text-decoration-none fw-normal align-items-center graphictoria-list-dropdown" data-bs-toggle="collapse" data-bs-target="#shop-bodyparts-collapse" aria-expanded="false" href="#">Body Parts</a>
|
||||
<div className="collapse" id="shop-bodyparts-collapse">
|
||||
<ul className="btn-toggle-nav list-unstyled fw-normal small">
|
||||
<li><a href="#" className="text-decoration-none ms-2">All Body Parts</a></li>
|
||||
<li><a href="#" className="text-decoration-none ms-2">Heads</a></li>
|
||||
<li><a href="#" className="text-decoration-none ms-2">Faces</a></li>
|
||||
<li><a href="#" className="text-decoration-none ms-2">Packages</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</li>
|
||||
<li className="mb-1">
|
||||
<a className="text-decoration-none fw-normal align-items-center graphictoria-list-dropdown" data-bs-toggle="collapse" data-bs-target="#shop-gear-collapse" aria-expanded="false" href="#">Gear</a>
|
||||
<div className="collapse" id="shop-gear-collapse">
|
||||
<ul className="btn-toggle-nav list-unstyled fw-normal small">
|
||||
<li><a href="#" className="text-decoration-none ms-2">All Gear</a></li>
|
||||
<li><a href="#" className="text-decoration-none ms-2">Building</a></li>
|
||||
<li><a href="#" className="text-decoration-none ms-2">Explosive</a></li>
|
||||
<li><a href="#" className="text-decoration-none ms-2">Melee</a></li>
|
||||
<li><a href="#" className="text-decoration-none ms-2">Musical</a></li>
|
||||
<li><a href="#" className="text-decoration-none ms-2">Navigation</a></li>
|
||||
<li><a href="#" className="text-decoration-none ms-2">Power Up</a></li>
|
||||
<li><a href="#" className="text-decoration-none ms-2">Ranged</a></li>
|
||||
<li><a href="#" className="text-decoration-none ms-2">Social</a></li>
|
||||
<li><a href="#" className="text-decoration-none ms-2">Transport</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-md-10 d-flex flex-column">
|
||||
<div className="card p-3">
|
||||
<div className="graphictoria-shop-overlay">
|
||||
<Loader />
|
||||
</div>
|
||||
<div>
|
||||
<a className="graphictoria-item-card" href="#">
|
||||
<span className="card m-2">
|
||||
<img className="img-fluid" src="https://gtoria.local/images/testing/hat.png" />
|
||||
<div className="p-2">
|
||||
<p>Test hat</p>
|
||||
<p className="text-muted">Free</p>
|
||||
</div>
|
||||
</span>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<ul className="list-inline mx-auto mt-3">
|
||||
<li className="list-inline-item">
|
||||
<button className="btn btn-secondary" disabled><i className="fa-solid fa-angle-left"></i></button>
|
||||
</li>
|
||||
<li className="list-inline-item graphictoria-paginator">
|
||||
<span>Page </span>
|
||||
<input type="text" value="1" className="form-control" disabled />
|
||||
<span> of 20</span>
|
||||
</li>
|
||||
<li className="list-inline-item">
|
||||
<button className="btn btn-secondary" disabled><i className="fa-solid fa-angle-right"></i></button>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
export default Shop;
|
||||
|
|
@ -0,0 +1,17 @@
|
|||
// © XlXi 2021
|
||||
// Graphictoria 5
|
||||
|
||||
import $ from 'jquery';
|
||||
|
||||
import React from 'react';
|
||||
import { render } from 'react-dom';
|
||||
|
||||
import Shop from '../components/Shop';
|
||||
|
||||
const shopId = 'gt-shop-main';
|
||||
|
||||
$(document).ready(function() {
|
||||
if (document.getElementById(shopId)) {
|
||||
render(<Shop />, document.getElementById(shopId));
|
||||
}
|
||||
});
|
||||
|
|
@ -2,101 +2,13 @@
|
|||
|
||||
@section('title', 'Shop')
|
||||
|
||||
@section('page-specific')
|
||||
<script src="{{ mix('js/Shop.js') }}"></script>
|
||||
@endsection
|
||||
|
||||
@section('content')
|
||||
<div class="container-lg my-2">
|
||||
<div class="row">
|
||||
<div class="col d-flex">
|
||||
<h4 class="my-auto">Shop</h4>
|
||||
</div>
|
||||
<div class="col-lg-5 my-2 my-lg-0 mb-lg-2 d-flex">
|
||||
<button class="btn btn-secondary me-2"><i class="fa-solid fa-gear"></i></button>
|
||||
<div class="input-group">
|
||||
<input type="text" class="form-control d-lg-flex" placeholder="Item name" />
|
||||
<button class="btn btn-primary">Search</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-md-2">
|
||||
<div class="graphictoria-shop-categories">
|
||||
<h5>Category</h5>
|
||||
<a href="#" class="text-decoration-none">All Items</a>
|
||||
<ul class="list-unstyled ps-0">
|
||||
<li class="mb-1">
|
||||
<a class="text-decoration-none fw-normal align-items-center graphictoria-list-dropdown" data-bs-toggle="collapse" data-bs-target="#shop-clothing-collapse" aria-expanded="true" href="#">Clothing</a>
|
||||
<div class="collapse show" id="shop-clothing-collapse">
|
||||
<ul class="btn-toggle-nav list-unstyled fw-normal small">
|
||||
<li><a href="#" class="text-decoration-none ms-2">All Clothing</a></li>
|
||||
<li><a href="#" class="fw-bold text-decoration-none ms-2">Hats</a></li>
|
||||
<li><a href="#" class="text-decoration-none ms-2">Shirts</a></li>
|
||||
<li><a href="#" class="text-decoration-none ms-2">T-Shirts</a></li>
|
||||
<li><a href="#" class="text-decoration-none ms-2">Pants</a></li>
|
||||
<li><a href="#" class="text-decoration-none ms-2">Packages</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</li>
|
||||
<li class="mb-1">
|
||||
<a class="text-decoration-none fw-normal align-items-center graphictoria-list-dropdown" data-bs-toggle="collapse" data-bs-target="#shop-bodyparts-collapse" aria-expanded="false" href="#">Body Parts</a>
|
||||
<div class="collapse" id="shop-bodyparts-collapse">
|
||||
<ul class="btn-toggle-nav list-unstyled fw-normal small">
|
||||
<li><a href="#" class="text-decoration-none ms-2">All Body Parts</a></li>
|
||||
<li><a href="#" class="text-decoration-none ms-2">Heads</a></li>
|
||||
<li><a href="#" class="text-decoration-none ms-2">Faces</a></li>
|
||||
<li><a href="#" class="text-decoration-none ms-2">Packages</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</li>
|
||||
<li class="mb-1">
|
||||
<a class="text-decoration-none fw-normal align-items-center graphictoria-list-dropdown" data-bs-toggle="collapse" data-bs-target="#shop-gear-collapse" aria-expanded="false" href="#">Gear</a>
|
||||
<div class="collapse" id="shop-gear-collapse">
|
||||
<ul class="btn-toggle-nav list-unstyled fw-normal small">
|
||||
<li><a href="#" class="text-decoration-none ms-2">All Gear</a></li>
|
||||
<li><a href="#" class="text-decoration-none ms-2">Building</a></li>
|
||||
<li><a href="#" class="text-decoration-none ms-2">Explosive</a></li>
|
||||
<li><a href="#" class="text-decoration-none ms-2">Melee</a></li>
|
||||
<li><a href="#" class="text-decoration-none ms-2">Musical</a></li>
|
||||
<li><a href="#" class="text-decoration-none ms-2">Navigation</a></li>
|
||||
<li><a href="#" class="text-decoration-none ms-2">Power Up</a></li>
|
||||
<li><a href="#" class="text-decoration-none ms-2">Ranged</a></li>
|
||||
<li><a href="#" class="text-decoration-none ms-2">Social</a></li>
|
||||
<li><a href="#" class="text-decoration-none ms-2">Transport</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-10 d-flex flex-column">
|
||||
<div class="card p-3">
|
||||
<div class="graphictoria-shop-overlay">
|
||||
<x-loader />
|
||||
</div>
|
||||
<div>
|
||||
<a class="graphictoria-item-card" href="#">
|
||||
<span class="card m-2">
|
||||
<img class="img-fluid" src="{{ asset('images/testing/hat.png') }}" />
|
||||
<div class="p-2">
|
||||
<p>Test hat</p>
|
||||
<p class="text-muted">Free</p>
|
||||
</div>
|
||||
</span>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<ul class="list-inline mx-auto mt-3">
|
||||
<li class="list-inline-item">
|
||||
<button class="btn btn-secondary disabled"><i class="fa-solid fa-angle-left"></i></button>
|
||||
</li>
|
||||
<li class="list-inline-item graphictoria-paginator">
|
||||
<span>Page</span>
|
||||
<input type="text" value="1" class="form-control">
|
||||
<span>of 20</span>
|
||||
</li>
|
||||
<li class="list-inline-item">
|
||||
<button class="btn btn-secondary"><i class="fa-solid fa-angle-right"></i></button>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<div id="gt-shop-main" class="container-lg my-2 d-flex flex-column">
|
||||
<h4 class="my-auto">Shop</h4>
|
||||
<x-loader />
|
||||
</div>
|
||||
@endsection
|
||||
|
|
@ -15,6 +15,7 @@ require('laravel-mix-banner');
|
|||
mix.js('resources/js/app.js', 'public/js')
|
||||
.js('resources/js/pages/Maintenance.js', 'public/js')
|
||||
.js('resources/js/pages/Dashboard.js', 'public/js')
|
||||
.js('resources/js/pages/Shop.js', 'public/js')
|
||||
.react()
|
||||
.sass('resources/sass/Graphictoria.scss', 'public/css')
|
||||
.banner({
|
||||
|
|
|
|||
Loading…
Reference in New Issue