truck/Sahli
1
0
Fork 0
Code Issues Pull requests Releases Wiki Activity

working for MY screen. Not working well in responsive view

Browse source 
- or Nameless' browser, which is larger.
This commit is contained in:
Iam Naughton Phier 2015-03-01 16:34:25 +02:00
parent 96781e8413
commit 6987e1fd57
3 changed files with 34 additions and 39 deletions
Download patch file Download diff file Expand all files Collapse all files

3
index.html
View file

@ -40,8 +40,9 @@
<li><span class="key">C</span> "panel" view toggle</li> <li><span class="key">C</span> "panel" view toggle</li>
<li><span class="key">Up</span><span class="key">Down</span><span class="key">Pageup</span><span class="key">Pagedown</span> Move about by line/page</li> <li><span class="key">Up</span><span class="key">Down</span><span class="key">Pageup</span><span class="key">Pagedown</span> Move about by line/page</li>
<li><span class="key">Home</span><span class="key">End</span> Move to top/bottom (no zoom reset)</li> <li><span class="key">Home</span><span class="key">End</span> Move to top/bottom (no zoom reset)</li>
<li><span class="key">I</span> SAUCE or Partymeister info</li>
<li><span class="key">H</span> This help (: <span class="key">Esc</span> Cancel fullscreen</li> <li><span class="key">H</span> This help (: <span class="key">Esc</span> Cancel fullscreen</li>
<li class='nodot'><b>Tab also works for "info" but browsers hate it, so use 'U'</b></li> <li class='nodot'><b>Tab also works for "info" but browsers hate it, so use 'I'</b></li>
</ul> </ul>
</div> </div>
</div> </div>

28
sahli.coffee
View file

@ -249,25 +249,22 @@ class @Sahli
ww = window.innerWidth ww = window.innerWidth
wh = window.innerHeight wh = window.innerHeight
numpanels = canvs.length numpanels = canvs.length
fullpicheight = 0 screenratio = ww/wh
fullpicheight = (fullpicheight + i.height) for i in canvs panelratio = canvs[0].height/canvs[0].width
stripe_width = ww/Math.ceil(fullpicheight/ww) x = Math.sqrt numpanels/screenratio
num_strips = Math.sqrt (ww/stripe_width)*(fullpicheight/wh) numcols = Math.round(screenratio*x)
picdpercol = Math.round(numpanels/numcols)
numcols = Math.floor num_strips-1 newwidth = ww/numcols
scaling_factor = num_strips * (wh / fullpicheight)
# newheight = canvs[0].height * scaling_factor
# $(canvs[0]).height newheight
newwidth = scaling_factor * canvs.height()
canvs.width newwidth canvs.width newwidth
newheight = $(canvs[0]).height() newheight = $(canvs[0]).height()
colwidth = ww/numcols colwidth = ww/numcols
outer = $('<div>') outer = $('<div>')
outer.append @createpanel(i,colwidth - 6) for i in [1..numcols] outer.append @createpanel(i,colwidth - 6) for i in [1..numcols-1]
outer.addClass 'nosb' outer.addClass 'nosb'
$('#panel').append outer $('#panel').append outer
$('#outbox').toggle() $('#outbox').toggle()
@ -276,11 +273,14 @@ class @Sahli
drawcol = 1 drawcol = 1
for pic in canvs for pic in canvs
$("#column#{drawcol}").append pic $("#column#{drawcol}").append pic
level = level + newheight level += 1
if level+(newheight/2) > wh if level > picdpercol
level = 0 level = 0
drawcol = drawcol + 1 drawcol = drawcol + 1
console.log "ww: #{ww} wh: #{wh} numpanels: #{numpanels} x: #{x}"
console.log "numcols: #{numcols} picdpercol: #{picdpercol}"
else else
$('.scrolly').width @origwidth $('.scrolly').width @origwidth
$('#outbox').show() $('#outbox').show()
@ -322,7 +322,7 @@ class @Sahli
when @keycode 'x' when @keycode 'x'
@changescrolldirection 1 @changescrolldirection 1
when @keycode 'c' when @keycode 'c'
@panelmode() @panelmode(1)
when @keycode '1' when @keycode '1'
@changespeed 1 @changespeed 1
when @keycode '2' when @keycode '2'

42
sahli.js
View file

@ -281,7 +281,7 @@ l__________/__________|___|______l__________j_____j
}; };
Sahli.panelmode = function() { Sahli.panelmode = function() {
var canvs, colwidth, drawcol, fullpicheight, i, level, newheight, newwidth, num_strips, numcols, numpanels, outer, pic, scaling_factor, stripe_width, wh, ww, _i, _j, _k, _l, _len, _len1, _len2, _results; var canvs, colwidth, drawcol, i, level, newheight, newwidth, numcols, numpanels, outer, panelratio, pic, picdpercol, screenratio, wh, ww, x, _i, _j, _k, _len, _len1, _ref;
$('#panel').toggle(); $('#panel').toggle();
canvs = $('canvas'); canvs = $('canvas');
if ($('.scrolly').width() === this.origwidth) { if ($('.scrolly').width() === this.origwidth) {
@ -290,21 +290,17 @@ l__________/__________|___|______l__________j_____j
ww = window.innerWidth; ww = window.innerWidth;
wh = window.innerHeight; wh = window.innerHeight;
numpanels = canvs.length; numpanels = canvs.length;
fullpicheight = 0; screenratio = ww / wh;
for (_i = 0, _len = canvs.length; _i < _len; _i++) { panelratio = canvs[0].height / canvs[0].width;
i = canvs[_i]; x = Math.sqrt(numpanels / screenratio);
fullpicheight = fullpicheight + i.height; numcols = Math.round(screenratio * x);
} picdpercol = Math.round(numpanels / numcols);
stripe_width = ww / Math.ceil(fullpicheight / ww); newwidth = ww / numcols;
num_strips = Math.sqrt((ww / stripe_width) * (fullpicheight / wh));
numcols = Math.floor(num_strips - 1);
scaling_factor = num_strips * (wh / fullpicheight);
newwidth = scaling_factor * canvs.height();
canvs.width(newwidth); canvs.width(newwidth);
newheight = $(canvs[0]).height(); newheight = $(canvs[0]).height();
colwidth = ww / numcols; colwidth = ww / numcols;
outer = $('<div>'); outer = $('<div>');
for (i = _j = 1; 1 <= numcols ? _j <= numcols : _j >= numcols; i = 1 <= numcols ? ++_j : --_j) { for (i = _i = 1, _ref = numcols - 1; 1 <= _ref ? _i <= _ref : _i >= _ref; i = 1 <= _ref ? ++_i : --_i) {
outer.append(this.createpanel(i, colwidth - 6)); outer.append(this.createpanel(i, colwidth - 6));
} }
outer.addClass('nosb'); outer.addClass('nosb');
@ -312,24 +308,22 @@ l__________/__________|___|______l__________j_____j
$('#outbox').toggle(); $('#outbox').toggle();
level = 0; level = 0;
drawcol = 1; drawcol = 1;
_results = []; for (_j = 0, _len = canvs.length; _j < _len; _j++) {
for (_k = 0, _len1 = canvs.length; _k < _len1; _k++) { pic = canvs[_j];
pic = canvs[_k];
$("#column" + drawcol).append(pic); $("#column" + drawcol).append(pic);
level = level + newheight; level += 1;
if (level + (newheight / 2) > wh) { if (level > picdpercol) {
level = 0; level = 0;
_results.push(drawcol = drawcol + 1); drawcol = drawcol + 1;
} else {
_results.push(void 0);
} }
} }
return _results; console.log("ww: " + ww + " wh: " + wh + " numpanels: " + numpanels + " x: " + x);
return console.log("numcols: " + numcols + " picdpercol: " + picdpercol);
} else { } else {
$('.scrolly').width(this.origwidth); $('.scrolly').width(this.origwidth);
$('#outbox').show(); $('#outbox').show();
for (_l = 0, _len2 = canvs.length; _l < _len2; _l++) { for (_k = 0, _len1 = canvs.length; _k < _len1; _k++) {
pic = canvs[_l]; pic = canvs[_k];
$('.scrolly').append(pic); $('.scrolly').append(pic);
} }
canvs.width(this.origwidth); canvs.width(this.origwidth);
@ -373,7 +367,7 @@ l__________/__________|___|______l__________j_____j
case _this.keycode('x'): case _this.keycode('x'):
return _this.changescrolldirection(1); return _this.changescrolldirection(1);
case _this.keycode('c'): case _this.keycode('c'):
return _this.panelmode(); return _this.panelmode(1);
case _this.keycode('1'): case _this.keycode('1'):
return _this.changespeed(1); return _this.changespeed(1);
case _this.keycode('2'): case _this.keycode('2'):