liqd · MarvMa · Jun 19, 2024 · Jul 7, 2024 · Jul 7, 2024 · Jul 7, 2024
diff --git a/.dockerignore b/.dockerignore
@@ -0,0 +1 @@
+node_modules
diff --git a/.stylelintrc.json b/.stylelintrc.json
@@ -1,13 +1,7 @@
 {
-  "extends": [
-    "stylelint-config-standard-scss"
-  ],
-  "ignoreFiles": [
-    "**/_variables.scss"
-  ],
-  "plugins": [
-    "stylelint-declaration-strict-value"
-  ],
+  "extends": ["stylelint-config-standard-scss"],
+  "ignoreFiles": ["**/_variables.scss", "**/*.html"],
+  "plugins": ["stylelint-declaration-strict-value"],
   "rules": {
     "font-family-name-quotes": "always-unless-keyword",
 
@@ -29,26 +23,28 @@
     "alpha-value-notation": null,
     "color-function-notation": null,
 
-    "at-rule-empty-line-before": [ "always", {
-      "except": ["first-nested"],
-      "ignore": [
-        "blockless-after-blockless",
-        "after-comment"
-      ]
-    }],
-    "at-rule-no-unknown": [ true, {
-      "ignoreAtRules": [
-        "extend",
-        "include",
-        "mixin"
-      ]
-    }],
+    "at-rule-empty-line-before": [
+      "always",
+      {
+        "except": ["first-nested"],
+        "ignore": ["blockless-after-blockless", "after-comment"]
+      }
+    ],
+    "at-rule-no-unknown": [
+      true,
+      {
+        "ignoreAtRules": ["extend", "include", "mixin"]
+      }
+    ],
 
     "max-nesting-depth": 2,
 
-    "scale-unlimited/declaration-strict-value": ["/color/", {
-      "ignoreKeywords": ["inherit", "transparent"]
-    }],
+    "scale-unlimited/declaration-strict-value": [
+      "/color/",
+      {
+        "ignoreKeywords": ["inherit", "transparent"]
+      }
+    ],
 
     "declaration-empty-line-before": null
   }

diff --git a/Dockerfile b/Dockerfile
@@ -0,0 +1,48 @@
+# Use the official Python image as the base image
+FROM python:3.10-slim
+
+# Set environment variables
+ENV PYTHONUNBUFFERED 1
+ENV DATABASE sqlite
+
+# Install system dependencies
+RUN apt-get update && \
+    apt-get install -y build-essential libpq-dev sqlite3 nodejs npm redis-server libmagic1 && \
+    apt-get clean && \
+    rm -rf /var/lib/apt/lists/*
+
+# Create and set the working directory
+WORKDIR /adhocracy-plus
+
+# Copy the requirements file
+COPY requirements.txt .
+COPY /requirements /adhocracy-plus/requirements
+
+# Create a virtual environment and install Python dependencies
+RUN python -m venv /adhocracy-plus/venv && \
+    /bin/bash -c "source /adhocracy-plus/venv/bin/activate && pip install --upgrade pip && pip install -r requirements.txt"
+
+# Copy the rest of the application code
+COPY . .
+
+# Create a non-root user and set permissions
+RUN useradd -ms /bin/bash appuser && \
+    chown -R appuser:appuser /adhocracy-plus
+
+RUN chmod +x /adhocracy-plus/entrypoint.sh
+
+# Switch to the non-root user
+USER appuser
+
+# Install Node.js dependencies
+RUN npm install
+
+# Set up the database
+RUN /bin/bash -c "source /adhocracy-plus/venv/bin/activate && make install && make fixtures"
+
+RUN ls /adhocracy-plus
+# Expose the application port
+EXPOSE 8004
+
+# Set the entry point for the container
+ENTRYPOINT ["/adhocracy-plus/entrypoint.sh"]
diff --git a/Makefile b/Makefile
@@ -58,7 +58,6 @@ help:
 .PHONY: install
 install:
 	npm install --no-save
-	npm run build
 	if [ ! -f $(VIRTUAL_ENV)/bin/python3 ]; then python3 -m venv $(VIRTUAL_ENV); fi
 	$(VIRTUAL_ENV)/bin/python -m pip install --upgrade -r requirements/dev.txt
 	$(VIRTUAL_ENV)/bin/python manage.py migrate
@@ -83,7 +82,7 @@ server:
 watch:
 	trap 'kill %1' KILL; \
 	npm run watch & \
-	$(VIRTUAL_ENV)/bin/python manage.py runserver 8004
+	$(VIRTUAL_ENV)/bin/python manage.py runserver 0.0.0.0:8004
 
 .PHONY: background
 background:

diff --git a/adhocracy-plus/config/settings/base.py b/adhocracy-plus/config/settings/base.py
@@ -89,6 +89,7 @@
     "adhocracy4.reports",
     "adhocracy4.rules",
     # General components that define models or helpers
+    "apps.arpas",
     "apps.actions",
     "apps.captcha",
     "apps.contrib",
@@ -539,6 +540,7 @@
     ("IE", _("interactive event")),
     ("TP", _("prioritization")),
     ("DB", _("debate")),
+    ("AR", _("arpas")),
 ]
 
 A4_MAP_BASEURL = "https://{s}.tile.openstreetmap.org/"

diff --git a/apps/arpas/__init__.py b/apps/arpas/__init__.py
diff --git a/apps/arpas/api.py b/apps/arpas/api.py
diff --git a/apps/arpas/apps.py b/apps/arpas/apps.py
@@ -0,0 +1,6 @@
+from django.apps import AppConfig
+
+
+class Config(AppConfig):
+    name = "apps.arpas"
+    label = "a4_candy_arpas"
diff --git a/apps/arpas/assets/Objects.tsx b/apps/arpas/assets/Objects.tsx
@@ -0,0 +1,25 @@
+import React from "react";
+import { useDraftStorage } from "./storage";
+import { Gltf } from "@react-three/drei";
+
+function Objects() {
+  const { draft, setDraft } = useDraftStorage();
+
+  console.log(JSON.stringify(draft, null, 2));
+
+  return (
+    <>
+      {draft.objects.map((object, index) => (
+        <Gltf
+          key={index}
+          src={object.url}
+          position={object.position}
+          scale={object.scale}
+          rotation={object.rotation}
+        />
+      ))}
+    </>
+  );
+}
+
+export default Objects;
diff --git a/apps/arpas/assets/Prototype.tsx b/apps/arpas/assets/Prototype.tsx
@@ -0,0 +1,57 @@
+import {
+    VRButton,
+    ARButton,
+    XR,
+    Controllers,
+    Hands,
+    RayGrab,
+    Interactive,
+    useXR,
+} from "@react-three/xr";
+import { Canvas } from "@react-three/fiber";
+import { Text, Gltf, Clouds, Cloud } from "@react-three/drei";
+import * as THREE from "three";
+
+import React from "react";
+import { DraftStorageProvider } from "./storage";
+import ObjectSelector from "./objectEdit/ObjectSelector";
+import PlaceObject from "./objectEdit/PlaceObject";
+import Objects from "./Objects";
+
+function Prototype() {
+    return (
+        <div
+            style={{
+                height: "30vh",
+                width: "100%",
+                position: "relative",
+            }}
+        >
+            <DraftStorageProvider>
+                <ObjectSelector />
+
+                <ARButton />
+                <Canvas
+                    style={{
+                        height: "100%",
+                        width: "100%",
+                    }}
+                    dpr={[1, 2]}
+                    gl={{ antialias: true }}
+                >
+                    <XR>
+                        <ambientLight />
+
+                        <Controllers />
+                        <Hands />
+
+                        <PlaceObject />
+                        <Objects />
+                    </XR>
+                </Canvas>
+            </DraftStorageProvider>
+        </div>
+    );
+}
+
+export default Prototype;
diff --git a/apps/arpas/assets/objectEdit/ObjectDemo.tsx b/apps/arpas/assets/objectEdit/ObjectDemo.tsx
@@ -0,0 +1,50 @@
+import React, { Suspense, useEffect, useRef } from "react";
+import { Canvas, useFrame } from "@react-three/fiber";
+import { OrbitControls, useGLTF, Box, Gltf } from "@react-three/drei";
+import * as THREE from "three";
+
+const SpinningModel = ({ url }: { url: string }) => {
+  const modelRef = useRef<THREE.Group>();
+  const { scene } = useGLTF(url);
+  const [scale, setScale] = React.useState(1);
+
+  useEffect(() => {
+    if (modelRef.current && scale === 1) {
+      const box = new THREE.Box3().setFromObject(scene);
+      const size = new THREE.Vector3();
+      box.getSize(size);
+      const maxDim = Math.max(size.x, size.y, size.z);
+      const desiredSize = 3;
+      const scale = desiredSize / maxDim;
+      setScale(scale);
+    }
+  }, [scale, scene]);
+
+  useFrame(() => {
+    if (modelRef.current) {
+      modelRef.current.rotation.y += 0.01; // Adjust the speed of rotation here
+    }
+  });
+
+  return (
+    <group scale={[scale, scale, scale]}>
+      <primitive object={scene} ref={modelRef} />
+    </group>
+  );
+};
+
+function ObjectDemo({ url }: { url: string }) {
+  return (
+    <Canvas>
+      <ambientLight intensity={0.5} />
+      <spotLight position={[10, 10, 10]} angle={0.15} penumbra={1} />
+      <pointLight position={[-10, -10, -10]} />
+      <Suspense fallback={null}>
+        <SpinningModel url={url} />
+      </Suspense>
+      <OrbitControls />
+    </Canvas>
+  );
+}
+
+export default ObjectDemo;
diff --git a/apps/arpas/assets/objectEdit/ObjectSelector.tsx b/apps/arpas/assets/objectEdit/ObjectSelector.tsx
@@ -0,0 +1,63 @@
+import React from "react";
+import { Plus, X } from "lucide-react";
+import { OBJECTS, useDraftStorage } from "../storage";
+import ObjectDemo from "./ObjectDemo";
+
+function ObjectSelector() {
+    const { draft, setDraft } = useDraftStorage();
+    const [isOpen, setIsOpen] = React.useState(false);
+
+    return (
+        <>
+            {draft.placeObjectUrl ? (
+                <button
+                    className="btn"
+                    style={{ zIndex: 9999 }}
+                     => {
+                        setDraft({
+                            ...draft,
+                            placeObjectUrl: undefined,
+                        });
+                    }}
+                >
+                    <X size={24} />
+                </button>
+            ) : (
+                <></>
+                // <Drawer open={isOpen} >
+                //   <DrawerTrigger asChild>
+                //     <Button className="fixed bottom-4 right-4" style={{ zIndex: 9999 }}>
+                //       <Plus size={24} />
+                //     </Button>
+                //   </DrawerTrigger>
+
+                //   <DrawerContent>
+                //     <DrawerHeader>
+                //       <DrawerTitle>Objekt hinzufügen</DrawerTitle>
+                //     </DrawerHeader>
+
+                //     <div className="grid grid-cols-3 gap-3 mb-12">
+                //       {OBJECTS.map((object, index) => (
+                //         <button
+                //           key={index}
+                //           className="cursor-pointer w-full h-32"
+                //            => {
+                //             setDraft({
+                //               ...draft,
+                //               placeObjectUrl: object.url,
+                //             });
+                //             setIsOpen(false);
+                //           }}
+                //         >
+                //           <ObjectDemo url={object.url} />
+                //         </button>
+                //       ))}
+                //     </div>
+                //   </DrawerContent>
+                // </Drawer>
+            )}
+        </>
+    );
+}
+
+export default ObjectSelector;