plint

French poetry validator
git clone https://a3nm.net/git/plint/
Log | Files | Refs | README

commit d51d134cbaea402fcacd1cd1734f1f9690386258
parent 5ef33a18c406b7298f64407ddf7f34d98249e3c4
Author: Antoine Amarilli <a3nm@a3nm.net>
Date:   Thu,  3 Sep 2015 00:56:22 +0200

fix chrome and other weirdnesses

Diffstat:
static/main.css | 9+--------
static/mobile.css | 17++++++++++++++++-
static/script.js | 67+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++--------
3 files changed, 76 insertions(+), 17 deletions(-)

diff --git a/static/main.css b/static/main.css @@ -96,18 +96,14 @@ dt { #poem { min-height: 8em; - min-width: 100%; - max-width: 100%; - width: 100%; /* http://stackoverflow.com/a/4156343 */ + width: 100%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } #predef { - max-width: 100%; - min-width: 100%; width: 100%; /* http://stackoverflow.com/a/4156343 */ -webkit-box-sizing: border-box; @@ -120,9 +116,6 @@ dt { } #user_template { - width: 100%; - min-width: 100%; - max-width: 100%; /* http://stackoverflow.com/a/4156343 */ -webkit-box-sizing: border-box; -moz-box-sizing: border-box; diff --git a/static/mobile.css b/static/mobile.css @@ -15,7 +15,22 @@ } #lcontainer { - width: initial; float: none; + width: 100%; +} + +#poem { + min-width: 100%; + max-width: 100%; +} + +#predef { + max-width: 100%; + min-width: 100%; +} + +#user_template { + min-width: 100%; + max-width: 100%; } diff --git a/static/script.js b/static/script.js @@ -36,11 +36,9 @@ var setForCustom = false; function setUnload() { window.onbeforeunload = function() { if (lang == "fr") { - return ("Votre poème sera perdu en fermant cette page. " - + "Êtes-vous sûr de vouloir la quitter ?"); + return ("Votre poème sera perdu en fermant cette page."); } else { - return ("Your poem will be lost when closing this page. " - + "Are you sure you want to navigate away?"); + return ("Your poem will be lost when closing this page."); } }; } @@ -90,14 +88,39 @@ function sanitize(e) { } } +var poem_h, poem_w, user_template_h, user_template_w; + function resizeCErrors(e) { + // resize in width + var twidth = $( window ).width() - $( '#poem' ).width() - em2px(2); + if (twidth > 50) { + $( '#cerrors' ).width(twidth); + } + if ($( window ).width() > 650) { /* stretch cerrors */ $( '#cerrors' ).height($( window ).height() - $( '#cerrors' ).offset().top - em2px(1)); } + if ($( window ).width() <= 650) { + // everyone takes full width + $( '#cerrors' ).width($( window ).width() - em2px(2)); + $( '#user_template' ).width($( window ).width() - em2px(2)); + $( '#poem' ).width($( window ).width() - em2px(2)); + $( '#lcontainer' ).width($( window ).width() - em2px(2)); + } + // store the sizes (see resizeAllLast function) + // following http://stackoverflow.com/a/7055197 + poem_h = $( '#poem' ).height(); + poem_w = $( '#poem' ).width(); + user_template_h = $( '#user_template' ).height(); + user_template_w = $( '#user_template' ).width(); } function resizeAllPoem(e) { + if ($( '#poem' ).height() == poem_h && $( '#poem' ).width() == poem_w) { + // nothing changed + return; + } sanitize(e); var avail = getAvail(); var h1 = $( '#poem' ).height(); @@ -119,10 +142,17 @@ function resizeAllPoem(e) { $( '#user_template' ).height(0.1 + avail); } } + // resize in width + $( '#user_template' ).width($( '#poem' ).width()); + $( '#lcontainer' ).width($( '#poem' ).width()); resizeCErrors(e); } function resizeAllUserTemplate(e) { + if ($( '#user_template' ).height() == user_template_h && $( '#user_template' ).width() == user_template_w) { + // nothing changed + return; + } sanitize(e); var avail = getAvail(); var h1 = $( '#poem' ).height(); @@ -138,6 +168,9 @@ function resizeAllUserTemplate(e) { if ($( window ).width() <= 650) { $( '#cerrors' ).height(0.1 + h3 * avail/used); } + // resize in width + $( '#poem' ).width($( '#user_template' ).width()); + $( '#lcontainer' ).width($( '#user_template' ).width()); resizeCErrors(e); } @@ -165,6 +198,24 @@ function resizeAll(e) { resizeCErrors(e); } +function resizeAllLast(e) { + // chrome does not fire mouseup when it happens outside of the element + // and does not fire mousedown when resizing + // https://code.google.com/p/chromium/issues/detail?id=453023 + // so we have to detect mouseups globally + // and figure out who was resized + // by comparing against stored sizes... + if ($( '#poem' ).height() != poem_h || $( '#poem' ).width() != poem_w) { + resizeAllPoem(); + } else if ($( '#user_template' ).height() != user_template_h || $( '#user_template' ).width() != user_template_w) { + resizeAllUserTemplate(); + } else { + // we can't figure it out (or the mouseup is irrelevant) + // run resizeAll + resizeAll(); + } +} + window.onresize = resizeAll; window.onload = resizeAll; @@ -288,15 +339,15 @@ jQuery(document).ready(function(){ $( '#poem' ).dblclick(function(){ resizeAllPoem(); }); + $(document).mouseup(function() { + resizeAllLast(); + }); resizeAll(); - setTimeout(function () { - $(window).resize(); - }, 1000); }); $(document).load(function(e) { setTimeout(function () { $(window).resize(); - }, 1000); + }, 100); });