Ankündigung

Einklappen
Keine Ankündigung bisher.

Alles Müll ...

Einklappen
X
 
  • Filter
  • Zeit
  • Anzeigen
Alles löschen
neue Beiträge

  • Sisamiwe
    antwortet
    Prima. Hab's gefunden.
    DANKE

    Einen Kommentar schreiben:


  • Tom Bombadil
    antwortet
    Stefan hat eine überarbeitete/verbesserte Version in die 2.9 als 'calendar.waste' aufgenommen.
    Es wird jetzt also kein separates Widget mehr benötigt.
    /tom

    Einen Kommentar schreiben:


  • Sisamiwe
    antwortet
    Hallo,

    ich habe auf einem Testsystem begonnen auf 2.9 umzusteigen.
    Da scheint das widget nicht mehr zu funktionieren.
    Muss etwas angepasst werden?

    Danke für die Rückmeldung.

    Einen Kommentar schreiben:


  • Tom Bombadil
    antwortet
    Cool, muss ich ausprobieren - klingt alles sehr plausibel und sehr schön 'um die Ecke gedacht'. Zum 'Optimierungsbedarf' hab ich ein paar Ideen, muss die aber erstmal ausprobieren. Ganz vielen Dank, Sebastian!!!

    /tom

    Einen Kommentar schreiben:


  • Bainit
    antwortet
    Moin Tom,

    danke für das super Widget.
    Läuft direkt out-of-the-box.

    Zitat von Tom Bombadil Beitrag anzeigen
    [*]Mit den Limitierungen des calendar-Plugins beschäftigen:
    - scheinbar keine Übertragung des Kalendernamens eines Termins
    (über Kalendernamen könnte man anzuzeigende Termine ein-/ausschließen),
    - scheinbar keine Übertragung der am Termin hängenden Kategorien
    (könnte ebenfalls zum Filtern von Terminen benutzt werden).
    Mit diesem Problem habe ich mich auch etwas beschäftigt und eine für mich tragbare Lösung gefunden.
    Mich hat es nämlich gestört, das in der Liste der nächsten Termine die Mülltonnen drin stehen. Dafür gibt es ja dein tolles Widget. Da brauche ich die Mülltonnen nicht zusätzlich in der Terminübersicht.
    Erst mal die Randbedingungen:
    1) Ich nutze das OwnCloud / NextCloud Plugin von nextCloud (ownCloud) Kalender per CalDAV einbinden
    2) Ich habe in OwnCloud einen eigenen Benutzer "muell" für den Müllkalender angelegt.
    3) Der Benutzer hat seinen eigenen Kalender der "personal" (default in OwnCloud 9) heißt.
    Dann die Anpassungen in der SmartVISU:
    Zeile 56 in deinem Widget geändert auf
    Code:
    $.getJSON('lib/calendar/service/{{ config_calendar_service }}.php?url={{ config_calendar_[COLOR=#FF0000][B]muell_[/B][/COLOR]url|url_encode() }}&count={{ count|default(25) }}', function (data) {
    config.php im smartVISU Hauptverzeichnis um folgende Zeile erweitert:
    Code:
    define('config_calendar_muell_url', 'http://muell:Passwort@domain.tld/owncloud/remote.php/dav/calendars/muell/');
    config.php den zusätzlichen Kalendernamen mitteilen:
    Code:
        define('config_calendar_name', '[COLOR=#FF0000][B]personal,[/B][/COLOR]persönlich,pers%C3%B6nlich_shared_by_Benutzer1,pers%C3%B6nlich_shared_by_Benutzer2');
    Die Funktionsweise dahinter scheint folgende zu sein.
    Das NextCloud Widget ignoriert Benutzername und Passwort aus der config.php (jedenfalls wenn Benutzer und Passwort im Link übergeben werden.
    Daher können der Benutzer für den eigentlichen Kalender und der für den Müllkalender unterschiedliche sein.
    In der Variable config_calendar_name muss der Kalendername des Müllbenutzers mit aufgerufen werden.
    Optimierungsbedarf:
    Über den Benutzer Muell werden jetzt auch die anderen in config_calendar_name definierten Kalender abgefragt. Da dies natürlich durch fehlende Berechtigungen schief geht, werden in OwnCloud jedes mal Fehler ins Log geschrieben. Der Kalender auf den es ankommt (personal) wird allerdings sauber abgefragt. Daher kann ich bisher gut mit den Fehlermeldungen im Log leben.

    Gruß, Sebastian
    Zuletzt geändert von Bainit; 31.01.2017, 14:21.

    Einen Kommentar schreiben:


  • Tom Bombadil
    antwortet
    Gibt es da eine Steueranweisung á la mozilla-xxx, einen anderen Farbcode zu verwenden? Wollte zwar eigentlich kein extra css, aber wenn's denn sein muss ...

    /tom

    Edit: Habe mal den Code in #1 angepasst, er enthält jetzt den letzten Bearbeitungsstand inkl. Eurer Kommentare - Danke Thomas & Mike!
    Zuletzt geändert von Tom Bombadil; 05.01.2017, 22:03.

    Einen Kommentar schreiben:


  • Mike01
    antwortet
    Danke, liegt wohl am Firefox. Beim chrome browser werden die Farben richtig angezeigt.

    Einen Kommentar schreiben:


  • Tom Bombadil
    antwortet
    Nein, hab nur original 'red' und 'orange' verwendet, siehe Quellcode. Könnte aber auch mit dem Hintergrund im Quad-Design zusammenhängen. Notfalls in den beiden IF-Anweisungen einfach RGB verwenden, sollte auch klappen:

    Code:
    [FONT=arial][SIZE=15px]if (data[i].date == heute) muell_html += " style='border-bottom: [COLOR=#FF0000]red[/COLOR] 10px inset; width: 100% !important; overflow: hidden;'";[/SIZE][/FONT]
    [FONT=arial][SIZE=15px]if (data[i].date == morgen) muell_html += " style='border-bottom: [COLOR=#FF8C00]orange[/COLOR] 10px inset; width: 100% !important; overflow: hidden;'";[/SIZE][/FONT]
    [SIZE=15px][/SIZE]


    /tom

    Einen Kommentar schreiben:


  • Mike01
    antwortet
    Kann ich bestätigen, musste auch den Teil
    Code:
    width: 100% !important
    entfernen damit die Anzeige passt.
    Ausserdem hab ich die folgende Zeile ebenfalls noch abgeändert:
    Code:
    [FONT=courier new]var muell_html = "<table class ='ui-btn-up-a' style='width:100%;align:center;overflow:hidden;'><tr>";[/FONT]
    zu:
    Code:
    [FONT=courier new]var muell_html = "<table class ='ui-btn-up-a' style='width:100%;text-align:center;overflow:hidden;'><tr>";[/FONT]
    damit die Symbole mittig ausgerichtet werden.

    Was mir noch aufgefallen ist, bei den Fotos von Tom Bombadil sind die Unterstriche in Rot und Orange kräftiger, bei mir sehen die Farben eher aus wie Rosa und Gelb,
    Hab mit den Farbcode bereits experimentiert, aber ohne erfolg, wird das mit einer CSS übersteuert ?
    Angehängte Dateien

    Einen Kommentar schreiben:


  • Tom Bombadil
    antwortet
    Kann an meinem Skin liegen, ich verwende ein weiter angepasstes 'Quad' Layout. Danke für den Hinweis!
    /tom

    Einen Kommentar schreiben:


  • Maxthomas2001
    antwortet
    Hallo,

    vielen Dank für die Mühe!
    Ja genau so wollte ich es.
    Bei mir hat es aber mit deinem Code etwas komisch ausgesehen. Der erste Termin war riesig, etwas 5 mal so groß wie die anderen. Ich habe diesen Teil
    width: 100% !important
    entfernt. Jetzt passt alles.
    Grüße Thomas


    Einen Kommentar schreiben:


  • Tom Bombadil
    antwortet
    Hier mal ein vorher/nachher Bild: vorher_nachher.png



    Recht so?

    Code:
    /**
    * Displays the trash list
    *
    * @param unique id for this widget
    * @param a title to display
    * @param the number of calendar-entries to parse, default 100
    * @param the number of displayed columns, default 5
    * @param the refresh interval for this widget (using relative time format), default 1h
    */
    {% macro list(id, title, count, cols, repeat) %}
    
        {% set uid = uid(page, id) %}
    
        <div id="{{ uid }}" data-widget="calendar.list" class="calendarlist" data-repeat="{{ repeat|default('1h') }}">
            {% if title %} <h2>{{ title }}</h2> {% endif %}
            <ul data-role="listview" style='width:100%;align:center;overflow:hidden;'>
            </ul>
        </div>
    
        <script type="text/javascript">
    
            $('#{{ page }}').on('pagecreate', function (event, ui) {
                $('#{{ uid }}').on( {
                    'init' : function (event) {
    
                        var uid = this.id;
    
                        var heute = new Date();
                        var morgen = new Date(heute.getTime()+(1000 * 60 * 60 * 24 * 1));
    
                        var spalte = 0;
                        var muell_html = "<table class ='ui-btn-up-a' style='width:100%;align:center;overflow:hidden;'><tr>";
    
                        var heute_tag = heute.getDate();
                        if (heute_tag < 10) heute_tag = "0" + heute_tag;                    
                        var heute_monat = heute.getMonth() + 1;
                        if (heute_monat < 10) heute_monat = "0" + heute_monat;                    
                        heute = heute_tag + '.' + heute_monat + '.';                    
    
                        var morgen_tag = morgen.getDate();
                        if (morgen_tag < 10) morgen_tag = "0" + morgen_tag;                    
                        var morgen_monat = morgen.getMonth() + 1;
                        if (morgen_monat < 10) morgen_monat = "0" + morgen_monat;                    
                        morgen = morgen_tag + '.' + morgen_monat + '.';                    
    
                        $.getJSON('lib/calendar/service/{{ config_calendar_service }}.php?url={{ config_calendar_url|url_encode() }}&count={{ count|default(25) }}', function (data) {
    
                        for (var i in data) {
    
                            if (spalte === {{ cols|default(5) }}) break;
    
                            switch (data[i].title) {
                                case 'Gelbe Tonne':        data[i].color='#FFFF00'; break;
                                case 'Blaue Tonne':     data[i].color='#0000FF'; break;
                                case 'Schwarze Tonne':     data[i].color='#000000'; break;
                                case 'Braune Tonne':     data[i].color='#993300'; break;
                                case 'Grüne Tonne':     data[i].color='#008000'; break;
                                default:                data[i].color='#FF0000';
                            }
    
                            if (data[i].color != '#FF0000') {
                                data[i].weekday = data[i].weekday.substring(0,2);
                                data[i].date = data[i].period.substring(0,6);
                                muell_html += "<td";
                                if (data[i].date == heute)    muell_html += " style='border-bottom: red 10px inset; width: 100% !important; overflow: hidden;'";
                                if (data[i].date == morgen) muell_html += " style='border-bottom: orange 10px inset; width: 100% !important; overflow: hidden;'";
                                muell_html += "><svg xmlns='http://www.w3.org/2000/svg' viewBox='260 100 250 220' width='64px' height='64px'><g><path d='m316 129l124-12 0 26 -124 5Z' fill='" + data[i].color + "'/>"
                                muell_html += "<path d='m329 242l14 0c30-10 70 18 47 50l0 8 31 0 7-147 -99 0' fill='" + data[i].color + "'/>"
                                muell_html += "<ellipse cx='356' cy='275' rx='28' ry='26' style='stroke-width:0.5;stroke:#333;fill:" + data[i].color + "'/></g></svg>"
                                muell_html += "<div class='ui-li-heading'>" + data[i].weekday + ' ' + data[i].date + '</div></td>';
                                spalte += 1;
                            }
    
                        }
    
                        muell_html += '</tr></table>';
    
                        $('#' + uid + ' ul').html(muell_html).trigger('prepare').listview('refresh').trigger('redraw');
    
                        })
                            .error(notify.json);
                    },
    
                    'repeat': function(event) {
                        $('#{{ uid }}').trigger('init');
                    }
                });
            });
        </script>
    {% endmacro %}


    Viel Spass! (wäre schön, wenn es noch jemand testet, hier läuft's)

    /tom

    Edit: Danke für's Nachformatieren bei #2, Bernd - ich hab's heute in der Pause mangels Einrückungen aufgegeben.
    Angehängte Dateien
    Zuletzt geändert von Tom Bombadil; 02.01.2017, 18:54.

    Einen Kommentar schreiben:


  • Tom Bombadil
    antwortet
    Gute Frage - zwei hintereinander befindliche Zellen rot unterstreichen geht auf alle Fälle, hatte diesen Fall hier neulich. Ich schau es mir heute Abend mal etwas detaillierter an ...
    /tom

    Einen Kommentar schreiben:


  • Maxthomas2001
    antwortet
    Hallo,

    ich habe dein Widget erweitert. Ich möchte, das am Vortag ein oranger Balken unter dem Termin erscheint, am Abholtag selber ein roter.
    Das Ergebnis schaut bei mir folgendermaßen aus: Abfallkalender.png


    Bei zwei Terminen an direkt aufeinander folgenden Tagen, wird nur der erste Balken sauber angezeigt.
    Woran kann das liegen?

    hier mein Code:
    Code:
    <script type = "text/javascript">
    
        $('#{{ page }}').on('pagecreate', function (event, ui) {
            $('#{{ uid }}').on({
                'init': function (event) {
    
                    var uid = this.id;
    
                    var heute = new Date();
                    var heute_tag = heute.getDate();
                    var heute_monat = heute.getMonth() + 1;
                    var morgen = new Date(heute.getTime() + (1000 * 60 * 60 * 24 * 1));
                    var morgen_tag = morgen.getDate();
                    var morgen_monat = morgen.getMonth() + 1;
                    var spalte = 0;
                    var muell_html = "<table class ='ui-btn-up-a' width=100% align=center><tr>";
    
                    if (heute_tag < 10)
                        heute_tag = "0" + heute_tag;
                    if (heute_monat < 10)
                        heute_monat = "0" + heute_monat;
                    heute = heute_tag + '.' + heute_monat + '.';
    
                    if (morgen_tag < 10)
                        morgen_tag = "0" + morgen_tag;
                    if (morgen_monat < 10)
                        morgen_monat = "0" + morgen_monat;
                    morgen = morgen_tag + '.' + morgen_monat + '.';
    
                    $.getJSON('lib/calendar/service/{{ config_calendar_service }}.php?url={{ config_calendar_url|url_encode() }}&count={{ count|default(25) }}', function (data) {
    
                        for (var i in data) {
    
                            if (spalte === { {
                                    cols | default(5)
                                }
                            })
                                break;
    
                            switch (data[i].title) {
                            case 'Gelber Sack':
                                data[i].color = '#FFFF00';
                                break;
                            case 'Papiertonne':
                                data[i].color = '#0000FF';
                                break;
                            case 'Restmüll':
                                data[i].color = '#000000';
                                break;
                            case 'Biotonne':
                                data[i].color = '#088A08';
                                break;
                            case 'Sperrmüll':
                                data[i].color = '#B404AE';
                                break;
                            case 'Problemmüll':
                                data[i].color = '#FF8000';
                                break;
                            default:
                                data[i].color = '#FF0000';
                            }
    
                            if (data[i].color != '#FF0000') {
                                data[i].weekday = data[i].weekday.substring(0, 2);
                                data[i].date = data[i].period.substring(0, 6);
                                if (data[i].date == morgen)
                                    muell_html += "<td style='border-bottom: orange 15px inset;'>";
                                if (data[i].date == heute)
                                    muell_html += "<td style='border-bottom: red 15px inset;'>";
                                else
                                    muell_html += "<td>";
                                muell_html += "<svg xmlns='http://www.w3.org/2000/svg' viewBox='260 100 250 220' width='64px' height='64px'><g><path d='m316 129l124-12 0 26 -124 5Z' fill='" + data[i].color + "'/>"
                                muell_html += "<path d='m329 242l14 0c30-10 70 18 47 50l0 8 31 0 7-147 -99 0' fill='" + data[i].color + "'/>"
                                muell_html += "<ellipse cx='356' cy='275' rx='28' ry='26' style='stroke-width:0.5;stroke:#333;fill:" + data[i].color + "'/></g></svg>"
                                muell_html += "<div class='ui-li-heading'>" + data[i].weekday + ' ' + data[i].date + '</div></td>';
                                spalte += 1;
                            }
    
                        }
    
                        muell_html += '</tr></table>';
    
                        $('#' + uid + ' ul').html(muell_html).trigger('prepare').listview('refresh').trigger('redraw');
    
                    })
                    .error(notify.json);
                },
    
                'repeat': function (event) {
                    $('#{{ uid }}').trigger('init');
                }
            });
        });
    </script>
    Würde mich sehr freuen, wenn mir jemand helfen kann.

    Grüße
    Thomas
    Zuletzt geändert von bmx; 02.01.2017, 16:34.

    Einen Kommentar schreiben:


  • Tom Bombadil
    hat ein Thema erstellt [Codebeispiel] Alles Müll ....

    Alles Müll ...

    Hallo,

    da ich derzeit über den Kalender in der smartVISU hauptsächlich die Mülltermine anzeige, aber das 'lange' Anzeigeformat schon immer als störend empfunden habe, habe ich eben mal 'quick & dirty' eine alternative Anzeige programmiert:

    muell.png

    Der Code ist sicher nicht schön, aber funktional (jQuery und ich sind immer noch keine Freunde).

    Wer es verwenden möchte:
    • muell.html entweder im Deinem Pages-Verzeichnis oder unter Widgets erstellen, Code siehe unten.
    • Aufruf wie folgt:
      Code:
      	{% import "muell.html" as muell %}
      	{{ muell.list('muelltermine', 'Mülltermine', 50, 5, 3) }}
    • Parameter (Nr. 2 bis 5 können auch weggelassen werden, dann wird der Standard genommen):
      1/ Eindeutige ID
      2/ Überschrift ("")
      3/ Anzahl der insgesamt aus dem Kalender zu lesenden Termine (50)
      4/ Anzahl der anzuzeigenden Mülltermine (5)
      5/ Refresh-Intervall (1h)
    • Es werden genau die Termine gelistet, die im Kalender die folgenden Titel/Namen haben: Gelbe Tonne, Braune Tonne, Grüne Tonne, Blaue Tonne, Schwarze Tonne.
    Was noch zu tun ist:
    • Herausfinden, ob/wie statt einer festen Anzahl von Terminen ein bestimmter Zeitraum ausgelesen werden kann (z.B.: Hole die nächsten zwei Wochen statt der nächsten 50 Termine). Das calendar-Plugin scheint immerhin standardmäßig die nächsten 4 Wochen zu holen, egal wie viele Termine angegeben werden.
    • Mit den Limitierungen des calendar-Plugins beschäftigen:
      - scheinbar keine Übertragung des Kalendernamens eines Termins
      (über Kalendernamen könnte man anzuzeigende Termine ein-/ausschließen),
      - scheinbar keine Übertragung der am Termin hängenden Kategorien
      (könnte ebenfalls zum Filtern von Terminen benutzt werden).
    Wie gesagt: Falls noch jemand anders obiges als brauchbar empfindet - frohes Kopieren!

    UND (grins, den kann ich mir nicht verkneifen): Der Code muss sicher erweitert werden, wenn das hier durchsetzt.

    /tom


    Edit 05.01.2017: .zip-Attachment für widgets/muell.html gelöscht, Code des Widgets nach letztem Bearbeitungsstand wie folgt:

    HTML-Code:
    /**
    * -----------------------------------------------------------------------------
    * @package     smartVISU
    * @author      Martin Gleiß
    * @copyright   2012 - 2015
    * @modifier    (2016) Tom Bombadil of KNX User Forum, aka René Jahncke
    * @license     GPL [http://www.gnu.de]
    * -----------------------------------------------------------------------------
    */
    
    /**
    * Displays a tiny trash list
    *
    * @param unique id for this widget
    * @param a title to display
    * @param the number of calendar-entries to parse, default 100
    * @param the number of displayed columns, default 5
    * @param the refresh interval for this widget (using relative time format), default 1h
    */
    {% macro list(id, title, count, cols, repeat) %}
    
        {% set uid = uid(page, id) %}
    
        <div id="{{ uid }}" data-widget="calendar.list" class="calendarlist" data-repeat="{{ repeat|default('1h') }}">
            {% if title %} <h2>{{ title }}</h2> {% endif %}
            <ul data-role="listview" style='width:100%;align:center;overflow:hidden;'>
            </ul>
        </div>
    
        <script type="text/javascript">
    
            $('#{{ page }}').on('pagecreate', function (event, ui) {
                $('#{{ uid }}').on( {
                    'init' : function (event) {
    
                        var uid = this.id;
    
                        var heute = new Date();
                        var morgen = new Date(heute.getTime()+(1000 * 60 * 60 * 24 * 1));
    
                        var spalte = 0;
                        var muell_html = "<table class ='ui-btn-up-a' style='width:100%;text-align:center;overflow:hidden;'><tr>";
    
                        var heute_tag = heute.getDate();
                        if (heute_tag < 10) heute_tag = "0" + heute_tag;                  
                        var heute_monat = heute.getMonth() + 1;
                        if (heute_monat < 10) heute_monat = "0" + heute_monat;                
                        heute = heute_tag + '.' + heute_monat + '.';                  
    
                        var morgen_tag = morgen.getDate();
                        if (morgen_tag < 10) morgen_tag = "0" + morgen_tag;                
                        var morgen_monat = morgen.getMonth() + 1;
                        if (morgen_monat < 10) morgen_monat = "0" + morgen_monat;                  
                        morgen = morgen_tag + '.' + morgen_monat + '.';                
    
                        $.getJSON('lib/calendar/service/{{ config_calendar_service }}.php?url={{ config_calendar_url|url_encode() }}&count={{ count|default(25) }}', function (data) {
    
                            for (var i in data) {
    
                                if (spalte === {{ cols|default(5) }}) break;
    
                                switch (data[i].title) {
                                    case 'Gelbe Tonne':     data[i].color='#FFFF00'; break;
                                    case 'Blaue Tonne':     data[i].color='#0000FF'; break;
                                    case 'Schwarze Tonne':  data[i].color='#000000'; break;
                                    case 'Braune Tonne':    data[i].color='#993300'; break;
                                    case 'Grüne Tonne':     data[i].color='#008000'; break;
                                    default:                data[i].color='#FF0000';
                                }
    
                                if (data[i].color != '#FF0000') {
                                    data[i].weekday = data[i].weekday.substring(0,2);
                                    data[i].date = data[i].period.substring(0,6);
                                    muell_html += "<td";
                                    if (data[i].date == heute)  muell_html += " style='border-bottom: red 10px inset; overflow: hidden;'";
                                    if (data[i].date == morgen) muell_html += " style='border-bottom: orange 10px inset; overflow: hidden;'";
                                    muell_html += "><svg xmlns='http://www.w3.org/2000/svg' viewBox='260 100 250 220' width='64px' height='64px'><g><path d='m316 129l124-12 0 26 -124 5Z' fill='" + data[i].color + "'/>"
                                    muell_html += "<path d='m329 242l14 0c30-10 70 18 47 50l0 8 31 0 7-147 -99 0' fill='" + data[i].color + "'/>"
                                    muell_html += "<ellipse cx='356' cy='275' rx='28' ry='26' style='stroke-width:0.5;stroke:#333;fill:" + data[i].color + "'/></g></svg>"
                                    muell_html += "<div class='ui-li-heading'>" + data[i].weekday + ' ' + data[i].date + '</div></td>';
                                    spalte += 1;
                                }
    
                            }
    
                            muell_html += '</tr></table>';
    
                            $('#' + uid + ' ul').html(muell_html).trigger('prepare').listview('refresh').trigger('redraw');
    
                        })
                        .error(notify.json);
                    },
    
                    'repeat': function(event) {
                        $('#{{ uid }}').trigger('init');
                    }
                });
            });
        </script>
    {% endmacro %}
    Zuletzt geändert von Tom Bombadil; 05.01.2017, 22:02.
Lädt...
X