Merge branch 'Development' of https://github.com/Tucan444/Mabasej_Team into Development

This commit is contained in:
Untriex Programming 2021-05-09 12:02:06 +02:00
commit c91ac04d81
53 changed files with 1308 additions and 420 deletions

169
README.md

@ -1,22 +1,169 @@
# Mabasej_Team
We are working on system, that will help tourists in cities to get information about city more easily.
# Hardware
## Hardware
- Raspberry PI (for now tested only on rpi4. Works on rpi zero too, but it will be slow if more devices are connected)
- External/Internal WiFi antena
# Software
## Software
- python 3.9.2 compatible server with basic web interface
- Kotlin based mobile app
# Server
To run server you need to install
- hypercorn - "pip install hypercorn"
- fastapi - "pip install fastapi"
- requests - "pip install requests"
- aiofiles - "pip install aiofiles"
## Install
Wikispot is in testing stages, but it is possible to install it using our .img file (link coming soon) based on DietPi or custom script.
then run by command - "hypercorn main:app --bind <IP:port>"
To connect to another rpi you need to edit settings.json with different ID and fill heartbeat table.
| Device | Server compatible | Instalation |
| :-------------------- | :------------------------------------------------------------------------------------------ | :-----------: |
| Ubuntu (I7, 16GB ram) | :heavy_check_mark: WORKING (Only server) | Manual/script |
| RPI 4b (2GB) | :heavy_check_mark: WORKING | .img/script |
| RPI 400 (4GB) | :grey_question: Untested. Should work. | .img/script |
| RPI 3b+ | :grey_question: Untested. Should work. | .img/script |
| RPI zero w | :white_check_mark: Working with fewer devices (Only server. No AP, Computer vision) | .img/script |
| RPI 2 | :question: Untested. | :x: |
| RPI | :question: Untested. | :x: |
This is not finished product
### Fresh istall (.img) Only RPI
login credentials
> login: dietpi
> password: WikiSpot2021
requirements:
1. WikiSpot image file (download: *soon*)
2. MicroSd card (recommended: >=16GB, :exclamation: ALL DATA STORED ON SD CARD WILL BE FORMATED :exclamation:)
3. BalenaEtcher (or another sd card flasher) *link:* https://www.balena.io/etcher/
4. SD card reader
Install:
1. Download all required files (wikispot.img and balenaetcher) and install BalenaEtcher
2. Insert SD card into computer/reader, open BalenaEtcher -> chose Flash from file -> chose downloaded wikispot.img -> Select your sd in *Select target* -> Flash!
3. :exclamation: WINDOWS will show unformated drive. Cancel it. It is because of uncompatible format for windows :exclamation:
4. After flashing open partition *boot* (should apear as USB), find file *dietpi.txt* and open it in text editor.
- Accept license by changing `AUTO_SETUP_ACCEPT_LICENSE=0` to `AUTO_SETUP_ACCEPT_LICENSE=1`
- Change name of WikiSpot `AUTO_SETUP_NET_HOSTNAME=WikiSpot-CHANGE_ME` by changing only *CHANGE_ME* or leave *CHANGE_ME* for random number name *WikiSpot-54346
- You can set static ip address by changing `AUTO_SETUP_NET_USESTATIC=0` to `AUTO_SETUP_NET_USESTATIC=1` And entering your setting into required lines.
- If you want to use computer vision plugin with rpi camera set `ENABLE_COMPUTER_VISION_PLUGIN=0` to `ENABLE_COMPUTER_VISION_PLUGIN=1` (*recommended only on RPI4)
- If you want to use RPI as access point to WikiSpot change `#AUTO_SETUP_INSTALL_SOFTWARE_ID=60` to `AUTO_SETUP_INSTALL_SOFTWARE_ID=60`
- *wifi setup in testing*
5. :grey_exclamation:For advanced users:grey_exclamation: You can now change contens of WikiSpot server in `/boot/WikiSpot`according to an example in server filesystem
6. Eject sd card from computer, insert it in Raspberry Pi and power it on. :bangbang:Raspberry Pi needs to be connected to intenet via Ethernet (*wifi coming soon*) othervise the setup will crash.
7. The setup will take approximately 25-40 min (RPI 4b (2gb) and 70 mb download speed)
8. Done you can start using WikiSpot and edit contents of WikiSpot with our app (*coming soon*)
### Script install
*coming soon*
### Manual install
*coming soon*
## Server filesystem
```
└── test_directory
├── cache # files forwarded from another servers to client
├── engine.py # engine for server (log, recovery, update)
├── files # content of WikiSpot server
│   └── test.jpg
├── filesystem.json # data settings of server (name, description, files)
├── main.py # main server file
├── plugins # plugins file
│   └── computer_vision # oficial WikiSpot computer vision plugin for RPI 4
│   ├── MobileNetSSD_deploy.caffemodel
│   ├── MobileNetSSD_deploy.prototxt
│   └── com_vision.py
├── run.py # start script for server
├── settings.json # settings (log, debug, connected WikiSpots, cache size,...)
├── system.py # update and clean script
└── version.json # version of WikiSpot
```
### filesystem
```
{
"ID": 0, # ID of WikiSpots, Needs to be different, because network will crash
"location": "25.997417761947318, -97.15738221291177", # Location of WikiSpot server copied from google maps
"description": {
"title": "WikiSpot demo", # Name of WikiSpot server (swiming pool, school, ...)
"description_s": "This is showcase of WikiSpot", # Short description showed on web/app in list of servers
"description_l": "This will show after opening server in app", # Long description showed after opening the server in web/app
"photo_s": "test.jpg", # Small image showed on web/app in list of servers
"photo_b": "test.png" # Big image showed after opening the server in web/app
},
"files": [ # files on server in /files that will be mediated to the web/app
{
"name": "test", # Name of the file, without spaces. App will change "_" to spaces
"format": ".jpg", # Format of the file
"description": "This is test file" # Description showed next to the file
}
]
}
```
To manualy add new file to server (on setup or via ssh) add file to `server_directory/files`
and add record for file into `files` list in `filesystem.json`. :exclamation:do not forget "," after last record:exclamation:
```
{
"name": "new_file_name",
"format": ".txt",
"description": "This is how you add new file"
}
```
### settings.json
```
{
"time_to_heartbeat": 20, # Time to ping of another online servers in seconds
"time_to_heartbeat_offline": 25, # Time to ping of another offline servers in seconds
"save_table": true, # Save connected servers to reconnect after restart
"time_to_save": 60, # Time to save server in seconds
"max_mess": 20, # Maximum messages stored in RAM
"cache_size_mb": 1000, # Maximum size of cache directory in mb
"clear_cache_on_startup": false, # Remove contents of cache on startup (slower first downloads)
"log": { # Log settings
"save_error": true, # Save errors into log.txt
"print_error": true, # Print errors into console (if running as service into linux log)
"save_warning": true, # Save warnings into log.txt
"print_warning": true, # Print warnings into console (if running as service into linux log)
"save_message": false, # Save messages (new server, etc. not messages from clients) into log.txt
"print_message": true, # Print messages into console (if running as service into linux log)
"enable_debug": false # Enable debug into console (if running as service into linux log)
},
"heartbeat_table": { # Saved servers
"ID": [],
"IP": [],
"location": [],
"file_system": [],
"last_heartbeat": []
}
}
```
If you want to manually add server on first setup or via ssh fill heartbeat table like this.
```
"heartbeat_table": { # Saved servers
"ID": [1], # ID of server as integer (number)
"IP": ["192.168.1.2"], # IP of server as string
"location": [""], # Empty string as placeholder. location will be downloaded after first connection
"file_system": [""], # Empty string as placeholder. filesystem will be downloaded after first connection
"last_heartbeat": [10] # After how many seconds will server try to connect for the first time
}
```
:bangbang:If the server will be offline for long time (heartbeat + offline heartbeat) it will be removed from heartbeat table. If the save function is disabled server will trying to connect after restart:bangbang:
*This is not finished product*

@ -0,0 +1,123 @@
<component name="ProjectCodeStyleConfiguration">
<code_scheme name="Project" version="173">
<JetCodeStyleSettings>
<option name="CODE_STYLE_DEFAULTS" value="KOTLIN_OFFICIAL" />
</JetCodeStyleSettings>
<codeStyleSettings language="XML">
<option name="FORCE_REARRANGE_MODE" value="1" />
<indentOptions>
<option name="CONTINUATION_INDENT_SIZE" value="4" />
</indentOptions>
<arrangement>
<rules>
<section>
<rule>
<match>
<AND>
<NAME>xmlns:android</NAME>
<XML_ATTRIBUTE />
<XML_NAMESPACE>^$</XML_NAMESPACE>
</AND>
</match>
</rule>
</section>
<section>
<rule>
<match>
<AND>
<NAME>xmlns:.*</NAME>
<XML_ATTRIBUTE />
<XML_NAMESPACE>^$</XML_NAMESPACE>
</AND>
</match>
<order>BY_NAME</order>
</rule>
</section>
<section>
<rule>
<match>
<AND>
<NAME>.*:id</NAME>
<XML_ATTRIBUTE />
<XML_NAMESPACE>http://schemas.android.com/apk/res/android</XML_NAMESPACE>
</AND>
</match>
</rule>
</section>
<section>
<rule>
<match>
<AND>
<NAME>.*:name</NAME>
<XML_ATTRIBUTE />
<XML_NAMESPACE>http://schemas.android.com/apk/res/android</XML_NAMESPACE>
</AND>
</match>
</rule>
</section>
<section>
<rule>
<match>
<AND>
<NAME>name</NAME>
<XML_ATTRIBUTE />
<XML_NAMESPACE>^$</XML_NAMESPACE>
</AND>
</match>
</rule>
</section>
<section>
<rule>
<match>
<AND>
<NAME>style</NAME>
<XML_ATTRIBUTE />
<XML_NAMESPACE>^$</XML_NAMESPACE>
</AND>
</match>
</rule>
</section>
<section>
<rule>
<match>
<AND>
<NAME>.*</NAME>
<XML_ATTRIBUTE />
<XML_NAMESPACE>^$</XML_NAMESPACE>
</AND>
</match>
<order>BY_NAME</order>
</rule>
</section>
<section>
<rule>
<match>
<AND>
<NAME>.*</NAME>
<XML_ATTRIBUTE />
<XML_NAMESPACE>http://schemas.android.com/apk/res/android</XML_NAMESPACE>
</AND>
</match>
<order>ANDROID_ATTRIBUTE_ORDER</order>
</rule>
</section>
<section>
<rule>
<match>
<AND>
<NAME>.*</NAME>
<XML_ATTRIBUTE />
<XML_NAMESPACE>.*</XML_NAMESPACE>
</AND>
</match>
<order>BY_NAME</order>
</rule>
</section>
</rules>
</arrangement>
</codeStyleSettings>
<codeStyleSettings language="kotlin">
<option name="CODE_STYLE_DEFAULTS" value="KOTLIN_OFFICIAL" />
</codeStyleSettings>
</code_scheme>
</component>

@ -0,0 +1,5 @@
<component name="ProjectCodeStyleConfiguration">
<state>
<option name="USE_PER_PROJECT_SETTINGS" value="true" />
</state>
</component>

@ -1,6 +1,6 @@
<?xml version="1.0" encoding="UTF-8"?>
<project version="4">
<component name="CompilerConfiguration">
<bytecodeTargetLevel target="1.8" />
<bytecodeTargetLevel target="11" />
</component>
</project>

@ -1,6 +1,6 @@
<?xml version="1.0" encoding="UTF-8"?>
<project version="4">
<component name="ProjectRootManager" version="2" languageLevel="JDK_1_8" default="true" project-jdk-name="1.8" project-jdk-type="JavaSDK">
<component name="ProjectRootManager" version="2" languageLevel="JDK_11" default="true" project-jdk-name="1.8" project-jdk-type="JavaSDK">
<output url="file://$PROJECT_DIR$/build/classes" />
</component>
<component name="ProjectType">

@ -0,0 +1,10 @@
<?xml version="1.0" encoding="UTF-8"?>
<project version="4">
<component name="RunConfigurationProducerService">
<option name="ignoredProducers">
<set>
<option value="com.android.tools.idea.compose.preview.runconfiguration.ComposePreviewRunConfigurationProducer" />
</set>
</option>
</component>
</project>

Binary file not shown.

Before

Width:  |  Height:  |  Size: 17 KiB

After

Width:  |  Height:  |  Size: 144 KiB

@ -9,6 +9,8 @@ import android.view.View
import android.view.ViewGroup
import android.view.animation.Animation
import android.view.animation.AnimationUtils
import android.widget.RelativeLayout
import androidx.constraintlayout.widget.ConstraintLayout
import androidx.core.content.ContextCompat.startActivity
import androidx.core.view.setPadding
import androidx.recyclerview.widget.RecyclerView
@ -32,6 +34,7 @@ class FileViewsAdapter(private val context: Context, private val fileViews: Arra
var textInfo: String? = null
var imgInfo: String? = null
var pdfUrl: String? = null
var generalUrl: String? = null
var opened = false
init {
@ -39,7 +42,9 @@ class FileViewsAdapter(private val context: Context, private val fileViews: Arra
if (!opened) {
itemView.downloadFileBtn.visibility = View.VISIBLE
itemView.downloadFileBtn.startAnimation(fadeIn)
itemView.showFileBtn.startAnimation(rotateOpen)
if (generalUrl == null) {
itemView.showFileBtn.startAnimation(rotateOpen)
}
fileView?.let {
textInfo?.let {
@ -70,17 +75,18 @@ class FileViewsAdapter(private val context: Context, private val fileViews: Arra
pdfUrl?.let {
itemView.pdfContent.visibility = View.VISIBLE
ServerManagement.serverManager.loadPdfView(itemView.pdfContent, pdfUrl!!, true)
println("current page is: ${itemView.pdfContent.currentPage}")
}
}
} else {
itemView.showFileBtn.startAnimation(rotateClose)
itemView.textContent.textSize = 0F
itemView.textContent.setPadding(0)
if (generalUrl == null) {
itemView.showFileBtn.startAnimation(rotateClose)
}
val downloadBtnVanishActionThread = Thread(DownloadBtnVanishAction())
downloadBtnVanishActionThread.start()
itemView.textContent.textSize = 0F
itemView.textContent.setPadding(0)
itemView.imageContent.visibility = View.GONE
itemView.pdfContent.visibility = View.GONE
}
@ -109,6 +115,11 @@ class FileViewsAdapter(private val context: Context, private val fileViews: Arra
val browserIntent = Intent(Intent.ACTION_VIEW, Uri.parse(pdfUrl))
startActivity(context, browserIntent, null)
}
generalUrl?.let {
val browserIntent = Intent(Intent.ACTION_VIEW, Uri.parse(generalUrl))
startActivity(context, browserIntent, null)
}
}
}
@ -123,6 +134,20 @@ class FileViewsAdapter(private val context: Context, private val fileViews: Arra
fileView.pdfUrl?.let {
pdfUrl = it
}
fileView.generalUrl?.let {
generalUrl = it
itemView.showFileBtn.visibility = View.INVISIBLE
// setting new margins
var params = itemView.downloadFileBtn.layoutParams as ConstraintLayout.LayoutParams
params.marginEnd = 24
itemView.downloadFileBtn.layoutParams = params
params = itemView.showFileBtn.layoutParams as ConstraintLayout.LayoutParams
params.marginEnd = 0
itemView.showFileBtn.layoutParams = params
}
itemView.filenameText.text = fileView.filename.replace("_", " ")
itemView.fileDescription.text = fileView.fileDescription

@ -41,6 +41,8 @@ class infoFragment : Fragment(R.layout.fragment_info) {
updateSensorsRecyclerView()
updateFileViewsRecyclerView()
//file_views_recycler_view.isNestedScrollingEnabled = false
try {
executeLoadFunction = args.executeLoadFuntion
} catch (e: Throwable) {
@ -168,7 +170,7 @@ class infoFragment : Fragment(R.layout.fragment_info) {
}
// handling images
if ("jpg png".contains(filetype)) {
else if ("jpg png".contains(filetype)) {
val fileView = FileView(filetype, filename, fileDescription, null, "$serverId|||||$filename.$filetype")
if (!FileViewsSupplier.checkIfContains(fileView)) {
FileViewsSupplier.appendFileView(fileView)
@ -177,7 +179,7 @@ class infoFragment : Fragment(R.layout.fragment_info) {
}
// handling pdf files
if ("pdf".contains(filetype)) {
else if ("pdf".contains(filetype)) {
val fileView = FileView(filetype, filename, fileDescription, null, null, "${ServerManagement.baseUrl}files/$serverId/$filename.$filetype")
if (!FileViewsSupplier.checkIfContains(fileView)) {
FileViewsSupplier.appendFileView(fileView)
@ -185,6 +187,14 @@ class infoFragment : Fragment(R.layout.fragment_info) {
}
}
else {
val fileView = FileView(filetype, filename, fileDescription, null, null, null, "${ServerManagement.baseUrl}files/$serverId/$filename.$filetype")
if (!FileViewsSupplier.checkIfContains(fileView)) {
FileViewsSupplier.appendFileView(fileView)
updateFileViewsRecyclerView()
}
}
}
} catch (e: Throwable) { println("[debug] exception in infoFragment load data request Exception: $e") }
}
@ -290,6 +300,7 @@ class infoFragment : Fragment(R.layout.fragment_info) {
try {
file_views_recycler_view.post {
val layoutManager = LinearLayoutManager(context)
layoutManager.orientation = LinearLayoutManager.VERTICAL
file_views_recycler_view.layoutManager = layoutManager

@ -1,7 +1,8 @@
package com.example.wikispot.modelsForAdapters
data class FileView(val filetype: String, val filename: String, val fileDescription: String,
var textInfo: String? = null, var imgInfo: String? = null, var pdfUrl: String? = null)
var textInfo: String? = null, var imgInfo: String? = null, var pdfUrl: String? = null,
var generalUrl: String? = null)
object FileViewsSupplier {

@ -1,170 +0,0 @@
<?xml version="1.0" encoding="utf-8"?>
<vector xmlns:android="http://schemas.android.com/apk/res/android"
android:width="108dp"
android:height="108dp"
android:viewportWidth="108"
android:viewportHeight="108">
<path
android:fillColor="#3DDC84"
android:pathData="M0,0h108v108h-108z" />
<path
android:fillColor="#00000000"
android:pathData="M9,0L9,108"
android:strokeWidth="0.8"
android:strokeColor="#33FFFFFF" />
<path
android:fillColor="#00000000"
android:pathData="M19,0L19,108"
android:strokeWidth="0.8"
android:strokeColor="#33FFFFFF" />
<path
android:fillColor="#00000000"
android:pathData="M29,0L29,108"
android:strokeWidth="0.8"
android:strokeColor="#33FFFFFF" />
<path
android:fillColor="#00000000"
android:pathData="M39,0L39,108"
android:strokeWidth="0.8"
android:strokeColor="#33FFFFFF" />
<path
android:fillColor="#00000000"
android:pathData="M49,0L49,108"
android:strokeWidth="0.8"
android:strokeColor="#33FFFFFF" />
<path
android:fillColor="#00000000"
android:pathData="M59,0L59,108"
android:strokeWidth="0.8"
android:strokeColor="#33FFFFFF" />
<path
android:fillColor="#00000000"
android:pathData="M69,0L69,108"
android:strokeWidth="0.8"
android:strokeColor="#33FFFFFF" />
<path
android:fillColor="#00000000"
android:pathData="M79,0L79,108"
android:strokeWidth="0.8"
android:strokeColor="#33FFFFFF" />
<path
android:fillColor="#00000000"
android:pathData="M89,0L89,108"
android:strokeWidth="0.8"
android:strokeColor="#33FFFFFF" />
<path
android:fillColor="#00000000"
android:pathData="M99,0L99,108"
android:strokeWidth="0.8"
android:strokeColor="#33FFFFFF" />
<path
android:fillColor="#00000000"
android:pathData="M0,9L108,9"
android:strokeWidth="0.8"
android:strokeColor="#33FFFFFF" />
<path
android:fillColor="#00000000"
android:pathData="M0,19L108,19"
android:strokeWidth="0.8"
android:strokeColor="#33FFFFFF" />
<path
android:fillColor="#00000000"
android:pathData="M0,29L108,29"
android:strokeWidth="0.8"
android:strokeColor="#33FFFFFF" />
<path
android:fillColor="#00000000"
android:pathData="M0,39L108,39"
android:strokeWidth="0.8"
android:strokeColor="#33FFFFFF" />
<path
android:fillColor="#00000000"
android:pathData="M0,49L108,49"
android:strokeWidth="0.8"
android:strokeColor="#33FFFFFF" />
<path
android:fillColor="#00000000"
android:pathData="M0,59L108,59"
android:strokeWidth="0.8"
android:strokeColor="#33FFFFFF" />
<path
android:fillColor="#00000000"
android:pathData="M0,69L108,69"
android:strokeWidth="0.8"
android:strokeColor="#33FFFFFF" />
<path
android:fillColor="#00000000"
android:pathData="M0,79L108,79"
android:strokeWidth="0.8"
android:strokeColor="#33FFFFFF" />
<path
android:fillColor="#00000000"
android:pathData="M0,89L108,89"
android:strokeWidth="0.8"
android:strokeColor="#33FFFFFF" />
<path
android:fillColor="#00000000"
android:pathData="M0,99L108,99"
android:strokeWidth="0.8"
android:strokeColor="#33FFFFFF" />
<path
android:fillColor="#00000000"
android:pathData="M19,29L89,29"
android:strokeWidth="0.8"
android:strokeColor="#33FFFFFF" />
<path
android:fillColor="#00000000"
android:pathData="M19,39L89,39"
android:strokeWidth="0.8"
android:strokeColor="#33FFFFFF" />
<path
android:fillColor="#00000000"
android:pathData="M19,49L89,49"
android:strokeWidth="0.8"
android:strokeColor="#33FFFFFF" />
<path
android:fillColor="#00000000"
android:pathData="M19,59L89,59"
android:strokeWidth="0.8"
android:strokeColor="#33FFFFFF" />
<path
android:fillColor="#00000000"
android:pathData="M19,69L89,69"
android:strokeWidth="0.8"
android:strokeColor="#33FFFFFF" />
<path
android:fillColor="#00000000"
android:pathData="M19,79L89,79"
android:strokeWidth="0.8"
android:strokeColor="#33FFFFFF" />
<path
android:fillColor="#00000000"
android:pathData="M29,19L29,89"
android:strokeWidth="0.8"
android:strokeColor="#33FFFFFF" />
<path
android:fillColor="#00000000"
android:pathData="M39,19L39,89"
android:strokeWidth="0.8"
android:strokeColor="#33FFFFFF" />
<path
android:fillColor="#00000000"
android:pathData="M49,19L49,89"
android:strokeWidth="0.8"
android:strokeColor="#33FFFFFF" />
<path
android:fillColor="#00000000"
android:pathData="M59,19L59,89"
android:strokeWidth="0.8"
android:strokeColor="#33FFFFFF" />
<path
android:fillColor="#00000000"
android:pathData="M69,19L69,89"
android:strokeWidth="0.8"
android:strokeColor="#33FFFFFF" />
<path
android:fillColor="#00000000"
android:pathData="M79,19L79,89"
android:strokeWidth="0.8"
android:strokeColor="#33FFFFFF" />
</vector>

@ -1,5 +1,5 @@
<?xml version="1.0" encoding="utf-8"?>
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
<androidx.core.widget.NestedScrollView xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
@ -67,7 +67,8 @@
<androidx.recyclerview.widget.RecyclerView
android:id="@+id/labeled_values_recycler_view"
android:layout_width="match_parent"
android:layout_height="wrap_content"/>
android:layout_height="wrap_content"
android:nestedScrollingEnabled="false"/>
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
@ -95,7 +96,8 @@
<androidx.recyclerview.widget.RecyclerView
android:id="@+id/file_views_recycler_view"
android:layout_width="match_parent"
android:layout_height="wrap_content"/>
android:layout_height="wrap_content"
android:nestedScrollingEnabled="false" />
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
@ -139,4 +141,4 @@
</LinearLayout>
</ScrollView>
</androidx.core.widget.NestedScrollView>

@ -47,7 +47,7 @@
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="32dp"
android:text="More colors"
android:text="@string/more_colors"
android:background="@drawable/text_background_gradient"
android:padding="5dp"
android:textColor="?attr/textOnTextBgColor"
@ -64,6 +64,7 @@
android:layout_marginStart="16dp"
app:layout_constraintBottom_toBottomOf="@+id/moreColorsSwitchText"
app:layout_constraintStart_toEndOf="@+id/moreColorsSwitchText"
app:layout_constraintTop_toTopOf="@+id/moreColorsSwitchText" />
app:layout_constraintTop_toTopOf="@+id/moreColorsSwitchText"
tools:ignore="UseSwitchCompatOrMaterialXml" />
</androidx.constraintlayout.widget.ConstraintLayout>

@ -1,5 +1,5 @@
<?xml version="1.0" encoding="utf-8"?>
<adaptive-icon xmlns:android="http://schemas.android.com/apk/res/android">
<background android:drawable="@color/ic_launcher_background"/>
<foreground android:drawable="@drawable/ic_launcher_foreground"/>
<foreground android:drawable="@mipmap/ic_launcher_foreground"/>
</adaptive-icon>

@ -1,5 +1,5 @@
<?xml version="1.0" encoding="utf-8"?>
<adaptive-icon xmlns:android="http://schemas.android.com/apk/res/android">
<background android:drawable="@color/ic_launcher_background"/>
<foreground android:drawable="@drawable/ic_launcher_foreground"/>
<foreground android:drawable="@mipmap/ic_launcher_foreground"/>
</adaptive-icon>

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.9 KiB

After

Width:  |  Height:  |  Size: 4.5 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 37 KiB

After

Width:  |  Height:  |  Size: 9.4 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 3.9 KiB

After

Width:  |  Height:  |  Size: 6.3 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.3 KiB

After

Width:  |  Height:  |  Size: 3.0 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 18 KiB

After

Width:  |  Height:  |  Size: 4.9 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 2.5 KiB

After

Width:  |  Height:  |  Size: 4.0 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 2.6 KiB

After

Width:  |  Height:  |  Size: 6.7 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 61 KiB

After

Width:  |  Height:  |  Size: 16 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 5.6 KiB

After

Width:  |  Height:  |  Size: 9.3 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 4.1 KiB

After

Width:  |  Height:  |  Size: 12 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 121 KiB

After

Width:  |  Height:  |  Size: 38 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 8.5 KiB

After

Width:  |  Height:  |  Size: 17 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 5.6 KiB

After

Width:  |  Height:  |  Size: 18 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 195 KiB

After

Width:  |  Height:  |  Size: 70 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 12 KiB

After

Width:  |  Height:  |  Size: 26 KiB

@ -13,4 +13,5 @@
<string name="number_of_people">Anzahl der Personen :</string>
<string name="status">Status :</string>
<string name="temperature">Temperatur :</string>
<string name="more_colors">Mehr Farben</string>
</resources>

@ -13,4 +13,5 @@
<string name="number_of_people">Número de personas:</string>
<string name="open">Abierto</string>
<string name="closed">Cerrado</string>
<string name="more_colors">Mas colores</string>
</resources>

@ -13,4 +13,5 @@
<string name="number_of_people">Nombre de personnes :</string>
<string name="open">Ouvert</string>
<string name="closed">Fermé</string>
<string name="more_colors">Plus de couleurs</string>
</resources>

@ -13,4 +13,5 @@
<string name="number_of_people">人々の数 </string>
<string name="status">状態 </string>
<string name="temperature">温度:</string>
<string name="more_colors">より多くの色</string>
</resources>

@ -13,4 +13,5 @@
<string name="number_of_people">Число людей :</string>
<string name="open">Открыть</string>
<string name="closed">Закрыто</string>
<string name="more_colors">Больше цветов</string>
</resources>

@ -14,4 +14,5 @@
<string name="open">Otvorené</string>
<string name="closed">Zatvorené</string>
<string name="temperature">Teplota :</string>
<string name="more_colors">Viac farieb</string>
</resources>

@ -13,4 +13,5 @@
<string name="number_of_people">人数 </string>
<string name="temperature">温度 </string>
<string name="status">地位 </string>
<string name="more_colors">更多颜色</string>
</resources>

@ -1,4 +1,4 @@
<?xml version="1.0" encoding="utf-8"?>
<resources>
<color name="ic_launcher_background">#84ABFC</color>
<color name="ic_launcher_background">#3DDC84</color>
</resources>

@ -17,4 +17,5 @@
<string name="files">Files</string>
<string name="dark_theme">Dark theme</string>
<string name="more_colors">More colors</string>
</resources>

15
websites/.vscode/launch.json vendored Normal file

@ -0,0 +1,15 @@
{
// Use IntelliSense to learn about possible attributes.
// Hover to view descriptions of existing attributes.
// For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
"version": "0.2.0",
"configurations": [
{
"type": "chrome",
"request": "launch",
"name": "Launch Chrome against localhost",
"url": "http://localhost:8080",
"webRoot": "${workspaceFolder}"
}
]
}

@ -1,210 +1,114 @@
/* elements */
body{
background-color: #00B4D8;
/* ---------- Základné štýly ---------- */
header {
background-image: url(header-background.jpg);
}
body {
background-image: url(header-background.jpg);
margin: 0;
}
header{
background-color:#0077B6;
padding-bottom: 23px;
}
img{
padding-top: 25px;
padding-left: 25px;
}
nav{
float: right;
position: sticky;
}
ul{
margin: 0;
margin-left: 280px;
}
li{
padding-top: 50px;
padding-bottom: 48px;
padding-left: 50px;
padding-right: 50px;
margin-right: -5px;
display: inline-block;
font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
font-size: 20px;
transition: background-color 0.5s;
position: relative;
}
#contact{
margin: 0;
}
li:hover{
background-color: rgba(79, 80, 80, 0.356);
transition: ease-in-out;
transition: background-color 0.5s;
}
a{
text-decoration: none;
color: #FFFFFF;
}
label{
visibility: collapse;
user-select: none;
}
/* classes */
.expandable{
visibility: collapse;
display: block;
margin-left: 0;
padding-top: 10px;
padding-bottom: 10px;
text-decoration: none;
color: black;
font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
font-size: 20px;
text-align: center;
/* ---------- Navigačná lišta (navbar) ---------- */
.list {
margin: 0px;
padding: 1rem 0;
display: flex;
justify-content: flex-end;
align-items: center;
}
.an{
.item {
list-style: none;
margin-right: 3rem;
cursor: pointer;
}
.item:first-child {
margin-right: auto;
margin-left: 1.3rem;
}
.itemImg {
margin-right: auto;
margin-left: 1.3rem;
}
.list li {
color: #FFFFFF;
font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
font-size: 35px;
margin: 0;
margin-top: 340px;
margin-left: 150px;
font-size: 20px;
}
/* IDs */
#here{
margin-top: 150px;
.list li:hover {
color: chartreuse;
transition: color 0.2s ease-in-out;
}
#phone{
width: 200px;
height: 400px;
border: 10px solid grey;
border-radius: 5%;
background-color: black;
margin-left: 150px;
margin-top: 150px;
position: relative;
.wsImg {
border-radius: 10px;
}
#ref{
position: relative;
margin-top: 180px;
margin-left: -30px;
width: 2px;
height: 250px;
border: 2px solid rgba(79, 80, 80, 0.356);
border-radius: 30%;
background: rgba(126, 133, 133, 0.356);
.wsImg:first-child {
margin-right: auto;
}
#ref2{
position: relative;
margin-top: 450px;
margin-left: -30px;
width:50;
border: 3px solid rgba(166, 172, 172, 0.39);
border-radius: 50%;
/* ---------- Burger Menu ---------- */
.burger {
cursor: pointer;
font-size: 40px;
color: white;
display: flex;
visibility: collapse;
margin-right: 2rem;
margin-top: -10px;
position: absolute;
}
#phone, #ref, #ref2, #android{
display: inline;
float: left;
}
#check{
.burgerList {
display: none;
}
/* responsive */
@media (max-width: 1250px){
ul{
@media (max-width: 800px) {
.item {
display: none;
}
.burger {
visibility: visible;
}
.burgerList {
display: none;
flex-direction: column;
align-items: center;
margin-right: 30px;
margin-top: 0px;
margin-left: 0px;
}
}
@media (max-width: 955px){
#check:checked ~ * .expandable{
visibility: visible;
}
ul{
visibility: collapse;
padding: 0;
}
label{
font-size: 40px;
float: right;
margin-top: -90px;
margin-right: 45px;
position: relative;
visibility: visible;
}
.expandable{
visibility: collapse;
display: block;
position: relative;
margin-left: 400px;
text-decoration: none;
color: black;
color: white;
list-style: none;
font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
font-size: 20px;
text-align: center;
}
.menu{
position: relative;
margin-left: -12em;
.bItem {
margin-top: 10px;
}
.appear {
display: flex;
}
}
/* ---------- Hlavná stránka ---------- */
#downloadHolder {
margin-top: 5%;
margin-left: 25%;
display: flex;
justify-content: space-between;
width: 550px;
align-items: center;
}
@media (max-width: 914px){
label{
font-size: 40px;
float: right;
margin-top: -90px;
margin-right: 45px;
position: relative;
}
.menu{
margin-top: -97px;
}
#download {
cursor: pointer;
background-color: none;
color: white;
border: 4px white solid;
border-radius: 50px;
width: auto;
height: 20px;
padding: 10px;
position: static;
font-size: 20px;
font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
}
@media (max-width: 860px){
label{
font-size: 40px;
float: right;
margin-top: -90px;
margin-right: 45px;
position: relative;
}
#download:hover {
background-color: white;
color: rgb(47, 40, 150) ;
}
@media (max-width: 840px){
label{
font-size: 40px;
float: right;
margin-top: -90px;
margin-right: 45px;
position: relative;
}
}
@media (max-width: 692px){
label{
font-size: 40px;
float: right;
margin-top: -90px;
margin-right: 45px;
position: relative;
}
.menu{
margin-top: -217px;
}
}
@media (max-width: 635px){
label{
font-size: 40px;
float: right;
margin-top: -90px;
margin-right: 45px;
position: relative;
}
}
@media (max-width: 618px){
label{
font-size: 40px;
float: right;
margin-top: -90px;
margin-right: 45px;
position: relative;
}
#phoneImg {
width: 350px;
}

33
websites/WikiSpotCon.html Normal file

@ -0,0 +1,33 @@
<!DOCTYPE html>
<html lang="sk">
<head>
<title>WikiSpot</title>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<link rel="stylesheet" href="WikiSpotCSS.css">
<meta name="viewport" content="width=device-width, initial-scale=1">
<script src="appjs.js"></script>
</head>
<body>
<header>
<nav>
<!-- Navigačná lišta /veľká obrazovka/ -->
<ul class="list">
<img src="wikispot-white.png" alt="" class="itemImg">
<li class="item" onclick="location.href = 'WikiSpot.html'">DOMOV</li>
<li class="item" onclick="location.href = 'WikiSpotWS.html'">WIKISPOT</li>
<li class="item" onclick="location.href = 'WikiSpotPro.html'">O PROJEKTE</li>
<li class="item" onclick="location.href = 'WikiSpotCon.html'">KONTAKT</li>
<div class="burger" onclick="bmenu()">&#9776</div>
</ul>
<!-- Navigačná lisťa /malá obrazovka/ -->
<ul class="burgerList" id="bonger">
<li class="bItem">DOMOV</li>
<li class="bItem">WIKISPOT</li>
<li class="bItem">O PROJEKTE</li>
<li class="bItem">KONTAKT</li>
</ul>
</nav>
</header>
</body>
</html>

158
websites/WikiSpotLoc.html Normal file

@ -0,0 +1,158 @@
<!DOCTYPE html>
<html lang="sk">
<head>
<title>WikiSpot</title>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<link rel="stylesheet" href="WikiSpotLoc.css">
<meta name="viewport" content="width=device-width, initial-scale=1">
<script src="desc_short.js"></script>
<script src="click1.js"></script>
<script src="sensors.js"></script>
</head>
<body>
<header>
<img src="wikispot-white.png" alt="wikispot" id="logo" usemap="#navhome">
<map name="navhome">
<area shape="rect" coords="20, 15, 255, 100" href="http://www.spspb.sk/kontakt.html?page_id=91" alt="home">
</map>
<nav>
<ul id="container">
<li id="home" onclick="location.href = 'WikiSpot.html';"><a href="WikiSpot.html">DOMOV</a></li>
<li id="about" onclick="location.href = 'WikiSpotLoc.html';"><a href="WikiSpotLoc.html">WIKISPOT</a></li>
<li id="project" onclick="location.href = 'WikiSpotPro.html';"><a href="WikiSpotPro.html">O PROJEKTE</a></li>
<li id="contact" onclick="location.href = 'http://www.spspb.sk/kontakt.html?page_id=91';"><a href="http://www.spspb.sk/kontakt.html?page_id=91">KONTAKT</a></li>
</ul>
<div class="nav">
<label for="check" id="bmenu">&#9776</label>
<input type="checkbox" id="check">
<table class="menu">
<tr><td><a href="WikiSpot.html" class="expandable">DOMOV</a></td></tr>
<tr><td><a href="WikiSpotLoc.html" class="expandable">WIKISPOT</a></td></tr>
<tr><td><a href="WikiSpotPro.html" class="expandable">PROJEKT</a></td></tr>
<tr><td><a href="#" class="expandable">KOTAKT</a></td></tr>
</table>
</div>
</nav>
</header>
<!--Device select-->
<input type="radio" id="checkExp1" name="pick" class="pickNone">
<input type="radio" id="checkExp2" name="pick" class="pickNone">
<!--1st device-->
<label for="checkExp1">
<section id="wsData1">
<div id="wsBackGround1" class="round_s"></div>
<section id="myData"></section>
<section id="myTitle"></section>
<div id="imgData1">
<img src="http://192.168.1.105:8000/files/0/library.jpg" alt="wsimage1" style="width: 100px; height: 100px;">
</div>
<input type="checkbox" id="checkDesc1" class="none">
<label for="checkDesc1" id="descIcon1" onclick="lul1()"><div id="fuckme1">&#9660</div></label>
<div id="dataExpand1"></div>
</section>
</label>
<section id="wsData1Exp" class="round">
<article id="wsData1desc_l">
<div id="desc_l1"></div>
</article>
<article>
<img src="http://192.168.1.105:8000/files/0/library.jpg" alt="wsData1img" id="wsData1img" style="height: 300px; width: 500px;">
</article>
</section>
<!--2nd device-->
<label for="checkExp2">
<section id="wsData2">
<div id="wsBackGround2" class="round_s"></div>
<section id="myData2"></section>
<section id="myTitle2"></section>
<div id="imgData2">
<img src="http://192.168.1.105:8000/files/0/test.jpg" alt="wsimage2" style="width: 100px; height: 100px;">
</div>
<label for="checkDesc2" id="descIcon2" onclick="lul2()"><div id="fuckme2">&#9660</div></label>
<input type="checkbox" id="checkDesc2" class="none">
<div id="dataExpand2" class="round_s"></div>
</section>
</label>
<section id="wsData2Exp" class="round">
<article id="wsData2desc_l">
<div id="desc_l2"></div>
</article>
<article>
<img src="http://192.168.1.105:8000/files/0/test.jpg" alt="wsData2img" id="wsData2img" style="height: 300px; width: 500px;">
</article>
</section>
</body>
</html>
<!--3rd device-->
<label for="checkExp3">
<section id="wsData3">
<div id="wsBackGround3" class="round_s"></div>
<section id="myData3"></section>
<section id="myTitle3"></section>
<div id="imgData3">
<img src="http://192.168.1.105:8000/files/0/test.jpg" alt="wsimage3" style="width: 100px; height: 100px;">
</div>
<label for="checkDesc3" id="descIcon3" onclick="lul2()"><div id="fuckme3">&#9660</div></label>
<input type="checkbox" id="checkDesc3" class="none">
<div id="dataExpand3"></div>
</section>
</label>
<section id="wsData3Exp" class="round">
<article id="wsData3desc_l">
<div id="desc_l3"></div>
</article>
<article>
<img src="http://192.168.1.105:8000/files/0/test.jpg" alt="wsData3img" id="wsData3img" style="height: 300px; width: 500px;">
</article>
</section>
</body>
</html>
<!--4th device-->
<label for="checkExp4">
<section id="wsData4">
<div id="wsBackGround4" class="round_s"></div>
<section id="myData4"></section>
<section id="myTitle4"></section>
<div id="imgData4">
<img src="http://192.168.1.105:8000/files/0/test.jpg" alt="wsimage4" style="width: 100px; height: 100px;">
</div>
<label for="checkDesc4" id="descIcon4" onclick="lul4()"><div id="fuckme4">&#9660</div></label>
<input type="checkbox" id="checkDesc4" class="none">
<div id="dataExpand4"></div>
</section>
</label>
<section id="wsData4Exp" class="round">
<article id="wsData4desc_l">
<div id="desc_l4"></div>
</article>
<article>
<img src="http://192.168.1.105:8000/files/0/test.jpg" alt="wsData4img" id="wsData4img" style="height: 300px; width: 500px;">
</article>
</section>
</body>
</html>
<!--5th device-->
<label for="checkExp5">
<section id="wsData5">
<div id="wsBackGround5" class="round_s"></div>
<section id="myData5"></section>
<section id="myTitle5"></section>
<div id="imgData5">
<img src="http://192.168.1.105:8000/files/0/test.jpg" alt="wsimage5" style="width: 100px; height: 100px;">
</div>
<label for="checkDesc5" id="descIcon5" onclick="lul5()"><div id="fuckme5">&#9660</div></label>
<input type="checkbox" id="checkDesc5">
<div id="dataExpand5"></div>
</section>
</label>
<section id="wsData5Exp" class="round">
<article id="wsData5desc_l">
<div id="desc_l5"></div>
</article>
<article>
<img src="http://192.168.1.105:8000/files/0/test.jpg" alt="wsData5img" id="wsData5img" style="height: 300px; width: 500px;">
</article>
</section>
</body>
</html>

33
websites/WikiSpotPro.html Normal file

@ -0,0 +1,33 @@
<!DOCTYPE html>
<html lang="sk">
<head>
<title>WikiSpot</title>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<link rel="stylesheet" href="WikiSpotCSS.css">
<meta name="viewport" content="width=device-width, initial-scale=1">
<script src="appjs.js"></script>
</head>
<body>
<header>
<nav>
<!-- Navigačná lišta /veľká obrazovka/ -->
<ul class="list">
<img src="wikispot-white.png" alt="" class="itemImg">
<li class="item" onclick="location.href = 'WikiSpot.html'">DOMOV</li>
<li class="item" onclick="location.href = 'WikiSpotWS.html'">WIKISPOT</li>
<li class="item" onclick="location.href = 'WikiSpotPro.html'">O PROJEKTE</li>
<li class="item" onclick="location.href = 'WikiSpotCon.html'">KONTAKT</li>
<div class="burger" onclick="bmenu()">&#9776</div>
</ul>
<!-- Navigačná lisťa /malá obrazovka/ -->
<ul class="burgerList" id="bonger">
<li class="bItem">DOMOV</li>
<li class="bItem">WIKISPOT</li>
<li class="bItem">O PROJEKTE</li>
<li class="bItem">KONTAKT</li>
</ul>
</nav>
</header>
</body>
</html>

146
websites/WikiSpotWS.html Normal file

@ -0,0 +1,146 @@
<!DOCTYPE html>
<html lang="sk">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="app.css">
<title>Flextest</title>
<script src="appjs.js"></script>
<!-- <script src="click1.js"></script> -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
</head>
<header>
<nav>
<!-- Navigačná lišta /veľká obrazovka/ -->
<ul class="list">
<img src="wikispot-white.png" alt="" class="itemImg">
<li class="item" onclick="location.href = 'WikiSpot.html'">DOMOV</li>
<li class="item" onclick="location.href = 'WikiSpotWS.html'">WIKISPOT</li>
<li class="item" onclick="location.href = 'WikiSpotPro.html'">O PROJEKTE</li>
<li class="item" onclick="location.href = 'WikiSpotCon.html'">KONTAKT</li>
<div class="burger" onclick="bmenu()">&#9776</div>
</ul>
<!-- Navigačná lisťa /malá obrazovka/ -->
<ul class="burgerList" id="bonger">
<li class="bItem">DOMOV</li>
<li class="bItem">WIKISPOT</li>
<li class="bItem">O PROJEKTE</li>
<li class="bItem">KONTAKT</li>
</ul>
</nav>
</header>
<body>
<!-- 2. -->
<!-- Malé zobrazenie -->
<div class="wsList hey" id="wsList2">
<img src="http://192.168.1.105:8000/files/0/library.jpg" alt="#" style="height: 100px;" class="wsImg">
<div class="klol">
<div id="hey2">Kniznica</div>
<div id="hou2">Lorem ipsum dolor sit amet consectetur adipisicing elit. Voluptatem, numquam facilis aut officia.</div>
</div>
<div id="arrow2" class="arrow" onclick="onclick2()">&#9660</div>
</div>
<!-- Rozšírené malé zobrazenie -->
<div id="listExpand2" class="listHide">
<img src="http://192.168.1.105:8000/files/0/library.jpg" alt="#" class="constantImg">
<div class="text">Lorem ipsum dolor sit amet consectetur adipisicing elit. Minus recusandae et repellat saepe modi tenetur provident. Perferendis dolorum odit dolorem delectus consequatur eos, deleniti, pariatur corporis in magnam dolor quam? Consequuntur asperiores provident repellendus itaque tenetur, accusantium aperiam nemo architecto cum magnam amet necessitatibus dolore eaque tempore iusto incidunt nihil voluptatem dolores facilis rem cumque animi perferendis. Error, molestias deserunt.</div>
<div>
<div class="senzory">Teplota</div>
<div id="heat" class="senzory"></div>
</div>
<div class="info"></div>
</div>
<!-- Veľké zobrazenie -->
<div class="big">
<img class="obrazok" src="http://192.168.1.105:8000/files/0/library.jpg" alt="#">
<div class="text">Lorem ipsum dolor sit amet consectetur adipisicing elit. Minus recusandae et repellat saepe modi tenetur provident. Perferendis dolorum odit dolorem delectus consequatur eos, deleniti, pariatur corporis in magnam dolor quam? Consequuntur asperiores provident repellendus itaque tenetur, accusantium aperiam nemo architecto cum magnam amet necessitatibus dolore eaque tempore iusto incidunt nihil voluptatem dolores facilis rem cumque animi perferendis. Error, molestias deserunt.</div>
</div>
<!-- 3. -->
<!-- Malé zobrazenie -->
<div class="wsList hey" id="wsList3">
<img src="http://192.168.1.105:8000/files/0/library.jpg" alt="#" style="height: 100px;" class="wsImg">
<div class="klol">
<div id="hey3">Kniznica</div>
<div id="hou3">Lorem ipsum dolor sit amet consectetur adipisicing elit. Voluptatem, numquam facilis aut officia.</div>
</div>
<div id="arrow3" class="arrow" onclick="onclick3()">&#9660</div>
</div>
<!-- Rozšírené malé zobrazenie -->
<div id="listExpand3" class="listHide">
<img src="http://192.168.1.105:8000/files/0/library.jpg" alt="#" class="constantImg">
<div class="text">Lorem ipsum dolor sit amet consectetur adipisicing elit. Minus recusandae et repellat saepe modi tenetur provident. Perferendis dolorum odit dolorem delectus consequatur eos, deleniti, pariatur corporis in magnam dolor quam? Consequuntur asperiores provident repellendus itaque tenetur, accusantium aperiam nemo architecto cum magnam amet necessitatibus dolore eaque tempore iusto incidunt nihil voluptatem dolores facilis rem cumque animi perferendis. Error, molestias deserunt.</div>
<div>
<div class="senzory">Teplota</div>
<div id="heat" class="senzory"></div>
</div>
<div class="info"></div>
</div>
<!-- Veľké zobrazenie -->
<div class="big">
<img class="obrazok" src="http://192.168.1.105:8000/files/0/library.jpg" alt="#">
<div class="text">Lorem ipsum dolor sit amet consectetur adipisicing elit. Minus recusandae et repellat saepe modi tenetur provident. Perferendis dolorum odit dolorem delectus consequatur eos, deleniti, pariatur corporis in magnam dolor quam? Consequuntur asperiores provident repellendus itaque tenetur, accusantium aperiam nemo architecto cum magnam amet necessitatibus dolore eaque tempore iusto incidunt nihil voluptatem dolores facilis rem cumque animi perferendis. Error, molestias deserunt.</div>
</div>
<!-- 4. -->
<!-- Malé zobrazenie -->
<div class="wsList hey" id="wsList4">
<img src="http://192.168.1.105:8000/files/0/library.jpg" alt="#" style="height: 100px;" class="wsImg">
<div class="klol">
<div id="hey4">Kniznica</div>
<div id="hou4">Lorem ipsum dolor sit amet consectetur adipisicing elit. Voluptatem, numquam facilis aut officia.</div>
</div>
<div id="arrow4" class="arrow" onclick="onclick4()">&#9660</div>
</div>
<!-- Rozšírené malé zobrazenie -->
<div id="listExpand4" class="listHide">
<img src="http://192.168.1.105:8000/files/0/library.jpg" alt="#" class="constantImg">
<div class="text">Lorem ipsum dolor sit amet consectetur adipisicing elit. Minus recusandae et repellat saepe modi tenetur provident. Perferendis dolorum odit dolorem delectus consequatur eos, deleniti, pariatur corporis in magnam dolor quam? Consequuntur asperiores provident repellendus itaque tenetur, accusantium aperiam nemo architecto cum magnam amet necessitatibus dolore eaque tempore iusto incidunt nihil voluptatem dolores facilis rem cumque animi perferendis. Error, molestias deserunt.</div>
<div>
<div class="senzory">Teplota</div>
<div id="heat" class="senzory"></div>
</div>
<div class="info"></div>
</div>
<!-- Veľké zobrazenie -->
<div class="big">
<img class="obrazok" src="http://192.168.1.105:8000/files/0/library.jpg" alt="#">
<div class="text">Lorem ipsum dolor sit amet consectetur adipisicing elit. Minus recusandae et repellat saepe modi tenetur provident. Perferendis dolorum odit dolorem delectus consequatur eos, deleniti, pariatur corporis in magnam dolor quam? Consequuntur asperiores provident repellendus itaque tenetur, accusantium aperiam nemo architecto cum magnam amet necessitatibus dolore eaque tempore iusto incidunt nihil voluptatem dolores facilis rem cumque animi perferendis. Error, molestias deserunt.</div>
</div>
<!-- 5. -->
<!-- Malé zobrazenie -->
<div class="wsList hey" id="wsList5">
<img src="http://192.168.1.105:8000/files/0/library.jpg" alt="#" style="height: 100px;" class="wsImg">
<div class="klol">
<div id="hey5">Kniznica</div>
<div id="hou5">Lorem ipsum dolor sit amet consectetur adipisicing elit. Voluptatem, numquam facilis aut officia.</div>
</div>
<div id="arrow5" class="arrow" onclick="onclick5()">&#9660</div>
</div>
<!-- Rozšírené malé zobrazenie -->
<div id="listExpand5" class="listHide">
<img src="http://192.168.1.105:8000/files/0/library.jpg" alt="#" class="constantImg">
<div class="text">Lorem ipsum dolor sit amet consectetur adipisicing elit. Minus recusandae et repellat saepe modi tenetur provident. Perferendis dolorum odit dolorem delectus consequatur eos, deleniti, pariatur corporis in magnam dolor quam? Consequuntur asperiores provident repellendus itaque tenetur, accusantium aperiam nemo architecto cum magnam amet necessitatibus dolore eaque tempore iusto incidunt nihil voluptatem dolores facilis rem cumque animi perferendis. Error, molestias deserunt.</div>
<div>
<div class="senzory">Teplota</div>
<div id="heat" class="senzory"></div>
</div>
<div class="info"></div>
</div>
<!-- Veľké zobrazenie -->
<div class="big">
<img class="obrazok" src="http://192.168.1.105:8000/files/0/library.jpg" alt="#">
<div class="text">Lorem ipsum dolor sit amet consectetur adipisicing elit. Minus recusandae et repellat saepe modi tenetur provident. Perferendis dolorum odit dolorem delectus consequatur eos, deleniti, pariatur corporis in magnam dolor quam? Consequuntur asperiores provident repellendus itaque tenetur, accusantium aperiam nemo architecto cum magnam amet necessitatibus dolore eaque tempore iusto incidunt nihil voluptatem dolores facilis rem cumque animi perferendis. Error, molestias deserunt.</div>
</div>
<script src="desc_short.js"></script>
</body>
</html>

278
websites/app.css Normal file

@ -0,0 +1,278 @@
/* ---------- Základné štýly ---------- */
header {
background-image: url(header-background.jpg);
}
body {
background-image: url(header-background.jpg);
margin: 0;
user-select: none;
}
/* ---------- Navigačná lišta (navbar) ---------- */
.list {
margin: 0px;
padding: 1rem 0;
display: flex;
justify-content: flex-end;
align-items: center;
}
.item {
list-style: none;
margin-right: 3rem;
cursor: pointer;
}
.item:first-child {
margin-right: auto;
margin-left: 1.3rem;
}
.itemImg {
margin-right: auto;
margin-left: 1.3rem;
}
.list li {
color: #FFFFFF;
font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
font-size: 20px;
}
.list li:hover {
color: chartreuse;
transition: color 0.2s ease-in-out;
}
.wsImg {
border-radius: 10px;
}
.wsImg:first-child {
margin-right: auto;
}
/* ---------- Burger Menu ---------- */
.burger {
cursor: pointer;
font-size: 40px;
color: white;
display: flex;
visibility: collapse;
margin-right: 2rem;
margin-top: -10px;
position: absolute;
}
.burgerList {
display: none;
}
/* ---------- 1 ---------- */
#list1 {
cursor: pointer;
height: 40px;
width: 40px;
font-size: 40px;
margin-right: 30px;
margin-top: 28px;
transition: transform 0.5s ease-in-out;
}
#hey1 {
font-weight: bold;
margin-top: 15px;
}
#hou1 {
margin-top: 50px;
margin-left: -60px;
}
/* ---------- 2 ---------- */
#list2 {
cursor: pointer;
height: 40px;
width: 40px;
font-size: 40px;
margin-right: 30px;
margin-top: 28px;
transition: transform 0.5s ease-in-out;
}
#hey2 {
font-weight: bold;
margin-top: 15px;
}
#hou2 {
margin-top: 50px;
margin-left: -60px;
}
/* ---------- 3 ---------- */
#list3 {
cursor: pointer;
height: 40px;
width: 40px;
font-size: 40px;
margin-right: 30px;
margin-top: 28px;
transition: transform 0.5s ease-in-out;
}
#hey3 {
font-weight: bold;
margin-top: 15px;
}
#hou3 {
margin-top: 50px;
margin-left: -60px;
}
/* ---------- 4 ---------- */
#list4 {
cursor: pointer;
height: 40px;
width: 40px;
font-size: 40px;
margin-right: 30px;
margin-top: 28px;
transition: transform 0.5s ease-in-out;
}
#hey4 {
font-weight: bold;
margin-top: 15px;
}
#hou4 {
margin-top: 50px;
margin-left: -60px;
}
/* ---------- 5 ---------- */
#list5 {
cursor: pointer;
height: 40px;
width: 40px;
font-size: 40px;
margin-right: 30px;
margin-top: 28px;
transition: transform 0.5s ease-in-out;
}
#hey5 {
font-weight: bold;
margin-top: 15px;
}
#hou5 {
margin-top: 50px;
margin-left: -60px;
}
/* ---------- Zdieľané štýly (classes) ---------- */
.wsList {
background: white;
width: 550px;
height: 100px;
border-radius: 10px;
margin-left: 20px;
margin-top: 5px;
}
.hey {
display: flex;
flex-direction: row;
justify-content: flex-end;
}
.klol {
display: flex;
flex-direction: row;
justify-content: flex-end;
margin-bottom: 10px;
margin-left: 10px;
font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
}
.constantImg {
grid-area: obrazok;
display: flex;
width: 300px;
height: 300px;
top: 250px;
left: 50px;
transition: display 1s 1s;
}
.mystyle {
transform: rotate(180deg);
}
.appear {
display: flex;
}
.arrow {
cursor: pointer;
height: 40px;
width: 40px;
font-size: 40px;
margin-right: 30px;
margin-top: 28px;
transition: transform 0.5s ease-in-out;
}
/* ---------- Grid Layout ---------- */
.obrazok {
grid-area: obrazok;
width: 500px;
height: 300px;
margin-left: 25px;
}
.text {
grid-area: description;
}
.senzory {
grid-area: senzory;
}
.info {
grid-area: info;
}
.listHide {
display: none;
background: #ffffff;
}
.expand {
display: grid;
grid-template-columns: 1.3fr 0.7fr;
grid-template-rows: 1fr 1fr;
gap: 5px 5px;
grid-template-areas:
"obrazok senzory"
"description info";
margin-top: 2px;
margin-left: 20px;
margin-bottom: 2px;
border-radius: 10px;
height: 600px;
width: 550px;
}
.big {
display: grid;
grid-template-columns: 1.3fr 0.7fr;
grid-template-rows: 1fr 1fr;
gap: 5px 5px;
grid-template-areas:
"obrazok senzory"
"description info";
position: absolute;
border-radius: 10px;
left: 650px;
top: 117px;
height: 700px;
width: 900px;
background: royalblue;
align-items: center;
}
.appear {
display: flex;
}
/* ---------- Responzívnosť (media tag) ---------- */
@media (max-width: 1000px) {
.big {
display: none;
}
}
@media (max-width: 800px) {
.item {
display: none;
}
.burger {
visibility: visible;
}
.burgerList {
display: none;
flex-direction: column;
align-items: center;
margin-right: 30px;
margin-top: 0px;
color: white;
list-style: none;
font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
font-size: 20px;
}
.bItem {
margin-top: 10px;
}
}

44
websites/appjs.js Normal file

@ -0,0 +1,44 @@
function onclick1() {
var click = document.getElementById("arrow1");
click.classList.toggle("mystyle");
var expand = document.getElementById("listExpand1");
expand.classList.toggle("expand");
var appear = document.getElementById("roko1");
appear.classList.toggle("appear");
}
function onclick2() {
var click = document.getElementById("arrow2");
click.classList.toggle("mystyle");
var expand = document.getElementById("listExpand2");
expand.classList.toggle("expand");
var appear = document.getElementById("roko2");
appear.classList.toggle("appear");
}
function onclick3() {
var click = document.getElementById("arrow3");
click.classList.toggle("mystyle");
var expand = document.getElementById("listExpand3");
expand.classList.toggle("expand");
var appear = document.getElementById("roko3");
appear.classList.toggle("appear");
}
function onclick4() {
var click = document.getElementById("arrow4");
click.classList.toggle("mystyle");
var expand = document.getElementById("listExpand4");
expand.classList.toggle("expand");
var appear = document.getElementById("roko4");
appear.classList.toggle("appear");
}
function onclick5() {
var click = document.getElementById("arrow5");
click.classList.toggle("mystyle");
var expand = document.getElementById("listExpand5");
expand.classList.toggle("expand");
var appear = document.getElementById("roko5");
appear.classList.toggle("appear");
}
function bmenu() {
var burger = document.getElementById("bonger");
burger.classList.toggle("appear")
}

118
websites/desc_short.js Normal file

@ -0,0 +1,118 @@
// fetch("http://192.168.1.105:8000/devices_list")
// .then(function(response){
// return response.json();
// })
// .then(function(data){
// appendData(data);
// })
// .catch(function(err){
// console.log(err);
// });
// function appendData(data){
// console.log(data);
// console.log(data[1]["files"][0]);
// var myJson = JSON.stringify(data[1]["description"]["description_s"]);
// var myJson1 = JSON.stringify(data[1]["description"]["title"]);
// var myJson2 = JSON.stringify(data[1]["description"]["description_l"]);
// var uJson = myJson.replace(/\"/g, "");
// var str = (uJson);
// var str_esc = escape(str);
// console.log(str_esc + "<br>" + myJson1);
// console.log(unescape(str_esc));
// var mainContainer = document.getElementById("hou1");
// var div = document.createElement("div");
// div.setAttribute("id", "hou");
// div.innerHTML = unescape(str_esc);
// mainContainer.appendChild(div);
// var mainContainer1 = document.getElementById("hey1");
// var uJson1 = myJson1.replace(/\"/g, "");
// var div1 = document.createElement("div");
// div1.setAttribute("id", "hey");
// div1.innerHTML = unescape(escape(uJson1));
// var uJson1 = myJson1.replace(/\"/g, "");
// mainContainer1.appendChild(div1);
// }
$(document).ready(function() {
let urls = ["http://192.168.1.105:8000/files/0/library.jpg", "http://192.168.1.105:8000/files/0/library.jpg", "http://192.168.1.105:8000/files/0/library.jpg"];
let descriptions = ["here", "there"];
let n = 1;
function append_element(urls, descriptions, n) {
let template = `<div class="wsList hey">
<div ></div>
<img src="${urls[0]}" alt="#" style="height: 100px;" class="wsImg">
<div class="klol">
<div id="hey1"></div>
<div id="hou1"></div>
</div>
<div id="arrow${n}" class="arrow" onclick="onclick${n}()">&#9660</div>
</div>
<!-- Rozšírené malé zobrazenie -->
<div id="listExpand${n}" class="listHide">
<img src="${urls[1]}" alt="#" class="constantImg">
<div class="text">${descriptions[0]}</div>
<div>
<div class="senzory">Teplota</div>
<div id="heat" class="senzory"></div>
</div>
<div class="info"></div>
</div>
<!-- Veľké zobrazenie -->
<div class="big">
<img class="obrazok" src="${urls[2]}" alt="#">
<div class="text">${descriptions[1]}</div>
</div>`;
$("body").append(template);
}
append_element(urls, descriptions, n);
$.get("http://192.168.1.105:8000/devices_list", function(data) {
console.log(data);
var myJson = JSON.stringify(data[1]["description"]["description_s"]);
var myJson1 = JSON.stringify(data[1]["description"]["title"]);
console.log(myJson);
console.log(myJson1);
uJson = myJson.replace(/\"/g, "");
var str = (uJson);
var str_esc = escape(str);
console.log(str_esc + "<br>" + myJson);
console.log(unescape(str_esc));
var main = document.getElementById("hou1");
var div = document.createElement("div");
div.setAttribute("id", "hou");
div.innerHTML = unescape(str_esc);
main.appendChild(div);
var sub = document.getElementById("hey1");
var uJson1 = myJson1.replace(/\"/g, "");
var div1 = document.createElement("div");
div1.setAttribute("id", "hey");
div1.innerHTML = unescape(escape(uJson1));
sub.appendChild(div1);
ID = 0;
$.get(`http://192.168.1.105:8000/${ID}/sensors`, function(data1) {
console.log(data1);
var sens = JSON.stringify(data1["teplota"]);
console.log(sens);
var uSens = sens.replace(/\"/g, "");
var heat = document.getElementById("heat");
var div2 = document.createElement("div");
div2.setAttribute("id", "hot");
div2.innerHTML = unescape(escape(uSens));
heat.appendChild(div2);
})
})
})

Binary file not shown.

After

Width:  |  Height:  |  Size: 81 KiB

@ -1,41 +1,37 @@
<!DOCTYPE html>
<html lang="en">
<html lang="sk">
<head>
<title>Travellly</title>
<link rel="stylesheet" href="WikiSpotCSS.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<title>WikiSpot</title>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<link rel="stylesheet" href="WikiSpotCSS.css">
<meta name="viewport" content="width=device-width, initial-scale=1">
<script src="appjs.js"></script>
</head>
<header>
<nav>
<!-- Navigačná lišta /veľká obrazovka/ -->
<ul class="list">
<img src="wikispot-white.png" alt="" class="itemImg">
<li class="item" onclick="location.href = 'WikiSpot.html'">DOMOV</li>
<li class="item" onclick="location.href = 'WikiSpotWS.html'">WIKISPOT</li>
<li class="item" onclick="location.href = 'WikiSpotPro.html'">O PROJEKTE</li>
<li class="item" onclick="location.href = 'WikiSpotCon.html'">KONTAKT</li>
<div class="burger" onclick="bmenu()">&#9776</div>
</ul>
<!-- Navigačná lisťa /malá obrazovka/ -->
<ul class="burgerList" id="bonger">
<li class="bItem">DOMOV</li>
<li class="bItem">WIKISPOT</li>
<li class="bItem">O PROJEKTE</li>
<li class="bItem">KONTAKT</li>
</ul>
</nav>
</header>
<body>
<header>
<img src="wikispot.png" alt="wikispot" id="logo">
<nav>
<ul id="container">
<li id="home"><a href="travellly.html">HOME</a></li>
<li id="about"><a href="http://www.spspb.sk/o-skole.html?page_id=95">O NÁS</a></li>
<li id="project"><a href="http://www.spspb.sk/partneri.html?page_id=1362">O PROJEKTE</a></li>
<li id="contact"><a href="http://www.spspb.sk/kontakt.html?page_id=91">KONTAKT</a></li>
</ul>
<div class="nav">
<label for="check" id="bmenu">&#9776</label>
<input type="checkbox" id="check">
<table class="menu">
<tr><td><a href="#" class="expandable">HOME</a></td></tr>
<tr><td><a href="#" class="expandable">ABOUT</a></td></tr>
<tr><td><a href="#" class="expandable">PROJECT</a></td></tr>
<tr><td><a href="#" class="expandable">CONTACT</a></td></tr>
</table>
</div>
</nav>
</header>
<!--<article>
<div class="an" class="next" id="android"><a href="http://localhost:8000/files/0/PQ.apk">Android</a></div>
</article>
<section>
<div id="phone" class="next"></div>
<div id="ref"></div>
<div id="ref2"></div>
</section>-->
<div id="downloadHolder">
<div id="download">SŤIAHNUŤ &#9660</div>
<div id="phone"><img src="samsung1.png" alt="" id="phoneImg"></div>
</div>
</body>
</html>

BIN
websites/samsung1.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 338 KiB

BIN
websites/wikispot-white.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.8 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 3.6 KiB