diff --git a/.gitignore b/.gitignore index 9bb272d..a99a6b7 100644 --- a/.gitignore +++ b/.gitignore @@ -1,5 +1,7 @@ .venv/ files/* +postgres_data/* +export_images/* .vscode/ __pycache__/ poetry.lock diff --git a/back/back/settings.py b/back/back/settings.py index 99a1237..f478979 100644 --- a/back/back/settings.py +++ b/back/back/settings.py @@ -79,11 +79,12 @@ INSTALLED_APPS = [ "django.contrib.staticfiles", "corsheaders", "django_filters", - 'django_extensions', + "django_extensions", "rest_framework", "crispy_forms", "crispy_bootstrap4", "colorfield", + "import_export", "frontImages", "object", ] @@ -125,14 +126,12 @@ WSGI_APPLICATION = "back.wsgi.application" DATABASES = { "default": { - "ENGINE": "django.db.backends.postgresql_psycopg2", # change engine to this - "NAME": "interactive_table", # db name you created above - "HOST": os.getenv("DB_HOST"), # usually localhost - "USER": os.getenv("DB_USER"), # db user you created above or postgres default - "PASSWORD": os.getenv( - "DB_PASSWORD" - ), # db password you created above or postgres - "PORT": os.getenv("DB_PORT"), # usually 5432 + "ENGINE": "django.db.backends.postgresql_psycopg2", + "NAME": os.getenv("POSTGRES_NAME"), + "HOST": os.getenv("POSTGRES_HOST"), + "USER": os.getenv("POSTGRES_USER"), + "PASSWORD": os.getenv("POSTGRES_PASSWORD"), + "PORT": os.getenv("POSTGRES_PORT"), } } @@ -178,12 +177,14 @@ STATIC_URL = "static/" REST_FRAMEWORK = { - 'DEFAULT_FILTER_BACKENDS': ['django_filters.rest_framework.DjangoFilterBackend'] + "DEFAULT_FILTER_BACKENDS": ["django_filters.rest_framework.DjangoFilterBackend"] } CRISPY_ALLOWED_TEMPLATE_PACKS = "bootstrap4" CRISPY_TEMPLATE_PACK = "bootstrap4" +IMPORT_EXPORT_USE_TRANSACTIONS = True + DEFAULT_AUTO_FIELD = "django.db.models.BigAutoField" LOGGING = { "version": 1, diff --git a/back/frontImages/admin.py b/back/frontImages/admin.py index 0c53113..e5592be 100644 --- a/back/frontImages/admin.py +++ b/back/frontImages/admin.py @@ -1,9 +1,13 @@ from django.contrib import admin +from import_export.admin import ImportExportModelAdmin from .models import Image, Item -class ItemAdmin(admin.ModelAdmin): +class ItemAdmin(ImportExportModelAdmin, admin.ModelAdmin): filter_horizontal = ("images",) + +class ImportExportBtnAdmin(ImportExportModelAdmin, admin.ModelAdmin): + pass -admin.site.register(Image) +admin.site.register(Image, ImportExportModelAdmin) admin.site.register(Item, ItemAdmin) diff --git a/back/object/admin.py b/back/object/admin.py index 1bad528..c39d1a8 100644 --- a/back/object/admin.py +++ b/back/object/admin.py @@ -1,12 +1,15 @@ from django.contrib import admin +from import_export.admin import ImportExportModelAdmin from .models import ClickableArea, Element3D, Environment, Scene3D -class Scene3DAdmin(admin.ModelAdmin): +class Scene3DAdmin(ImportExportModelAdmin, admin.ModelAdmin): filter_horizontal = ("elements",) +class ImportExportBtnAdmin(ImportExportModelAdmin, admin.ModelAdmin): + pass -admin.site.register(Environment) +admin.site.register(Environment, ImportExportBtnAdmin) admin.site.register(Scene3D, Scene3DAdmin) -admin.site.register(Element3D) -admin.site.register(ClickableArea) +admin.site.register(Element3D, ImportExportBtnAdmin) +admin.site.register(ClickableArea, ImportExportBtnAdmin) diff --git a/back/object/models.py b/back/object/models.py index c6e82b0..e80e3e0 100644 --- a/back/object/models.py +++ b/back/object/models.py @@ -16,13 +16,8 @@ def group_based_upload_to(instance, filename): class Environment(models.Model): - env_displacementmap = models.FileField( - upload_to=group_based_upload_to, blank=True, null=True - ) - env_normalmap = models.FileField( - upload_to=group_based_upload_to, blank=True, null=True - ) clear_color = ColorField(blank=True, null=True) + clear_color_to = ColorField(blank=True, null=True) hdr_gainmap = models.FileField( upload_to=group_based_upload_to, blank=True, null=True ) @@ -36,7 +31,7 @@ class Element3D(models.Model): description = models.TextField(blank=True, null=True) is_enabled = models.BooleanField(default=True) can_not_disable = models.BooleanField(default=False) - + x_pos = models.IntegerField(default=0) y_pos = models.IntegerField(default=0) z_pos = models.IntegerField(default=0) @@ -47,6 +42,7 @@ class Element3D(models.Model): class Scene3D(models.Model): name = models.CharField(max_length=120) + description = models.TextField(blank=True, null=True) elements = models.ManyToManyField(Element3D) env = models.ForeignKey(Environment, models.RESTRICT, blank=True, null=True) @@ -73,33 +69,33 @@ def maximum_size_validator(image): class ClickableArea(models.Model): - name = models.CharField("название", max_length=255) - description = models.TextField("описание") - object_name = models.CharField("название объекта", max_length=255) - target_name = models.CharField( - max_length=200, - blank=True, - null=True, + name = models.CharField( + "Название", + max_length=255, + help_text="Название кликабельной области", ) + description = models.TextField( + "Описание", + help_text="Описание кликабельной области", + ) + target = models.ForeignKey( Scene3D, on_delete=models.PROTECT, related_name="clickable_areas", blank=True, null=True, + help_text="На какую сцену ведет клик", ) source = models.ForeignKey( Element3D, on_delete=models.PROTECT, + help_text="В каком элементе искать object_name", ) - image = models.ImageField( - "Картинка", - upload_to=group_based_upload_to, - validators=[ - maximum_size_validator, - ], - blank=True, - null=True, + object_name = models.CharField( + "Название объекта", + max_length=255, + help_text="Имя mesh или group в элементе 3D", ) def __str__(self): diff --git a/back/object/serializers.py b/back/object/serializers.py index ec50e36..f623ac6 100644 --- a/back/object/serializers.py +++ b/back/object/serializers.py @@ -6,8 +6,6 @@ class EnvironmentSerializer(serializers.ModelSerializer): hdr_gainmap = serializers.FileField(use_url=False) hdr_json = serializers.FileField(use_url=False) hdr_webp = serializers.FileField(use_url=False) - env_displacementmap = serializers.FileField(use_url=False) - env_normalmap = serializers.FileField(use_url=False) class Meta: model = Environment @@ -33,8 +31,6 @@ class Scene3DSerializer(serializers.ModelSerializer): class ClickableAreaSerializer(serializers.ModelSerializer): - image = serializers.ImageField(use_url=False) - class Meta: model = ClickableArea fields = "__all__" diff --git a/back/requirements.txt b/back/requirements.txt index 763f30d..d0bce67 100644 --- a/back/requirements.txt +++ b/back/requirements.txt @@ -1,11 +1,13 @@ asgiref==3.8.1 ; python_version >= "3.10" and python_version < "4.0" colorama==0.4.6 ; python_version >= "3.10" and python_version < "4.0" crispy-bootstrap4==2024.1 ; python_version >= "3.10" and python_version < "4.0" +diff-match-patch==20230430 ; python_version >= "3.10" and python_version < "4.0" django-colorfield==0.11.0 ; python_version >= "3.10" and python_version < "4.0" django-cors-headers==4.3.1 ; python_version >= "3.10" and python_version < "4.0" django-crispy-forms==2.2 ; python_version >= "3.10" and python_version < "4.0" django-extensions==3.2.3 ; python_version >= "3.10" and python_version < "4.0" django-filter==24.2 ; python_version >= "3.10" and python_version < "4.0" +django-import-export==4.1.1 ; python_version >= "3.10" and python_version < "4.0" django==5.0.6 ; python_version >= "3.10" and python_version < "4.0" djangorestframework==3.15.1 ; python_version >= "3.10" and python_version < "4.0" mslex==1.2.0 ; python_version >= "3.10" and python_version < "4.0" and sys_platform == "win32" @@ -14,6 +16,7 @@ psutil==5.9.8 ; python_version >= "3.10" and python_version < "4.0" psycopg2==2.9.9 ; python_version >= "3.10" and python_version < "4.0" python-dotenv==1.0.1 ; python_version >= "3.10" and python_version < "4.0" sqlparse==0.5.0 ; python_version >= "3.10" and python_version < "4.0" +tablib==3.5.0 ; python_version >= "3.10" and python_version < "4.0" taskipy==1.12.2 ; python_version >= "3.10" and python_version < "4.0" tomli==2.0.1 ; python_version >= "3.10" and python_version < "4.0" typing-extensions==4.11.0 ; python_version >= "3.10" and python_version < "3.11" diff --git a/docker-compose.yml b/docker-compose.yml index bc6d1a4..2a12f7e 100644 --- a/docker-compose.yml +++ b/docker-compose.yml @@ -1,10 +1,32 @@ services: + db: + image: postgres:16 + restart: always + env_file: + - .env + environment: + PGDATA: /var/lib/postgresql/data/pgdata + POSTGRES_DB: inttable + ports: + - 5433:5432 + volumes: + - ./postgres_data:/var/lib/postgresql/data + networks: + - dev + healthcheck: + test: pg_isready -d $$POSTGRES_DB -U $$POSTGRES_USER + start_period: 5s + interval: 5s + timeout: 5s + retries: 10 + back: build: context: ./back dockerfile: Dockerfile - container_name: inttable-back restart: always + env_file: + - ./.env expose: - "8000" healthcheck: @@ -12,19 +34,16 @@ services: interval: 5s timeout: 3s retries: 10 - privileged: true volumes: - ./.env:/app/.env - ./files:/app/files networks: - # - network - dev front: build: context: ./front dockerfile: Dockerfile - container_name: inttable-front restart: always expose: - "4173" @@ -32,15 +51,13 @@ services: back: condition: service_healthy networks: - # - network - dev nginx: image: nginx:1.25 - container_name: inttable-nginx restart: always ports: - - "8098:80" + - "${WEB_PORT:-80}:80" depends_on: back: condition: service_healthy @@ -51,7 +68,6 @@ services: - ./nginx/nginx.conf:/etc/nginx/nginx.conf - ./nginx/conf.d:/etc/nginx/conf.d networks: - # - network - dev networks: diff --git a/front/.env.development b/front/.env.development index 099ac37..24192be 100644 --- a/front/.env.development +++ b/front/.env.development @@ -1,4 +1,4 @@ VITE_SERVER_URL='https://demo.kustarshina.ru' VITE_IMAGE_URL='https://demo.kustarshina.ru' VITE_SERVER_URL='https://demo.kustarshina.ru' -VITE_SERVER_URL='http://localhost:8000' \ No newline at end of file +# VITE_SERVER_URL='http://localhost:8000' \ No newline at end of file diff --git a/front/components.d.ts b/front/components.d.ts index b98dda4..b8680fa 100644 --- a/front/components.d.ts +++ b/front/components.d.ts @@ -10,24 +10,41 @@ declare module 'vue' { Composer: typeof import('./src/components/Promo/composer.vue')['default'] Env: typeof import('./src/components/Promo/env.vue')['default'] Floorplan: typeof import('./src/components/Floorplan/index.vue')['default'] - Gallery: typeof import('./src/components/Promo/gallery.vue')['default'] + Gallery: typeof import('./src/components/Gallery/index.vue')['default'] Game: typeof import('./src/components/Game.vue')['default'] Home: typeof import('./src/components/Home.vue')['default'] + IIconMdiHomeOutline: typeof import('~icons/ic/on-mdi-home-outline')['default'] + IIconParkSolidLeftC: typeof import('~icons/icon-park-solid/left-c')['default'] + 'IMdi:arrowLeft': typeof import('~icons/mdi/arrow-left')['default'] + 'IMdi:arrowRight': typeof import('~icons/mdi/arrow-right')['default'] + 'IMdi:vectorArrangeBelow': typeof import('~icons/mdi/vector-arrange-below')['default'] + 'IMdi:video3d': typeof import('~icons/mdi/video3d')['default'] IMdiArrowRight: typeof import('~icons/mdi/arrow-right')['default'] IMdiChevronLeft: typeof import('~icons/mdi/chevron-left')['default'] IMdiClose: typeof import('~icons/mdi/close')['default'] IMdiFile: typeof import('~icons/mdi/file')['default'] IMdiHexagonOutline: typeof import('~icons/mdi/hexagon-outline')['default'] IMdiHome: typeof import('~icons/mdi/home')['default'] + IMdiHomeOutline: typeof import('~icons/mdi/home-outline')['default'] + IMdiMinusCircle: typeof import('~icons/mdi/minus-circle')['default'] IMdiMonitorScreenshot: typeof import('~icons/mdi/monitor-screenshot')['default'] IMdiPagePreviousOutline: typeof import('~icons/mdi/page-previous-outline')['default'] + IMdiPlusCircle: typeof import('~icons/mdi/plus-circle')['default'] IMdiShop: typeof import('~icons/mdi/shop')['default'] IMdiVideo3d: typeof import('~icons/mdi/video3d')['default'] - Item: typeof import('./src/components/Promo/item.vue')['default'] + Item: typeof import('./src/components/Gallery/item.vue')['default'] + IUilAngleLeft: typeof import('~icons/uil/angle-left')['default'] + IUilAngleLeftB: typeof import('~icons/uil/angle-left-b')['default'] + IUilAngleRightB: typeof import('~icons/uil/angle-right-b')['default'] + IUilCompressArrows: typeof import('~icons/uil/compress-arrows')['default'] + IUilTimes: typeof import('~icons/uil/times')['default'] + Load: typeof import('./src/components/load.vue')['default'] Load_models: typeof import('./src/components/Promo/load_models.vue')['default'] - Main: typeof import('./src/components/Promo/main.vue')['default'] + Main: typeof import('./src/components/Main/index.vue')['default'] + Main_load_models: typeof import('./src/components/Main/main_load_models.vue')['default'] ModelItem: typeof import('./src/components/Promo/modelItem.vue')['default'] Models: typeof import('./src/components/Promo/models.vue')['default'] + Nav: typeof import('./src/components/nav.vue')['default'] Post_pocessing: typeof import('./src/components/Promo/post_pocessing.vue')['default'] Post_processing: typeof import('./src/components/Promo/post_processing.vue')['default'] Projects: typeof import('./src/components/Projects.vue')['default'] @@ -35,6 +52,6 @@ declare module 'vue' { RandomIcon: typeof import('./src/components/RandomIcon.vue')['default'] RouterLink: typeof import('vue-router')['RouterLink'] RouterView: typeof import('vue-router')['RouterView'] - Sidebar: typeof import('./src/components/Promo/sidebar.vue')['default'] + Sidebar: typeof import('./src/components/sidebar.vue')['default'] } } diff --git a/front/index.html b/front/index.html index 8c7abe7..2510e06 100644 --- a/front/index.html +++ b/front/index.html @@ -1,8 +1,8 @@ - + - + Проекты Кустарщины diff --git a/front/package-lock.json b/front/package-lock.json index 14fecb6..dd8b980 100644 --- a/front/package-lock.json +++ b/front/package-lock.json @@ -9,21 +9,25 @@ "version": "0.0.0", "dependencies": { "@fireworks-js/vue": "^2.10.7", + "@iconify-json/icon-park": "^1.1.14", + "@iconify-json/icon-park-solid": "^1.1.15", + "@iconify-json/uil": "^1.2.0", + "@iconify/vue": "^4.1.2", "@monogrid/gainmap-js": "^3.0.5", "@tresjs/cientos": "^3.9.0", - "@tresjs/core": "^4.0.2", + "@tresjs/core": "^4.2.9", "@tresjs/leches": "^0.14.0", "@tresjs/post-processing": "^0.7.1", "@vueuse/components": "^10.9.0", "@vueuse/core": "^10.9.0", "d3": "^7.9.0", + "maath": "^0.10.8", "pathfinding": "^0.4.18", "pinia": "^2.1.7", "reset-css": "^5.0.2", "three": "^0.164.1", "vite-svg-loader": "^5.1.0", "vue": "^3.4.21", - "vue-3d-model": "^2.0.0-alpha.4", "vue-router": "^4.3.2" }, "devDependencies": { @@ -435,6 +439,24 @@ "vue": ">=3.0.0" } }, + "node_modules/@iconify-json/icon-park": { + "version": "1.1.14", + "resolved": "https://registry.npmjs.org/@iconify-json/icon-park/-/icon-park-1.1.14.tgz", + "integrity": "sha512-D/Tyww0fPhEwLqeQuzKMxE4HKjWsCG8TPRZsUIgjGh1qBOI3Ad9G5y0mQi4mLBtHrdCPdfbCz2oZJHxPoLyScA==", + "license": "Apache-2.0", + "dependencies": { + "@iconify/types": "*" + } + }, + "node_modules/@iconify-json/icon-park-solid": { + "version": "1.1.15", + "resolved": "https://registry.npmjs.org/@iconify-json/icon-park-solid/-/icon-park-solid-1.1.15.tgz", + "integrity": "sha512-fFuDj5H8+x/V2hzknhpBifFBIOVP/sm2ElGQ0M1W4d0EQ5f7Pss1v7tfmDSQR2F6eISKDjuA2yyT7fF/C366Hw==", + "license": "Apache-2.0", + "dependencies": { + "@iconify/types": "*" + } + }, "node_modules/@iconify-json/mdi": { "version": "1.1.66", "resolved": "https://registry.npmjs.org/@iconify-json/mdi/-/mdi-1.1.66.tgz", @@ -444,11 +466,19 @@ "@iconify/types": "*" } }, + "node_modules/@iconify-json/uil": { + "version": "1.2.0", + "resolved": "https://registry.npmjs.org/@iconify-json/uil/-/uil-1.2.0.tgz", + "integrity": "sha512-DFhJYbp/H2BGQ2oBS0DmqhvgkdUXpBTgCErhqwLEeRhkt8+MuTKlivpQf/gPgD5/6wHH37gPX4BhlqU4eH372w==", + "license": "Apache-2.0", + "dependencies": { + "@iconify/types": "*" + } + }, "node_modules/@iconify/types": { "version": "2.0.0", "resolved": "https://registry.npmjs.org/@iconify/types/-/types-2.0.0.tgz", - "integrity": "sha512-+wluvCrRhXrhyOmRDJ3q8mux9JkKy5SJ/v8ol2tu4FVjyYvtEzkc/3pK15ET6RKg4b4w4BmTk1+gsCUhf21Ykg==", - "dev": true + "integrity": "sha512-+wluvCrRhXrhyOmRDJ3q8mux9JkKy5SJ/v8ol2tu4FVjyYvtEzkc/3pK15ET6RKg4b4w4BmTk1+gsCUhf21Ykg==" }, "node_modules/@iconify/utils": { "version": "2.1.23", @@ -478,6 +508,21 @@ "url": "https://github.com/sponsors/antfu" } }, + "node_modules/@iconify/vue": { + "version": "4.1.2", + "resolved": "https://registry.npmjs.org/@iconify/vue/-/vue-4.1.2.tgz", + "integrity": "sha512-CQnYqLiQD5LOAaXhBrmj1mdL2/NCJvwcC4jtW2Z8ukhThiFkLDkutarTOV2trfc9EXqUqRs0KqXOL9pZ/IyysA==", + "license": "MIT", + "dependencies": { + "@iconify/types": "^2.0.0" + }, + "funding": { + "url": "https://github.com/sponsors/cyberalien" + }, + "peerDependencies": { + "vue": ">=3" + } + }, "node_modules/@jridgewell/sourcemap-codec": { "version": "1.4.15", "resolved": "https://registry.npmjs.org/@jridgewell/sourcemap-codec/-/sourcemap-codec-1.4.15.tgz", @@ -793,13 +838,14 @@ } }, "node_modules/@tresjs/core": { - "version": "4.0.2", - "resolved": "https://registry.npmjs.org/@tresjs/core/-/core-4.0.2.tgz", - "integrity": "sha512-+Shy5ch4m9gQSHRlArZAn4nv2apaFJJv21bAvpOKRXTCtGu0BakKGUpWcTzzmDsTs9t6yndbjCWzyifggjFpQQ==", + "version": "4.2.9", + "resolved": "https://registry.npmjs.org/@tresjs/core/-/core-4.2.9.tgz", + "integrity": "sha512-e5RIRSlIOtrIHBZr4t/5bQ0v+egzDkojENaLOPELJ2TxwJAs33QJUfPTkPPVXc0gSDHzH47qFHqUCGIQ/LYG3w==", + "license": "MIT", "dependencies": { "@alvarosabu/utils": "^3.2.0", - "@vue/devtools-api": "^6.6.2", - "@vueuse/core": "^10.10.0" + "@vue/devtools-api": "^6.6.3", + "@vueuse/core": "^10.11.0" }, "peerDependencies": { "three": ">=0.133", @@ -807,24 +853,26 @@ } }, "node_modules/@tresjs/core/node_modules/@vueuse/core": { - "version": "10.10.0", - "resolved": "https://registry.npmjs.org/@vueuse/core/-/core-10.10.0.tgz", - "integrity": "sha512-vexJ/YXYs2S42B783rI95lMt3GzEwkxzC8Hb0Ndpd8rD+p+Lk/Za4bd797Ym7yq4jXqdSyj3JLChunF/vyYjUw==", + "version": "10.11.1", + "resolved": "https://registry.npmjs.org/@vueuse/core/-/core-10.11.1.tgz", + "integrity": "sha512-guoy26JQktXPcz+0n3GukWIy/JDNKti9v6VEMu6kV2sYBsWuGiTU8OWdg+ADfUbHg3/3DlqySDe7JmdHrktiww==", + "license": "MIT", "dependencies": { "@types/web-bluetooth": "^0.0.20", - "@vueuse/metadata": "10.10.0", - "@vueuse/shared": "10.10.0", - "vue-demi": ">=0.14.7" + "@vueuse/metadata": "10.11.1", + "@vueuse/shared": "10.11.1", + "vue-demi": ">=0.14.8" }, "funding": { "url": "https://github.com/sponsors/antfu" } }, "node_modules/@tresjs/core/node_modules/@vueuse/core/node_modules/vue-demi": { - "version": "0.14.8", - "resolved": "https://registry.npmjs.org/vue-demi/-/vue-demi-0.14.8.tgz", - "integrity": "sha512-Uuqnk9YE9SsWeReYqK2alDI5YzciATE0r2SkA6iMAtuXvNTMNACJLJEXNXaEy94ECuBe4Sk6RzRU80kjdbIo1Q==", + "version": "0.14.10", + "resolved": "https://registry.npmjs.org/vue-demi/-/vue-demi-0.14.10.tgz", + "integrity": "sha512-nMZBOwuzabUO0nLgIcc6rycZEebF6eeUfaiQx9+WSk8e29IbLvPU9feI6tqW4kTo3hvoYAJkMh8n8D0fuISphg==", "hasInstallScript": true, + "license": "MIT", "bin": { "vue-demi-fix": "bin/vue-demi-fix.js", "vue-demi-switch": "bin/vue-demi-switch.js" @@ -846,29 +894,32 @@ } }, "node_modules/@tresjs/core/node_modules/@vueuse/metadata": { - "version": "10.10.0", - "resolved": "https://registry.npmjs.org/@vueuse/metadata/-/metadata-10.10.0.tgz", - "integrity": "sha512-UNAo2sTCAW5ge6OErPEHb5z7NEAg3XcO9Cj7OK45aZXfLLH1QkexDcZD77HBi5zvEiLOm1An+p/4b5K3Worpug==", + "version": "10.11.1", + "resolved": "https://registry.npmjs.org/@vueuse/metadata/-/metadata-10.11.1.tgz", + "integrity": "sha512-IGa5FXd003Ug1qAZmyE8wF3sJ81xGLSqTqtQ6jaVfkeZ4i5kS2mwQF61yhVqojRnenVew5PldLyRgvdl4YYuSw==", + "license": "MIT", "funding": { "url": "https://github.com/sponsors/antfu" } }, "node_modules/@tresjs/core/node_modules/@vueuse/shared": { - "version": "10.10.0", - "resolved": "https://registry.npmjs.org/@vueuse/shared/-/shared-10.10.0.tgz", - "integrity": "sha512-2aW33Ac0Uk0U+9yo3Ypg9s5KcR42cuehRWl7vnUHadQyFvCktseyxxEPBi1Eiq4D2yBGACOnqLZpx1eMc7g5Og==", + "version": "10.11.1", + "resolved": "https://registry.npmjs.org/@vueuse/shared/-/shared-10.11.1.tgz", + "integrity": "sha512-LHpC8711VFZlDaYUXEBbFBCQ7GS3dVU9mjOhhMhXP6txTV4EhYQg/KGnQuvt/sPAtoUKq7VVUnL6mVtFoL42sA==", + "license": "MIT", "dependencies": { - "vue-demi": ">=0.14.7" + "vue-demi": ">=0.14.8" }, "funding": { "url": "https://github.com/sponsors/antfu" } }, "node_modules/@tresjs/core/node_modules/@vueuse/shared/node_modules/vue-demi": { - "version": "0.14.8", - "resolved": "https://registry.npmjs.org/vue-demi/-/vue-demi-0.14.8.tgz", - "integrity": "sha512-Uuqnk9YE9SsWeReYqK2alDI5YzciATE0r2SkA6iMAtuXvNTMNACJLJEXNXaEy94ECuBe4Sk6RzRU80kjdbIo1Q==", + "version": "0.14.10", + "resolved": "https://registry.npmjs.org/vue-demi/-/vue-demi-0.14.10.tgz", + "integrity": "sha512-nMZBOwuzabUO0nLgIcc6rycZEebF6eeUfaiQx9+WSk8e29IbLvPU9feI6tqW4kTo3hvoYAJkMh8n8D0fuISphg==", "hasInstallScript": true, + "license": "MIT", "bin": { "vue-demi-fix": "bin/vue-demi-fix.js", "vue-demi-switch": "bin/vue-demi-switch.js" @@ -1242,7 +1293,6 @@ "version": "0.164.1", "resolved": "https://registry.npmjs.org/@types/three/-/three-0.164.1.tgz", "integrity": "sha512-dR/trWDhyaNqJV38rl1TonlCA9DpnX7OPYDWD81bmBGn/+uEc3+zNalFxQcV4FlPTeDBhCY3SFWKvK6EJwL88g==", - "dev": true, "dependencies": { "@tweenjs/tween.js": "~23.1.1", "@types/stats.js": "*", @@ -1283,31 +1333,32 @@ } }, "node_modules/@volar/language-core": { - "version": "2.2.0-alpha.10", - "resolved": "https://registry.npmjs.org/@volar/language-core/-/language-core-2.2.0-alpha.10.tgz", - "integrity": "sha512-njVJLtpu0zMvDaEk7K5q4BRpOgbyEUljU++un9TfJoJNhxG0z/hWwpwgTRImO42EKvwIxF3XUzeMk+qatAFy7Q==", + "version": "2.4.1", + "resolved": "https://registry.npmjs.org/@volar/language-core/-/language-core-2.4.1.tgz", + "integrity": "sha512-9AKhC7Qn2mQYxj7Dz3bVxeOk7gGJladhWixUYKef/o0o7Bm4an+A3XvmcTHVqZ8stE6lBVH++g050tBtJ4TZPQ==", "dev": true, + "license": "MIT", "dependencies": { - "@volar/source-map": "2.2.0-alpha.10" + "@volar/source-map": "2.4.1" } }, "node_modules/@volar/source-map": { - "version": "2.2.0-alpha.10", - "resolved": "https://registry.npmjs.org/@volar/source-map/-/source-map-2.2.0-alpha.10.tgz", - "integrity": "sha512-nrdWApVkP5cksAnDEyy1JD9rKdwOJsEq1B+seWO4vNXmZNcxQQCx4DULLBvKt7AzRUAQiAuw5aQkb9RBaSqdVA==", + "version": "2.4.1", + "resolved": "https://registry.npmjs.org/@volar/source-map/-/source-map-2.4.1.tgz", + "integrity": "sha512-Xq6ep3OZg9xUqN90jEgB9ztX5SsTz1yiV8wiQbcYNjWkek+Ie3dc8l7AVt3EhDm9mSIR58oWczHkzM2H6HIsmQ==", "dev": true, - "dependencies": { - "muggle-string": "^0.4.0" - } + "license": "MIT" }, "node_modules/@volar/typescript": { - "version": "2.2.0-alpha.10", - "resolved": "https://registry.npmjs.org/@volar/typescript/-/typescript-2.2.0-alpha.10.tgz", - "integrity": "sha512-GCa0vTVVdA9ULUsu2Rx7jwsIuyZQPvPVT9o3NrANTbYv+523Ao1gv3glC5vzNSDPM6bUl37r94HbCj7KINQr+g==", + "version": "2.4.1", + "resolved": "https://registry.npmjs.org/@volar/typescript/-/typescript-2.4.1.tgz", + "integrity": "sha512-UoRzC0PXcwajFQTu8XxKSYNsWNBtVja6Y9gC8eLv7kYm+UEKJCcZ8g7dialsOYA0HKs3Vpg57MeCsawFLC6m9Q==", "dev": true, + "license": "MIT", "dependencies": { - "@volar/language-core": "2.2.0-alpha.10", - "path-browserify": "^1.0.1" + "@volar/language-core": "2.4.1", + "path-browserify": "^1.0.1", + "vscode-uri": "^3.0.8" } }, "node_modules/@vue/compiler-core": { @@ -1356,24 +1407,38 @@ "@vue/shared": "3.4.25" } }, + "node_modules/@vue/compiler-vue2": { + "version": "2.7.16", + "resolved": "https://registry.npmjs.org/@vue/compiler-vue2/-/compiler-vue2-2.7.16.tgz", + "integrity": "sha512-qYC3Psj9S/mfu9uVi5WvNZIzq+xnXMhOwbTFKKDD7b1lhpnn71jXSFdTQ+WsIEk0ONCd7VV2IMm7ONl6tbQ86A==", + "dev": true, + "license": "MIT", + "dependencies": { + "de-indent": "^1.0.2", + "he": "^1.2.0" + } + }, "node_modules/@vue/devtools-api": { - "version": "6.6.2", - "resolved": "https://registry.npmjs.org/@vue/devtools-api/-/devtools-api-6.6.2.tgz", - "integrity": "sha512-134clD8u7cBBXdmBbXI282gHGF7T/eAbD/G7mAK2llQF62IbI4ny28IVamZVMoJSvfImC2Xxnj732hXkJvUj6g==" + "version": "6.6.3", + "resolved": "https://registry.npmjs.org/@vue/devtools-api/-/devtools-api-6.6.3.tgz", + "integrity": "sha512-0MiMsFma/HqA6g3KLKn+AGpL1kgKhFWszC9U29NfpWK5LE7bjeXxySWJrOJ77hBz+TBrBQ7o4QJqbPbqbs8rJw==", + "license": "MIT" }, "node_modules/@vue/language-core": { - "version": "2.0.14", - "resolved": "https://registry.npmjs.org/@vue/language-core/-/language-core-2.0.14.tgz", - "integrity": "sha512-3q8mHSNcGTR7sfp2X6jZdcb4yt8AjBXAfKk0qkZIh7GAJxOnoZ10h5HToZglw4ToFvAnq+xu/Z2FFbglh9Icag==", + "version": "2.1.2", + "resolved": "https://registry.npmjs.org/@vue/language-core/-/language-core-2.1.2.tgz", + "integrity": "sha512-tt2J7C+l0J/T5PaLhJ0jvCCi0JNwu3e8azWTYxW3jmAW5B/dac0g5UxmI7l59CQgCGFotqUqI3tXjfZgoWNtog==", "dev": true, + "license": "MIT", "dependencies": { - "@volar/language-core": "2.2.0-alpha.10", + "@volar/language-core": "~2.4.1", "@vue/compiler-dom": "^3.4.0", + "@vue/compiler-vue2": "^2.7.16", "@vue/shared": "^3.4.0", "computeds": "^0.0.1", "minimatch": "^9.0.3", - "path-browserify": "^1.0.1", - "vue-template-compiler": "^2.7.14" + "muggle-string": "^0.4.1", + "path-browserify": "^1.0.1" }, "peerDependencies": { "typescript": "*" @@ -1665,7 +1730,8 @@ "version": "0.0.1", "resolved": "https://registry.npmjs.org/computeds/-/computeds-0.0.1.tgz", "integrity": "sha512-7CEBgcMjVmitjYo5q8JTJVra6X5mQ20uTThdK+0kR7UEaDrAWEQcRiBtWJzga4eRpP6afNwwLsX2SET2JhVB1Q==", - "dev": true + "dev": true, + "license": "MIT" }, "node_modules/confbox": { "version": "0.1.7", @@ -2666,6 +2732,16 @@ "node": ">=10" } }, + "node_modules/maath": { + "version": "0.10.8", + "resolved": "https://registry.npmjs.org/maath/-/maath-0.10.8.tgz", + "integrity": "sha512-tRvbDF0Pgqz+9XUa4jjfgAQ8/aPKmQdWXilFu2tMy4GWj4NOsx99HlULO4IeREfbO3a0sA145DZYyvXPkybm0g==", + "license": "MIT", + "peerDependencies": { + "@types/three": ">=0.134.0", + "three": ">=0.134.0" + } + }, "node_modules/magic-string": { "version": "0.30.10", "resolved": "https://registry.npmjs.org/magic-string/-/magic-string-0.30.10.tgz", @@ -2700,12 +2776,13 @@ "integrity": "sha512-ZhoIoL7TNV4s5B6+rx5mC//fw8/POGyNxS/DZyCJeiZ12ScLfVwRE/GfsxwiTkMYYD5DmK2/JXnEVXqL4rF+Sw==" }, "node_modules/micromatch": { - "version": "4.0.5", - "resolved": "https://registry.npmjs.org/micromatch/-/micromatch-4.0.5.tgz", - "integrity": "sha512-DMy+ERcEW2q8Z2Po+WNXuw3c5YaUSFjAO5GsJqfEl7UjvtIuFKO6ZrKvcItdy98dwFI2N1tg3zNIdKaQT+aNdA==", + "version": "4.0.8", + "resolved": "https://registry.npmjs.org/micromatch/-/micromatch-4.0.8.tgz", + "integrity": "sha512-PXwfBhYu0hBCPw8Dn0E+WDYb7af3dSLVWKi3HGv84IdF4TyFoC0ysxFd0Goxw7nSv4T/PzEJQxsYsEiFCKo2BA==", "dev": true, + "license": "MIT", "dependencies": { - "braces": "^3.0.2", + "braces": "^3.0.3", "picomatch": "^2.3.1" }, "engines": { @@ -2758,7 +2835,8 @@ "version": "0.4.1", "resolved": "https://registry.npmjs.org/muggle-string/-/muggle-string-0.4.1.tgz", "integrity": "sha512-VNTrAak/KhO2i8dqqnqnAHOa3cYBwXEZe9h+D5h/1ZqFSTEFHdM65lR7RoIqq3tBBYavsOXV84NoHXZ0AkPyqQ==", - "dev": true + "dev": true, + "license": "MIT" }, "node_modules/nanoid": { "version": "3.3.7", @@ -2866,7 +2944,8 @@ "version": "1.0.1", "resolved": "https://registry.npmjs.org/path-browserify/-/path-browserify-1.0.1.tgz", "integrity": "sha512-b7uo2UCUOYZcnF/3ID0lulOJi/bafxa1xPe7ZPsammBSpjSWQkjNxlt635YGS2MiR9GjvuXCtz2emr3jbsz98g==", - "dev": true + "dev": true, + "license": "MIT" }, "node_modules/path-exists": { "version": "4.0.0", @@ -3648,6 +3727,13 @@ "vue": ">=3.2.13" } }, + "node_modules/vscode-uri": { + "version": "3.0.8", + "resolved": "https://registry.npmjs.org/vscode-uri/-/vscode-uri-3.0.8.tgz", + "integrity": "sha512-AyFQ0EVmsOZOlAnxoFOGOq1SQDWAB7C6aqMGS23svWAllfOaxbuFvcT8D1i8z3Gyn8fraVeZNNmN6e9bxxXkKw==", + "dev": true, + "license": "MIT" + }, "node_modules/vue": { "version": "3.4.25", "resolved": "https://registry.npmjs.org/vue/-/vue-3.4.25.tgz", @@ -3668,31 +3754,6 @@ } } }, - "node_modules/vue-3d-model": { - "version": "2.0.0-alpha.4", - "resolved": "https://registry.npmjs.org/vue-3d-model/-/vue-3d-model-2.0.0-alpha.4.tgz", - "integrity": "sha512-/dGP7YTAK5e7o8i9592PS9S0mbUStRl26OeeC2Qz4XePrG9BU/Q1GkETqPSMJPWgNa8TkqrxXP9ItYgcmxuSqw==", - "dependencies": { - "@types/three": "^0.141.0", - "three": "^0.141.0" - }, - "peerDependencies": { - "vue": ">=3.0.0" - } - }, - "node_modules/vue-3d-model/node_modules/@types/three": { - "version": "0.141.0", - "resolved": "https://registry.npmjs.org/@types/three/-/three-0.141.0.tgz", - "integrity": "sha512-OJdKDgTPVBUgc+s74DYoy4aLznbFFC38Xm4ElmU1YwGNgR7GGFVvFCX7lpVgOsT6S1zSJtGdajTsOYE8/xY9nA==", - "dependencies": { - "@types/webxr": "*" - } - }, - "node_modules/vue-3d-model/node_modules/three": { - "version": "0.141.0", - "resolved": "https://registry.npmjs.org/three/-/three-0.141.0.tgz", - "integrity": "sha512-JaSDAPWuk4RTzG5BYRQm8YZbERUxTfTDVouWgHMisS2to4E5fotMS9F2zPFNOIJyEFTTQDDKPpsgZVThKU3pXA==" - }, "node_modules/vue-router": { "version": "4.3.2", "resolved": "https://registry.npmjs.org/vue-router/-/vue-router-4.3.2.tgz", @@ -3712,26 +3773,29 @@ "resolved": "https://registry.npmjs.org/vue-template-compiler/-/vue-template-compiler-2.7.16.tgz", "integrity": "sha512-AYbUWAJHLGGQM7+cNTELw+KsOG9nl2CnSv467WobS5Cv9uk3wFcnr1Etsz2sEIHEZvw1U+o9mRlEO6QbZvUPGQ==", "dev": true, + "optional": true, + "peer": true, "dependencies": { "de-indent": "^1.0.2", "he": "^1.2.0" } }, "node_modules/vue-tsc": { - "version": "2.0.14", - "resolved": "https://registry.npmjs.org/vue-tsc/-/vue-tsc-2.0.14.tgz", - "integrity": "sha512-DgAO3U1cnCHOUO7yB35LENbkapeRsBZ7Ugq5hGz/QOHny0+1VQN8eSwSBjYbjLVPfvfw6EY7sNPjbuHHUhckcg==", + "version": "2.1.2", + "resolved": "https://registry.npmjs.org/vue-tsc/-/vue-tsc-2.1.2.tgz", + "integrity": "sha512-PH1BDxWT3eaPhl73elyZj6DV0nR3K4IFoUM1sGzMXXQneovVUwHQytdSyAHiED5MtEINGSHpL/Hs9ch+c/tDTw==", "dev": true, + "license": "MIT", "dependencies": { - "@volar/typescript": "2.2.0-alpha.10", - "@vue/language-core": "2.0.14", + "@volar/typescript": "~2.4.1", + "@vue/language-core": "2.1.2", "semver": "^7.5.4" }, "bin": { "vue-tsc": "bin/vue-tsc.js" }, "peerDependencies": { - "typescript": "*" + "typescript": ">=5.0.0" } }, "node_modules/webpack-sources": { diff --git a/front/package.json b/front/package.json index db2e288..753040f 100644 --- a/front/package.json +++ b/front/package.json @@ -11,21 +11,25 @@ }, "dependencies": { "@fireworks-js/vue": "^2.10.7", + "@iconify-json/icon-park": "^1.1.14", + "@iconify-json/icon-park-solid": "^1.1.15", + "@iconify-json/uil": "^1.2.0", + "@iconify/vue": "^4.1.2", "@monogrid/gainmap-js": "^3.0.5", "@tresjs/cientos": "^3.9.0", - "@tresjs/core": "^4.0.2", + "@tresjs/core": "^4.2.9", "@tresjs/leches": "^0.14.0", "@tresjs/post-processing": "^0.7.1", "@vueuse/components": "^10.9.0", "@vueuse/core": "^10.9.0", "d3": "^7.9.0", + "maath": "^0.10.8", "pathfinding": "^0.4.18", "pinia": "^2.1.7", "reset-css": "^5.0.2", "three": "^0.164.1", "vite-svg-loader": "^5.1.0", "vue": "^3.4.21", - "vue-3d-model": "^2.0.0-alpha.4", "vue-router": "^4.3.2" }, "devDependencies": { diff --git a/front/public/pointer_texture.png b/front/public/pointer_texture.png index 739fdd7..8fc3708 100644 Binary files a/front/public/pointer_texture.png and b/front/public/pointer_texture.png differ diff --git a/front/src/App.vue b/front/src/App.vue index 562cc09..a39aef1 100644 --- a/front/src/App.vue +++ b/front/src/App.vue @@ -1,5 +1,19 @@ + \ No newline at end of file diff --git a/front/src/assets/btn/3D_lg.svg b/front/src/assets/btn/3D_lg.svg new file mode 100644 index 0000000..cae3bb7 --- /dev/null +++ b/front/src/assets/btn/3D_lg.svg @@ -0,0 +1,4 @@ + + + + diff --git a/front/src/assets/btn/3D_sm.svg b/front/src/assets/btn/3D_sm.svg new file mode 100644 index 0000000..29a3a51 --- /dev/null +++ b/front/src/assets/btn/3D_sm.svg @@ -0,0 +1,4 @@ + + + + diff --git a/front/src/assets/btn/enter.svg b/front/src/assets/btn/enter.svg new file mode 100644 index 0000000..58bb2d2 --- /dev/null +++ b/front/src/assets/btn/enter.svg @@ -0,0 +1,7 @@ + + + + + + + diff --git a/front/src/assets/btn/gallery.svg b/front/src/assets/btn/gallery.svg new file mode 100644 index 0000000..3aee3f7 --- /dev/null +++ b/front/src/assets/btn/gallery.svg @@ -0,0 +1,4 @@ + + + + diff --git a/front/src/assets/btn/home.svg b/front/src/assets/btn/home.svg new file mode 100644 index 0000000..e9dac4f --- /dev/null +++ b/front/src/assets/btn/home.svg @@ -0,0 +1,3 @@ + + + diff --git a/front/src/assets/btn/left_lg.svg b/front/src/assets/btn/left_lg.svg new file mode 100644 index 0000000..704bf65 --- /dev/null +++ b/front/src/assets/btn/left_lg.svg @@ -0,0 +1,3 @@ + + + diff --git a/front/src/assets/btn/left_sm.svg b/front/src/assets/btn/left_sm.svg new file mode 100644 index 0000000..07dcbe6 --- /dev/null +++ b/front/src/assets/btn/left_sm.svg @@ -0,0 +1,3 @@ + + + diff --git a/front/src/assets/btn/minus.svg b/front/src/assets/btn/minus.svg new file mode 100644 index 0000000..45ab541 --- /dev/null +++ b/front/src/assets/btn/minus.svg @@ -0,0 +1,3 @@ + + + diff --git a/front/src/assets/btn/plus_lg.svg b/front/src/assets/btn/plus_lg.svg new file mode 100644 index 0000000..45542f8 --- /dev/null +++ b/front/src/assets/btn/plus_lg.svg @@ -0,0 +1,3 @@ + + + diff --git a/front/src/assets/btn/plus_sm.svg b/front/src/assets/btn/plus_sm.svg new file mode 100644 index 0000000..ec71f07 --- /dev/null +++ b/front/src/assets/btn/plus_sm.svg @@ -0,0 +1,3 @@ + + + diff --git a/front/src/assets/btn/right_lg.svg b/front/src/assets/btn/right_lg.svg new file mode 100644 index 0000000..557dde4 --- /dev/null +++ b/front/src/assets/btn/right_lg.svg @@ -0,0 +1,3 @@ + + + diff --git a/front/src/assets/btn/right_sm.svg b/front/src/assets/btn/right_sm.svg new file mode 100644 index 0000000..5a184ce --- /dev/null +++ b/front/src/assets/btn/right_sm.svg @@ -0,0 +1,3 @@ + + + diff --git a/front/src/assets/fonts.scss b/front/src/assets/fonts.scss index 9136d72..83d93a1 100644 --- a/front/src/assets/fonts.scss +++ b/front/src/assets/fonts.scss @@ -25,4 +25,6 @@ @include font-face("Montserrat", '../fonts/Montserrat-ExtraBold.ttf', 800); @include font-face("Montserrat", '../fonts/Montserrat-ExtraBoldItalic.ttf', 800, italic); @include font-face("Montserrat", '../fonts/Montserrat-Black.ttf', 900); -@include font-face("Montserrat", '../fonts/Montserrat-BlackItalic.ttf', 900, italic); \ No newline at end of file +@include font-face("Montserrat", '../fonts/Montserrat-BlackItalic.ttf', 900, italic); + +@include font-face("Project Space", '../fonts/Project Space.ttf', 400); \ No newline at end of file diff --git a/front/src/assets/main.scss b/front/src/assets/main.scss index fc0799d..28cdeb8 100644 --- a/front/src/assets/main.scss +++ b/front/src/assets/main.scss @@ -1,6 +1,21 @@ @import 'grid.scss'; @import 'fonts.scss'; +:root { + --primary-color: #ACD0E5; +} + +body { + font-family: 'Montserrat'; + user-select: none; + + &:not(.notouch) { + // canvas { + cursor: none; + // } + } +} + a[href] { color: #048280; @@ -9,4 +24,48 @@ a[href] { } } -@import 'sidebar.scss'; \ No newline at end of file +.main { + display: flex; + align-items: center; + flex-direction: column; + justify-content: space-between; + height: calc(100vh - 4.25rem); + gap: 1.25rem; + + &-title, + &-desc { + max-width: 40vw; + position: relative; + z-index: 2; + color: var(--main-text-color) + } + + &-title { + text-align: center; + font-family: 'Project Space'; + margin-top: 1rem; + } + + h1 { + font-size: 3rem + } + + &-desc { + font-size: 1.125rem; + line-height: 1.2; + } + + p { + &:not(:last-child) { + margin-bottom: 0.5rem; + } + } + + &-canvas { + flex-grow: 1; + height: 100vh; + } +} + +@import 'sidebar.scss'; +@import 'nav.scss'; \ No newline at end of file diff --git a/front/src/assets/nav.scss b/front/src/assets/nav.scss new file mode 100644 index 0000000..3173b48 --- /dev/null +++ b/front/src/assets/nav.scss @@ -0,0 +1,80 @@ +$bg: #ACD0E5; +$activeBg: #438CB6; +$white: #fff; + +.nav { + background-color: $white; + padding: 1rem; + // height: 2rem; + position: fixed; + right: 0; + left: 0; + bottom: 0; + + display: flex; + align-items: center; + justify-content: center; + + > * { + &:not(:last-child) { + border-right: 2px solid #B3B3B3 + } + } + + &-icon { + display: inline-flex; + justify-content: center; + align-items: center; + font-size: 1.75rem; + width: 2.25rem; + height: 2.25rem; + border-radius: 50%; + overflow: hidden; + + background-color: var(--primary-color); + color: $white; + cursor: pointer; + font-weight: bold; + + &.disabled { + opacity: 0.5; + pointer-events: none; + } + + a, + a[href].router-link-active { + color: $white; + line-height: 0; + text-decoration: none; + } + + &.active { + background-image: linear-gradient(fade-out(#000, 0.5), fade-out(#000, 0.5)); + } + } + + &-group { + display: flex; + gap: 1rem; + padding: 0 1.5rem; + } + + &-content { + flex-grow: 1; + text-align: right; + font-size: 1.125rem; + padding: 0 1.5rem; + display: flex; + flex-wrap: wrap; + align-items: center; + justify-content: flex-end; + + .nav-icon { + margin: 0 0.25rem; + + font-size: 1.25em; + width: 1.25em; + height: 1.25em; + } + } +} \ No newline at end of file diff --git a/front/src/assets/pointer/0.png b/front/src/assets/pointer/0.png new file mode 100644 index 0000000..dba1927 Binary files /dev/null and b/front/src/assets/pointer/0.png differ diff --git a/front/src/assets/pointer/1.png b/front/src/assets/pointer/1.png new file mode 100644 index 0000000..eccee1c Binary files /dev/null and b/front/src/assets/pointer/1.png differ diff --git a/front/src/assets/pointer/2.png b/front/src/assets/pointer/2.png new file mode 100644 index 0000000..adcc0e7 Binary files /dev/null and b/front/src/assets/pointer/2.png differ diff --git a/front/src/assets/pointer/3.png b/front/src/assets/pointer/3.png new file mode 100644 index 0000000..8b9ebb8 Binary files /dev/null and b/front/src/assets/pointer/3.png differ diff --git a/front/src/assets/pointer/4.png b/front/src/assets/pointer/4.png new file mode 100644 index 0000000..52a441b Binary files /dev/null and b/front/src/assets/pointer/4.png differ diff --git a/front/src/assets/pointer/5.png b/front/src/assets/pointer/5.png new file mode 100644 index 0000000..ae9e627 Binary files /dev/null and b/front/src/assets/pointer/5.png differ diff --git a/front/src/assets/pointer/point-v1-v1.glb b/front/src/assets/pointer/point-v1-v1.glb new file mode 100644 index 0000000..487e20d Binary files /dev/null and b/front/src/assets/pointer/point-v1-v1.glb differ diff --git a/front/src/assets/pointer/point-v1.glb b/front/src/assets/pointer/point-v1.glb new file mode 100644 index 0000000..cc2ce33 Binary files /dev/null and b/front/src/assets/pointer/point-v1.glb differ diff --git a/front/src/assets/promo/Vector.svg b/front/src/assets/promo/Vector.svg new file mode 100644 index 0000000..44dadeb --- /dev/null +++ b/front/src/assets/promo/Vector.svg @@ -0,0 +1,36 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/front/src/assets/promo/logo.svg b/front/src/assets/promo/logo.svg index 81d8838..61c3bc2 100644 --- a/front/src/assets/promo/logo.svg +++ b/front/src/assets/promo/logo.svg @@ -1,167 +1,19 @@ - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + + diff --git a/front/src/assets/sidebar.scss b/front/src/assets/sidebar.scss index 3090ed7..31eaeeb 100644 --- a/front/src/assets/sidebar.scss +++ b/front/src/assets/sidebar.scss @@ -1,34 +1,26 @@ -$bg: #2D3031; -$textColor: #fff; +$bg: fade-out(#fff, 0.05); +$textColor: #484848; $textColor2: #9A9697; $primary: #E75B12; +$boxShadow: 0px 0px 8px rgba(0, 0, 0, .25); .homelink { position: absolute; right: 2rem; - top: 4rem; + top: 2rem; transition: right 300ms linear; - &.main { - right: auto; - left: 2rem; - } - a { - background-color: $bg; - color: $textColor; + color: $bg; line-height: 1; - font-size: 3rem; - height: 7rem; + font-size: 2.5rem; display: flex; align-items: center; - border-radius: 1rem; - opacity: 0.97; + } - svg { - transition: all 400ms linear; - } + svg { + filter: drop-shadow($boxShadow); } &.open { @@ -40,10 +32,83 @@ $primary: #E75B12; } } +.itemnav { + position: absolute; + bottom: 5rem; + left: 50%; + display: grid; + grid-template-columns: 1fr 1fr 1fr; + grid-template-rows: 1fr 1fr; + // flex-wrap: wrap; + column-gap: 1rem; + max-width: 8rem; + align-items: center; + justify-content: center; + + >* { + grid-row-start: 2; + grid-row-end: 2; + line-height: 1; + font-size: 2.5rem; + display: flex; + align-items: center; + justify-content: center; + + border-radius: 50%; + background-color: $bg; + color: var(--primary-color); + + width: 2.5rem; + height: 2.5rem; + filter: drop-shadow($boxShadow); + + &.invisible { + visibility: hidden; + pointer-events: none; + } + + >a { + line-height: 1; + font-size: 0; + color: inherit; + width: 100%; + height: 100%; + display: flex; + align-items: center; + justify-content: center; + } + + svg { + width: 50%; + height: 50%; + } + } + + &_one { + grid-column-start: 2; + grid-column-end: 4; + grid-row-start: 1; + grid-row-end: 1; + margin: 1rem 0.75rem; + } + &_big { + width: 4rem; + height: 4rem; + + } + + &-deep { + svg { + width: 70%; + height: 70%; + } + } +} + .sidebar { position: fixed; width: 30vw; - top: 4rem; + top: 2rem; right: -50%; bottom: 0; transition: all 300ms linear; @@ -51,6 +116,8 @@ $primary: #E75B12; display: flex; flex-direction: column; gap: 1.5rem; + color: #484848; + pointer-events: none; &.open { right: 0; @@ -62,60 +129,129 @@ $primary: #E75B12; } &-content { - max-height: 50vh; - overflow: auto; - + pointer-events: all; background-color: $bg; - border-top-left-radius: 2rem; - border-bottom-left-radius: 2rem; - - padding: 1.5rem; + border-top-left-radius: 0.5rem; + border-bottom-left-radius: 0.5rem; + box-shadow: $boxShadow; color: $textColor; - font-family: 'Montserrat'; - } - - &-list {} - - &-list-item { - font-size: 1.5rem; - color: $textColor2; display: flex; + flex-direction: column; + max-height: calc(100vh - 8rem); + } - input { - margin-right: 2rem; + &-accordion { + padding: 1.125rem 1rem; + border-bottom: 2px solid var(--primary-color); + min-height: 1.625rem; + overflow: hidden; + display: flex; + flex-direction: column; - &.checked+label { - color: $primary; + &:last-child { + border-bottom: none; + } + + h3 { + font-weight: 700; + font-size: 1.25rem; + } + + p { + &:not(:last-child) { + margin-bottom: 1rem; } } + + &-title { + display: flex; + align-items: center; + justify-content: flex-start; + gap: 0.75rem; + color: var(--primary-color); + cursor: pointer; + + svg { + flex-shrink: 0; + } + } + + &-content { + height: calc(100% - 2rem); + overflow: auto; + margin-top: 1.125rem; + padding-left: 2rem; + scrollbar-gutter: stable; + } + } h2 { - font-size: 3rem; + font-size: 1.5rem; text-align: center; - margin-bottom: 1rem; - - font-weight: 800; - } - - p { - font-size: 1rem; - margin-bottom: 1rem; - } - - a { - background-color: darken($textColor2, 30%); - opacity: 0.97; - border-radius: 1rem; - height: 3.75rem; - color: $primary; - + padding: 0.5rem 1rem; + min-height: 3rem; display: flex; + flex-wrap: wrap; align-items: center; justify-content: center; - text-decoration: none; - font-size: 2rem; + + font-weight: 700; + text-transform: uppercase; + line-height: 1; + + border-bottom: 2px solid var(--primary-color); + } + + &-list { + &-item { + font-size: 1.25rem; + position: relative; + display: flex; + justify-content: space-between; + margin-right: 0.25rem; + margin-bottom: 0.25rem; + + input[type=radio], + input[type=checkbox] { + order: 10; + + &:checked + label { + font-weight: bolder; + } + } + + label { + flex-grow: 1; + } + + $r: 0.5rem; + + &:before, + &::after { + content: ''; + display: block; + background-color: var(--primary-color); + position: absolute; + left: -1.5rem; + opacity: 0.5; + } + + &:before { + width: $r; + height: $r; + border-radius: 50%; + top: calc(50% - 0.125rem) + } + + &:after { + width: 0.125rem; + top: 50%; + bottom: -50%; + transform: translate3d((0.125rem)*1.5, -100%, 0); + } + } } } \ No newline at end of file diff --git a/front/src/components/Gallery/index.vue b/front/src/components/Gallery/index.vue new file mode 100644 index 0000000..ee6f151 --- /dev/null +++ b/front/src/components/Gallery/index.vue @@ -0,0 +1,126 @@ + +
+
+ +
+ +
+ + \ No newline at end of file diff --git a/front/src/components/Promo/gallery.vue b/front/src/components/Gallery/item.vue similarity index 76% rename from front/src/components/Promo/gallery.vue rename to front/src/components/Gallery/item.vue index 948469e..b055cde 100644 --- a/front/src/components/Promo/gallery.vue +++ b/front/src/components/Gallery/item.vue @@ -7,7 +7,8 @@ import { IMAGE_URL } from '../../constants' const props = defineProps(['files']) onMounted(async () => { - const files = props.files + const files = props.files.slice(0) + // const width = 1920 // const height = 1080 const width = window.innerWidth @@ -35,7 +36,7 @@ onMounted(async () => { .attr("x", 0) .attr("y", 0); }); - const range = files.length + 2 + const range = files.length - 2 const circles = d3.range(range).map(() => ({ x: Math.random() * width, y: Math.random() * height, @@ -61,34 +62,36 @@ onMounted(async () => { .attr("d", voronoi.render()); const cell = svg.append("g") - .attr("fill", "none") .attr("pointer-events", "all") .selectAll("path") .data(circles) .join("path") - .attr("d", (d, i) => voronoi.renderCell(i)) - .attr('fill', (d, i) => i < (range - 2) ? `url(#img${i})` : 'none') + .attr("d", (_, i) => voronoi.renderCell(i)) + .attr('fill', (_, i) => `url(#img${i})`) .call(d3.drag() - .on("start", (event, d) => circle.filter(p => p === d).raise().attr("stroke", "black")) + .on("start", (_, d) => circle.filter(p => p === d).raise().attr("stroke", "black")) .on("drag", (event, d: any) => (d.x = event.x, d.y = event.y)) - .on("end", (event, d) => circle.filter(p => p === d).attr("stroke", null)) + .on("end", (_, d) => circle.filter(p => p === d).attr("stroke", null)) .on("start.update drag.update end.update", update) as any) function update() { voronoi = d3.Delaunay.from(circles, d => d.x, d => d.y).voronoi([0, 0, width, height]); circle.attr("cx", d => d.x).attr("cy", d => d.y); - cell.attr("d", (d, i) => voronoi.renderCell(i)); + cell.attr("d", (_, i) => voronoi.renderCell(i)); mesh.attr("d", voronoi.render()); } if (document.querySelector('.pin')) { - const rect = (document.querySelector('.pin') as HTMLElement).getBoundingClientRect() - circles[circles.length - 1] = { x: rect.x + rect.width, y: rect.y + rect.height } - circles[circles.length - 2] = { x: rect.x, y: rect.y } update() } }) \ No newline at end of file + + \ No newline at end of file diff --git a/front/src/components/Main/index.vue b/front/src/components/Main/index.vue new file mode 100644 index 0000000..4a0e941 --- /dev/null +++ b/front/src/components/Main/index.vue @@ -0,0 +1,55 @@ + + \ No newline at end of file diff --git a/front/src/components/Main/main_load_models.vue b/front/src/components/Main/main_load_models.vue new file mode 100644 index 0000000..7b1ea37 --- /dev/null +++ b/front/src/components/Main/main_load_models.vue @@ -0,0 +1,82 @@ + + \ No newline at end of file diff --git a/front/src/components/Promo/env.vue b/front/src/components/Promo/env.vue index 0e256f7..aa90bc6 100644 --- a/front/src/components/Promo/env.vue +++ b/front/src/components/Promo/env.vue @@ -1,7 +1,7 @@ \ No newline at end of file diff --git a/front/src/components/Promo/index.vue b/front/src/components/Promo/index.vue index 0aeb724..19a34fd 100644 --- a/front/src/components/Promo/index.vue +++ b/front/src/components/Promo/index.vue @@ -1,131 +1,150 @@ \ No newline at end of file diff --git a/front/src/components/Promo/load_models.vue b/front/src/components/Promo/load_models.vue index 014c93a..6204572 100644 --- a/front/src/components/Promo/load_models.vue +++ b/front/src/components/Promo/load_models.vue @@ -1,110 +1,134 @@