Where communities thrive


  • Join over 1.5M+ people
  • Join over 100K+ communities
  • Free without limits
  • Create your own community
People
Activity
    World-Hack.org
    @world_hack_org_twitter
    ich glaube ich nutze derzeit die 3er version....
    aber erstmal danke für die info und vor allem für das panel.... sehr schöne arbeit und vor allem gut dokumentiert....
    ok.... die jspanel ist version 4.0.0
    Stefan Sträßer
    @Flyer53
    @world_hack_org_twitter Danke für das Lob :smile: Du nutzt aber v4 alpha, denn bei v3 gibt es noch kein jsPanel.create(). Und auch die Option animateIn gibt's erst in v4
    World-Hack.org
    @world_hack_org_twitter

    stimmt schon.... ich hatte bei v3 auch nicht so ganz den erfolg den ich wollte.... deswegen ging ich recht schnell zur alpha über und war davon sehr angetan...
    ich versuche mir gerade eine neue version meines browsergames zu erstellen... und da möchte ich gerne solche fenster verwenden.... und bisher erfüllen deine panels genau das, was ich möchte....
    zumal sie viele aha-effekte bei mir in den letzten tagen hervorgebracht hat und ich für mich persönlich sichtbare fortschritte erzielen konnte...

    hier mal meine funktion die ich aufrufe um meine fenster variable zu erstellen...

    function setContent(pagename){
    
    //mit pagenameID kann ein Panel nur einmal geöffnet werden.... ohne mehrfach
      if(pagename == 'main') {
                    var pagenameID = '';
                    }else{
                    var pagenameID = pagename;
                    }
    
      jsPanel.create({
    
                    id: pagenameID,
                    theme:       'rebeccapurple',
                    contentSize: {
                       width: function() { return Math.min(730, window.innerWidth*0.9);},
                        height: function() { return Math.min(400, window.innerHeight*0.5);}
                    },
                    position:    {my: "center-top", at: "center-top", offsetY: 15},
                    animateIn:   'jsPanelFadeIn', // wird die zeile auskommentiert, funktioniert die opacity
                    headerTitle: pagename,    
                    contentAjax: 'content/' + pagename + '.html'
                })
    }
    Stefan Sträßer
    @Flyer53
    Sieht gut aus. Ich denke ich habe den tweak für animateIn schon gefunden damit die opacity wunschgemäß funktioniert. Muss ich natürlich noch etwas testen. Im Laufe der Woche wird's also eine neue alpha geben. Schau einfach die Tage mal wieder in die Docs. Aktuell ist alpha.70
    World-Hack.org
    @world_hack_org_twitter
    alles klar... danke dir
    Stefan Sträßer
    @Flyer53
    Gerne ...
    World-Hack.org
    @world_hack_org_twitter

    der link funktioniert im übrigen nicht ...
    http://jspanel.de/demos/group-minimized.html

    hier geklickt: http://jspanel.de/api/#option/minimizeTo
    bei
    Go to group-minimized.html for an example.

    Stefan Sträßer
    @Flyer53
    Yep! Der link war fehlerhaft ... ist korrigiert http://jspanel.de/media/demos/group-minimized.html
    Danke für die Info
    World-Hack.org
    @world_hack_org_twitter
    immer gerne.... ich erwarte im übrigen NICHT das du immer gleich zu stelle bist und alles behebst.... ich kenn das ja selber... demnach ist es nur für dich zur reinen info, wenn es ok ist, das ich solche dinge hier mal schreibe...
    World-Hack.org
    @world_hack_org_twitter

    und bei der funktion fallen mir direkt 2 dinge auf....

    1. während des normalen minimized reihen sich die minimierten fenster nacheinander ein.... bei der gruppierung, drängelt sich die gruppe vor das undefinierte minimierte fenster.... die reihenfolge wird somit verändert...

    2. die gruppe lässt sich zwar per mouseover anzeigen, jedoch kann ich den 2. und 3. reiter nicht erreichen und muss demnach die jeweils erste öffnen...

    Stefan Sträßer
    @Flyer53
    Bin für jede Info dankbar. Und da ich eh grad an v4 am arbeiten war antworte ich auch gleich ... wenn ich es mitbekomme ...
    Ja das Beispiel lässt sich sicher noch optimieren, sollte aber eh nur zeigen wofür diese Option gut sein könnte.
    Für v4 habe ich ein anderes Beispiel, dass ich ganz cool finde http://alpha.jspanel.de/docs/demos/html2canvas.html
    World-Hack.org
    @world_hack_org_twitter
    das sieht auch sehr nett aus...
    ist aber leicht ungünstig platziert in dem beispiel, weil es den quellcode am ende verdeckt... hehe
    Stefan Sträßer
    @Flyer53
    Auf meinem Full HD Schirm ist das kein Thema ;) ... Musst halt alle panels schließen, dann ist nichts mehr verdeckt.
    Für heute mach ich Feierabend ... schönen Abend noch ...
    World-Hack.org
    @world_hack_org_twitter
    ... ups.... ja sry... ich hab 3 monitore und hab den browser nicht im hauptfenster offen....
    ebenfalls... danke
    World-Hack.org
    @world_hack_org_twitter
    guten morgen...
    da ich keine funktion zum gleichzeitigen minimieren aller geöffneten panels gefunden habe, hab ich mal selber eine geschrieben.... vllt willst du sie ja mit einbinden....
    function miniAll() { 
    
    var x = document.getElementsByClassName("jsPanel");
        var i;
        for (i = 0; i < x.length; i++) {
    
            x[i].minimize();
    
        }
    
    }
    und im übrigen... danke für das schnelle bugfixen gestern noch...
    World-Hack.org
    @world_hack_org_twitter
    mhhh.... ka ob es an mir leigt oder ob es nen fehler ist....
    wenn ich meinem body nem overflow: hidden gebe, muss ich zwei mal zb den minimize-btn klicken bevor es sich minimiert (gleiches gilt auch fürs closen und maximize)
    hab zwar nun nen weg für mich gefunden auf den style-tag zu verzichten, aber es hat ne sekunde gedauert um den fehler zu finden....
    vllt blockiert der style die initialisierung beim laden....
    World-Hack.org
    @world_hack_org_twitter
    fehler auf der page gefunden....
    wenn ich unter methods auf closeChildPanels() klicke kommt nur eine weiße seite.... der fehler liegt wohl im link.... closeChildpanels statt closeChildPanels
    Stefan Sträßer
    @Flyer53
    Mühsam ernährt sich das Eichhörnchen. Ich hab schon Tage damit verbracht Fehler zu suchen, die sich schließlich als simples Typo herausstellten ;)
    Der Code für deine Funktion geht auch kürzer:
    document.querySelectorAll(".jsPanel").forEach(function(elmt){
        elmt.minimize();
    });
    Sofern der browser NodeList.prototype.forEach() unterstützt https://developer.mozilla.org/en-US/docs/Web/API/NodeList/forEach
    World-Hack.org
    @world_hack_org_twitter
    guten hallo....
    ich hab da mal wieder ein schönes problem, bei dem ich einfach keine lösung finde....
    der fehler tritt allerdings nur bei firefox auf...
    bau-dein-bunker.de/test/test3/ .... dort befindet sich mein aktuelles projekt an dem ich bastel....
    wenn ich ein panel (zb info) öffne und das dann minimiere, landet es ja in der taskleiste meiner seite.... wenn ich es dann von dort via klick öffne, dann öffnet es sich auch... aber wenn ich dann die maus bewege, scheint es so als würde ich die maustaste festhalten und nen text markieren...
    wie gesagt... der fehler scheint nur bei ff aufzutreten....
    ne idee woran das liegen kann?
    Stefan Sträßer
    @Flyer53
    Servus ... Kann ich mir ehrlich gesagt auch nicht erklären. Hast du mal ausprobiert wie es ist wenn du das reguläre normalize control im minimierten panel belässt anstatt alle controls auszublenden? Das einzige was ich mir so auf Anhieb vorstellen kann ist irgendeine event handler Sache. Sorry dass ich auf die Schnelle nicht mehr dazu sagen kann
    World-Hack.org
    @world_hack_org_twitter
    ich glaub der fehler liegt noch in meiner alten version (4.0.0)....
    hab gerade mal die jspanel.js von der aktuellen version reinkopiert....
    und ja, da werden dann im minimierten zustand die controls angezeigt und es kommt nicht mehr zu dem fehler....
    jetzt versuch ich die mal wieder auszublenden und hoffe das es dann geht.... will die ja an der stelle nicht haben... ich geb feddback... und ja... ich weiß das die 4.0.0 auch ne ne alpha von ner aplha war... hehe
    World-Hack.org
    @world_hack_org_twitter
    gar nicht so einfach die stelle zu finden, wo ich das bearbeiten kann.... grml
    World-Hack.org
    @world_hack_org_twitter
    ok... raus bekomme hab ich sie.... jetzt muss ich nur noch der titelbar zu verstehen geben das die den button für das nomalize sein soll... ach ja... alles nicht so einfach
    World-Hack.org
    @world_hack_org_twitter
    ich gebs auf für heute.... bin für jeden tip dankbar....
    Stefan Sträßer
    @Flyer53

    Also wenn du im minimierten panel gar keine controls haben willst wäre mein Ansatz ein anderer. Nutze option.minimizeTo um das automatische Erstellen eines minimierten panels zu unterbinden und erstelle ein eigenes minimiertes panel in option.onminimized.

    jsPanel.create({
      minimizeTo: false,
      onminimized: function(panel) {
        var min = document.createElement('div');
        min.textContent = 'TEST';
        min.style.padding = '5px 10px';
        min.style.backgroundColor = 'yellow';
        min.style.cursor = 'pointer';
    
        var minContainer = document.querySelector('#jsPanel-replacement-container');
        minContainer.append(min);
        min.addEventListener('click', function(){
          panel.normalize();
          minContainer.removeChild(min);
        });
      }
    });

    Das ist deutlich einfacher als mühsam das default minimierte panel zu bearbeiten.

    Stefan Sträßer
    @Flyer53
    minimizeTo: false schaftt zwar das original panel aus dem Weg, erzeugt aber kein Ersatzelement.
    In onminimized wird zunächst das custom Ersatzelement erzeugt und dann in den entsprechenden container eingefügt.
    Dann noch ein event handler der das original panel wiederherstellt und das Erstzelement entfernt.
    Ich denke das kannst du recht einfach an deine Bedürfnisse anpassen.
    World-Hack.org
    @world_hack_org_twitter

    ich hab die buttons einfach via css rausgenommen....

    via display:none

    #jsPanel-replacement-container .jsPanel-replacement .jsPanel-btn.jsPanel-btn-normalize, .jsPanel-minimized-box .jsPanel-replacement .jsPanel-btn.jsPanel-btn-normalize {
          display: none; }
    #jsPanel-replacement-container .jsPanel-replacement .jsPanel-btn.jsPanel-btn-maximize, .jsPanel-minimized-box .jsPanel-replacement .jsPanel-btn.jsPanel-btn-normalize {
          display: none; }
    #jsPanel-replacement-container .jsPanel-replacement .jsPanel-btn.jsPanel-btn-close, .jsPanel-minimized-box .jsPanel-replacement .jsPanel-btn.jsPanel-btn-normalize {
          display: none; }

    dadurch werden sie einfach nicht angezeigt und ich halte mir die option offen, das der user später einfach über seine optionen frei entscheiden kann ob er sie vllt doch nutzen möchte....
    einzig das klickevent für die titelbar muss ich mir jetzt noch suchen, so das man es darüber wieder normalisieren kann...

    World-Hack.org
    @world_hack_org_twitter
    ok... es geht.... ich danke wieder mal recht herzlich.... wenn ich fertig bin mit dem projekt, dann gibt es auch mal was für die kaffekasse....
    Stefan Sträßer
    @Flyer53
    :thumbsup:
    World-Hack.org
    @world_hack_org_twitter
    aber den style einfach per
    '''
    min.style.border: '2px solid red';
    min.style.border-radius: '5px';
    '''
    ändern geht nicht .... wie muss ich da dann vorgehen?
    Stefan Sträßer
    @Flyer53
    Oh sorry, deinen letzten post habe ich nicht mitbekommen. Ich melde mich die Tage nochmal, bin grad ein paar Tage im Urlaub ... sonst erinnere mich nächste Woche nochmal dran ;)
    World-Hack.org
    @world_hack_org_twitter

    '''
    onminimized: function(panel) {
    var elemID = pagename + '-min';
    var suche = document.getElementById(elemID);
    $('#' + elemID).find('.jsPanel-controlbar').css('display','none');
    suche.addEventListener('click', function(){
    panel.normalize();
    });
    }
    '''

    so konnte ich das ganze auch lösen....
    vorteil: ich musste nicht das ganze teil neu designen, sondern konnte weiterhin den standard nutzen...

    viel spass im urlaub.... und danke

    David Labbe
    @Davidlab
    Is there a way to remove the minimize option (icon from header) from the panel?
    Stefan Sträßer
    @Flyer53
    Sure, take a look at option headerControls https://jspanel.de/api.html#options/headerControls
    SJM662
    @SJM662
    Now please dont get too technical on me lol, jsPanel seems to be exactly what I want, but I cannot replicate it. If I have 4 buttons each opening a jsPanel with different content in each it only opens the same jsPanel irrespective of which button I click. The issue would appear to be an id issue, but I've given each jspanel a unique id, but I'm thinking it's in the html for the button tag that I need to be looking or in the function clickToOpen() part. Hope I'm making sense.
    Stefan Sträßer
    @Flyer53
    @SJM662 I suggest you mail me some example code to info@jspanel.de and then we'll see how I can help you ...
    SJM662
    @SJM662
    @Flyer53 okay, will do, thanks