Merge pull request #64 from ShahriarDhruvo/tashfi

Tashfi

README.md

@@ -1,2 +1,37 @@
-# DU_Hackathon
-This is project idea & implementation for DU itverse hackathon
+# ClassPortal
+<i>ClassPortal</i> is a project that simplifies the E-learning processes.
+
+# Project Purpose
+Because of the Covid-19 outbreak coutries are in lockdown, educational institutes has been closed for a long time now. As a result the whole education system has become a messy. <br /> <br />
+Even though a lot of institutes are try to take classes online, they aren't becoming so efficient. Even students and teachers needs to have accounts in multiple flatforms to stay in sync. As example, maybe teacher will take class in an online video conference app. But to have all students joined here, teacher needs to give link in an another platform. Then students may have any query for teacher, again for this reason they need to have accounts in a chatting application. So number of acounts goes up and up.
+So in ClassPortal we tried to solve this part. We developed a web application where teacher can create Room and can post class links, students can comment/question, teacher can create different sections according to types of information he/she can share.
+<br /> <br />
+In this lockdown our <b>Hands-on Laboratory Activities</b> are suffering the most. Because Laboratory Activities are needed to conduct live. Even if we try to minimize it by arranging video conference, it won't be successful because students can't participate in the hands on laboratory experiments.
+<br /> <br />
+So, as the major part of our <i>ClassPortal</i> we tried to solve this issue by introducing <b>Interactive Simulation</b> in our project.
+
+![alt text](https://github.com/ShahriarDhruvo/HackTheVerse_SUST_NOOBs/blob/main/Cell_Simulation_Screenshots/Screenshot%20(150).png?raw=true)
+
+![alt text](https://github.com/ShahriarDhruvo/HackTheVerse_SUST_NOOBs/blob/main/Cell_Simulation_Screenshots/Screenshot%20(154).png?raw=true)
+
+![alt text](https://github.com/ShahriarDhruvo/HackTheVerse_SUST_NOOBs/blob/main/Cell_Simulation_Screenshots/Screenshot%20(155).png?raw=true)
+
+# How to run this project
+1. Install the dependencies in server/requirements.txt
+2. Install the dependencies in frontend/package.json
+3. Configure your server then Enjoy :-)
+
+# Frameworks & Libraries
+Backend: <br />
+  &nbsp;&nbsp;&nbsp;&nbsp; a. Django <br />
+  &nbsp;&nbsp;&nbsp;&nbsp; b. Django Rest Framework <br />
+  &nbsp;&nbsp;&nbsp;&nbsp; c. Django Channels <br />
+  &nbsp;&nbsp;&nbsp;&nbsp; d. PostgreSQL <br />
+  &nbsp;&nbsp;&nbsp;&nbsp; etc... <br />
+
+Frontend: <br />
+  &nbsp;&nbsp;&nbsp;&nbsp; a. ReactJS <br />
+  &nbsp;&nbsp;&nbsp;&nbsp; b. React-Bootstrap, Material UI <br />
+  &nbsp;&nbsp;&nbsp;&nbsp; c. Moment <br />
+  &nbsp;&nbsp;&nbsp;&nbsp; etc... <br />
+

frontend/.gitignore

@@ -21,3 +21,7 @@
 npm-debug.log*
 yarn-debug.log*
 yarn-error.log*
+
+
+# Big files
+/public/static/Simulators/CellSimulation/Build/CellSimulation.data.unityweb

frontend/public/index.html

@@ -5,26 +5,8 @@
     <meta name="description" content="Educational Website"/>
     <meta name="theme-color" content="#000000" />
     <meta name="viewport" content="width=device-width, initial-scale=1" />
-
-    <link rel="icon" href="/static/favicon.ico">
-
-    <!-- <meta name="msapplication-TileColor" content="#ffffff">
-    <meta name="msapplication-TileImage" content="/icon/ms-icon-144x144.png">
-    <link rel="apple-touch-icon" sizes="57x57" href="/icon/apple-icon-57x57.png">
-    <link rel="apple-touch-icon" sizes="60x60" href="/icon/apple-icon-60x60.png">
-    <link rel="apple-touch-icon" sizes="72x72" href="/icon/apple-icon-72x72.png">
-    <link rel="apple-touch-icon" sizes="76x76" href="/icon/apple-icon-76x76.png">
-    <link rel="apple-touch-icon" sizes="114x114" href="/icon/apple-icon-114x114.png">
-    <link rel="apple-touch-icon" sizes="120x120" href="/icon/apple-icon-120x120.png">
-    <link rel="apple-touch-icon" sizes="144x144" href="/icon/apple-icon-144x144.png">
-    <link rel="apple-touch-icon" sizes="152x152" href="/icon/apple-icon-152x152.png">
-    <link rel="apple-touch-icon" sizes="180x180" href="/icon/apple-icon-180x180.png">
-    <link rel="icon" type="image/png" sizes="192x192"  href="/icon/android-icon-192x192.png">
-    <link rel="icon" type="image/png" sizes="32x32" href="/icon/favicon-32x32.png">
-    <link rel="icon" type="image/png" sizes="96x96" href="/icon/favicon-96x96.png">
-    <link rel="icon" type="image/png" sizes="16x16" href="/icon/favicon-16x16.png"> -->
-
-    <title>React App</title>
+    <link rel="icon" href="/static/img/favicon.ico">
+    <title>ClassPortal</title>
   </head>
   <body>
     <div id="root"></div>

frontend/public/static/Simulators/CellSimulation/Build/CellSimulation.json

@@ -0,0 +1,16 @@
+{
+"companyName": "DefaultCompany",
+"productName": "DU Hackathon",
+"productVersion": "0.1",
+"dataUrl": "CellSimulation.data.unityweb",
+"wasmCodeUrl": "CellSimulation.wasm.code.unityweb",
+"wasmFrameworkUrl": "CellSimulation.wasm.framework.unityweb",
+"graphicsAPI": ["WebGL 2.0","WebGL 1.0"],
+"webglContextAttributes": {"preserveDrawingBuffer": false},
+"splashScreenStyle": "Dark",
+"backgroundColor": "#231F20",
+"cacheControl": {"default": "must-revalidate"},
+"developmentBuild": false,
+"multithreading": false,
+"unityVersion": "2019.2.12f1"
+}

frontend/public/static/Simulators/CellSimulation/TemplateData/UnityProgress.js

@@ -0,0 +1,24 @@
+function UnityProgress(unityInstance, progress) {
+  if (!unityInstance.Module)
+    return;
+  if (!unityInstance.logo) {
+    unityInstance.logo = document.createElement("div");
+    unityInstance.logo.className = "logo " + unityInstance.Module.splashScreenStyle;
+    unityInstance.container.appendChild(unityInstance.logo);
+  }
+  if (!unityInstance.progress) {    
+    unityInstance.progress = document.createElement("div");
+    unityInstance.progress.className = "progress " + unityInstance.Module.splashScreenStyle;
+    unityInstance.progress.empty = document.createElement("div");
+    unityInstance.progress.empty.className = "empty";
+    unityInstance.progress.appendChild(unityInstance.progress.empty);
+    unityInstance.progress.full = document.createElement("div");
+    unityInstance.progress.full.className = "full";
+    unityInstance.progress.appendChild(unityInstance.progress.full);
+    unityInstance.container.appendChild(unityInstance.progress);
+  }
+  unityInstance.progress.full.style.width = (100 * progress) + "%";
+  unityInstance.progress.empty.style.width = (100 * (1 - progress)) + "%";
+  if (progress == 1)
+    unityInstance.logo.style.display = unityInstance.progress.style.display = "none";
+}

frontend/public/static/Simulators/CellSimulation/TemplateData/style.css

@@ -0,0 +1,18 @@
+.webgl-content * {border: 0; margin: 0; padding: 0}
+.webgl-content {position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%);}
+
+.webgl-content .logo, .progress {position: absolute; left: 50%; top: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%);}
+.webgl-content .logo {background: url('progressLogo.Light.png') no-repeat center / contain; width: 154px; height: 130px;}
+.webgl-content .progress {height: 18px; width: 141px; margin-top: 90px;}
+.webgl-content .progress .empty {background: url('progressEmpty.Light.png') no-repeat right / cover; float: right; width: 100%; height: 100%; display: inline-block;}
+.webgl-content .progress .full {background: url('progressFull.Light.png') no-repeat left / cover; float: left; width: 0%; height: 100%; display: inline-block;}
+
+.webgl-content .logo.Dark {background-image: url('progressLogo.Dark.png');}
+.webgl-content .progress.Dark .empty {background-image: url('progressEmpty.Dark.png');}
+.webgl-content .progress.Dark .full {background-image: url('progressFull.Dark.png');}
+
+.webgl-content .footer {margin-top: 5px; height: 38px; line-height: 38px; font-family: Helvetica, Verdana, Arial, sans-serif; font-size: 18px;}
+.webgl-content .footer .webgl-logo, .title, .fullscreen {height: 100%; display: inline-block; background: transparent center no-repeat;}
+.webgl-content .footer .webgl-logo {background-image: url('webgl-logo.png'); width: 204px; float: left;}
+.webgl-content .footer .title {margin-right: 10px; float: right;}
+.webgl-content .footer .fullscreen {background-image: url('fullscreen.png'); width: 38px; float: right;}

frontend/src/App.js

@@ -1,7 +1,9 @@
 import React from "react";
 import "./styles/styles.scss";
 import { library } from "@fortawesome/fontawesome-svg-core";
+import { far } from "@fortawesome/free-regular-svg-icons";
 import { fas } from "@fortawesome/free-solid-svg-icons";
+import { fab } from "@fortawesome/free-brands-svg-icons";
 import Home from "./components/Home/Home";
 import { BrowserRouter as Router, Route, Switch } from "react-router-dom";
 import EmailConfirmationSent from "./components/generic/EmailConfirmationSent";
@@ -13,15 +15,23 @@ import PasswordChange from "./components/generic/PasswordChange";
 import Rooms from "./components/Rooms/Rooms";
 import AuthenticationContextProvider from "./contexts/AuthenticationContext";
 import SettingsContextProvider from "./contexts/SettingsContext";
-import Navs from './components/Navbar/Navbar';
-import Dept from './components/Dept/Dept'
+import Navs from "./components/Navbar/Navbar";
+import Dept from "./components/Dept/Dept";
 import CreateCourse from "./components/CreateCourse/CreateCourse";
-import Notifications from "./components/Notifications/Notifications";
+// import Notifications from "./components/Notifications/Notifications";
 import MyRooms from "./components/My_Rooms/MyRooms";
+
+import CellSimulation from "./Simulations/CellSimulation";
 // import FooterPage from "./components/Footer/Footer";
 // import Footer from "./components/generic/Footer";
 
-library.add(fas);
+import Footer from "./components/Footer/Footer";
+import Simulations from "./Simulations/Simulations";
+import BiologySimulations from "./Simulations/BiologySimulations";
+import PhysicsSimulations from "./Simulations/PhysicsSimulations";
+import ChemistrySimulations from "./Simulations/ChemistrySimulations";
+
+library.add(far, fas, fab);
 
 function App() {
     return (
@@ -36,15 +46,8 @@ function App() {
                             path="/rooms/:room_pk/"
                             component={Rooms}
                         />
-                        <Route
-                            exact
-                            path="/myrooms/"
-                            component={MyRooms}
-                        />
-                        <Route
-                            exact
-                            path="/homerooms/:id/"
-                            component={Dept} />
+                        <Route exact path="/myrooms/" component={MyRooms} />
+                        <Route exact path="/homerooms/:id/" component={Dept} />
                         <Route
                             exact
                             path="/password/reset/"
@@ -67,19 +70,48 @@ function App() {
                             component={EmailConfirm}
                         />
 
-                        <Route
+                        {/* <Route
                             exact
                             path="/notifications"
                             component={Notifications}
+                        /> */}
+
+                        <Route
+                            exact
+                            path="/simulation"
+                            component={Simulations}
+                        />
+
+                        <Route
+                            exact
+                            path="/simulation/biology/"
+                            component={BiologySimulations}
+                        />
+
+                        <Route
+                            exact
+                            path="/simulation/biology/cell/simulation/"
+                            component={CellSimulation}
+                        />
+
+                        <Route
+                            exact
+                            path="/simulation/physics/"
+                            component={PhysicsSimulations}
+                        />
+
+                        <Route
+                            exact
+                            path="/simulation/chemistry/"
+                            component={ChemistrySimulations}
                         />
 
                         <Route component={NotFound} />
                     </Switch>
                     <CreateCourse />
                 </AuthenticationContextProvider>
             </SettingsContextProvider>
-            {/* <FooterPage /> */}
-            {/* <Footer /> */}
+            <Footer />
         </Router>
     );
 }

frontend/src/Simulations/BiologySimulations.js

@@ -0,0 +1,79 @@
+import React from "react";
+import { Button, Card, Col, Container, Row } from "react-bootstrap";
+import { Link } from "react-router-dom";
+
+const BiologySimulations = (props) => {
+    return (
+        <Container className="mt-7">
+            <Row>
+                <Col>
+                    <Card>
+                        <Card.Img
+                            variant="top"
+                            src="/static/img/Simulations/CellSimulation.jpg"
+                        />
+                        <Card.Body>
+                            <Card.Title>Cell Simulation</Card.Title>
+                            <Card.Text>
+                                The cell is the basic structural, functional,
+                                and biological unit of all known organisms. A
+                                cell is the smallest unit of life. Cells are
+                                often called the "building blocks of life". The
+                                study of cells is called cell biology.
+                            </Card.Text>
+                            <Button
+                                variant="primary"
+                                as={Link}
+                                to="/simulation/biology/cell/simulation/"
+                            >
+                                Show Simulations
+                            </Button>
+                        </Card.Body>
+                    </Card>
+                </Col>
+
+                <Col>
+                    <Card>
+                        <Card.Img
+                            variant="top"
+                            src="/static/img/Coming_Soon.jpg"
+                        />
+                        <Card.Body>
+                            <Card.Title>Coming Soon</Card.Title>
+                            <Card.Text>
+                                Cras cursus magna libero, eu viverra augue
+                                feugiat eget. In hac habitasse platea dictumst.
+                                Etiam ut sem vel magna aliquet maximus. Sed
+                                pulvinar tellus turpis, pharetra porta ligula
+                                dictum ut.
+                            </Card.Text>
+                            <Button disabled variant="primary">Show Simulations</Button>
+                        </Card.Body>
+                    </Card>
+                </Col>
+
+                <Col>
+                    <Card>
+                        <Card.Img
+                            variant="top"
+                            src="/static/img/Coming_Soon.jpg"
+                        />
+                        <Card.Body>
+                            <Card.Title>Coming Soon</Card.Title>
+                            <Card.Text>
+                                Cras cursus magna libero, eu viverra augue
+                                feugiat eget. In hac habitasse platea dictumst.
+                                Etiam ut sem vel magna aliquet maximus. Sed
+                                pulvinar tellus turpis, pharetra porta ligula
+                                dictum ut.
+                            </Card.Text>
+                            <Button disabled variant="primary">Show Simulations</Button>
+                        </Card.Body>
+                    </Card>
+                </Col>
+            </Row>
+        </Container>
+    );
+};
+
+export default BiologySimulations;