Buggy texture coordinate mapping

Question

I can't find the issue with my offset to coordinate and vice versa mapping however there's a problem that manifests itself very repeatedly as soon as the sizes get slightly large. This runs on Chrome.

I am trying a 55x56 texture and I use the following routines to map from a logical interger offset to the uv (st) of TexCoords and back. Somehere some error gets accumulated causing two subsequent offset (eg. 54 and 55) to map to the same texel.

The line for halfTexel addition below was found in one of StackOverflow posts (and it makes very much sense). At the beginning of my shader i also have this line:

// const vec2 halfTexel = vec2(${1.0 / (2.0 * xScale)}, ${1.0 / (2.0 * yScale)});
// xscale is the width (55)
// yscale is the height (56)

precision highp float;
...
vec2 offsetToCoords_A(int offset) {
  const vec2 halfTexel = vec2(0.00909090909090909, 0.008928571428571428);
  const float xScale = 55.0;
  const float yScale = 56.0;
  float offsetF = float(offset);
  float s = mod(offsetF, 55.0);
  float t = floor(offsetF / 55.0);
  vec2 coords = vec2(s/xScale, t/yScale) + halfTexel;
  return coords;
}

int coordsToOffset_A(vec2 coords) {
  const float xScale = 55.0;
  const float yScale = 56.0;
  float s = coords.s * xScale;
  float t = coords.t * yScale;
  int offset = int(t) * 55 + int(s);
  return offset;
}

sample result:

49,50,51,52,53,54,54,56,57,58,59,
...
106,107,108,109,109,111,112,113

Answer 1

Removed the mod and changed offsetToCoords to the following:

vec2 offsetToCoords_A(int offset) {
  const vec2 halfTexel = vec2(0.00909090909090909, 0.008928571428571428);
  const float xScale = 55.0;
  const float yScale = 56.0;
  int t = offset / int(xScale);
  int s = offset - t*int(xScale);
  vec2 coords = vec2(s,t)/vec2(xScale, yScale) + halfTexel;
  return coords;
}