Skip to content

Commit

Permalink
Correct notifications bug, render <vue-github-star/> only once
Browse files Browse the repository at this point in the history
  • Loading branch information
danon committed Sep 27, 2023
1 parent e75fb5f commit 4b31974
Show file tree
Hide file tree
Showing 4 changed files with 137 additions and 127 deletions.
53 changes: 29 additions & 24 deletions resources/js/app.js
Original file line number Diff line number Diff line change
Expand Up @@ -9,14 +9,14 @@ import './libs/timeago.js';
import './components/vcard.js';
import './plugins/flags.ts';
import './plugins/sociale.js';
import './plugins/components.ts';
import '@popperjs/core'; // must be imported before bootstrap
import './bootstrap';
import './libs/axios-throttle.ts';
import VueAutosize from './plugins/autosize';
import Router from './libs/router';
import Prism from 'prismjs';
import Vue from 'vue';
import GithubStar from "./components/github-star.vue";

Prism.highlightAll();

Expand All @@ -26,34 +26,39 @@ let r = new Router();

r.on(['/User', '/User/Skills', '/User/Relations', '/User/Tokens'], () => require('./pages/user'));
r.on(['/Register', '/Login'], () => require('./pages/auth'))
.on('/Adm/Firewall/*', () => {
require.ensure(['flatpickr', 'flatpickr/dist/l10n/pl'], require => {
require('flatpickr');
require('../sass/vendor/_flatpickr.scss');

const Polish = require('flatpickr/dist/l10n/pl.js').pl;

$('#expire-at').flatpickr({
allowInput: true,
locale: Polish
});
});
})
.on('/Adm/Mailing', () => {
require('./libs/tinymce').default();
})
.on(['/User/Pm/Submit', '/User/Pm/Show/*', '/User/Pm'], () => require('./pages/pm'))
.on(['/Mikroblogi', '/Mikroblogi/*', '/Profile/*/Microblog'], () => require('./pages/microblog'))
.on(['/Profile/*'], () => require('./pages/profile'))
.on('/', () => require('./pages/homepage'))
.on('/Search', () => require('./pages/search'))
.on(['/Guide', '/Guide/*'], () => require('./pages/guide'));
.on('/Adm/Firewall/*', () => {
require.ensure(['flatpickr', 'flatpickr/dist/l10n/pl'], require => {
require('flatpickr');
require('../sass/vendor/_flatpickr.scss');

const Polish = require('flatpickr/dist/l10n/pl.js').pl;

$('#expire-at').flatpickr({
allowInput: true,
locale: Polish
});
});
})
.on('/Adm/Mailing', () => {
require('./libs/tinymce').default();
})
.on(['/User/Pm/Submit', '/User/Pm/Show/*', '/User/Pm'], () => require('./pages/pm'))
.on(['/Mikroblogi', '/Mikroblogi/*', '/Profile/*/Microblog'], () => require('./pages/microblog'))
.on(['/Profile/*'], () => require('./pages/profile'))
.on('/', () => require('./pages/homepage'))
.on('/Search', () => require('./pages/search'))
.on(['/Guide', '/Guide/*'], () => require('./pages/guide'));

r.resolve();

// must be at the end so other vue components can render
require('./plugins/popover');

if ('serviceWorker' in navigator) {
navigator.serviceWorker.register('/sw.js').catch(err => console.log(err));
navigator.serviceWorker.register('/sw.js').catch(err => console.log(err));
}

new Vue({
el: '#github-button',
components: {'vue-github-star': GithubStar,},
});
21 changes: 9 additions & 12 deletions resources/js/components/github-star.vue
Original file line number Diff line number Diff line change
@@ -1,16 +1,16 @@
<template>
<iframe v-if="isLoaded"
src="https://ghbtns.com/github-btn.html?user=pradoslaw&repo=coyote&type=star&count=true&size=large"
frameborder="0"
scrolling="0"
width="120"
height="30"
title="GitHub"
></iframe>
<iframe
v-if="isLoaded"
src="https://ghbtns.com/github-btn.html?user=pradoslaw&repo=coyote&type=star&count=true&size=large"
frameborder="0"
scrolling="0"
width="120"
height="30"
title="GitHub"
></iframe>
</template>

<script lang="js">
export default {
data: () => ({
isLoaded: false,
Expand All @@ -25,14 +25,11 @@ export default {
if (this.isMounted) {
return;
}
window.addEventListener('load', this.handleLoad)
this.isMounted = true;
},
unmounted() {
window.removeEventListener('load', this.handleLoad)
this.isMounted = false;
this.isLoaded = false;
}
Expand Down
9 changes: 0 additions & 9 deletions resources/js/plugins/components.ts

This file was deleted.

181 changes: 99 additions & 82 deletions resources/views/layout.twig
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,7 @@
{% endblock %}

{% block canonical %}
<link rel="canonical" href="{% block canonical_href %}{{ app.request.url }}{% endblock %}" />
<link rel="canonical" href="{% block canonical_href %}{{ app.request.url }}{% endblock %}"/>
{% endblock %}

{% block head %}
Expand Down Expand Up @@ -61,98 +61,113 @@
{{ form_open({url: route('logout'), name: 'logout-form'}) }}
{{ form_close() }}

<nav id="navbar" class="navbar navbar-expand-lg {{ __dark_theme ? 'bg-dark navbar-dark' : 'bg-light navbar-light' }}">
<nav class="navbar navbar-expand-lg {{ __dark_theme ? 'bg-dark navbar-dark' : 'bg-light navbar-light' }}">
<div class="container-xxl d-flex w-100 flex-wrap">
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#mobile-menu">
<span class="navbar-toggler-icon"></span>
</button>

<a rel="home" class="navbar-brand order-0" href="{{ route('home') }}" title="4programmers.net - Strona główna">
<img alt="4programmers.net" src="{{ cdn('img/logo-mobile.png') }}">
</a>

<div class="collapse navbar-collapse flex-grow-0 order-3 order-lg-1 ml-2" id="mobile-menu">
<ul class="navbar-nav">

{% for item in __master_menu.roots() %}
<li {{ forms.attr(item.attr) }}>
<a href="{{ item.url }}" class="nav-link">{{ item.title|raw }}</a>

{{ item.afterHTML|raw }}

{% if item.hasChildren() %}
<div class="dropdown-container">
<div class="dropdown-menu dropdown-menu-left">
{% for children in item.children() %}
<a class="dropdown-item" href="{{ children.url }}">{{ children.title }}</a>
{% endfor %}
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#mobile-menu">
<span class="navbar-toggler-icon"></span>
</button>

<a rel="home" class="navbar-brand order-0" href="{{ route('home') }}" title="4programmers.net - Strona główna">
<img alt="4programmers.net" src="{{ cdn('img/logo-mobile.png') }}">
</a>

<div class="collapse navbar-collapse flex-grow-0 order-3 order-lg-1 ml-2" id="mobile-menu">
<ul class="navbar-nav">
{% for item in __master_menu.roots() %}
<li {{ forms.attr(item.attr) }}>
<a href="{{ item.url }}" class="nav-link">{{ item.title|raw }}</a>

{{ item.afterHTML|raw }}

{% if item.hasChildren() %}
<div class="dropdown-container">
<div class="dropdown-menu dropdown-menu-left">
{% for children in item.children() %}
<a class="dropdown-item" href="{{ children.url }}">{{ children.title }}</a>
{% endfor %}
</div>
</div>
</div>
{% endif %}
</li>
{% endfor %}
<li class="d-block d-md-none">
<vue-github-star></vue-github-star>
</li>
</ul>
</div>

<div id="js-searchbar" class="d-flex flex-grow-1 order-1">
<vue-searchbar value="{{ input_get('q') }}"></vue-searchbar>
</div>
<div class="d-none d-md-flex order-1 align-self-center">
<vue-github-star></vue-github-star>
</div>
{% endif %}
</li>
{% endfor %}
</ul>
</div>

{% if auth_check() %}
<ul id="nav-auth" class="nav-auth navbar-nav order-2"></ul>
<div id="github-button" class="d-flex align-items-center order-md-2 ml-3 ml-md-0">
<vue-github-star></vue-github-star>
</div>

<div class="dropdown nav-avatar order-2">
<a href="#" class="dropdown-toggle img-thumbnail d-block i-35" data-bs-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">
<img alt="{{ user('name') }}" src="{{ user_photo(user('photo')) }}" style="width: 100%">
</a>
<div id="js-searchbar" class="d-flex flex-grow-1 order-1">
<vue-searchbar value="{{ input_get('q') }}"></vue-searchbar>
</div>

<div class="dropdown-menu dropdown-menu-right">
<a class="dropdown-item profile-name" href="{{ route('user.home') }}">
{{ user('name') }}
{% if auth_check() %}
<ul id="nav-auth" class="nav-auth navbar-nav order-2"></ul>

{% if user('is_sponsor') %}
<i class="fa fa-fw fa-medal" title="Konto Premium"></i>
{% endif %}
<div class="dropdown nav-avatar order-2">
<a href="#" class="dropdown-toggle img-thumbnail d-block i-35" data-bs-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">
<img alt="{{ user('name') }}" src="{{ user_photo(user('photo')) }}" style="width: 100%">
</a>

<div class="dropdown-divider"></div>

<a class="dropdown-item" href="{{ route('user.pm') }}"><i class="fas fa-envelope fa-fw"></i> Wiadomości</a>
<a class="dropdown-item" href="{{ route('user.settings') }}"><i class="fas fa-cog fa-fw"></i> Ustawienia</a>
<a class="dropdown-item" href="{{ route('profile', [user('id')]) }}"><i class="fas fa-user fa-fw"></i> Profil</a>
<a class="dropdown-item" href="{{ url('Pomoc') }}"><i class="fas fa-info-circle fa-fw"></i> Pomoc</a>

{% if can('adm-access') %}
<a class="dropdown-item" href="{{ route('adm.home') }}"><i class="fas fa-user-secret fa-fw"></i> Panel administracyjny</a>
{% endif %}
<div class="dropdown-menu dropdown-menu-right">
<a class="dropdown-item profile-name" href="{{ route('user.home') }}">
{{ user('name') }}

{% if user('is_sponsor') %}
<i class="fa fa-fw fa-medal" title="Konto Premium"></i>
{% endif %}
</a>

<div class="dropdown-divider"></div>

<a class="dropdown-item" href="{{ route('user.pm') }}">
<i class="fas fa-envelope fa-fw"></i>
Wiadomości</a>
<a class="dropdown-item" href="{{ route('user.settings') }}">
<i class="fas fa-cog fa-fw"></i>
Ustawienia</a>
<a class="dropdown-item" href="{{ route('profile', [user('id')]) }}">
<i class="fas fa-user fa-fw"></i>
Profil
</a>
<a class="dropdown-item" href="{{ url('Pomoc') }}">
<i class="fas fa-info-circle fa-fw"></i>
Pomoc
</a>
{% if can('adm-access') %}
<a class="dropdown-item" href="{{ route('adm.home') }}">
<i class="fas fa-user-secret fa-fw"></i>
Panel administracyjny
</a>
{% endif %}

<div class="dropdown-divider"></div>
<div class="dropdown-divider"></div>

<div class="dropdown-item">
<div class="custom-control custom-switch">
<input type="checkbox" class="custom-control-input" id="js-dark-theme" {{ __dark_theme ? 'checked' }}>
<label class="custom-control-label" for="js-dark-theme">Ciemne menu</label>
<div class="dropdown-item">
<div class="custom-control custom-switch">
<input type="checkbox" class="custom-control-input" id="js-dark-theme" {{ __dark_theme ? 'checked' }}>
<label class="custom-control-label" for="js-dark-theme">Ciemne menu</label>
</div>
</div>
</div>

<div class="dropdown-divider"></div>
<div class="dropdown-divider"></div>

<a href="javascript:" onclick="document['logout-form'].submit()" class="dropdown-item btn-sign-out"><i class="fas fa-sign-out-alt fa-fw"></i> Wyloguj</a>
<a href="javascript:" onclick="document['logout-form'].submit()" class="dropdown-item btn-sign-out">
<i class="fas fa-sign-out-alt fa-fw"></i>
Wyloguj
</a>
</div>
</div>
</div>
{% else %}
<div class="form-inline order-2 ml-auto">
<a class="btn btn-sm btn-register" href="{{ route('register') }}"><i class="fas fa-sign-in"></i> Utwórz konto</a>
<a class="btn btn-sm btn-login" href="{{ route('login') }}">Logowanie</a>
</div>
{% endif %}
</div>
{% else %}
<div class="form-inline order-2 ml-auto">
<a class="btn btn-sm btn-register" href="{{ route('register') }}">
<i class="fas fa-sign-in"></i>
Utwórz konto
</a>
<a class="btn btn-sm btn-login" href="{{ route('login') }}">Logowanie</a>
</div>
{% endif %}
</div>
</nav>
</header>

Expand Down Expand Up @@ -224,9 +239,11 @@

<div id="footer-copyright">
<div class="row container-xxl no-gutters">
<div>Copyright © 2000-{{ 'now'|date('Y') }} <a title="4programmers.net -- programowanie" class="logo" href="http://4programmers.net/">4programmers.net - programowanie i tworzenie stron
WWW</a></div>

<div>Copyright © 2000-{{ 'now'|date('Y') }}
<a title="4programmers.net -- programowanie" class="logo" href="http://4programmers.net/">
4programmers.net - programowanie i tworzenie stron WWW
</a>
</div>
<div class="ml-auto">Coyote {{ config('app.version') }}: {{ timer() }}</div>
</div>
</div>
Expand Down

0 comments on commit 4b31974

Please sign in to comment.