Smiley im Chat

Hier könnt ihr alle Fragen zu SpiderBasic austauschen.
stevie1401
Beiträge: 659
Registriert: 19.10.2014 15:51
Kontaktdaten:

Smiley im Chat

Beitrag von stevie1401 »

Ich versuche Smileys in den Chat zu bringen.
Die Chatbox ist eine Textbox.
Ich versuchte dies:

Code: Alles auswählen

TextGadget(#edi,10,10,500,300,"")
smile$="This is a text <img src='smile.png' >"
SetGadgetText(#edi,smile)
Aber leider ist das Smiley links und der Text rechts.

Dann versuchte ich dies:

Code: Alles auswählen

smile="This is a text <img src='smile.png' style='float:right ;width:12x;height:12px;'>"
Hier ist der Text links und das Bild rechts. Allerdings ist das Bild immer am Ende der Zeile, weit, weit weg vom Text.

Der Code:

Code: Alles auswählen

"This is a text <img src='smile.png' >"
..funktoniert als HTML-Datei im Browser übrigens 1a, nur in Spiderbasic nicht.

Ich möchte es halt wie in einem Messenger haben, wo das Smiliey direkt nach dem Text kommt.
Hat jemand eine Idee, wie man das in Spiederbasic macht?
Ich programmiere nur noch mit Linux.
Linux Mint 21.x
Benutzeravatar
TroaX
Beiträge: 659
Registriert: 08.03.2013 14:27
Computerausstattung: PC: Ryzen 9 3950X, 96 GB RAM, RX6800XT, 2.5 TB SSD, 21:9 Display, Pop_OS! | Lappi: Ryzen 7 5800H, 16 GB RAM, 1 TB SSD, Pop_OS!
Wohnort: NRW
Kontaktdaten:

Re: Smiley im Chat

Beitrag von TroaX »

Das liegt daran, das in den CSS-Files von Spiderbasic irgendwo die Anweisung img { float: left; } existiert. Versuch es also mal mit style="float: none;". Dann müsste es eigentlich klappen.
PC: Ryzen 9 3950X | 96 GB RAM | RX6800XT | 2,5 TB NVMe | Pop_OS!
Notebook: 16" 3:2 | Ryzen 7 5800H | 16 GB RAM | Radeon Vega | 1TB NVMe | Pop_OS!
NAS: Fritz.Box :lol:
Coding: Purebasic 6.04 | PHP | HTML | CSS | Javascript
Benutzeravatar
RSBasic
Admin
Beiträge: 8022
Registriert: 05.10.2006 18:55
Wohnort: Gernsbach
Kontaktdaten:

Re: Smiley im Chat

Beitrag von RSBasic »

Ich empfehle dir die mitgelieferte Browser-Konsole (egal ob Firefox, Chrome oder IE), die du mit F12 öffnen kannst. Dort kannst du sowohl HTML, CSS als auch Javascript debuggen und bei CSS siehst du auch, was für CSS-Klassen es noch gibt, die deine Styles überschreiben.
Deine eigenen Styles kannst du höher stellen, indem du genauere CSS-Pfade nutzt (z.B. .deinDIV img {}) oder im Sonderfall mit !important auf hoch stellst.
Tipp: Inline-Styles würde ich immer vemeiden und stattdessen eigene CSS-Klassen definieren, die du auch für andere Sachen wiederverwenden kannst. Sonst machst du mit deinen Inline-Styles nur Duplikate im Code, was nicht gut ist.
Aus privaten Gründen habe ich leider nicht mehr so viel Zeit wie früher. Bitte habt Verständnis dafür.
Bild
Bild
Benutzeravatar
TroaX
Beiträge: 659
Registriert: 08.03.2013 14:27
Computerausstattung: PC: Ryzen 9 3950X, 96 GB RAM, RX6800XT, 2.5 TB SSD, 21:9 Display, Pop_OS! | Lappi: Ryzen 7 5800H, 16 GB RAM, 1 TB SSD, Pop_OS!
Wohnort: NRW
Kontaktdaten:

Re: Smiley im Chat

Beitrag von TroaX »

Ich wäre ja an und für sich bei dir. Das Problem dabei ist nur, das es in einem etablierten Bibliotheks-Konvolut wie bei Spiderbasic kaum Sinn macht, seine Formate zu präzisieren. Bei generativem Code Macht es daher kaum einen Unterschied, ob man nun style="float: None;" oder class="non-float" nimmt. Vor allem dann nicht, wenn man es innerhalb des Codes eh über eine zentrale Variable nutzt.

Das ist im übrigen auch einer der Gründe, warum ich Spiderbasic und Co. nicht nutze. Um in meinen Projekten den Overhead zu unterbinden, muss ich die einzelnen Elemente regelrecht studieren, bis ich wirklich von solchen Kleinigkeiten profitiere. z.B.:

Code: Alles auswählen

.textchat img {
  float: None;
}

<div class="textchat">Dies ist eine Nachricht!<img src="Smiley.png"></div>
Das wäre im Grunde die sauberste Lösung. Dafür muss man am Ende aber auch im Code-Output gut wühlen, bis man weiß, was man am sinnvollsten ohne Seiteneffekte überschreiben kann. Stattdessen würde ich eher mit Inlinestyle und einer Variable mit der gespeicherten Formatierung arbeiten, als den ganzen Kram zu debuggen. Das Macht am Ende den Code auch net schöner. Der Output ist bereits versaut xD
PC: Ryzen 9 3950X | 96 GB RAM | RX6800XT | 2,5 TB NVMe | Pop_OS!
Notebook: 16" 3:2 | Ryzen 7 5800H | 16 GB RAM | Radeon Vega | 1TB NVMe | Pop_OS!
NAS: Fritz.Box :lol:
Coding: Purebasic 6.04 | PHP | HTML | CSS | Javascript
Benutzeravatar
RSBasic
Admin
Beiträge: 8022
Registriert: 05.10.2006 18:55
Wohnort: Gernsbach
Kontaktdaten:

Re: Smiley im Chat

Beitrag von RSBasic »

Da hast du recht. Ich hatte leider immer noch keine Zeit gehabt, mich mit SB zu beschäftigen.
Aus privaten Gründen habe ich leider nicht mehr so viel Zeit wie früher. Bitte habt Verständnis dafür.
Bild
Bild
stevie1401
Beiträge: 659
Registriert: 19.10.2014 15:51
Kontaktdaten:

Re: Smiley im Chat

Beitrag von stevie1401 »

Ich benutze ja Spiderbasic, gerade weil ich keine wirkliche Ahnung von CSS, Javascript und HTML habe.
Also gibt es keine (einfache) zufriedenstellende Lösung?

Code: Alles auswählen

"<img src='bilder/smile.png' float:none'/>"
...funktioniert auch nicht.
Ich programmiere nur noch mit Linux.
Linux Mint 21.x
ccode_new
Beiträge: 1214
Registriert: 27.11.2016 18:13
Wohnort: Erzgebirge

Re: Smiley im Chat

Beitrag von ccode_new »

Hallo stevie1401,

programmiere doch einfach wie unter PureBasic üblich.

Nimm z.B. ein Canvas, statt einer Textbox.

Zeichne den Text und die Bilder die du willst einfach darauf.

Das ganze könntest du dann auch zu einer Chatbox umbauen.

Nur ein kleiner Tipp!
Betriebssysteme: div. Windows, Linux, Unix - Systeme

no Keyboard, press any key
no mouse, you need a cat
Benutzeravatar
TroaX
Beiträge: 659
Registriert: 08.03.2013 14:27
Computerausstattung: PC: Ryzen 9 3950X, 96 GB RAM, RX6800XT, 2.5 TB SSD, 21:9 Display, Pop_OS! | Lappi: Ryzen 7 5800H, 16 GB RAM, 1 TB SSD, Pop_OS!
Wohnort: NRW
Kontaktdaten:

Re: Smiley im Chat

Beitrag von TroaX »

ccode_new hat geschrieben:Hallo stevie1401,

programmiere doch einfach wie unter PureBasic üblich.

Nimm z.B. ein Canvas, statt einer Textbox.

Zeichne den Text und die Bilder die du willst einfach darauf.

Das ganze könntest du dann auch zu einer Chatbox umbauen.

Nur ein kleiner Tipp!
Sei mir nicht böse. Das mag vielleicht für PureBasic best Practice sein, wenn man diese Art von Controls haben möchte. Aber für alles, was in irgendeiner Form HTML, CSS oder Javascript ausgibt, ist es genau das Gegenteil. Denn im Grunde zeichnet man mit Javscript Dinge auf das Canvas, die HTML von Haus aus mitbringt. Vollkommen witzlos, da sich die Darstellung dank CSS in Form und Farbe anpassen lässt und somit man sich das ganze JS-Gematsche ersparen kann. Im Vergleich dazu ist dann selbst ein <img src="smiley.png" class="inlineimg non-float non-border tiny" style="background-Color: #00000;" alt="Smiley"> sinnvoller.
PC: Ryzen 9 3950X | 96 GB RAM | RX6800XT | 2,5 TB NVMe | Pop_OS!
Notebook: 16" 3:2 | Ryzen 7 5800H | 16 GB RAM | Radeon Vega | 1TB NVMe | Pop_OS!
NAS: Fritz.Box :lol:
Coding: Purebasic 6.04 | PHP | HTML | CSS | Javascript
ccode_new
Beiträge: 1214
Registriert: 27.11.2016 18:13
Wohnort: Erzgebirge

Re: Smiley im Chat

Beitrag von ccode_new »

Huhu TroaX,

Alles hat sein Für- und Wider - wort.

Spidi ist dafür nicht direkt ausgelegt.

Aber niemand hindert einen daran direkt die Html-Seiten anzupassen, oder Inline-JS zuverwenden.

Und Leute die Ahnung von Webanwendungen und Design haben werden auch eine Lösung finden.

Es ist sogar möglich ein Webgadget innerhalb der Anwendung aufzurufen.
Zuletzt geändert von ccode_new am 23.02.2018 20:01, insgesamt 1-mal geändert.
Betriebssysteme: div. Windows, Linux, Unix - Systeme

no Keyboard, press any key
no mouse, you need a cat
Benutzeravatar
RSBasic
Admin
Beiträge: 8022
Registriert: 05.10.2006 18:55
Wohnort: Gernsbach
Kontaktdaten:

Re: Smiley im Chat

Beitrag von RSBasic »

@stevie1401
Hast du für uns eine öffentliche SB-Seite? Vielleicht kann ich dir dann helfen.
Da ich den Code und Aufbau von SB nicht kenne, müsste ich sinnlos raten.
Aus privaten Gründen habe ich leider nicht mehr so viel Zeit wie früher. Bitte habt Verständnis dafür.
Bild
Bild
Antworten