Web: Files: added opening of files through the mouse wheel in a new tab
This commit is contained in:
parent
ad654d43e8
commit
a746432470
@ -29,6 +29,7 @@ const SETTINGS_URL = combineUrl(PROXY_HOMEPAGE_URL, "/settings/:setting");
|
|||||||
const HISTORY_URL = combineUrl(PROXY_HOMEPAGE_URL, "/:fileId/history");
|
const HISTORY_URL = combineUrl(PROXY_HOMEPAGE_URL, "/:fileId/history");
|
||||||
const PRIVATE_ROOMS_URL = combineUrl(PROXY_HOMEPAGE_URL, "/private");
|
const PRIVATE_ROOMS_URL = combineUrl(PROXY_HOMEPAGE_URL, "/private");
|
||||||
const FILTER_URL = combineUrl(PROXY_HOMEPAGE_URL, "/filter");
|
const FILTER_URL = combineUrl(PROXY_HOMEPAGE_URL, "/filter");
|
||||||
|
const MEDIA_VIEW_URL = combineUrl(PROXY_HOMEPAGE_URL, "/view");
|
||||||
|
|
||||||
if (!window.AppServer) {
|
if (!window.AppServer) {
|
||||||
window.AppServer = {};
|
window.AppServer = {};
|
||||||
@ -40,6 +41,7 @@ window.AppServer.files = {
|
|||||||
HISTORY_URL,
|
HISTORY_URL,
|
||||||
PRIVATE_ROOMS_URL,
|
PRIVATE_ROOMS_URL,
|
||||||
FILTER_URL,
|
FILTER_URL,
|
||||||
|
MEDIA_VIEW_URL,
|
||||||
};
|
};
|
||||||
|
|
||||||
const Error404 = React.lazy(() => import("studio/Error404"));
|
const Error404 = React.lazy(() => import("studio/Error404"));
|
||||||
@ -113,6 +115,7 @@ class FilesContent extends React.Component {
|
|||||||
<PrivateRoute path={PRIVATE_ROOMS_URL} component={PrivateRoomsPage} />
|
<PrivateRoute path={PRIVATE_ROOMS_URL} component={PrivateRoomsPage} />
|
||||||
<PrivateRoute exact path={HOME_URL} component={Home} />
|
<PrivateRoute exact path={HOME_URL} component={Home} />
|
||||||
<PrivateRoute path={FILTER_URL} component={Home} />
|
<PrivateRoute path={FILTER_URL} component={Home} />
|
||||||
|
<PrivateRoute path={MEDIA_VIEW_URL} component={Home} />
|
||||||
<PrivateRoute component={Error404Route} />
|
<PrivateRoute component={Error404Route} />
|
||||||
</Switch>
|
</Switch>
|
||||||
</>
|
</>
|
||||||
|
@ -109,6 +109,9 @@ export default function withFileActions(WrappedFileItem) {
|
|||||||
} = this.props;
|
} = this.props;
|
||||||
const notSelectable = e.target.classList.contains("not-selectable");
|
const notSelectable = e.target.classList.contains("not-selectable");
|
||||||
|
|
||||||
|
if (e.button === 1) {
|
||||||
|
return localStorage.setItem("location", JSON.stringify(location));
|
||||||
|
}
|
||||||
this.setState({ isMouseDown: true });
|
this.setState({ isMouseDown: true });
|
||||||
|
|
||||||
if (!draggable || isPrivacy) return;
|
if (!draggable || isPrivacy) return;
|
||||||
@ -196,6 +199,7 @@ export default function withFileActions(WrappedFileItem) {
|
|||||||
|
|
||||||
if (isTrashFolder) return;
|
if (isTrashFolder) return;
|
||||||
if (e && e.target.tagName === "INPUT") return;
|
if (e && e.target.tagName === "INPUT") return;
|
||||||
|
e.preventDefault();
|
||||||
|
|
||||||
if (!fileExst && !contentLength) {
|
if (!fileExst && !contentLength) {
|
||||||
setIsLoading(true);
|
setIsLoading(true);
|
||||||
|
@ -10,6 +10,9 @@ import RowContent from "@appserver/components/row-content";
|
|||||||
|
|
||||||
import withContent from "../../../../../HOCs/withContent";
|
import withContent from "../../../../../HOCs/withContent";
|
||||||
import withBadges from "../../../../../HOCs/withBadges";
|
import withBadges from "../../../../../HOCs/withBadges";
|
||||||
|
import { AppServerConfig } from "@appserver/common/constants";
|
||||||
|
import { combineUrl } from "@appserver/common/utils";
|
||||||
|
import config from "../../../../../../package.json";
|
||||||
|
|
||||||
const sideColor = "#A3A9AE";
|
const sideColor = "#A3A9AE";
|
||||||
|
|
||||||
@ -68,6 +71,9 @@ const FilesRowContent = ({
|
|||||||
foldersCount,
|
foldersCount,
|
||||||
providerKey,
|
providerKey,
|
||||||
access,
|
access,
|
||||||
|
previewUrl,
|
||||||
|
folderUrl,
|
||||||
|
id,
|
||||||
} = item;
|
} = item;
|
||||||
|
|
||||||
const onMobileRowClick = () => {
|
const onMobileRowClick = () => {
|
||||||
@ -77,6 +83,20 @@ const FilesRowContent = ({
|
|||||||
|
|
||||||
const withAccess = isAdmin || access === 0;
|
const withAccess = isAdmin || access === 0;
|
||||||
|
|
||||||
|
const docUrl = combineUrl(
|
||||||
|
AppServerConfig.proxyURL,
|
||||||
|
config.homepage,
|
||||||
|
`/doceditor?fileId=${id}`
|
||||||
|
);
|
||||||
|
|
||||||
|
const href = isTrashFolder
|
||||||
|
? null
|
||||||
|
: previewUrl
|
||||||
|
? previewUrl
|
||||||
|
: !item.isFolder
|
||||||
|
? docUrl
|
||||||
|
: folderUrl;
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
<SimpleFilesRowContent
|
<SimpleFilesRowContent
|
||||||
@ -93,6 +113,8 @@ const FilesRowContent = ({
|
|||||||
title={titleWithoutExt}
|
title={titleWithoutExt}
|
||||||
fontWeight="600"
|
fontWeight="600"
|
||||||
fontSize="15px"
|
fontSize="15px"
|
||||||
|
target="_blank"
|
||||||
|
href={href}
|
||||||
{...linkStyles}
|
{...linkStyles}
|
||||||
color="#333"
|
color="#333"
|
||||||
isTextOverflow
|
isTextOverflow
|
||||||
|
@ -10,6 +10,10 @@ import TileContent from "./sub-components/TileContent";
|
|||||||
import withContent from "../../../../../HOCs/withContent";
|
import withContent from "../../../../../HOCs/withContent";
|
||||||
import withBadges from "../../../../../HOCs/withBadges";
|
import withBadges from "../../../../../HOCs/withBadges";
|
||||||
|
|
||||||
|
import { AppServerConfig } from "@appserver/common/constants";
|
||||||
|
import { combineUrl } from "@appserver/common/utils";
|
||||||
|
import config from "../../../../../../package.json";
|
||||||
|
|
||||||
const SimpleFilesTileContent = styled(TileContent)`
|
const SimpleFilesTileContent = styled(TileContent)`
|
||||||
.row-main-container {
|
.row-main-container {
|
||||||
height: auto;
|
height: auto;
|
||||||
@ -81,13 +85,27 @@ const FilesTileContent = ({
|
|||||||
onFilesClick,
|
onFilesClick,
|
||||||
badgesComponent,
|
badgesComponent,
|
||||||
}) => {
|
}) => {
|
||||||
const { fileExst } = item;
|
const { fileExst, previewUrl, folderUrl, id } = item;
|
||||||
|
|
||||||
const onMobileRowClick = () => {
|
const onMobileRowClick = () => {
|
||||||
if (isTrashFolder || window.innerWidth > 1024) return;
|
if (isTrashFolder || window.innerWidth > 1024) return;
|
||||||
onFilesClick();
|
onFilesClick();
|
||||||
};
|
};
|
||||||
|
|
||||||
|
const docUrl = combineUrl(
|
||||||
|
AppServerConfig.proxyURL,
|
||||||
|
config.homepage,
|
||||||
|
`/doceditor?fileId=${id}`
|
||||||
|
);
|
||||||
|
|
||||||
|
const href = isTrashFolder
|
||||||
|
? null
|
||||||
|
: previewUrl
|
||||||
|
? previewUrl
|
||||||
|
: !item.isFolder
|
||||||
|
? docUrl
|
||||||
|
: folderUrl;
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
<SimpleFilesTileContent
|
<SimpleFilesTileContent
|
||||||
@ -103,6 +121,8 @@ const FilesTileContent = ({
|
|||||||
title={titleWithoutExt}
|
title={titleWithoutExt}
|
||||||
fontWeight="600"
|
fontWeight="600"
|
||||||
fontSize="14px"
|
fontSize="14px"
|
||||||
|
target="_blank"
|
||||||
|
href={href}
|
||||||
{...linkStyles}
|
{...linkStyles}
|
||||||
color="#333"
|
color="#333"
|
||||||
isTextOverflow
|
isTextOverflow
|
||||||
|
@ -38,12 +38,48 @@ class PureHome extends React.Component {
|
|||||||
isVisitor,
|
isVisitor,
|
||||||
expandedKeys,
|
expandedKeys,
|
||||||
setExpandedKeys,
|
setExpandedKeys,
|
||||||
|
setMediaViewerData,
|
||||||
} = this.props;
|
} = this.props;
|
||||||
|
|
||||||
const reg = new RegExp(`${homepage}((/?)$|/filter)`, "gm"); //TODO: Always find?
|
const reg = new RegExp(`${homepage}((/?)$|/filter)`, "gm"); //TODO: Always find?
|
||||||
const match = window.location.pathname.match(reg);
|
const match = window.location.pathname.match(reg);
|
||||||
let filterObj = null;
|
let filterObj = null;
|
||||||
|
|
||||||
|
if (window.location.pathname.indexOf("/files/view") > 1) {
|
||||||
|
const search = window.location.search;
|
||||||
|
let id = null;
|
||||||
|
|
||||||
|
if (search.indexOf("?folder") >= 0) {
|
||||||
|
id = search.slice(search.indexOf("=") + 1);
|
||||||
|
}
|
||||||
|
const newLocation = JSON.parse(localStorage.getItem("location"));
|
||||||
|
|
||||||
|
filterObj = newLocation
|
||||||
|
? FilesFilter.getFilter(newLocation)
|
||||||
|
: FilesFilter.getDefault();
|
||||||
|
if (isVisitor) filterObj.folder = "@common";
|
||||||
|
const folderId = id || filterObj.folder;
|
||||||
|
setIsLoading(true);
|
||||||
|
|
||||||
|
fetchFiles(folderId, filterObj)
|
||||||
|
.then((data) => {
|
||||||
|
const pathParts = data.selectedFolder.pathParts;
|
||||||
|
const newExpandedKeys = createTreeFolders(pathParts, expandedKeys);
|
||||||
|
setExpandedKeys(newExpandedKeys);
|
||||||
|
})
|
||||||
|
.finally(() => {
|
||||||
|
setIsLoading(false);
|
||||||
|
setFirstLoad(false);
|
||||||
|
});
|
||||||
|
|
||||||
|
if (!(search.indexOf("?folder") >= 0)) {
|
||||||
|
const fileId = Number(search.slice(search.indexOf("?") + 1));
|
||||||
|
setMediaViewerData({ visible: true, id: fileId });
|
||||||
|
}
|
||||||
|
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
if (match && match.length > 0) {
|
if (match && match.length > 0) {
|
||||||
filterObj = FilesFilter.getFilter(window.location);
|
filterObj = FilesFilter.getFilter(window.location);
|
||||||
|
|
||||||
@ -311,7 +347,13 @@ class PureHome extends React.Component {
|
|||||||
const Home = withTranslation("Home")(PureHome);
|
const Home = withTranslation("Home")(PureHome);
|
||||||
|
|
||||||
export default inject(
|
export default inject(
|
||||||
({ auth, filesStore, uploadDataStore, treeFoldersStore }) => {
|
({
|
||||||
|
auth,
|
||||||
|
filesStore,
|
||||||
|
uploadDataStore,
|
||||||
|
treeFoldersStore,
|
||||||
|
mediaViewerDataStore,
|
||||||
|
}) => {
|
||||||
const {
|
const {
|
||||||
secondaryProgressDataStore,
|
secondaryProgressDataStore,
|
||||||
primaryProgressDataStore,
|
primaryProgressDataStore,
|
||||||
@ -366,6 +408,7 @@ export default inject(
|
|||||||
? filesStore.selectionTitle
|
? filesStore.selectionTitle
|
||||||
: null;
|
: null;
|
||||||
|
|
||||||
|
const { setMediaViewerData } = mediaViewerDataStore;
|
||||||
return {
|
return {
|
||||||
homepage: config.homepage,
|
homepage: config.homepage,
|
||||||
firstLoad,
|
firstLoad,
|
||||||
@ -405,6 +448,7 @@ export default inject(
|
|||||||
startUpload,
|
startUpload,
|
||||||
isHeaderVisible: auth.settingsStore.isHeaderVisible,
|
isHeaderVisible: auth.settingsStore.isHeaderVisible,
|
||||||
setHeaderVisible: auth.settingsStore.setHeaderVisible,
|
setHeaderVisible: auth.settingsStore.setHeaderVisible,
|
||||||
|
setMediaViewerData,
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
)(withRouter(observer(Home)));
|
)(withRouter(observer(Home)));
|
||||||
|
@ -1093,6 +1093,9 @@ class FilesStore {
|
|||||||
item.fileExst
|
item.fileExst
|
||||||
);
|
);
|
||||||
|
|
||||||
|
const previewUrl = canOpenPlayer
|
||||||
|
? combineUrl(AppServerConfig.proxyURL, config.homepage, `/view?${id}`)
|
||||||
|
: null;
|
||||||
const contextOptions = this.getFilesContextOptions(item, canOpenPlayer);
|
const contextOptions = this.getFilesContextOptions(item, canOpenPlayer);
|
||||||
|
|
||||||
//const isCanWebEdit = canWebEdit(item.fileExst);
|
//const isCanWebEdit = canWebEdit(item.fileExst);
|
||||||
@ -1106,6 +1109,14 @@ class FilesStore {
|
|||||||
if (x.id === item.id) isFolder = true;
|
if (x.id === item.id) isFolder = true;
|
||||||
});
|
});
|
||||||
|
|
||||||
|
const folderUrl = isFolder
|
||||||
|
? combineUrl(
|
||||||
|
AppServerConfig.proxyURL,
|
||||||
|
config.homepage,
|
||||||
|
`/view?folder=${id}`
|
||||||
|
)
|
||||||
|
: null;
|
||||||
|
|
||||||
return {
|
return {
|
||||||
access,
|
access,
|
||||||
//checked,
|
//checked,
|
||||||
@ -1144,6 +1155,8 @@ class FilesStore {
|
|||||||
//canShare,
|
//canShare,
|
||||||
thumbnailUrl,
|
thumbnailUrl,
|
||||||
thumbnailStatus,
|
thumbnailStatus,
|
||||||
|
previewUrl,
|
||||||
|
folderUrl,
|
||||||
};
|
};
|
||||||
});
|
});
|
||||||
|
|
||||||
|
Loading…
Reference in New Issue
Block a user