setting up bounds
This commit is contained in:
francois.lutran
267
masks/write.html
267
masks/write.html
@@ -1,130 +1,139 @@
|
||||
<div id="write">
|
||||
<div id="write_feedback"></div>
|
||||
<div id="nav">
|
||||
<a class="fa fa-prev"></a>
|
||||
<span class="page_nb">1</span>
|
||||
<A class="fa fa-next"></a>
|
||||
</div>
|
||||
<div id="editor">
|
||||
<p>So, I'm there, wondering about myself and my future - such a luxury by the way - when suddenly, someone approaches. mid-40s i'd say, elegant cold women, the kind you've learned not to talk to, to eventually avoid feeling repressed, or bad for yourself, or both.</p>
|
||||
<p>Anyhow, it would seem that in this particular situation, the choice wasn't given to me to decide whether or not to talk to that precise women. She seats down next to me and engage a conversation. 'How is it you're here today?' I'm already regretting not having gone away when i still had the chance.</p>
|
||||
<p>'Hello to you too' I say, still willing to show some manhood, even though I already know this women crushes manhood by pairs as a breakfast ritual.</p>
|
||||
<p>In-extremist, I manage to babble some excuses about a rigorous lunch break time and leave the premises.</p>
|
||||
<p>So, I'm there, wondering about myself and my future - such a luxury by the way - when suddenly, someone approaches. mid-40s i'd say, elegant cold women, the kind you've learned not to talk to, to eventually avoid feeling repressed, or bad for yourself, or both.</p>
|
||||
<p>Anyhow, it would seem that in this particular situation, the choice wasn't given to me to decide whether or not to talk to that precise women. She seats down next to me and engage a conversation. 'How is it you're here today?' I'm already regretting not having gone away when i still had the chance.</p>
|
||||
<p>'Hello to you too' I say, still willing to show some manhood, even though I already know this women crushes manhood by pairs as a breakfast ritual.</p>
|
||||
<p>In-extremist, I manage to babble some excuses about a rigorous lunch break time and leave the premises.</p>
|
||||
</div>
|
||||
</div>
|
||||
<script type="text/javascript">
|
||||
oMyThoughts.pageInit = function(asHash, bFirstPage)
|
||||
{
|
||||
self.vars('counter', 0);
|
||||
self.vars('id', 0);
|
||||
self.vars('default_text', '<p><br></p>');
|
||||
self.vars('working', false);
|
||||
self.vars('prec_displayed', 0);
|
||||
self.vars('prec_content', 0);
|
||||
self.vars('page', $('.page_nb').text());
|
||||
|
||||
self.vars('page_height', $('#editor').height());
|
||||
|
||||
var oQuill = new Quill('#editor', {
|
||||
theme: 'bubble',
|
||||
modules:
|
||||
{
|
||||
toolbar: [['bold', 'italic', 'underline'], [{ 'list': 'ordered'}, { 'list': 'bullet' }], ['clean']]
|
||||
}
|
||||
});
|
||||
|
||||
quill.on('text-change', function(delta, oldDelta, source) {
|
||||
if(source == 'user')
|
||||
{
|
||||
|
||||
}
|
||||
});
|
||||
|
||||
$('.fa-prev').click(function(){moveToPage(-1);});
|
||||
$('.fa-next').click(function(){moveToPage(1);});
|
||||
};
|
||||
|
||||
oMyThoughts.onFeedback = function(sType, sMsg)
|
||||
{
|
||||
var $Feedback = $('#write_feedback');
|
||||
$Feedback
|
||||
.stop()
|
||||
.fadeOut($Feedback.is(':empty')?0:'fast', function(){
|
||||
$(this)
|
||||
.empty()
|
||||
.append($('<span>', {'class':sType}).text(sMsg))
|
||||
.fadeIn('fast');
|
||||
});
|
||||
};
|
||||
|
||||
oMyThoughts.onQuitPage = function()
|
||||
{
|
||||
save();
|
||||
return true;
|
||||
};
|
||||
|
||||
function save(sContent)
|
||||
{
|
||||
if(sContent != self.vars('default_text'))
|
||||
{
|
||||
oMyThoughts.onFeedback('info', 'Saving...');
|
||||
getInfo
|
||||
(
|
||||
'update',
|
||||
function(asData)
|
||||
{
|
||||
self.vars('id', asData.id_thought);
|
||||
oMyThoughts.onFeedback('notice', 'Saved ('+asData.led.substr(11, 5)+')');
|
||||
},
|
||||
{content:sContent, id:self.vars('id')},
|
||||
function(sError)
|
||||
{
|
||||
oMyThoughts.onFeedback('error', 'Not saved! Un error occured: '+sError);
|
||||
},
|
||||
'POST'
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
function checkPageBook()
|
||||
{
|
||||
self.vars('working', true);
|
||||
var iEm = $(1).toPx();
|
||||
iEm = iEm.substr(0, iEm.length - 2);
|
||||
|
||||
$Editor = self.vars('editor');
|
||||
|
||||
//Content Height
|
||||
var iContentHeight = $Editor.height();
|
||||
|
||||
//Calculates what should be displayed
|
||||
iDisplayedHeight = iContentHeight % self.vars('max_height');
|
||||
console.log(iContentHeight+'%'+self.vars('max_height')+'='+iDisplayedHeight);
|
||||
|
||||
//Navigation
|
||||
var iNewPage = Math.ceil(iContentHeight / self.vars('max_height'));
|
||||
moveToPage(iNewPage);
|
||||
|
||||
|
||||
self.vars('prec_displayed', iDisplayedHeight);
|
||||
self.vars('prec_content', iContentHeight);
|
||||
|
||||
self.vars('working', false);
|
||||
}
|
||||
|
||||
function moveToPage(iNewPage)
|
||||
{
|
||||
if(iNewPage!=self.vars('page'))
|
||||
{
|
||||
self.vars('page', iNewPage);
|
||||
console.log('moving to page '+self.vars('page'));
|
||||
$('.page_nb').text(self.vars('page'));
|
||||
|
||||
self.vars('editor').css('top', (self.vars('page') - 1)*self.vars('max_height')*-1);
|
||||
}
|
||||
}
|
||||
<div id="write">
|
||||
<div id="write_feedback"></div>
|
||||
<div id="nav">
|
||||
<a class="fa fa-prev"></a>
|
||||
<span class="page_nb">1</span>
|
||||
<A class="fa fa-next"></a>
|
||||
</div>
|
||||
<div id="editor_container">
|
||||
<div id="editor">
|
||||
<p>So, I'm there, wondering about myself and my future - such a luxury by the way - when suddenly, someone approaches. mid-40s i'd say, elegant cold women, the kind you've learned not to talk to, to eventually avoid feeling repressed, or bad for yourself, or both.</p>
|
||||
<p>Anyhow, it would seem that in this particular situation, the choice wasn't given to me to decide whether or not to talk to that precise women. She seats down next to me and engage a conversation. 'How is it you're here today?' I'm already regretting not having gone away when i still had the chance.</p>
|
||||
<p>'Hello to you too' I say, still willing to show some manhood, even though I already know this women crushes manhood by pairs as a breakfast ritual.</p>
|
||||
<p>In-extremist, I manage to babble some excuses about a rigorous lunch break time and leave the premises.</p>
|
||||
<p>So, I'm there, wondering about myself and my future - such a luxury by the way - when suddenly, someone approaches. mid-40s i'd say, elegant cold women, the kind you've learned not to talk to, to eventually avoid feeling repressed, or bad for yourself, or both.</p>
|
||||
<p>Anyhow, it would seem that in this particular situation, the choice wasn't given to me to decide whether or not to talk to that precise women. She seats down next to me and engage a conversation. 'How is it you're here today?' I'm already regretting not having gone away when i still had the chance.</p>
|
||||
<p>'Hello to you too' I say, still willing to show some manhood, even though I already know this women crushes manhood by pairs as a breakfast ritual.</p>
|
||||
<p>In-extremist, I manage to babble some excuses about a rigorous lunch break time and leave the premises.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<script type="text/javascript">
|
||||
oMyThoughts.pageInit = function(asHash, bFirstPage)
|
||||
{
|
||||
self.vars('counter', 0);
|
||||
self.vars('id', 0);
|
||||
self.vars('default_text', '<p><br></p>');
|
||||
self.vars('working', false);
|
||||
self.vars('prec_displayed', 0);
|
||||
self.vars('prec_content', 0);
|
||||
self.vars('page', $('.page_nb').text());
|
||||
|
||||
self.vars('page_height', $('#editor').height());
|
||||
|
||||
var oQuill = new Quill('#editor', {
|
||||
theme: 'bubble',
|
||||
modules:
|
||||
{
|
||||
toolbar: [['bold', 'italic', 'underline'], [{ 'list': 'ordered'}, { 'list': 'bullet' }], ['clean']]
|
||||
}
|
||||
});
|
||||
|
||||
oQuill.on('text-change', function(delta, oldDelta, source) {
|
||||
if(source == 'user')
|
||||
{
|
||||
var range = oQuill.getSelection();
|
||||
if(range)
|
||||
{
|
||||
var oBound = oQuill.getBounds(range.index, range.length);
|
||||
$('#editor').append($('<div>', {style:'background:red;width:1px;height:'+(oBound.bottom - oBound.top)+'px;position:absolute;top:'+oBound.top+'px;left:'+oBound.left+'px;'}));
|
||||
$('#editor').append($('<div>', {style:'background:red;width:1px;height:10px;position:absolute;top:0px;left:0px;'}));
|
||||
$('#editor').append($('<div>', {style:'background:red;width:1px;height:10px;position:absolute;top:'+($('#editor').height() - 10)+'px;left:'+($('#editor').width() - 1)+'px;'}));
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
$('.fa-prev').click(function(){moveToPage(-1);});
|
||||
$('.fa-next').click(function(){moveToPage(1);});
|
||||
};
|
||||
|
||||
oMyThoughts.onFeedback = function(sType, sMsg)
|
||||
{
|
||||
var $Feedback = $('#write_feedback');
|
||||
$Feedback
|
||||
.stop()
|
||||
.fadeOut($Feedback.is(':empty')?0:'fast', function(){
|
||||
$(this)
|
||||
.empty()
|
||||
.append($('<span>', {'class':sType}).text(sMsg))
|
||||
.fadeIn('fast');
|
||||
});
|
||||
};
|
||||
|
||||
oMyThoughts.onQuitPage = function()
|
||||
{
|
||||
save();
|
||||
return true;
|
||||
};
|
||||
|
||||
function save(sContent)
|
||||
{
|
||||
if(sContent != self.vars('default_text'))
|
||||
{
|
||||
oMyThoughts.onFeedback('info', 'Saving...');
|
||||
getInfo
|
||||
(
|
||||
'update',
|
||||
function(asData)
|
||||
{
|
||||
self.vars('id', asData.id_thought);
|
||||
oMyThoughts.onFeedback('notice', 'Saved ('+asData.led.substr(11, 5)+')');
|
||||
},
|
||||
{content:sContent, id:self.vars('id')},
|
||||
function(sError)
|
||||
{
|
||||
oMyThoughts.onFeedback('error', 'Not saved! Un error occured: '+sError);
|
||||
},
|
||||
'POST'
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
function checkPageBook()
|
||||
{
|
||||
self.vars('working', true);
|
||||
var iEm = $(1).toPx();
|
||||
iEm = iEm.substr(0, iEm.length - 2);
|
||||
|
||||
$Editor = self.vars('editor');
|
||||
|
||||
//Content Height
|
||||
var iContentHeight = $Editor.height();
|
||||
|
||||
//Calculates what should be displayed
|
||||
iDisplayedHeight = iContentHeight % self.vars('max_height');
|
||||
console.log(iContentHeight+'%'+self.vars('max_height')+'='+iDisplayedHeight);
|
||||
|
||||
//Navigation
|
||||
var iNewPage = Math.ceil(iContentHeight / self.vars('max_height'));
|
||||
moveToPage(iNewPage);
|
||||
|
||||
|
||||
self.vars('prec_displayed', iDisplayedHeight);
|
||||
self.vars('prec_content', iContentHeight);
|
||||
|
||||
self.vars('working', false);
|
||||
}
|
||||
|
||||
function moveToPage(iNewPage)
|
||||
{
|
||||
if(iNewPage!=self.vars('page'))
|
||||
{
|
||||
self.vars('page', iNewPage);
|
||||
console.log('moving to page '+self.vars('page'));
|
||||
$('.page_nb').text(self.vars('page'));
|
||||
|
||||
self.vars('editor').css('top', (self.vars('page') - 1)*self.vars('max_height')*-1);
|
||||
}
|
||||
}
|
||||
</script>
|
||||
Reference in New Issue
Block a user