Started working on a bash like user interface (easter egg).
このコミットが含まれているのは:
コミット
873e0a8151
|
@ -0,0 +1,13 @@
|
||||||
|
<?php
|
||||||
|
|
||||||
|
namespace App\Http\Controllers;
|
||||||
|
|
||||||
|
use Illuminate\Support\Facades\DB;
|
||||||
|
use Illuminate\Http\Request;
|
||||||
|
use Illuminate\Support\Facades\Log;
|
||||||
|
|
||||||
|
class BashController extends Controller {
|
||||||
|
public function ls($pwd) { // /api/rpc/bash/ls/pwd
|
||||||
|
return 'page forum store user';
|
||||||
|
}
|
||||||
|
}
|
|
@ -9,6 +9,8 @@ require('./bootstrap');
|
||||||
|
|
||||||
window.Vue = require('vue');
|
window.Vue = require('vue');
|
||||||
|
|
||||||
|
Vue.component('bash', require('./components/cli.vue'));
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Next, we will create a fresh Vue application instance and attach it to
|
* Next, we will create a fresh Vue application instance and attach it to
|
||||||
* the page. Then, you may begin adding components to this application
|
* the page. Then, you may begin adding components to this application
|
||||||
|
|
|
@ -19,9 +19,9 @@ try {
|
||||||
* CSRF token as a header based on the value of the "XSRF" token cookie.
|
* CSRF token as a header based on the value of the "XSRF" token cookie.
|
||||||
*/
|
*/
|
||||||
|
|
||||||
// window.axios = require('axios');
|
window.axios = require('axios');
|
||||||
|
|
||||||
// window.axios.defaults.headers.common['X-Requested-With'] = 'XMLHttpRequest';
|
window.axios.defaults.headers.common['X-Requested-With'] = 'XMLHttpRequest';
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Next we will register the CSRF Token as a common header with Axios so that
|
* Next we will register the CSRF Token as a common header with Axios so that
|
||||||
|
|
|
@ -0,0 +1,207 @@
|
||||||
|
<template>
|
||||||
|
<div>
|
||||||
|
<span v-for="(l, i) in line" :key="`l-${i}`">
|
||||||
|
<span class="regText">
|
||||||
|
<span class="regBold">
|
||||||
|
{{ l.username }}@{{ l.hostname }}:<span class="pathText">{{ l.path }}</span>
|
||||||
|
</span>$
|
||||||
|
<span v-if="l.active">
|
||||||
|
<input
|
||||||
|
:key="i"
|
||||||
|
spellcheck="false"
|
||||||
|
type="text"
|
||||||
|
class="inputField"
|
||||||
|
v-model="l.command"
|
||||||
|
@keyup.enter="exec(l.command, i)"
|
||||||
|
/>
|
||||||
|
</span>
|
||||||
|
<span v-else>
|
||||||
|
<input
|
||||||
|
:key="i"
|
||||||
|
disabled
|
||||||
|
spellcheck="false"
|
||||||
|
type="text"
|
||||||
|
class="inputField"
|
||||||
|
v-model="l.command"
|
||||||
|
@keyup.enter="exec(l.command, i)"
|
||||||
|
/>
|
||||||
|
</span>
|
||||||
|
<span v-for="(res, d) in result" :key="`res-${d}`">
|
||||||
|
<br />
|
||||||
|
{{ res.text }}
|
||||||
|
<span v-if="res.field">
|
||||||
|
<span v-if="res.password">
|
||||||
|
<span v-if="res.active">
|
||||||
|
<input
|
||||||
|
:key="i"
|
||||||
|
password="password"
|
||||||
|
spellcheck="false"
|
||||||
|
type="text"
|
||||||
|
class="inputField"
|
||||||
|
v-model="res.command"
|
||||||
|
@keyup.enter="execContinue(res.command, i)"
|
||||||
|
/>
|
||||||
|
</span>
|
||||||
|
<span v-else>
|
||||||
|
<input
|
||||||
|
:key="i"
|
||||||
|
password="password"
|
||||||
|
disabled
|
||||||
|
spellcheck="false"
|
||||||
|
type="text"
|
||||||
|
class="inputField"
|
||||||
|
v-model="res.command"
|
||||||
|
@keyup.enter="execContinue(res.command, i)"
|
||||||
|
/>
|
||||||
|
</span>
|
||||||
|
</span>
|
||||||
|
<span v-else>
|
||||||
|
<span v-if="res.active">
|
||||||
|
<input
|
||||||
|
:key="i"
|
||||||
|
spellcheck="false"
|
||||||
|
type="text"
|
||||||
|
class="inputField"
|
||||||
|
v-model="res.command"
|
||||||
|
@keyup.enter="execContinue(res.command, i)"
|
||||||
|
/>
|
||||||
|
</span>
|
||||||
|
<span v-else>
|
||||||
|
<input
|
||||||
|
:key="i"
|
||||||
|
disabled
|
||||||
|
spellcheck="false"
|
||||||
|
type="text"
|
||||||
|
class="inputField"
|
||||||
|
v-model="res.command"
|
||||||
|
@keyup.enter="execContinue(res.command, i)"
|
||||||
|
/>
|
||||||
|
</span>
|
||||||
|
</span>
|
||||||
|
</span>
|
||||||
|
<br />
|
||||||
|
</span>
|
||||||
|
</span>
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
name: 'cli',
|
||||||
|
data () {
|
||||||
|
return {
|
||||||
|
user: 'user',
|
||||||
|
host: '076server',
|
||||||
|
pwd: '/',
|
||||||
|
line: [{
|
||||||
|
active: true,
|
||||||
|
username: this.user,
|
||||||
|
hostname: this.host,
|
||||||
|
path: this.pwd,
|
||||||
|
command: ''
|
||||||
|
}],
|
||||||
|
result: []
|
||||||
|
}
|
||||||
|
},
|
||||||
|
created: function () {
|
||||||
|
this.line = [];
|
||||||
|
this.line.push({
|
||||||
|
active: true,
|
||||||
|
username: this.user,
|
||||||
|
hostname: this.host,
|
||||||
|
path: this.pwd,
|
||||||
|
command: ''
|
||||||
|
});
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
exec(text, key) {
|
||||||
|
var arg = text.split(' ');
|
||||||
|
|
||||||
|
this.line[key].active = false;
|
||||||
|
if (arg[0] === 'sudo') this.isSudo();
|
||||||
|
else this.execContinue(text, key);
|
||||||
|
},
|
||||||
|
isSudo() {
|
||||||
|
this.result.push({
|
||||||
|
active: true,
|
||||||
|
text: 'パスワード: ',
|
||||||
|
field: true,
|
||||||
|
password: true,
|
||||||
|
command: ''
|
||||||
|
});
|
||||||
|
},
|
||||||
|
execContinue(text, key) {
|
||||||
|
// this.result[key].active = false;
|
||||||
|
var arg = text.split(' ');
|
||||||
|
|
||||||
|
if (arg[0] === 'ls') this.ls(this.line[key].path);
|
||||||
|
else this.result.push({
|
||||||
|
active: true,
|
||||||
|
text: arg[0] + ': コマンドは見つかれません。',
|
||||||
|
field: false,
|
||||||
|
password: false,
|
||||||
|
command: ''
|
||||||
|
})
|
||||||
|
|
||||||
|
this.line.push({
|
||||||
|
active: true,
|
||||||
|
username: this.user,
|
||||||
|
hostname: this.host,
|
||||||
|
path: this.pwd,
|
||||||
|
command: ''
|
||||||
|
});
|
||||||
|
},
|
||||||
|
ls(pwd) {
|
||||||
|
var neopwd = pwd.replace('/', 'sl');
|
||||||
|
axios.get('/api/rpc/bash/ls/' + neopwd).then(res => {
|
||||||
|
console.log(res.data);
|
||||||
|
this.result.push({
|
||||||
|
active: true,
|
||||||
|
text: res.data,
|
||||||
|
field: false,
|
||||||
|
password: false,
|
||||||
|
command: ''
|
||||||
|
})
|
||||||
|
})
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<!-- Add "scoped" attribute to limit CSS to this component only -->
|
||||||
|
<style scoped>
|
||||||
|
.inputField {
|
||||||
|
background-color: #000000;
|
||||||
|
color: #73D216;
|
||||||
|
border-width: 0px;
|
||||||
|
font-family: monospace;
|
||||||
|
font-size: large;
|
||||||
|
width: 500px;
|
||||||
|
outline: none;
|
||||||
|
|
||||||
|
}
|
||||||
|
.regBold {
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
.regText {
|
||||||
|
color: #73D216;
|
||||||
|
}
|
||||||
|
.pathText {
|
||||||
|
color: #5454FF;
|
||||||
|
}
|
||||||
|
h1, h2 {
|
||||||
|
font-weight: normal;
|
||||||
|
}
|
||||||
|
ul {
|
||||||
|
list-style-type: none;
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
li {
|
||||||
|
display: inline-block;
|
||||||
|
margin: 0 10px;
|
||||||
|
}
|
||||||
|
a {
|
||||||
|
color: #42b983;
|
||||||
|
}
|
||||||
|
</style>
|
|
@ -1,7 +1,7 @@
|
||||||
|
|
||||||
// Body
|
// Body
|
||||||
//$body-bg: #f5f8fa;
|
//$body-bg: #f5f8fa;
|
||||||
$body-bg: #454545;
|
$body-bg: #000;
|
||||||
|
|
||||||
// Borders
|
// Borders
|
||||||
$laravel-border-color: darken($body-bg, 10%);
|
$laravel-border-color: darken($body-bg, 10%);
|
||||||
|
@ -38,3 +38,16 @@ $input-color-placeholder: lighten($text-color, 30%);
|
||||||
// Panels
|
// Panels
|
||||||
$panel-default-heading-bg: #ababab;
|
$panel-default-heading-bg: #ababab;
|
||||||
|
|
||||||
|
body{
|
||||||
|
background-color: #000000;
|
||||||
|
color: #ffffff;
|
||||||
|
}
|
||||||
|
#app {
|
||||||
|
font-family: monospace;
|
||||||
|
font-size: large;
|
||||||
|
-webkit-font-smoothing: antialiased;
|
||||||
|
-moz-osx-font-smoothing: grayscale;
|
||||||
|
text-align: left;
|
||||||
|
margin-top: 20px;
|
||||||
|
margin-left: 20px;
|
||||||
|
}
|
||||||
|
|
|
@ -0,0 +1,5 @@
|
||||||
|
@extends('layouts.app')
|
||||||
|
|
||||||
|
@section('content')
|
||||||
|
<bash />
|
||||||
|
@endsection
|
|
@ -0,0 +1,13 @@
|
||||||
|
<?php
|
||||||
|
|
||||||
|
/*
|
||||||
|
|--------------------------------------------------------------------------
|
||||||
|
| User class
|
||||||
|
|--------------------------------------------------------------------------
|
||||||
|
|
|
||||||
|
| These are the API routes corresponding to user.
|
||||||
|
|
|
||||||
|
*/
|
||||||
|
|
||||||
|
// Commands
|
||||||
|
Route::get('/api/rpc/bash/ls/{pwd}', 'BashController@ls');
|
|
@ -25,3 +25,10 @@ Route::get('/api/rpc/permission/getpermissionfrommodule/{id}', 'PermissionContro
|
||||||
Route::get('/api/rpc/permission/getpermissions/{mdl}', 'PermissionController@getPermissions');
|
Route::get('/api/rpc/permission/getpermissions/{mdl}', 'PermissionController@getPermissions');
|
||||||
Route::get('/api/rpc/permission/getpermissiongroup/{mdl}/{id}', 'PermissionController@getPermissionGroup');
|
Route::get('/api/rpc/permission/getpermissiongroup/{mdl}/{id}', 'PermissionController@getPermissionGroup');
|
||||||
Route::get('/api/rpc/permission/getpermissionuser/{mdl}/{id}', 'PermissionController@getPermissionUser');
|
Route::get('/api/rpc/permission/getpermissionuser/{mdl}/{id}', 'PermissionController@getPermissionUser');
|
||||||
|
|
||||||
|
// Bash
|
||||||
|
Route::get('/', function () {
|
||||||
|
return view('cli');
|
||||||
|
});
|
||||||
|
|
||||||
|
require(__DIR__.'/class/bash.php');
|
新しいイシューから参照