57 lines
1.7 KiB
JavaScript
57 lines
1.7 KiB
JavaScript
import React, { Component } from 'react';
|
|
import { refresh, selectView } from 'actions/files-view';
|
|
import { show as showDialog } from 'actions/dialog';
|
|
import { show as showMenu } from 'actions/menu';
|
|
import settings from 'actions/settings';
|
|
import store, { bind } from 'store';
|
|
import { MENU_WIDTH } from './menu';
|
|
|
|
export default class Toolbar extends Component {
|
|
render() {
|
|
return (
|
|
<div className='toolbar'>
|
|
<button className='icon-back tour-item' onClick={this.goUp} />
|
|
<button className='icon-plus tour-item' onClick={this.newFile} />
|
|
<button className='icon-refresh tour-item' onClick={bind(refresh())} />
|
|
<button className='icon-select tour-item' onClick={bind(selectView('toggle'))} />
|
|
<button className='icon-more tour-item' onClick={this.showMore.bind(this)} ref='more' />
|
|
</div>
|
|
);
|
|
}
|
|
|
|
showMore() {
|
|
let rect = React.findDOMNode(this.refs.more).getBoundingClientRect();
|
|
let {x, y, width, height} = rect;
|
|
|
|
let left = x + width - MENU_WIDTH,
|
|
top = y + height;
|
|
|
|
let transform = 'translate(0, -100%)';
|
|
store.dispatch(showMenu('moreMenu', {style: {left, top, transform}}));
|
|
}
|
|
|
|
goUp() {
|
|
let current = store.getState().get('cwd');
|
|
let up = current.split('/').slice(0, -1).join('/');
|
|
|
|
if (up === current) return;
|
|
|
|
store.dispatch(changedir(up));
|
|
}
|
|
|
|
newFile() {
|
|
let cwd = store.getState().get('cwd');
|
|
let action = showDialog('createDialog', {
|
|
description: `Enter a name for the new file to be created in ${cwd}`
|
|
});
|
|
store.dispatch(action);
|
|
}
|
|
|
|
toggleView() {
|
|
let current = store.getState().get('settings').view;
|
|
let value = current === 'list' ? 'grid' : 'list';
|
|
|
|
store.dispatch(settings({view: value}));
|
|
}
|
|
}
|