1 |
- {"ast":null,"code":"var _jsxFileName = \"/Users/holunyeung/Documents/GitHub/Photo_React/photo/src/testM.js\";\nimport React from 'react';\nimport { makeStyles, useTheme } from '@material-ui/core/styles';\nimport AppBar from '@material-ui/core/AppBar';\nimport Toolbar from '@material-ui/core/Toolbar';\nimport Typography from '@material-ui/core/Typography';\nimport Button from '@material-ui/core/Button';\nimport IconButton from '@material-ui/core/IconButton';\nimport MenuIcon from '@material-ui/icons/Menu';\nimport clsx from 'clsx';\nimport Drawer from '@material-ui/core/Drawer';\nimport List from '@material-ui/core/List';\nimport CssBaseline from '@material-ui/core/CssBaseline';\nimport Divider from '@material-ui/core/Divider';\nimport ChevronLeftIcon from '@material-ui/icons/ChevronLeft';\nimport ChevronRightIcon from '@material-ui/icons/ChevronRight';\nimport ListItem from '@material-ui/core/ListItem';\nimport ListItemIcon from '@material-ui/core/ListItemIcon';\nimport ListItemText from '@material-ui/core/ListItemText';\nimport InboxIcon from '@material-ui/icons/MoveToInbox';\nimport MailIcon from '@material-ui/icons/Mail';\nimport ImageList from './ImageList';\nimport PhotoIcon from '@material-ui/icons/Photo';\nimport ShareIcon from '@material-ui/icons/Share';\nimport PhotoAlbumIcon from '@material-ui/icons/PhotoAlbum';\nimport LibraryAddCheckIcon from '@material-ui/icons/LibraryAddCheck';\nimport Grid from '@material-ui/core/Grid';\nimport DeleteIcon from '@material-ui/icons/Delete';\nimport CloudUploadIcon from '@material-ui/icons/CloudUpload';\nimport HelpOutlineIcon from '@material-ui/icons/HelpOutline';\nimport SettingsIcon from '@material-ui/icons/Settings';\nimport Avatar from '@material-ui/core/Avatar';\nconst drawerWidth = 240;\nconst useStyles = makeStyles(theme => ({\n root: {\n flexGrow: 1\n },\n menuButton: {\n marginRight: theme.spacing(2)\n },\n title: {\n flexGrow: 1\n },\n toolbar: {\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'flex-end',\n padding: theme.spacing(0, 1),\n // necessary for content to be below app bar\n ...theme.mixins.toolbar\n },\n root: {\n display: 'flex'\n },\n appBar: {\n zIndex: theme.zIndex.drawer + 1,\n transition: theme.transitions.create(['width', 'margin'], {\n easing: theme.transitions.easing.sharp,\n duration: theme.transitions.duration.leavingScreen\n })\n },\n appBarShift: {\n marginLeft: drawerWidth,\n width: `calc(100% - ${drawerWidth}px)`,\n transition: theme.transitions.create(['width', 'margin'], {\n easing: theme.transitions.easing.sharp,\n duration: theme.transitions.duration.enteringScreen\n })\n },\n menuButton: {\n marginRight: 36\n },\n hide: {\n display: 'none'\n },\n drawer: {\n width: drawerWidth,\n flexShrink: 0,\n whiteSpace: 'nowrap'\n },\n drawerOpen: {\n width: drawerWidth,\n transition: theme.transitions.create('width', {\n easing: theme.transitions.easing.sharp,\n duration: theme.transitions.duration.enteringScreen\n })\n },\n drawerClose: {\n transition: theme.transitions.create('width', {\n easing: theme.transitions.easing.sharp,\n duration: theme.transitions.duration.leavingScreen\n }),\n overflowX: 'hidden',\n width: theme.spacing(7) + 1,\n [theme.breakpoints.up('sm')]: {\n width: theme.spacing(9) + 1\n }\n },\n toolbar: {\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'flex-end',\n padding: theme.spacing(0, 1),\n // necessary for content to be below app bar\n ...theme.mixins.toolbar\n },\n content: {\n flexGrow: 1,\n padding: theme.spacing(3)\n }\n}));\nexport default function ButtonAppBar() {\n const classes = useStyles();\n const [open, setOpen] = React.useState(false);\n const theme = useTheme();\n\n const handleDrawerOpen = () => {\n setOpen(true);\n };\n\n const handleDrawerClose = () => {\n setOpen(false);\n };\n\n return /*#__PURE__*/React.createElement(\"div\", {\n className: classes.root,\n __self: this,\n __source: {\n fileName: _jsxFileName,\n lineNumber: 127,\n columnNumber: 14\n }\n }, /*#__PURE__*/React.createElement(AppBar, {\n position: \"fixed\",\n className: clsx(classes.appBar, {\n [classes.appBarShift]: open\n }),\n __self: this,\n __source: {\n fileName: _jsxFileName,\n lineNumber: 129,\n columnNumber: 9\n }\n }, /*#__PURE__*/React.createElement(Toolbar, {\n __self: this,\n __source: {\n fileName: _jsxFileName,\n lineNumber: 136,\n columnNumber: 9\n }\n }, /*#__PURE__*/React.createElement(IconButton, {\n color: \"inherit\",\n onClick: handleDrawerOpen,\n edge: \"start\",\n className: clsx(classes.menuButton, {\n [classes.hide]: open\n }),\n __self: this,\n __source: {\n fileName: _jsxFileName,\n lineNumber: 138,\n columnNumber: 9\n }\n }, /*#__PURE__*/React.createElement(MenuIcon, {\n __self: this,\n __source: {\n fileName: _jsxFileName,\n lineNumber: 147,\n columnNumber: 9\n }\n })), \" \", /*#__PURE__*/React.createElement(Typography, {\n variant: \"h6\",\n className: classes.title,\n __self: this,\n __source: {\n fileName: _jsxFileName,\n lineNumber: 150,\n columnNumber: 23\n }\n }, \"\\u8C37\\u72D7\\u76F8\\u8584 \"), \" \", /*#__PURE__*/React.createElement(Button, {\n variant: \"contained\",\n startIcon: /*#__PURE__*/React.createElement(CloudUploadIcon, {\n __self: this,\n __source: {\n fileName: _jsxFileName,\n lineNumber: 156,\n columnNumber: 23\n }\n }),\n __self: this,\n __source: {\n fileName: _jsxFileName,\n lineNumber: 154,\n columnNumber: 23\n }\n }, \"Upload \"), /*#__PURE__*/React.createElement(IconButton, {\n style: {\n color: '#ffffff'\n },\n \"aria-label\": \"delete\",\n __self: this,\n __source: {\n fileName: _jsxFileName,\n lineNumber: 158,\n columnNumber: 17\n }\n }, \" \", /*#__PURE__*/React.createElement(CloudUploadIcon, {\n __self: this,\n __source: {\n fileName: _jsxFileName,\n lineNumber: 158,\n columnNumber: 79\n }\n })), \" \", /*#__PURE__*/React.createElement(IconButton, {\n style: {\n color: '#ffffff'\n },\n \"aria-label\": \"delete\",\n __self: this,\n __source: {\n fileName: _jsxFileName,\n lineNumber: 161,\n columnNumber: 22\n }\n }, \" \", /*#__PURE__*/React.createElement(HelpOutlineIcon, {\n __self: this,\n __source: {\n fileName: _jsxFileName,\n lineNumber: 161,\n columnNumber: 84\n }\n })), \" \", /*#__PURE__*/React.createElement(IconButton, {\n style: {\n color: '#ffffff'\n },\n \"aria-label\": \"delete\",\n __self: this,\n __source: {\n fileName: _jsxFileName,\n lineNumber: 164,\n columnNumber: 22\n }\n }, \" \", /*#__PURE__*/React.createElement(SettingsIcon, {\n __self: this,\n __source: {\n fileName: _jsxFileName,\n lineNumber: 164,\n columnNumber: 84\n }\n })), \" \", /*#__PURE__*/React.createElement(Avatar, {\n alt: \"Remy Sharp\",\n src: \"/static / images / avatar / 1. jpg \",\n __self: this,\n __source: {\n fileName: _jsxFileName,\n lineNumber: 167,\n columnNumber: 22\n }\n }), \" \"), \" \"), \" \", /*#__PURE__*/React.createElement(Drawer, {\n variant: \"permanent\",\n className: clsx(classes.drawer, {\n [classes.drawerOpen]: open,\n [classes.drawerClose]: !open\n }),\n classes: {\n paper: clsx({\n [classes.drawerOpen]: open,\n [classes.drawerClose]: !open\n })\n },\n __self: this,\n __source: {\n fileName: _jsxFileName,\n lineNumber: 169,\n columnNumber: 18\n }\n }, /*#__PURE__*/React.createElement(\"div\", {\n className: classes.toolbar,\n __self: this,\n __source: {\n fileName: _jsxFileName,\n lineNumber: 184,\n columnNumber: 9\n }\n }, /*#__PURE__*/React.createElement(IconButton, {\n onClick: handleDrawerClose,\n __self: this,\n __source: {\n fileName: _jsxFileName,\n lineNumber: 186,\n columnNumber: 9\n }\n }, \" \", theme.direction === 'rtl' ? /*#__PURE__*/React.createElement(ChevronRightIcon, {\n __self: this,\n __source: {\n fileName: _jsxFileName,\n lineNumber: 187,\n columnNumber: 84\n }\n }) : /*#__PURE__*/React.createElement(ChevronLeftIcon, {\n __self: this,\n __source: {\n fileName: _jsxFileName,\n lineNumber: 187,\n columnNumber: 109\n }\n }), \" \"), \" \"), \" \", /*#__PURE__*/React.createElement(Divider, {\n __self: this,\n __source: {\n fileName: _jsxFileName,\n lineNumber: 189,\n columnNumber: 15\n }\n }), /*#__PURE__*/React.createElement(List, {\n __self: this,\n __source: {\n fileName: _jsxFileName,\n lineNumber: 191,\n columnNumber: 9\n }\n }, \" \", ['相片', '共享', '相簿', '實用工具'].map((text, index) => /*#__PURE__*/React.createElement(ListItem, {\n button: true,\n key: text,\n __self: this,\n __source: {\n fileName: _jsxFileName,\n lineNumber: 193,\n columnNumber: 63\n }\n }, /*#__PURE__*/React.createElement(ListItemIcon, {\n __self: this,\n __source: {\n fileName: _jsxFileName,\n lineNumber: 195,\n columnNumber: 17\n }\n }, \" \", index == 0 ? /*#__PURE__*/React.createElement(PhotoIcon, {\n __self: this,\n __source: {\n fileName: _jsxFileName,\n lineNumber: 196,\n columnNumber: 47\n }\n }) : index == 1 ? /*#__PURE__*/React.createElement(ShareIcon, {\n __self: this,\n __source: {\n fileName: _jsxFileName,\n lineNumber: 196,\n columnNumber: 78\n }\n }) : index == 2 ? /*#__PURE__*/React.createElement(PhotoAlbumIcon, {\n __self: this,\n __source: {\n fileName: _jsxFileName,\n lineNumber: 196,\n columnNumber: 109\n }\n }) : /*#__PURE__*/React.createElement(LibraryAddCheckIcon, {\n __self: this,\n __source: {\n fileName: _jsxFileName,\n lineNumber: 196,\n columnNumber: 132\n }\n }), \" \"), \" \", /*#__PURE__*/React.createElement(ListItemText, {\n primary: text,\n __self: this,\n __source: {\n fileName: _jsxFileName,\n lineNumber: 196,\n columnNumber: 177\n }\n }), \" \")), \" \", /*#__PURE__*/React.createElement(Divider, {\n __self: this,\n __source: {\n fileName: _jsxFileName,\n lineNumber: 201,\n columnNumber: 11\n }\n }), \" \", /*#__PURE__*/React.createElement(Icon, {\n color: \"primary\",\n __self: this,\n __source: {\n fileName: _jsxFileName,\n lineNumber: 202,\n columnNumber: 21\n }\n }, \" add_circle \"), \"Your space: \"), \" \"), \" \", /*#__PURE__*/React.createElement(\"main\", {\n className: classes.content,\n __self: this,\n __source: {\n fileName: _jsxFileName,\n lineNumber: 205,\n columnNumber: 18\n }\n }, /*#__PURE__*/React.createElement(\"div\", {\n className: classes.toolbar,\n __self: this,\n __source: {\n fileName: _jsxFileName,\n lineNumber: 207,\n columnNumber: 9\n }\n }), \" \", /*#__PURE__*/React.createElement(ImageList, {\n __self: this,\n __source: {\n fileName: _jsxFileName,\n lineNumber: 209,\n columnNumber: 12\n }\n }), \" \"), \" \");\n}","map":{"version":3,"sources":["/Users/holunyeung/Documents/GitHub/Photo_React/photo/src/testM.js"],"names":["React","makeStyles","useTheme","AppBar","Toolbar","Typography","Button","IconButton","MenuIcon","clsx","Drawer","List","CssBaseline","Divider","ChevronLeftIcon","ChevronRightIcon","ListItem","ListItemIcon","ListItemText","InboxIcon","MailIcon","ImageList","PhotoIcon","ShareIcon","PhotoAlbumIcon","LibraryAddCheckIcon","Grid","DeleteIcon","CloudUploadIcon","HelpOutlineIcon","SettingsIcon","Avatar","drawerWidth","useStyles","theme","root","flexGrow","menuButton","marginRight","spacing","title","toolbar","display","alignItems","justifyContent","padding","mixins","appBar","zIndex","drawer","transition","transitions","create","easing","sharp","duration","leavingScreen","appBarShift","marginLeft","width","enteringScreen","hide","flexShrink","whiteSpace","drawerOpen","drawerClose","overflowX","breakpoints","up","content","ButtonAppBar","classes","open","setOpen","useState","handleDrawerOpen","handleDrawerClose","color","paper","direction","map","text","index"],"mappings":"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","sourcesContent":["import React from 'react';\nimport { makeStyles, useTheme } from '@material-ui/core/styles';\nimport AppBar from '@material-ui/core/AppBar';\nimport Toolbar from '@material-ui/core/Toolbar';\nimport Typography from '@material-ui/core/Typography';\nimport Button from '@material-ui/core/Button';\nimport IconButton from '@material-ui/core/IconButton';\nimport MenuIcon from '@material-ui/icons/Menu';\nimport clsx from 'clsx';\nimport Drawer from '@material-ui/core/Drawer';\nimport List from '@material-ui/core/List';\nimport CssBaseline from '@material-ui/core/CssBaseline';\nimport Divider from '@material-ui/core/Divider';\nimport ChevronLeftIcon from '@material-ui/icons/ChevronLeft';\nimport ChevronRightIcon from '@material-ui/icons/ChevronRight';\nimport ListItem from '@material-ui/core/ListItem';\nimport ListItemIcon from '@material-ui/core/ListItemIcon';\nimport ListItemText from '@material-ui/core/ListItemText';\nimport InboxIcon from '@material-ui/icons/MoveToInbox';\nimport MailIcon from '@material-ui/icons/Mail';\nimport ImageList from './ImageList';\nimport PhotoIcon from '@material-ui/icons/Photo';\nimport ShareIcon from '@material-ui/icons/Share';\nimport PhotoAlbumIcon from '@material-ui/icons/PhotoAlbum';\nimport LibraryAddCheckIcon from '@material-ui/icons/LibraryAddCheck';\nimport Grid from '@material-ui/core/Grid';\nimport DeleteIcon from '@material-ui/icons/Delete';\nimport CloudUploadIcon from '@material-ui/icons/CloudUpload';\nimport HelpOutlineIcon from '@material-ui/icons/HelpOutline';\nimport SettingsIcon from '@material-ui/icons/Settings';\nimport Avatar from '@material-ui/core/Avatar';\n\nconst drawerWidth = 240;\n\nconst useStyles = makeStyles((theme) => ({\n root: {\n flexGrow: 1,\n },\n menuButton: {\n marginRight: theme.spacing(2),\n },\n title: {\n flexGrow: 1,\n },\n toolbar: {\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'flex-end',\n padding: theme.spacing(0, 1),\n // necessary for content to be below app bar\n ...theme.mixins.toolbar,\n },\n root: {\n display: 'flex',\n },\n appBar: {\n zIndex: theme.zIndex.drawer + 1,\n transition: theme.transitions.create(['width', 'margin'], {\n easing: theme.transitions.easing.sharp,\n duration: theme.transitions.duration.leavingScreen,\n }),\n },\n appBarShift: {\n marginLeft: drawerWidth,\n width: `calc(100% - ${drawerWidth}px)`,\n transition: theme.transitions.create(['width', 'margin'], {\n easing: theme.transitions.easing.sharp,\n duration: theme.transitions.duration.enteringScreen,\n }),\n },\n menuButton: {\n marginRight: 36,\n },\n hide: {\n display: 'none',\n },\n drawer: {\n width: drawerWidth,\n flexShrink: 0,\n whiteSpace: 'nowrap',\n },\n drawerOpen: {\n width: drawerWidth,\n transition: theme.transitions.create('width', {\n easing: theme.transitions.easing.sharp,\n duration: theme.transitions.duration.enteringScreen,\n }),\n },\n drawerClose: {\n transition: theme.transitions.create('width', {\n easing: theme.transitions.easing.sharp,\n duration: theme.transitions.duration.leavingScreen,\n }),\n overflowX: 'hidden',\n width: theme.spacing(7) + 1,\n [theme.breakpoints.up('sm')]: {\n width: theme.spacing(9) + 1,\n },\n },\n toolbar: {\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'flex-end',\n padding: theme.spacing(0, 1),\n // necessary for content to be below app bar\n ...theme.mixins.toolbar,\n },\n content: {\n flexGrow: 1,\n padding: theme.spacing(3),\n },\n}));\n\nexport default function ButtonAppBar() {\n const classes = useStyles();\n const [open, setOpen] = React.useState(false);\n const theme = useTheme();\n\n const handleDrawerOpen = () => {\n setOpen(true);\n };\n\n const handleDrawerClose = () => {\n setOpen(false);\n };\n\n return ( <\n div className = { classes.root } >\n <\n AppBar position = \"fixed\"\n className = {\n clsx(classes.appBar, {\n [classes.appBarShift]: open,\n })\n } >\n <\n Toolbar >\n <\n IconButton color = \"inherit\"\n onClick = { handleDrawerOpen }\n edge = \"start\"\n className = {\n clsx(classes.menuButton, {\n [classes.hide]: open,\n })\n } >\n <\n MenuIcon / >\n <\n /IconButton> <\n Typography variant = \"h6\"\n className = { classes.title } >\n 谷狗相薄 <\n /Typography> <Button\n variant = \"contained\"\n startIcon = { < CloudUploadIcon / > } >\n Upload <\n /Button><IconButton style={{ color: '#ffffff' }} aria-label=\"delete\"> <\n CloudUploadIcon / >\n <\n /IconButton> <IconButton style={{ color: '#ffffff' }} aria-label=\"delete\"> <\n HelpOutlineIcon / >\n <\n /IconButton> <IconButton style={{ color: '#ffffff' }} aria-label=\"delete\"> <\n SettingsIcon / >\n <\n /IconButton> <Avatar alt=\"Remy Sharp\" src=\"/static / images / avatar / 1. jpg \" /> < /\n Toolbar > <\n /AppBar> < Drawer variant = \"permanent\"\n className = {\n clsx(classes.drawer, {\n [classes.drawerOpen]: open,\n [classes.drawerClose]: !open,\n })\n }\n classes = {\n {\n paper: clsx({\n [classes.drawerOpen]: open,\n [classes.drawerClose]: !open,\n }),\n }\n } >\n <\n div className = { classes.toolbar } >\n <\n IconButton onClick = { handleDrawerClose } > { theme.direction === 'rtl' ? < ChevronRightIcon / > : < ChevronLeftIcon / > } <\n /IconButton> < /\n div > <\n Divider / >\n <\n List > {\n ['相片', '共享', '相簿', '實用工具'].map((text, index) => ( <\n ListItem button key = { text } >\n <\n ListItemIcon > { index == 0 ? < PhotoIcon / > : index == 1 ? < ShareIcon / > : index == 2 ? < PhotoAlbumIcon / > : < LibraryAddCheckIcon / > } < /ListItemIcon> <\n ListItemText primary = { text }\n /> < /\n ListItem >\n ))\n } <\n Divider / > < Icon color = \"primary\" > add_circle < /Icon>\n Your space: <\n /List> < /\n Drawer > <\n main className = { classes.content } >\n <\n div className = { classes.toolbar }\n /> <\n ImageList / > < /\n main > < /\n div >\n );\n}"]},"metadata":{},"sourceType":"module"}
|