Hugging Face's logo

Spaces:
Test-caninet
/
Telemap-readysearchsystem
Sleeping

App Files Community
flpolprojects commited on
Commit
27a053f
·
verified ·
1 Parent(s): 56243df

Update app.py

Browse files
Files changed (1) hide show
  1. app.py +53 -52
app.py CHANGED
@@ -78,34 +78,34 @@ def check_premium_status():
78
  if updated:
79
  save_markers(markers)
80
 
81
- # HTML-шаблон с улучшенным дизайном
82
  html_template = '''
83
  <!DOCTYPE html>
84
  <html lang="ru">
85
  <head>
86
  <meta charset="UTF-8">
87
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
88
- <title>GeoGram</title>
89
  <link rel="stylesheet" href="https://unpkg.com/leaflet/dist/leaflet.css">
90
  <style>
91
  /* Общие стили */
92
  body {
93
  font-family: 'Roboto', sans-serif;
94
- background: linear-gradient(135deg, #483D8B, #2c3e50);
95
  margin: 0;
96
  padding: 0;
97
- color: #fff; /* Белый текст */
98
  overflow-x: hidden;
99
  }
100
  h1 {
101
  text-align: center;
102
  padding: 20px;
103
  margin: 0;
104
- background: linear-gradient(135deg, #6a0dad, #483D8B);
105
  color: white;
106
- font-size: 28px;
107
- letter-spacing: 2px;
108
- text-shadow: 2px 2px 5px rgba(0, 0, 0, 0.7);
109
  }
110
  #map {
111
  height: 90vh;
@@ -126,27 +126,28 @@ html_template = '''
126
  border: none;
127
  border-radius: 30px 0 0 30px;
128
  font-size: 16px;
129
- background: #34495e;
130
  color: #fff;
131
  outline: none;
132
  transition: background 0.3s ease;
 
133
  }
134
  #search-input:focus {
135
- background: #2c3e50;
136
  }
137
  #search-button {
138
  padding: 15px 30px;
139
- background: linear-gradient(135deg, #6a0dad, #483D8B);
140
  color: white;
141
  border: none;
142
  border-radius: 0 30px 30px 0;
143
  cursor: pointer;
144
  font-size: 16px;
145
  transition: background 0.3s ease;
146
- box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.5);
147
  }
148
  #search-button:hover {
149
- background: linear-gradient(135deg, #483D8B, #6a0dad);
150
  }
151
 
152
  /* Результаты поиска */
@@ -155,21 +156,21 @@ html_template = '''
155
  text-align: center;
156
  }
157
  .result-item {
158
- background: linear-gradient(135deg, #34495e, #2c3e50);
159
- border: 1px solid rgba(106, 13, 173, 0.5);
160
  border-radius: 15px;
161
  margin: 10px auto;
162
  padding: 20px;
163
  max-width: 500px;
164
  transition: transform 0.3s ease, box-shadow 0.3s ease;
165
- box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.5);
166
  }
167
  .result-item:hover {
168
  transform: translateY(-5px);
169
- box-shadow: 0px 8px 16px rgba(0, 0, 0, 0.7);
170
  }
171
  .result-item b {
172
- color: #fff;
173
  font-size: 18px;
174
  }
175
  .result-item p {
@@ -177,7 +178,7 @@ html_template = '''
177
  margin: 5px 0;
178
  }
179
  .result-item a {
180
- color: #fff;
181
  text-decoration: none;
182
  font-weight: bold;
183
  }
@@ -185,7 +186,7 @@ html_template = '''
185
  text-decoration: underline;
186
  }
187
  .result-item button {
188
- background: linear-gradient(135deg, #6a0dad, #483D8B);
189
  color: white;
190
  border: none;
191
  padding: 10px 20px;
@@ -193,18 +194,18 @@ html_template = '''
193
  cursor: pointer;
194
  font-size: 14px;
195
  transition: background 0.3s ease;
196
- box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.5);
197
  }
198
  .result-item button:hover {
199
- background: linear-gradient(135deg, #483D8B, #6a0dad);
200
  }
201
 
202
  /* Окно добавления метки */
203
  .popup-form {
204
- background: linear-gradient(135deg, #34495e, #2c3e50);
205
  border-radius: 15px;
206
  padding: 20px;
207
- box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.5);
208
  width: 300px;
209
  }
210
  .popup-form input,
@@ -214,17 +215,17 @@ html_template = '''
214
  border: none;
215
  border-radius: 10px;
216
  font-size: 14px;
217
- background: #483D8B;
218
  color: #fff;
219
  outline: none;
220
  transition: background 0.3s ease;
221
  }
222
  .popup-form input:focus,
223
  .popup-form textarea:focus {
224
- background: #6a0dad;
225
  }
226
  .popup-form button {
227
- background: linear-gradient(135deg, #6a0dad, #483D8B);
228
  color: white;
229
  border: none;
230
  padding: 12px;
@@ -232,37 +233,37 @@ html_template = '''
232
  cursor: pointer;
233
  font-size: 14px;
234
  transition: background 0.3s ease;
235
- box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.5);
236
  }
237
  .popup-form button:hover {
238
- background: linear-gradient(135deg, #483D8B, #6a0dad);
239
  }
240
 
241
  /* Попапы на карте */
242
  .leaflet-popup-content-wrapper {
243
- background: linear-gradient(135deg, #34495e, #2c3e50);
244
  border-radius: 15px;
245
  padding: 15px;
246
- box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.5);
247
  }
248
  .leaflet-popup-content {
249
  color: #fff;
250
  }
251
  .leaflet-popup-content b {
252
- color: #fff;
253
  font-size: 18px;
254
  display: block;
255
  margin-bottom: 5px;
256
  }
257
  .leaflet-popup-content a {
258
- color: #fff;
259
  text-decoration: none;
260
  }
261
  .leaflet-popup-content a:hover {
262
  text-decoration: underline;
263
  }
264
  .leaflet-popup-content button {
265
- background: linear-gradient(135deg, #6a0dad, #483D8B);
266
  color: white;
267
  border: none;
268
  padding: 10px 20px;
@@ -270,24 +271,24 @@ html_template = '''
270
  cursor: pointer;
271
  font-size: 14px;
272
  transition: background 0.3s ease;
273
- box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.5);
274
  }
275
  .leaflet-popup-content button:hover {
276
- background: linear-gradient(135deg, #483D8B, #6a0dad);
277
  }
278
 
279
  /* Маркеры */
280
  .marker-logo {
281
- width: 25px;
282
- height: 25px;
283
  border-radius: 50%;
284
- border: 2px solid #6a0dad;
285
- box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.5);
286
  }
287
  </style>
288
  </head>
289
  <body>
290
- <h1>GeoGram</h1>
291
  <div id="search-container">
292
  <input type="text" id="search-input" placeholder="Поиск по названию или описанию" />
293
  <button id="search-button">Поиск</button>
@@ -330,8 +331,8 @@ html_template = '''
330
  const customIcon = L.divIcon({
331
  className: 'custom-icon',
332
  html: `<img src="${marker.logo_link || 'https://simpleicon.com/wp-content/uploads/map-marker-1.png'}" class="marker-logo"/>`,
333
- iconSize: [25, 25],
334
- iconAnchor: [12.5, 25]
335
  });
336
 
337
  const markerObj = L.marker([marker.latitude, marker.longitude], {icon: customIcon}).addTo(map);
@@ -350,7 +351,7 @@ html_template = '''
350
  ${premiumLabel}
351
  <b>${marker.name}</b>
352
  <p>${marker.description}</p>
353
- <button style="background: linear-gradient(135deg, #6a0dad, #483D8B);
354
  color: white;
355
  border: none;
356
  padding: 10px 20px;
@@ -358,7 +359,7 @@ html_template = '''
358
  cursor: pointer;
359
  font-size: 14px;
360
  transition: background 0.3s ease;
361
- box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.5);"
362
  onclick="window.open('https://t.me/${marker.telegram_link}', '_blank')">
363
  Перейти в Telegram
364
  </button><br>
@@ -412,8 +413,8 @@ html_template = '''
412
  const customIcon = L.divIcon({
413
  className: 'custom-icon',
414
  html: `<img src="${data.logo_link}" class="marker-logo"/>`,
415
- iconSize: [25, 25],
416
- iconAnchor: [12.5, 25]
417
  });
418
 
419
  const markerObj = L.marker([data.latitude, data.longitude], {icon: customIcon}).addTo(map);
@@ -426,7 +427,7 @@ html_template = '''
426
  ${premiumLabel}
427
  <b>${data.name}</b>
428
  <p>${data.description}</p>
429
- <button style="background: linear-gradient(135deg, #6a0dad, #483D8B);
430
  color: white;
431
  border: none;
432
  padding: 10px 20px;
@@ -434,7 +435,7 @@ html_template = '''
434
  cursor: pointer;
435
  font-size: 14px;
436
  transition: background 0.3s ease;
437
- box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.5);"
438
  onclick="window.open('https://t.me/${data.telegram_link}', '_blank')">
439
  Перейти в Telegram
440
  </button><br>
@@ -554,7 +555,7 @@ html_template = '''
554
  <p>${marker.description}</p>
555
  <p>Расстояние: ${marker.distance.toFixed(2)} км</p>
556
  <p>Статус: ${marker.premium ? 'Премиум' + premiumLabel : 'Обычная'}</p>
557
- <button style="background: linear-gradient(135deg, #6a0dad, #483D8B);
558
  color: white;
559
  border: none;
560
  padding: 10px 20px;
@@ -562,7 +563,7 @@ html_template = '''
562
  cursor: pointer;
563
  font-size: 14px;
564
  transition: background 0.3s ease;
565
- box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.5);"
566
  onclick="window.open('https://t.me/${marker.telegram_link}', '_blank')">
567
  Перейти в Telegram
568
  </button>
@@ -665,4 +666,4 @@ def activate_premium_route():
665
 
666
  if __name__ == '__main__':
667
  init_db()
668
- app.run(debug=True, host='0.0.0.0', port=7860)
 
78
  if updated:
79
  save_markers(markers)
80
 
81
+ # HTML-шаблон с футуристическим дизайном
82
  html_template = '''
83
  <!DOCTYPE html>
84
  <html lang="ru">
85
  <head>
86
  <meta charset="UTF-8">
87
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
88
+ <title>GeoGram 2070</title>
89
  <link rel="stylesheet" href="https://unpkg.com/leaflet/dist/leaflet.css">
90
  <style>
91
  /* Общие стили */
92
  body {
93
  font-family: 'Roboto', sans-serif;
94
+ background: linear-gradient(135deg, #0f0c29, #302b63, #24243e);
95
  margin: 0;
96
  padding: 0;
97
+ color: #fff;
98
  overflow-x: hidden;
99
  }
100
  h1 {
101
  text-align: center;
102
  padding: 20px;
103
  margin: 0;
104
+ background: linear-gradient(135deg, #ff00cc, #333399);
105
  color: white;
106
+ font-size: 32px;
107
+ letter-spacing: 4px;
108
+ text-shadow: 0 0 10px rgba(255, 0, 204, 0.8), 0 0 20px rgba(255, 0, 204, 0.8);
109
  }
110
  #map {
111
  height: 90vh;
 
126
  border: none;
127
  border-radius: 30px 0 0 30px;
128
  font-size: 16px;
129
+ background: #24243e;
130
  color: #fff;
131
  outline: none;
132
  transition: background 0.3s ease;
133
+ box-shadow: 0 0 10px rgba(255, 0, 204, 0.8);
134
  }
135
  #search-input:focus {
136
+ background: #302b63;
137
  }
138
  #search-button {
139
  padding: 15px 30px;
140
+ background: linear-gradient(135deg, #ff00cc, #333399);
141
  color: white;
142
  border: none;
143
  border-radius: 0 30px 30px 0;
144
  cursor: pointer;
145
  font-size: 16px;
146
  transition: background 0.3s ease;
147
+ box-shadow: 0 0 10px rgba(255, 0, 204, 0.8);
148
  }
149
  #search-button:hover {
150
+ background: linear-gradient(135deg, #333399, #ff00cc);
151
  }
152
 
153
  /* Результаты поиска */
 
156
  text-align: center;
157
  }
158
  .result-item {
159
+ background: linear-gradient(135deg, #24243e, #302b63);
160
+ border: 1px solid rgba(255, 0, 204, 0.5);
161
  border-radius: 15px;
162
  margin: 10px auto;
163
  padding: 20px;
164
  max-width: 500px;
165
  transition: transform 0.3s ease, box-shadow 0.3s ease;
166
+ box-shadow: 0 0 10px rgba(255, 0, 204, 0.8);
167
  }
168
  .result-item:hover {
169
  transform: translateY(-5px);
170
+ box-shadow: 0 0 20px rgba(255, 0, 204, 0.8);
171
  }
172
  .result-item b {
173
+ color: #ff00cc;
174
  font-size: 18px;
175
  }
176
  .result-item p {
 
178
  margin: 5px 0;
179
  }
180
  .result-item a {
181
+ color: #ff00cc;
182
  text-decoration: none;
183
  font-weight: bold;
184
  }
 
186
  text-decoration: underline;
187
  }
188
  .result-item button {
189
+ background: linear-gradient(135deg, #ff00cc, #333399);
190
  color: white;
191
  border: none;
192
  padding: 10px 20px;
 
194
  cursor: pointer;
195
  font-size: 14px;
196
  transition: background 0.3s ease;
197
+ box-shadow: 0 0 10px rgba(255, 0, 204, 0.8);
198
  }
199
  .result-item button:hover {
200
+ background: linear-gradient(135deg, #333399, #ff00cc);
201
  }
202
 
203
  /* Окно добавления метки */
204
  .popup-form {
205
+ background: linear-gradient(135deg, #24243e, #302b63);
206
  border-radius: 15px;
207
  padding: 20px;
208
+ box-shadow: 0 0 10px rgba(255, 0, 204, 0.8);
209
  width: 300px;
210
  }
211
  .popup-form input,
 
215
  border: none;
216
  border-radius: 10px;
217
  font-size: 14px;
218
+ background: #302b63;
219
  color: #fff;
220
  outline: none;
221
  transition: background 0.3s ease;
222
  }
223
  .popup-form input:focus,
224
  .popup-form textarea:focus {
225
+ background: #ff00cc;
226
  }
227
  .popup-form button {
228
+ background: linear-gradient(135deg, #ff00cc, #333399);
229
  color: white;
230
  border: none;
231
  padding: 12px;
 
233
  cursor: pointer;
234
  font-size: 14px;
235
  transition: background 0.3s ease;
236
+ box-shadow: 0 0 10px rgba(255, 0, 204, 0.8);
237
  }
238
  .popup-form button:hover {
239
+ background: linear-gradient(135deg, #333399, #ff00cc);
240
  }
241
 
242
  /* Попапы на карте */
243
  .leaflet-popup-content-wrapper {
244
+ background: linear-gradient(135deg, #24243e, #302b63);
245
  border-radius: 15px;
246
  padding: 15px;
247
+ box-shadow: 0 0 10px rgba(255, 0, 204, 0.8);
248
  }
249
  .leaflet-popup-content {
250
  color: #fff;
251
  }
252
  .leaflet-popup-content b {
253
+ color: #ff00cc;
254
  font-size: 18px;
255
  display: block;
256
  margin-bottom: 5px;
257
  }
258
  .leaflet-popup-content a {
259
+ color: #ff00cc;
260
  text-decoration: none;
261
  }
262
  .leaflet-popup-content a:hover {
263
  text-decoration: underline;
264
  }
265
  .leaflet-popup-content button {
266
+ background: linear-gradient(135deg, #ff00cc, #333399);
267
  color: white;
268
  border: none;
269
  padding: 10px 20px;
 
271
  cursor: pointer;
272
  font-size: 14px;
273
  transition: background 0.3s ease;
274
+ box-shadow: 0 0 10px rgba(255, 0, 204, 0.8);
275
  }
276
  .leaflet-popup-content button:hover {
277
+ background: linear-gradient(135deg, #333399, #ff00cc);
278
  }
279
 
280
  /* Маркеры */
281
  .marker-logo {
282
+ width: 30px;
283
+ height: 30px;
284
  border-radius: 50%;
285
+ border: 2px solid #ff00cc;
286
+ box-shadow: 0 0 10px rgba(255, 0, 204, 0.8);
287
  }
288
  </style>
289
  </head>
290
  <body>
291
+ <h1>GeoGram 2070</h1>
292
  <div id="search-container">
293
  <input type="text" id="search-input" placeholder="Поиск по названию или описанию" />
294
  <button id="search-button">Поиск</button>
 
331
  const customIcon = L.divIcon({
332
  className: 'custom-icon',
333
  html: `<img src="${marker.logo_link || 'https://simpleicon.com/wp-content/uploads/map-marker-1.png'}" class="marker-logo"/>`,
334
+ iconSize: [30, 30],
335
+ iconAnchor: [15, 30]
336
  });
337
 
338
  const markerObj = L.marker([marker.latitude, marker.longitude], {icon: customIcon}).addTo(map);
 
351
  ${premiumLabel}
352
  <b>${marker.name}</b>
353
  <p>${marker.description}</p>
354
+ <button style="background: linear-gradient(135deg, #ff00cc, #333399);
355
  color: white;
356
  border: none;
357
  padding: 10px 20px;
 
359
  cursor: pointer;
360
  font-size: 14px;
361
  transition: background 0.3s ease;
362
+ box-shadow: 0 0 10px rgba(255, 0, 204, 0.8);"
363
  onclick="window.open('https://t.me/${marker.telegram_link}', '_blank')">
364
  Перейти в Telegram
365
  </button><br>
 
413
  const customIcon = L.divIcon({
414
  className: 'custom-icon',
415
  html: `<img src="${data.logo_link}" class="marker-logo"/>`,
416
+ iconSize: [30, 30],
417
+ iconAnchor: [15, 30]
418
  });
419
 
420
  const markerObj = L.marker([data.latitude, data.longitude], {icon: customIcon}).addTo(map);
 
427
  ${premiumLabel}
428
  <b>${data.name}</b>
429
  <p>${data.description}</p>
430
+ <button style="background: linear-gradient(135deg, #ff00cc, #333399);
431
  color: white;
432
  border: none;
433
  padding: 10px 20px;
 
435
  cursor: pointer;
436
  font-size: 14px;
437
  transition: background 0.3s ease;
438
+ box-shadow: 0 0 10px rgba(255, 0, 204, 0.8);"
439
  onclick="window.open('https://t.me/${data.telegram_link}', '_blank')">
440
  Перейти в Telegram
441
  </button><br>
 
555
  <p>${marker.description}</p>
556
  <p>Расстояние: ${marker.distance.toFixed(2)} км</p>
557
  <p>Статус: ${marker.premium ? 'Премиум' + premiumLabel : 'Обычная'}</p>
558
+ <button style="background: linear-gradient(135deg, #ff00cc, #333399);
559
  color: white;
560
  border: none;
561
  padding: 10px 20px;
 
563
  cursor: pointer;
564
  font-size: 14px;
565
  transition: background 0.3s ease;
566
+ box-shadow: 0 0 10px rgba(255, 0, 204, 0.8);"
567
  onclick="window.open('https://t.me/${marker.telegram_link}', '_blank')">
568
  Перейти в Telegram
569
  </button>
 
666
 
667
  if __name__ == '__main__':
668
  init_db()
669
+ app.run(debug=True, host='0.0.0.0', port=7860)