Revize b323292b
Přidáno uživatelem Marek Lovčí před asi 4 roky(ů)
| resources/views/categories/index.blade.php | ||
|---|---|---|
| 1 |
@extends('layouts.art')
|
|
| 1 |
@extends('layouts.app')
|
|
| 2 | 2 |
|
| 3 | 3 |
@section('title', 'Categories')
|
| 4 | 4 |
|
| 5 | 5 |
@section('content')
|
| 6 | 6 |
@if(isset($user)) |
| 7 | 7 |
{{--<p><?php dd($categories); ?></p>--}}
|
| 8 |
<div> |
|
| 9 |
<button type="button" class="btn btn-primary button-image monButton"></button> |
|
| 10 |
</div> |
|
| 11 |
<div class="head-title text-center"> |
|
| 12 |
<h1>choose a few topics</h1> |
|
| 13 |
</div> |
|
| 14 |
<div class="content" id="canvas"> |
|
| 8 |
<div class="cat-main-div" onclick="resetEnter()"> |
|
| 9 |
<div class="head-title text-center"> |
|
| 10 |
<h1>choose a topic</h1> |
|
| 11 |
</div> |
|
| 15 | 12 |
{{--@for($k = 1; $k <= count($categories);$k++)--}}
|
| 16 |
@for($k = 1; $k <= 10;$k++) |
|
| 17 |
@if($categorySizes[$k-1] == 1) |
|
| 18 |
<button type="button" class="btn btn-circle rounded-circle btn-categories btn-sm" id="cat-{{$k}}">{{$categoryNames[$k-1]->nameEN}}</button>
|
|
| 19 |
@elseif($categorySizes[$k-1] == 2) |
|
| 20 |
<button type="button" class="btn btn-circle rounded-circle btn-categories btn-dm" id="cat-{{$k}}">{{$categoryNames[$k-1]->nameEN}}</button>
|
|
| 21 |
@else |
|
| 22 |
<button type="button" class="btn btn-circle rounded-circle btn-categories btn-xl" id="cat-{{$k}}">{{$categoryNames[$k-1]->nameEN}}</button>
|
|
| 13 |
@for($k = 0; $k < $count;$k++) |
|
| 14 |
@if($k % 6 == 0) |
|
| 15 |
<div class="row"> |
|
| 16 |
@endif |
|
| 17 |
<div class="col-md-2 cat-col-md-2"> |
|
| 18 |
<a href="{{ url('/category/' . $categoryNames[$k]->id) }}">
|
|
| 19 |
<button class="btn btn-dark cat-tile"> |
|
| 20 |
{{$categoryNames[$k]->nameCZ}}
|
|
| 21 |
</button> |
|
| 22 |
</a> |
|
| 23 |
</div> |
|
| 24 |
@if($k % 6 == 5 || $k + 1 == $count) |
|
| 25 |
</div> |
|
| 23 | 26 |
@endif |
| 24 | 27 |
@endfor |
| 25 | 28 |
</div> |
| 26 |
<script> |
|
| 27 |
function randomCategoryPos(name, countButtons) |
|
| 28 |
{
|
|
| 29 |
var DISTANCE = 360; |
|
| 30 |
var MAX_DISTANCE = 3.5 * DISTANCE; |
|
| 31 |
var sWidth = screen.width; |
|
| 32 |
var positionsX = []; |
|
| 33 |
var positionsY = []; |
|
| 34 |
var types = []; |
|
| 35 |
var offset = 50; |
|
| 36 |
|
|
| 37 |
if(sWidth <= 540) |
|
| 38 |
{
|
|
| 39 |
sWidth -= 100; |
|
| 40 |
DISTANCE = 190; |
|
| 41 |
MAX_DISTANCE = 3.5 * DISTANCE; |
|
| 42 |
offset = 25; |
|
| 43 |
} |
|
| 44 |
else |
|
| 45 |
{
|
|
| 46 |
if(sWidth > 720) |
|
| 47 |
{
|
|
| 48 |
sWidth = 720; |
|
| 49 |
} |
|
| 50 |
} |
|
| 51 |
console.log(DISTANCE+ "dis\n"); |
|
| 52 |
console.log(MAX_DISTANCE+ "max_dis\n"); |
|
| 53 |
for(var i = 0; i < countButtons; i++) |
|
| 54 |
{
|
|
| 55 |
var size = document.getElementById(name + (i+1)).className; |
|
| 56 |
var type; |
|
| 57 |
if(size.includes("btn-sm"))
|
|
| 58 |
{
|
|
| 59 |
if(sWidth <= 540) |
|
| 60 |
{
|
|
| 61 |
type = 45; |
|
| 62 |
} |
|
| 63 |
else |
|
| 64 |
{
|
|
| 65 |
type = 60; |
|
| 66 |
} |
|
| 67 |
} |
|
| 68 |
else if(size.includes("btn-dm"))
|
|
| 69 |
{
|
|
| 70 |
if(sWidth <= 540) |
|
| 71 |
{
|
|
| 72 |
type = 65; |
|
| 73 |
} |
|
| 74 |
else |
|
| 75 |
{
|
|
| 76 |
type = 120; |
|
| 77 |
} |
|
| 78 |
} |
|
| 79 |
else |
|
| 80 |
{
|
|
| 81 |
if(sWidth <= 540) |
|
| 82 |
{
|
|
| 83 |
type = 90; |
|
| 84 |
} |
|
| 85 |
else |
|
| 86 |
{
|
|
| 87 |
type = 180; |
|
| 88 |
} |
|
| 89 |
} |
|
| 90 |
console.log(type + "<br>"); |
|
| 91 |
//document.write(type + "<br>"); |
|
| 92 |
|
|
| 93 |
var done = true; |
|
| 94 |
var topS; |
|
| 95 |
var rightS; |
|
| 96 |
while(done) |
|
| 97 |
{
|
|
| 98 |
if(i == 0) |
|
| 99 |
{
|
|
| 100 |
topS = offset + type; |
|
| 101 |
} |
|
| 102 |
else |
|
| 103 |
{
|
|
| 104 |
topS = (Math.floor(Math.random() * 2048) + offset) + type; |
|
| 105 |
} |
|
| 106 |
rightS = (Math.floor(Math.random() * sWidth) + 1) + type; |
|
| 107 |
console.log(topS + " " + rightS + "nn<br>"); |
|
| 108 |
|
|
| 109 |
//Check distancing from other circles |
|
| 110 |
var okay = true; |
|
| 111 |
for(var k = 0; k < positionsX.length; k++) |
|
| 112 |
{
|
|
| 113 |
var powX = Math.abs(positionsX[k] - topS); |
|
| 114 |
var powY = Math.abs(positionsY[k] - rightS); |
|
| 115 |
var tmp = Math.sqrt((powX*powX) + (powY*powY)); |
|
| 116 |
console.log(tmp+ "tmp<br>"); |
|
| 117 |
if(tmp < DISTANCE) |
|
| 118 |
{
|
|
| 119 |
okay = false; |
|
| 120 |
break; |
|
| 121 |
} |
|
| 122 |
} |
|
| 123 |
|
|
| 124 |
if(okay) |
|
| 125 |
{
|
|
| 126 |
done = false; |
|
| 127 |
} |
|
| 128 |
} |
|
| 129 |
|
|
| 130 |
//document.write("<br>");
|
|
| 131 |
positionsX.push(topS); |
|
| 132 |
positionsY.push(rightS); |
|
| 133 |
types.push(type); |
|
| 134 |
} |
|
| 135 |
|
|
| 136 |
for(var i = 1; i <= countButtons; i++) |
|
| 137 |
{
|
|
| 138 |
document.getElementById(name + i).style.top = (positionsX[i-1] - types[i-1]) + "px"; |
|
| 139 |
document.getElementById(name + i).style.right = (positionsY[i-1] - types[i-1]) + "px"; |
|
| 140 |
} |
|
| 141 |
} |
|
| 142 |
|
|
| 143 |
var countButtons = document.getElementById("canvas").getElementsByTagName('button').length;
|
|
| 144 |
randomCategoryPos("cat-", countButtons);
|
|
| 145 |
</script> |
|
| 146 | 29 |
@else |
| 147 | 30 |
<ul class="list-group"> |
| 148 | 31 |
<li class="list-group-item"> |
Také k dispozici: Unified diff
Merge branch 'develop'