mirror of
https://github.com/flynx/PortableMag.git
synced 2025-10-31 12:00:11 +00:00
added ckeditor support...
Signed-off-by: Alex A. Naanou <alex.nanou@gmail.com>
This commit is contained in:
parent
e1bf008245
commit
acea5f3fb1
7
TODO.otl
7
TODO.otl
@ -5,7 +5,12 @@
|
||||
| touchdown point.
|
||||
[_] BUG: no drag threshold on excludedElements (TouchSwipe)
|
||||
| stalled...
|
||||
[_] 82% general todo
|
||||
[_] 81% general todo
|
||||
[_] 33% add inline editor...
|
||||
[X] prepare the basic framework to accept the ckeditor
|
||||
| keyboard handler, touchswipe and other event handlers...
|
||||
[_] add editor and no-editor modes...
|
||||
[_] add editor detecting...
|
||||
[_] add in-page live templates...
|
||||
| elements that will get generated content, like page numbers etc.
|
||||
[_] magazine loader and data format...
|
||||
|
||||
27
index.html
27
index.html
@ -10,6 +10,7 @@
|
||||
<script src="jquery.js"></script>
|
||||
<script src="jquery.touchSwipe.js"></script>
|
||||
<script src="jstorage.js"></script>
|
||||
<script src="ckeditor/ckeditor.js"></script>
|
||||
|
||||
<script src="jli.js"></script>
|
||||
<script src="magazine.js"></script>
|
||||
@ -98,7 +99,7 @@ $(document).ready(function(){
|
||||
return true
|
||||
},
|
||||
|
||||
//excludedElements: '.noSwipe',
|
||||
excludedElements: '.noSwipe, a, [contenteditable=true]',
|
||||
fingers: $.fn.swipe.fingers.ALL
|
||||
//fingers: $.fn.swipe.fingers.THREE
|
||||
})
|
||||
@ -129,8 +130,24 @@ $(document).ready(function(){
|
||||
$('.splash').fadeOut()
|
||||
}, 350)
|
||||
})
|
||||
|
||||
|
||||
|
||||
})
|
||||
|
||||
// setup ckeditor events...
|
||||
CKEDITOR.on('instanceCreated', function(evt){
|
||||
var editor = evt.editor
|
||||
editor.on('focus', function(){
|
||||
toggleEditorMode('on')
|
||||
})
|
||||
editor.on('blur', function(){
|
||||
toggleEditorMode('off')
|
||||
})
|
||||
})
|
||||
|
||||
|
||||
|
||||
|
||||
</script>
|
||||
</head>
|
||||
@ -443,7 +460,13 @@ $(document).ready(function(){
|
||||
|
||||
<div class="page">
|
||||
<div class="content">
|
||||
Page
|
||||
<h1 contenteditable="true">Two column</h1>
|
||||
<div contenteditable="true" style="float:left; width: 45%; height: 100%; margin: 10px;">
|
||||
Column 1
|
||||
</div>
|
||||
<div contenteditable="true" style="float:left; width: 45%; height: 100%; padding: 10px;">
|
||||
Column 2
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="page no-resize">
|
||||
|
||||
6
jli.js
6
jli.js
@ -249,7 +249,8 @@ var KEYBOARD_HANDLER_PROPAGATE = true
|
||||
*/
|
||||
function makeKeyboardHandler(keybindings, unhandled){
|
||||
if(unhandled == null){
|
||||
unhandled = function(){return false}
|
||||
//unhandled = function(){return false}
|
||||
unhandled = function(){return KEYBOARD_HANDLER_PROPAGATE}
|
||||
}
|
||||
return function(evt){
|
||||
var did_handling = false
|
||||
@ -259,7 +260,8 @@ function makeKeyboardHandler(keybindings, unhandled){
|
||||
var bindings = keybindings[mode]
|
||||
|
||||
var key = evt.keyCode
|
||||
if(bindings.ignore != null && bindings.ignore.indexOf(key) != -1){
|
||||
if(bindings.ignore == '*'
|
||||
|| bindings.ignore != null && bindings.ignore.indexOf(key) != -1){
|
||||
// return true
|
||||
res = res == null ? true : res
|
||||
did_handling = true
|
||||
|
||||
@ -3,6 +3,7 @@
|
||||
// list of keys to be ignored by handler but still handled by the browser...
|
||||
|
||||
var keybindings = {
|
||||
/*
|
||||
// global bindings...
|
||||
'*': {
|
||||
title: 'Global',
|
||||
@ -15,14 +16,6 @@ var keybindings = {
|
||||
8 // BkSp
|
||||
],
|
||||
|
||||
// togglable modes and options...
|
||||
/*191: {
|
||||
'default': ImageGrid.showKeyboardBindings, // ?
|
||||
'ctrl': ImageGrid.showSetup, // ctrl+?
|
||||
},*/
|
||||
13: function(){togglePageView('on')}, // Enter
|
||||
27: function(){togglePageView('off')}, // Esc
|
||||
|
||||
// ignore the modifiers (shift, alt, ctrl, caps)...
|
||||
16: function(){},
|
||||
17: 16,
|
||||
@ -48,10 +41,15 @@ var keybindings = {
|
||||
40, // Down
|
||||
],
|
||||
},
|
||||
*/
|
||||
|
||||
// ignore all keys here...
|
||||
'.editor-mode': {
|
||||
ignore: '*'
|
||||
},
|
||||
|
||||
// everything except overlays...
|
||||
'.viewer *:not(.overlay-mode *)': {
|
||||
'.viewer:not(.editor-mode)': {
|
||||
title: 'Ribbon and Viewer',
|
||||
doc: '',
|
||||
|
||||
@ -82,6 +80,9 @@ var keybindings = {
|
||||
// combined navigation with actions..
|
||||
38: function(){togglePageView()}, // Up
|
||||
40: function(){togglePageView()}, // Down
|
||||
|
||||
13: function(){togglePageView('on')}, // Enter
|
||||
27: function(){togglePageView('off')}, // Esc
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@ -35,7 +35,10 @@ var USE_REAL_PAGE_SIZES = false
|
||||
// toggles .dragging CSS class on the viewer while dragging is in
|
||||
// progress.
|
||||
// NOTE: this is used mostly for styling and drag assisting...
|
||||
togglePageDragging = createCSSClassToggler('.viewer', 'dragging')
|
||||
var togglePageDragging = createCSSClassToggler('.viewer', 'dragging')
|
||||
|
||||
|
||||
var toggleEditorMode = createCSSClassToggler('.viewer', 'editor-mode noSwipe')
|
||||
|
||||
|
||||
// this is here only for speed, helps with dragging...
|
||||
@ -45,7 +48,7 @@ var _PAGE_VIEW
|
||||
// toggle between the two main modes:
|
||||
// - single page mode (.page-view-mode)
|
||||
// - thumbnail/ribbon mode
|
||||
togglePageView = createCSSClassToggler(
|
||||
var togglePageView = createCSSClassToggler(
|
||||
'.viewer',
|
||||
'page-view-mode',
|
||||
null,
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user