Beiträge von MyXoToD

MyXoToD

Bitte, gern geschehen. Passt es denn so wie du willst? Ja das mag sein, da die Slides ja vermutlich absolut positioniert sind...

MyXoToD

Ich würde bei dem CSS für das slideshow div eine :before Regel einfügen. Zum Beispiel:

Code

#slideshow:before {
  content: "";
  background-color: red;
  width: 5px; // Breite der Linie
  height: 100%;
  position: absolute;
  top: 0;
  left: Xpx; // Abstand nach Links von der Linie
}

Dem #slideshow container müsstest du dann noch position: relative geben (falls noch nicht vorhanden).

MyXoToD

Heyho liebe Community,

seit ein paar Tagen bin ich dabei einen Online-Editor zu erstellen. Vielleicht kennt einer von euch editorially.com dort wird ein Editor verwendet, der genauso funktioniert. Relativ simple:

Der User tippt zB: Lorem Ipsum **dolor* sit amet
Nun bekommt er in Echtzeit genau dasselbe angezeigt, einziger Unterschied: Die Markdown Tags sind hellgrau und das Wort wird tatsächlich fett dargestellt.

Um ein besseres Bild davon zu bekommen, könnt ihr euch meinen aktuellen Stand hier anschauen: http://md-editor.herokuapp.com/

Bold, Italic, h1, h2, usw funktioniert bereits wie ich es gerne hätte. Das einzige Problem was ich habe: Linebreaks und Absätze funktionieren nicht. Für den Editor verwende ich ein ganz normales DIV mit contenteditable=true. Das Markdown wird mittels dieser Funktion geparsed:

Code

[COLOR=#000000]function formatText() {[/COLOR]  var el = document.getElementById('editor');
  console.log(el.innerHTML);
  var savedSel = saveSelection(el);


  el.innerHTML = el.innerHTML.replace(/(<([^>]+)>)/gi, ""); // Remove HTML tags


  el.innerHTML = el.innerHTML.replace(/^# (.*)$/gi, create_tag_html("# ", "", "<h1>$1</h1>")); // H1
  el.innerHTML = el.innerHTML.replace(/^## (.*)$/gi, create_tag_html("## ", "", "<h2>$1</h2>")); // H2
  el.innerHTML = el.innerHTML.replace(/^### (.*)$/gi, create_tag_html("### ", "", "<h3>$1</h3>")); // H3
  el.innerHTML = el.innerHTML.replace(/\*\*(.*?)\*\*/gi, create_tag_html("**", "**", "<strong>$1</strong>")); // Bold
  el.innerHTML = el.innerHTML.replace(/\*(.*?)\*/gi, create_tag_html("*", "*", "<em>$1</em>")); // Italic
  el.innerHTML = el.innerHTML.replace(/\~\~(.*?)\~\~/gi, create_tag_html("~~", "~~", "<s>$1</s>")); // Strike
  el.innerHTML = el.innerHTML.replace(/\r\n\r\n([a-z])/gi, create_tag_html("", "", "\r\n\r\n<p>\r\n$1")); // Paragraph Open
  el.innerHTML = el.innerHTML.replace(/([^>])\r\n\r\n/gi, create_tag_html("", "", "$1\r\n</p>\r\n")); // Paragraph Close
  el.innerHTML = el.innerHTML.replace(/\[(.*)\]\((.*) "(.*)"\)/gi, create_tag_html("", "", "<a href='$2' title='$3'>[$1]($2 \"$3\")</a>")); // Link
  el.innerHTML = el.innerHTML.replace(/\r\n\r\n>/gi, create_tag_html("", "", "\r\n\r\n<quote>\r\n>")); // Quote
  el.innerHTML = el.innerHTML.replace(/(> .*)\r\n\r\n/gi, create_tag_html("", "", "$1\r\n</quote>\r\n\r\n")); // Quote
  el.innerHTML = el.innerHTML.replace(/> (.*)$/gi, create_tag_html("", "", "$1")); // Quote


  // Restore the original selection
  restoreSelection(el, savedSel);
}


function create_tag_html(before, after, content) {
  var tag = "<div class='tag'>";
  tag += "<span class='before'>" + before + "</span>";
  tag += content
  tag += "<span class='after'>" + after + "</span>";
  return tag; [COLOR=#000000]}[/COLOR]

Alles anzeigen

Was passiert wenn man return drückt? In dem Div wird an der aktuellen Curserposition folgendes hinzugefügt:

Code

<div><br></div>

Danach springt der Curser an Position 0 in dem Editor Element (DIV). Um die Curser Position zwischenzuspeichern und wieder auszugeben habe ich ein Framework names "Rangy" eingefüt, welches bei allen anderen Markdown Tags sehr gut funktioniert. Das komische: Selbst wenn ich alle replace Funktionen aus der format Funktion entferne, wird dieses div mit einem break hinzugefügt. Allerdings wird dies im eigentlich Div nicht angezeigt. Ich bin langsam ratlos und weiß nicht wie ich das Problem beheben soll.

Hat sich schonmal jemand mit diesem Thema auseinandergesetzt? Ich würde mich sehr über Hilfe freuen.

Cheers,
Max

MyXoToD

Danke für die Antwort.

Ja mir ist bewusst, dass dies zugelassen werden muss.

Die Pixel Angaben von mir sollten auch keine Fläche sein, sondern einen Punkt markieren. 250 Pixel von der linken Mapkante und 750 Pixel von der oberen Mapkante.

MyXoToD

Heyho,

ich plane ein bisschen Spielerei mit Geo-Daten. Erstmal schildere ich euch mein Vorhaben:

Ich möchte eine Weltkarte in 2D erstellen, welche nur die Grenzen aller Länder hat. Also ein etwas größeres Bild (kleinerer Maßstab, sollte klar sein :D). Mittels HTML5 kann man ja ziemlich toll die aktuellen Location-Daten des Benutzers auslesen. Diese bekommt man in "Grad" zurück. Mir stellt sich nun die Frage, wie ich die auf meiner 2D Map dargestellt bekomme.

Sagen wir mal als Beispiel Berlin liegt bei 90.216389, 50.216389. Auf der Map entspricht dies aber im Beispiel 250x750 Pixel. Wie komme ich von den Koordinaten ab geschicktesten auf diese Pixel angaben? Gibt es da überhaupt einen ordentlichen Weg oder gibt es andere Vorschläge? Würde mich freuen, wenn sich damit jemand auskennt.

Highfive!

MyXoToD

Sowas dachte ich mir schon irgendwie. Nur hab ich auch keine Idee, wie man das anders machen könnte... Irgendwie muss es ja aber machbar sein, denke ich. Wenn ich in dem For-Block direkt die Daten aus tmpCube in cube schreibe, passiert auch nur mist. Liegt aber vermutlich auch hier daran, dass ich nach den Durchläufen nicht immer den aktuellen Stand übergeben kann... Hmmm.

Edit:
Nun hab ich etwas völlig verrücktes rausgefunden... Anscheinend werden die Daten doch richtig zwischengespeichert aber nicht alle Oo Wie geht denn das...
Wenn ich den besagten Teil wiefolgt umschreibe:

Code

var tmpCube = new Array();
    var newCube = new Array();
    newCube = cube;
    scramble = "R";
    for (key in scramble) {
        var value = scramble[key];
        tmpCube = newCube;
        switch (value) {
            case "R":
                newCube['R1'] = tmpCube['R7'];
                newCube['R2'] = tmpCube['R4'];
                newCube['R3'] = tmpCube['R1'];
                newCube['R4'] = tmpCube['R8'];
                newCube['R6'] = tmpCube['R2'];
                newCube['R7'] = tmpCube['R9'];
                newCube['R8'] = tmpCube['R6'];
                newCube['R9'] = tmpCube['R3'];
                newCube['B7'] = tmpCube['U3'];
                newCube['B4'] = tmpCube['U6'];
                newCube['B1'] = tmpCube['U9'];
                newCube['U9'] = tmpCube['F9'];
                newCube['U6'] = tmpCube['F6'];
                newCube['U3'] = tmpCube['F3'];
                newCube['F3'] = tmpCube['D3'];
                newCube['F6'] = tmpCube['D6'];
                newCube['F9'] = tmpCube['D9'];
                newCube['D3'] = tmpCube['B7'];
                newCube['D6'] = tmpCube['B4'];
                newCube['D9'] = tmpCube['B1'];
            break;

Alles anzeigen

dann sind immer die letzten 3 Veränderungen falsch. Sprich in diesem Fall newCube D3, D6 und D9 sind zum Schluss falsch. Bei den anderen ist es richtig. Das versteh ich nicht :O

MyXoToD

Heyho,
ich hab gestern einen kleinen Scramble-Generator für Rubiks Cubes in PHP programmiert. Heute wollte ich das ganze in Javascript umschreiben. Soweit klappte alles auch ganz gut, allerdings gibts ein kleines Problem mit der Vorschau des Würfels.

Der gesamte Code ist hier zu finden: http://codepen.io/MyXoToD/pen/wFxJh

Im Javascript-Bereich geht es mir um den Bereich bei Zeile 107. Dort laufe ich in einer Schleife durch jeden Move im Scramble und "drehe" somit die ebenen. Nach jedem Durchlauf sollte in tmpCube die aktuelle Positionierung des Würfels stehen. Das scheint hier aber nicht wirklich zu klappen.
Wenn man nur einen Zug im Scramble macht, klappt alles aber sobald man 2 oder mehr macht, kommt es nicht mehr klar mit der Eingabe. In meiner PHP Version klappt das super...
Was mache ich hier bei Javascript falsch? Wie kann ich nach jedem durchlauf den aktuellen Stand des Würfels richtig abspeichern, damit dieser beim nächsten Durchlauf verwendet wird?

Hoffe mir kann hier jemand die Welt erklären

MyXoToD

Wenn es möglich ist, soll es nicht an der Programmierung scheitern. ich würde mich gerne bereiterklären dir ein solches Script zu programmieren. Werde mir die API von ebay mal näher anschauen.

MyXoToD

Wie gesagt, ich bin nicht grad der Profi was ebay angeht aber Javascript wird dort bestimmt nicht gern gesehen sein.

Eine Idee fällt mir noch ein. Das klappt aber nur, wenn ebay eine Schnittstelle hat, mit der du via PHP die Kundenstimmen auslesen kannst wenn du eine Produkt ID übergibst. Dann könnstest du ein PHP Skript auf deinem Server schreiben, welches die Bewertungen des Produktes ausliest (jenachdem welche ID an das Skript per URL übergeben wird). Wenn du die Daten hast, generierst du mittels PHP eine Grafik und lässt diese direkt an den Browser ausgeben. (jpeg Header senden).

Dann könntest du die letzten Bewertungen in etwa so einbinden:

HTML

<img src="http://www.deineurl.de/deinSkript.php?pid=PRODUKTID" alt="" />

Da das Skript ein Bild erzeugt und einen Grafik Header senden sollte, wird das erzeugte Bild im IMG-Tag angezeigt Mach dich mal schlau, ob ebay eine PHP Api anbietet, mit der man Bewertungen auslesen kann. (sollte eine öffentliche API sein)

MyXoToD

Dieses Tool verwendet anscheinend Javascript und Flash. Dieses Tool ist von Supreme und die sind wiederum zertifizierter Anbieter für Ebay. Das heißt es bleibt dir vermutlich keine andere Wahl als auf solch einen Anbieter zurückzugreifen.

MyXoToD

Was genau soll dieses Script denn überhaupt machen? Ist es Javascript oder PHP?
Ich kenne mich mit eBay zwar nicht so aus aber ich denke, dass dort weder internes Javascript, noch externes erlaubt ist. Mit PHP könntest du einen Besuchercounter in Form einer Grafik einbauen zum Beispiel...

Naja, erzähl erstmal was du überhaupt vor hast.

MyXoToD

Danke, das werde ich heute Abend mal ausprobieren! Sieht vielversprechend aus. Sonderzeichen bereits für Usernamen ausgeschlossen (a-z, A-Z, 0-9 und _ geht). Sollte somit mit dieser RegEx kein Problem geben, wenn ich dich richtig verstanden hab.

Kann ich deine Zeile mit meiner Kombinieren? ->

Apache Configuration

RewriteRule ^([^.]+)$ /index.php?p=$1 [L]
RewriteRule /([\w|\d|_|-)+/? index.php?p=user&u=$1

Damit ich Seiten und Benutzer gleich aufrufen kann...

MyXoToD

Ich glaube du hast ein schließendes Div irgendwo vergessen. Right Col ist bei dir in Left Col drin. Das darf nicht sein. Erst left col, dann right col und beide werden umschlossen von content wrapper, das ist schonmal richtig. Nach right col und vor dem schließenden content wrapper kommt dann das clear both.

MyXoToD

Da stimm ich dir soweit zu. Ich bin mir auch definitiv sicher, dass da noch einiges an Content kommen wird. Ich möchte die URLs deswegen gerne so machen, da es ähnlich wie Twitter auch ein Social Network wird. Zwar in winziger Form und eine komplett andere Art (für Autoren) aber dennoch finde ich solche URLs passend zu solchen Seiten. Hier geht es ja auch oft darum, dass man anderen Leuten mal schnell seine Profil URL schickt und das geht so am besten. Klar ein weiteres /user/ würde jetzt auch keinen stören aber ich finds irgendwie nicht so doll

MyXoToD

Das dachte ich mir, deswegen wollte ich sehen was du nun da gemacht hast.
Du hast die linke Spalte und die rechte Spalte nicht via Float nebeneinander gemacht, sondern absolut positioniert.
Hier mal mein Vorschlag ein bisschen klarer:

HTML

<div class="header">
    <!-- Dein Headerbild oder whatever -->
</div>
<div class="content-wrapper">
    <div class="left-col">
        <!-- vertikales Menü -->
    </div>
    <div class="right-col">
        <!-- horizontales Menü -->
        <!-- Content -->
    </div>
    <br style="clear: both;" />
</div>

Alles anzeigen

HTML

.header {
    width: 980px;
    height: 200px;
    margin: 0 auto;
    text-align: center;
}


.content-wrapper {
    width: 980px;
}


.left-col {
    width: 277px;
    float: left;
}


.right-col {
    width: 703px;
    float: left;
}


.horizontales-menu {
    width: 500px;
    margin: 0 auto;
}

Alles anzeigen

MyXoToD

"UPDATE" ändert in deinem Fall den bestehenden Eintrag mit der "id=$id"... Klar, dass du da was überschreibst. Wie Bandit schon sagt, machs mit "INSERT".

MyXoToD

Ja das ist mir kurz danach auch eingefallen. Ich werde wohl auch noch eine Namensliste erstellen müssen, wo ich alle Seitennamen reserviere, damit diese nicht bei der Registration als Username verwendet werden können.

Ich werde meine Methode vermutlich heute anpassen, dann poste ich dazu mal hier den Code. Das Thema interessiert bestimmt einige. Hab nämlich solche Art von Fragen in einigen Foren gefunden aber nie eine wirkliche Lösung dazu. Hab nur gelesen, dass Twitter das anscheinend irgendwie mit Ruby on Rails oder so macht.

MyXoToD

Auf deiner Testseite hast du das aber so noch nicht übernommen oder? Würde gerne mal sehen wie es jetzt mit deiner Lösung aussieht.

MyXoToD

Danke für die Info. Das klingt schonmal nicht schlecht. Das Einzige was mich stört ist, dass dann noch dieses doofe /user/ davor stehen muss. Allerdings kam mir bei deinem Vorschlag eine Idee, wie ich mein aktuelles Skript mit deiner Idee erweitern könnte. Ich habe ja meine Methode "getContent". In dieser Methode prüfe ich den "p" Parameter und gebe dementsprechend die Content-Dateien aus. Hier könnte ich es so machen, dass erst auf Username geprüft wird und wenn kein User gefunden wurde, dann prüfe ich auf Content-File. Wird auch kein Content-File gefunden, dann gibts halt ne 404 Meldung. Wenn ich jetzt keinen Denkfehler drin hab sollte das so klappen, dass ich Seiten und auch Profile mit *.de/seitenname bzw. *.de/username aufrufen kann. Korrigiert mich, fals ich hier falsch liege.

MyXoToD

Ein Vorschlag von mir: Das horizontale Menü rechts neben das vertikale Menü. Hierfür müsstest du beiden Containern float:left geben.

Ich würde dir die Strukturierung anders empfehlen.
Wie man unschwer erkennen kann, wird das Layout 2-spaltig. Nach deinem Header sollte also ein Div kommen, welches alle Inhalte umschließt (beide menüs und den späteren Content). In dieses Div machst du 2 weitere Divs: Linke Spalte und rechte Spalte. Diesen Divs gibst du die nötige Breite (links = breite vom vertikalen Menü ; rechts = restliche Breite die noch übrig bleibt). Außerdem beiden Divs float left geben.
Nun hast du schonmal die Spalten. In die rechte Spalte packst du dein vertikales Menü und in die rechte spalte dein horizontales. Um das Horizontale nun in die Mitte zu bekommen, gibst du diesen Menü auch eine feste Breite und zusätzlich margin: 0 auto;
Dann kannst du den Content in die linke Spalte unter das horizontale Menü machen.

Wichtig: Wenn gefloatet wird muss auch gecleart werden. Also mach in dem großen div, welches rechts und links umschließt (aber nach den beiden spalten divs) ein <br style="clear: both;" />

Beiträge von MyXoToD

Bild über ein Slide setzen...

Bild über ein Slide setzen...

Markdown Editor: Linebreak parsen funktioniert nicht

Geo-Koordinaten umrechnen zu Pixel X & Y

Geo-Koordinaten umrechnen zu Pixel X & Y

[JS] Variable lässt sich in einer For-Schleife nicht wie gewollt zwischenspeichern

[JS] Variable lässt sich in einer For-Schleife nicht wie gewollt zwischenspeichern

Versuche ein workaround zu finden, um ein Script anzeigen zu können

Versuche ein workaround zu finden, um ein Script anzeigen zu können

Versuche ein workaround zu finden, um ein Script anzeigen zu können

Versuche ein workaround zu finden, um ein Script anzeigen zu können

URLs via mod_rewrite umschreiben (ähnlich wie bei Twitter)

Brauche hilfe beim positionieren

URLs via mod_rewrite umschreiben (ähnlich wie bei Twitter)

Brauche hilfe beim positionieren

Datenbank Neuer Benutzer

URLs via mod_rewrite umschreiben (ähnlich wie bei Twitter)

Brauche hilfe beim positionieren

URLs via mod_rewrite umschreiben (ähnlich wie bei Twitter)

Brauche hilfe beim positionieren