Skip to content

Commit 8d704ae

Browse files
DaneEverittDaneEveritt
committed
Inital commit with gulp and base asset setup
1 parent 68f0811 commit 8d704ae

File tree

8 files changed

+5786
-18
lines changed

8 files changed

+5786
-18
lines changed

‎.gitignore‎

Lines changed: 4 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -7,25 +7,15 @@ storage/framework/*
77
/.idea
88
/nbproject
99

10-
package-lock.json
11-
composer.lock
1210
node_modules
13-
14-
_ide_helper_models.php
11+
*.log
1512
_ide_helper.php
16-
17-
sami.phar
18-
/.sami
13+
.phpstorm.meta.php
14+
.php_cs.cache
15+
public/assets/*
1916

2017
# For local development with docker
2118
# Remove if we ever put the Dockerfile in the repo
2219
.dockerignore
2320
Dockerfile
2421
docker-compose.yml
25-
# for image related files
26-
misc
27-
.phpstorm.meta.php
28-
.php_cs.cache
29-
30-
# Vagrant
31-
*.log

‎app/Services/Helpers/AssetHashService.php‎

Lines changed: 128 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,128 @@
1+
<?php
2+
3+
namespace Pterodactyl\Services\Helpers;
4+
5+
use Illuminate\Container\Container;
6+
use Illuminate\Filesystem\FilesystemManager;
7+
use Illuminate\Contracts\Foundation\Application;
8+
use Illuminate\Contracts\Cache\Repository as CacheRepository;
9+
10+
class AssetHashService
11+
{
12+
/**
13+
* Location of the manifest file generated by gulp.
14+
*/
15+
public const MANIFEST_PATH = './assets/manifest.json';
16+
17+
/**
18+
* @var \Illuminate\Contracts\Cache\Repository
19+
*/
20+
private $cache;
21+
22+
/**
23+
* @var \Illuminate\Contracts\Filesystem\Filesystem
24+
*/
25+
private $filesystem;
26+
27+
/**
28+
* @var \Illuminate\Contracts\Foundation\Application
29+
*/
30+
private $application;
31+
32+
/**
33+
* @var null|array
34+
*/
35+
protected static $manifest;
36+
37+
/**
38+
* AssetHashService constructor.
39+
*
40+
* @param \Illuminate\Contracts\Foundation\Application $application
41+
* @param \Illuminate\Contracts\Cache\Repository $cache
42+
* @param \Illuminate\Filesystem\FilesystemManager $filesystem
43+
*/
44+
public function __construct(Application $application, CacheRepository $cache, FilesystemManager $filesystem)
45+
{
46+
$this->application = $application;
47+
$this->cache = $cache;
48+
$this->filesystem = $filesystem->createLocalDriver(['root' => public_path()]);
49+
}
50+
51+
/**
52+
* Modify a URL to append the asset hash.
53+
*
54+
* @param string $resource
55+
* @return string
56+
*
57+
* @throws \Illuminate\Contracts\Filesystem\FileNotFoundException
58+
*/
59+
public function getUrl(string $resource): string
60+
{
61+
$file = last(explode('/', $resource));
62+
63+
return '/' . ltrim(str_replace($file, array_get($this->getManifest(), $file, $file), $resource), '/');
64+
}
65+
66+
/**
67+
* Get the asset manifest and store it in the cache for quicker lookups.
68+
*
69+
* @return array
70+
* @throws \Illuminate\Contracts\Filesystem\FileNotFoundException
71+
*/
72+
public function getManifest(): array
73+
{
74+
if (! is_null(self::$manifest)) {
75+
return self::$manifest;
76+
}
77+
78+
// Skip checking the cache if we are not in production.
79+
if ($this->application->environment() === 'production') {
80+
$stored = $this->cache->get('Core:AssetManifest');
81+
if (! is_null($stored)) {
82+
return self::$manifest = $stored;
83+
}
84+
}
85+
86+
$contents = json_decode($this->filesystem->get(self::MANIFEST_PATH), true);
87+
$this->cache->put('Core:AssetManifest', $contents, 1440);
88+
89+
return self::$manifest = $contents;
90+
}
91+
92+
/**
93+
* Get the URL for a resource in a static context.
94+
*
95+
* @param string $resource
96+
* @return string
97+
*
98+
* @throws \Illuminate\Contracts\Filesystem\FileNotFoundException
99+
*/
100+
public static function url(string $resource): string
101+
{
102+
return Container::getInstance()->make(self::class)->getUrl($resource);
103+
}
104+
105+
/**
106+
* @param string $resource
107+
* @return string
108+
* @throws \Illuminate\Contracts\Filesystem\FileNotFoundException
109+
*/
110+
public static function css(string $resource): string
111+
{
112+
$path = self::url($resource);
113+
114+
return '<link href="' . $path . '" rel="stylesheet preload" crossorigin="anonymous" referrerpolicy="no-referrer">';
115+
}
116+
117+
/**
118+
* @param string $resource
119+
* @return string
120+
* @throws \Illuminate\Contracts\Filesystem\FileNotFoundException
121+
*/
122+
public static function js(string $resource): string
123+
{
124+
$path = self::url($resource);
125+
126+
return '<script src="' . $path . '" crossorigin="anonymous">';
127+
}
128+
}

‎gulpfile.js‎

Lines changed: 84 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,84 @@
1+
const babel = require('gulp-babel');
2+
const concat = require('gulp-concat');
3+
const cssmin = require('gulp-cssmin');
4+
const del = require('del');
5+
const gulp = require('gulp');
6+
const gulpif = require('gulp-if');
7+
const postcss = require('gulp-postcss');
8+
const rev = require('gulp-rev');
9+
const tailwindcss = require('tailwindcss');
10+
const uglify = require('gulp-uglify');
11+
12+
const argv = require('yargs')
13+
.default('production', false)
14+
.argv;
15+
16+
const paths = {
17+
manifest: './public/assets',
18+
assets: './public/assets/{css,scripts}/*.{css,js}',
19+
styles: {
20+
src: './resources/assets/pterodactyl/css/**/*.css',
21+
dest: './public/assets/css',
22+
},
23+
scripts: {
24+
src: [
25+
'./resources/assets/pterodactyl/scripts/**/*.js',
26+
'./node_modules/jquery/dist/jquery.js',
27+
],
28+
dest: './public/assets/scripts',
29+
},
30+
};
31+
32+
/**
33+
* Build un-compiled CSS into a minified version.
34+
*/
35+
function styles() {
36+
return gulp.src(paths.styles.src)
37+
.pipe(postcss([
38+
require('postcss-import'),
39+
tailwindcss('./tailwind.js'),
40+
require('autoprefixer')]
41+
))
42+
.pipe(gulpif(argv.production, cssmin()))
43+
.pipe(concat('bundle.css'))
44+
.pipe(rev())
45+
.pipe(gulp.dest(paths.styles.dest))
46+
.pipe(rev.manifest(paths.manifest + '/manifest.json', { merge: true, base: paths.manifest }))
47+
.pipe(gulp.dest(paths.manifest));
48+
}
49+
50+
/**
51+
* Build all of the waiting scripts.
52+
*/
53+
function scripts() {
54+
return gulp.src(paths.scripts.src)
55+
.pipe(babel())
56+
.pipe(gulpif(argv.production, uglify()))
57+
.pipe(concat('bundle.js'))
58+
.pipe(rev())
59+
.pipe(gulp.dest(paths.scripts.dest))
60+
.pipe(rev.manifest(paths.manifest + '/manifest.json', { merge: true, base: paths.manifest }))
61+
.pipe(gulp.dest(paths.manifest));
62+
}
63+
64+
/**
65+
* Proves watchers.
66+
*/
67+
function watch() {
68+
gulp.watch(paths.styles.src, styles);
69+
gulp.watch(paths.scripts.src, scripts);
70+
}
71+
72+
/**
73+
* Cleanup unused versions of hashed assets.
74+
*/
75+
function clean() {
76+
return del([paths.assets]);
77+
}
78+
79+
exports.clean = clean;
80+
exports.styles = styles;
81+
exports.scripts = scripts;
82+
exports.watch = watch;
83+
84+
gulp.task('default', gulp.series(clean, styles, scripts));

‎package.json‎

Lines changed: 28 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,36 @@
11
{
22
"name": "pterodactyl-panel",
33
"devDependencies": {
4+
"autoprefixer": "^8.2.0",
45
"babel-cli": "6.18.0",
6+
"babel-core": "^6.26.0",
57
"babel-plugin-transform-strict-mode": "^6.18.0",
6-
"babel-preset-es2015": "6.18.0"
8+
"babel-preset-es2015": "^6.24.1",
9+
"babel-register": "^6.26.0",
10+
"del": "^3.0.0",
11+
"gulp": "^4.0.0",
12+
"gulp-babel": "^7.0.1",
13+
"gulp-cli": "^2.0.1",
14+
"gulp-concat": "^2.6.1",
15+
"gulp-cssmin": "^0.2.0",
16+
"gulp-if": "^2.0.2",
17+
"gulp-postcss": "^7.0.1",
18+
"gulp-rename": "^1.2.2",
19+
"gulp-rev": "^8.1.1",
20+
"gulp-uglify": "^3.0.0",
21+
"jquery": "^3.3.1",
22+
"postcss": "^6.0.21",
23+
"postcss-import": "^11.1.0",
24+
"tailwindcss": "^0.5.1",
25+
"vue": "^2.5.16",
26+
"yargs": "^11.0.0"
727
},
828
"scripts": {
9-
"build": "./node_modules/babel-cli/bin/babel.js public/themes/pterodactyl/js/frontend/files/src --source-maps --out-file public/themes/pterodactyl/js/frontend/files/filemanager.min.js"
10-
}
29+
"build:filemanager": "./node_modules/babel-cli/bin/babel.js public/themes/pterodactyl/js/frontend/files/src --source-maps --out-file public/themes/pterodactyl/js/frontend/files/filemanager.min.js",
30+
"watch": "./node_modules/gulp-cli/bin/gulp.js watch",
31+
"build": "./node_modules/gulp-cli/bin/gulp.js default",
32+
"build:styles": "./node_modules/gulp-cli/bin/gulp.js styles",
33+
"build:scripts": "./node_modules/gulp-cli/bin/gulp.js scripts"
34+
},
35+
"dependencies": {}
1136
}

‎public/themes/pterodactyl/js/frontend/files/filemanager.min.js.map‎

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎resources/assets/pterodactyl/css/main.css‎

Lines changed: 27 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,27 @@
1+
/**
2+
* This injects Tailwind's base styles, which is a combination of
3+
* Normalize.css and some additional base styles.
4+
*/
5+
@import "tailwindcss/preflight";
6+
7+
/**
8+
* This injects any component classes registered by plugins.
9+
*/
10+
@import "tailwindcss/components";
11+
12+
/**
13+
* Here you would add any of your custom component classes; stuff that you'd
14+
* want loaded *before* the utilities so that the utilities could still
15+
* override them.
16+
*/
17+
18+
/**
19+
* This injects all of Tailwind's utility classes, generated based on your
20+
* config file.
21+
*/
22+
@import "tailwindcss/utilities";
23+
24+
/**
25+
* Here you would add any custom utilities you need that don't come out of the
26+
* box with Tailwind.
27+
*/

0 commit comments

Comments
 (0)