Creat react files list

This commit is contained in:
maximstewart 2021-02-07 22:49:38 -06:00
parent 47a03155d5
commit a477654021
9 changed files with 61745 additions and 30 deletions

View File

@ -25,7 +25,7 @@ class Config(object):
SECRET_KEY = secrets.token_hex(32)
PERMANENT_SESSION_LIFETIME = timedelta(days = 7).total_seconds()
SQLALCHEMY_DATABASE_URI = "sqlite:///static/db/database.db"
SQLALCHEMY_DATABASE_URI = "sqlite:///static/db/webfm.db"
SQLALCHEMY_TRACK_MODIFICATIONS = False
LOGIN_PATH = "FLASK_LOGIN" # Value can be OIDC or FLASK_LOGIN

View File

@ -44,7 +44,7 @@ def home():
@app.route('/api/list-files/<_hash>', methods=['GET', 'POST'])
def listFilesRoute(_hash = None):
def listFiles(_hash = None):
if request.method == 'POST':
view = get_window_controller().get_window(1).get_view(0)
dot_dots = view.get_dot_dots()
@ -78,7 +78,7 @@ def listFilesRoute(_hash = None):
return msgHandler.createMessageJSON("danger", msg)
@app.route('/api/file-manager-action/<_type>/<_hash>')
def file_manager_action(_type, _hash = None):
def fileManagerAction(_type, _hash = None):
view = get_window_controller().get_window(1).get_view(0)
if _type == "reset-path" and _hash == None:
@ -103,8 +103,8 @@ def file_manager_action(_type, _hash = None):
return msgHandler.createMessageJSON("success", msg)
@app.route('/api/get-favorites', methods=['GET', 'POST'])
def getAllFavoritesRoute():
@app.route('/api/list-favorites', methods=['GET', 'POST'])
def listFavorites():
if request.method == 'POST':
list = db.session.query(Favorites).all()
faves = []
@ -121,7 +121,7 @@ def loadFavorite(_id):
if request.method == 'POST':
try:
ID = int(_id)
fave = db.session.query(Favorites).filter_by(id=ID).first()
fave = db.session.query(Favorites).filter_by(id = ID).first()
view = get_window_controller().get_window(1).get_view(0)
view.set_path(fave.link)
return '{"refresh": "true"}'
@ -135,7 +135,7 @@ def loadFavorite(_id):
@app.route('/api/manage-favorites/<_action>', methods=['GET', 'POST'])
def manageFavoritesRoute(_action):
def manageFavorites(_action):
if request.method == 'POST':
ACTION = _action.strip()
view = get_window_controller().get_window(1).get_view(0)
@ -146,7 +146,7 @@ def manageFavoritesRoute(_action):
db.session.add(fave)
msg = "Added to Favorites successfully..."
else:
fave = db.session.query(Favorites).filter_by(link=path).first()
fave = db.session.query(Favorites).filter_by(link = path).first()
db.session.delete(fave)
msg = "Deleted from Favorites successfully..."

View File

@ -5,7 +5,7 @@ const listFilesAjax = async (hash) => {
const getFavesAjax = async () => {
const data = "empty=NULL";
doAjax("api/get-favorites", data, "favorites");
doAjax("api/list-favorites", data, "favorites");
}
const loadFavoriteLink = async (id) => {

File diff suppressed because one or more lines are too long

View File

@ -5,8 +5,9 @@ const postAjaxController = (data, action) => {
return ;
}
console.log(data);
if (data.hasOwnProperty('path_head'))
console.log(data);
console.log();
// updateHTMLDirList(data);
if (data.hasOwnProperty('faves_list'))
// generateFavesList(data.faves_list);

View File

@ -0,0 +1,44 @@
// Create a ES6 class component
class FilesList extends React.Component {
// Use the render function to return JSX component
render() {
let final = [];
let files = this.props.files;
for (let file of files) {
final.push(
<div class="col-sm-12 col-md-6 col-lg-4">
<div class="card">
<div class="card-header">{file}</div>
<div class="card-body">
<img class="image-style" src="/api/files/file" alt="{file}" />
</div>
<div class="card-footer">
<input app="{file}" class="btn btn-secondary btn-sm" type="button" value="Launch"/>
<input app="{file}" class="btn btn-secondary btn-sm" type="button" value="Launch Locally"/>
</div>
</div>
</div>
);
}
return (
<div class="row">
{final}
</div>
);
}
}
const renderFilesList = (data = {"files": ['Dir 1', 'Dir 2', 'Dir 3', 'Dir 4', 'Dir 5']}) => {
// Obtain the root
const filesListElm = document.getElementById('files')
// Use the ReactDOM.render to show our component on the browser
ReactDOM.render(
React.createElement(FilesList, data),
filesListElm
)
}
renderFilesList()

View File

@ -1,20 +1,3 @@
// {% for file in files['files'] %}
// <div class="col-sm-12 col-md-6 col-lg-4">
// <div class="card">
// <div class="card-header">{{file[0]}}</div>
// <div class="card-body">
// <img class="image-style" src="/api/files/{{file[1]}}" alt="{{file[0]}}" />
// </div>
// <div class="card-footer">
// <input app="{{file[1]}}" class="btn btn-secondary btn-sm" type="button" value="Launch"/>
// <input app="{{file[1]}}" class="btn btn-secondary btn-sm" type="button" value="Launch Locally"/>
// </div>
// </div>
// </div>
// {% endfor %}
const reloadDirectory = () => {
let target = document.getElementById('refresh-btn')
const hash = target.getAttribute("hash");

View File

@ -111,6 +111,7 @@
<!-- For React -->
<script src="{{ url_for('static', filename='js/libs/react/react.production.min-17-0-1.js')}}"></script>
<script src="{{ url_for('static', filename='js/libs/react/react-dom.production.min-17-0-1.js')}}"></script>
<script src="{{ url_for('static', filename='js/libs/react/babel.js')}}"></script>
<!-- Application Imports -->
{% block body_scripts_additional %}

View File

@ -14,8 +14,8 @@
{% endblock body_header_additional %}
{% block body_content_additional %}
<div id="files" class="row">
</div>
<div id="files">
</div>
{% endblock body_content_additional %}
{% block body_footer_additional %}
@ -23,7 +23,7 @@
{% block body_scripts_additional %}
<script src="{{ url_for('static', filename='js/react-ui-logic.js')}}"></script>
<script type="text/babel" src="{{ url_for('static', filename='js/react-ui-logic.js')}}"></script>
<script src="{{ url_for('static', filename='js/ui-logic.js')}}"></script>
<script src="{{ url_for('static', filename='js/post-ajax.js')}}"></script>
<script src="{{ url_for('static', filename='js/ajax.js')}}"></script>