reworked macros and re-did base teplate pages...

Signed-off-by: Alex A. Naanou <alex.nanou@gmail.com>
This commit is contained in:
Alex A. Naanou 2016-07-28 09:07:46 +03:00
parent 18fe95b436
commit 5172666b45
2 changed files with 144 additions and 31 deletions

View File

@ -4,6 +4,13 @@
<title>pWiki</title> <title>pWiki</title>
</head> </head>
<style> <style>
.raw,
.text
{
display: block;
}
</style> </style>
<script src="ext-lib/jquery.js"></script> <script src="ext-lib/jquery.js"></script>
@ -37,13 +44,13 @@ var update_editor = function(){
// XXX make this update on enter... // XXX make this update on enter...
$('.title') $('.title')
.on('blur', () => { .on('blur', () => {
//Wiki.title = $('.title').text() Wiki.title = $('.title').text()
//reload() reload()
}) })
// live update text... // live update text...
// XXX is this the right way to go for large documents??? // XXX is this the right way to go for large documents???
$('.text') var text = $('.text')
.focus(function(){ .focus(function(){
console.log('EDITING:', Wiki.path) console.log('EDITING:', Wiki.path)
@ -68,7 +75,10 @@ var update_editor = function(){
reload() reload()
}) })
$('.raw') //text.html(Wiki.get(text.attr('saveto')).text)
var raw = $('.raw')
.focus(function(){ .focus(function(){
var to = $(this).attr('saveto') || '.' var to = $(this).attr('saveto') || '.'
console.log('EDITING:', Wiki.get(to).path) console.log('EDITING:', Wiki.get(to).path)
@ -83,7 +93,9 @@ var update_editor = function(){
.blur(() => { .blur(() => {
reload() reload()
}) })
.text($('.raw').html()) //.text($('.raw').html())
//raw.text(Wiki.get(raw.attr('saveto')).raw)
} }
var go = (path) => { var go = (path) => {
@ -154,6 +166,7 @@ $(() => {
} }
}) })
}) })
</script> </script>
<body> <body>

152
wiki.js
View File

@ -143,7 +143,7 @@ var macro = {
// get and prepare the included page... // get and prepare the included page...
state.include state.include
.push(context.get(path)) .push([elem, context.get(path)])
// return the marker... // return the marker...
return this.__include_marker__ return this.__include_marker__
@ -160,35 +160,68 @@ var macro = {
return context.get(path).raw return context.get(path).raw
}), }),
quote: Macro('Include quoted page source (without parsing)',
['src'],
function(context, elem, state){
elem = $(elem)
var path = elem.attr('src')
return elem.text(context.get(path).raw)
}),
/*
// fill/define slot (stage 1)... // fill/define slot (stage 1)...
// //
// XXX which should have priority the arg text or the content??? // XXX which should have priority the arg text or the content???
slot: Macro('Define/fill slot', _slot: Macro('Define/fill slot',
['name', 'text'], ['name', 'text'],
function(context, elem, state){ function(context, elem, state, parse){
var name = $(elem).attr('name') var name = $(elem).attr('name')
// XXX // XXX
text = $(elem).html() text = $(elem).html()
text = text == '' ? $(elem).attr('text') : text text = text == '' ? $(elem).attr('text') : text
text = this.parse(context, text, state, true) text = this.parse(context, text, state, true)
//text = parse(elem)
if(state.slots[name] == null){ if(state.slots[name] == null){
state.slots[name] = text state.slots[name] = text
// return a slot macro parsable by stage 2... // return a slot macro parsable by stage 2...
return '<slot name="'+name+'">'+ text +'</slot>' //return '<_slot name="'+name+'">'+ text +'</slot>'
return elem
} else if(name in state.slots){ } else if(name in state.slots){
state.slots[name] = text state.slots[name] = text
return '' return ''
} }
}), }),
//*/
// convert @ macro to html-like + parse content...
slot: Macro('Define/fill slot',
['name', 'text'],
function(context, elem, state, parse){
elem = $(elem)
var name = elem.attr('name')
// XXX
text = elem.html()
text = text.trim() == '' ?
elem.html(elem.attr('text') || '').html()
: text
text = parse(elem)
elem.attr('text', null)
elem.html(text)
return elem
}),
}, },
// Post macros... // Post macros...
// //
post_macro: { post_macro: {
slot: Macro('', /*
_slot: Macro('',
['name'], ['name'],
function(context, elem, state){ function(context, elem, state){
var name = $(elem).attr('name') var name = $(elem).attr('name')
@ -200,6 +233,25 @@ var macro = {
return state.slots[name] return state.slots[name]
} }
}), }),
//*/
/*
// XXX rename to post-include and post-quote
'page-text': Macro('',
['src'],
function(context, elem, state){
elem = $(elem)
return elem.html(context.get(elem.attr('src')).text)
}),
'page-raw': Macro('',
['src'],
function(context, elem, state){
elem = $(elem)
return elem.text(context.get(elem.attr('src')).text)
}),
//*/
}, },
// Filters... // Filters...
@ -246,7 +298,8 @@ var macro = {
// 3) merge and parse included pages: // 3) merge and parse included pages:
// 1) expand macros // 1) expand macros
// 2) apply filters // 2) apply filters
// 4) expand post-macros // 4) fill slots
// 5) expand post-macros
// //
// NOTE: stage 4 parsing is executed on the final merged page only // NOTE: stage 4 parsing is executed on the final merged page only
// once. i.e. it is not performed on the included pages. // once. i.e. it is not performed on the included pages.
@ -299,7 +352,13 @@ var macro = {
}) })
// call macro... // call macro...
return macro[name].call(that, context, elem, state) var res = macro[name]
.call(that, context, elem, state,
function(elem){ _parse(context, elem, macro) })
return res instanceof $ ? res[0].outerHTML
: typeof(res) != typeof('str') ? res.outerHTML
: res
} }
return match return match
@ -321,7 +380,9 @@ var macro = {
// macro match -> call macro... // macro match -> call macro...
if(name in macro){ if(name in macro){
$(e).replaceWith(macro[name].call(that, context, e, state)) $(e).replaceWith(macro[name]
.call(that, context, e, state,
function(elem){ _parse(context, elem, macro) }))
// normal tag -> attrs + sub-tree... // normal tag -> attrs + sub-tree...
} else { } else {
@ -380,9 +441,11 @@ var macro = {
parsed parsed
.html(parsed.html().replace(include_marker, function(){ .html(parsed.html().replace(include_marker, function(){
var page = state.include.shift() var page = state.include.shift()
var elem = $(page.shift())
page = page.pop()
return $('<div>') return $('<div>')
.append($('<include/>') .append(elem//$('<include/>')
.attr('src', page.path) .attr('src', page.path)
//.append(page //.append(page
// .parse({ slots: state.slots }, true)) // .parse({ slots: state.slots }, true))
@ -394,9 +457,34 @@ var macro = {
.html() .html()
})) }))
// post macro... // post processing...
if(!skip_post){ if(!skip_post){
_parse(context, parsed, this.post_macro) // fill slots...
// XXX need to prevent this from processing slots in editable
// elements...
slots = {}
// get slots...
parsed.find('slot')
.each(function(i, e){
e = $(e)
var n = e.attr('name')
n in slots && e.detach()
slots[n] = e
})
// place slots...
parsed.find('slot')
.each(function(i, e){
e = $(e)
var n = e.attr('name')
e.replaceWith(slots[n])
})
// post-macro...
this.post_macro
&& _parse(context, parsed, this.post_macro)
} }
// XXX shuld we get rid of the rot span??? // XXX shuld we get rid of the rot span???
@ -517,21 +605,32 @@ var data = {
'Templates/_raw': { 'Templates/_raw': {
text: '@source(..)', text: '@source(..)',
}, },
'Templates/_view': { 'Templates/_view': {
text: '\n' text: '\n'
+'<!-- place filters here so as not to takup page space: ... -->\n'
+'\n' +'\n'
+'<div>\n' +'<div>\n'
+'<a href="#tree">&#x2630;</a> \n' +'<a href="#tree">&#x2630;</a> \n'
+'@include(../path) (<a href="#./_edit">edit</a>)\n' +'@include(../path)\n'
+'\n'
+'<slot name="toggle-edit-link">\n'
+'(<a href="#./_edit">edit</a>)\n'
+'</slot>\n'
+'\n'
+'</div>\n' +'</div>\n'
+'<hr>\n' +'<hr>\n'
+'<h1 class="title" contenteditable tabindex="0">' +'<h1 class="title" contenteditable tabindex="0">'
//+'<slot name="title">@include(../title)</slot>' +'<slot name="title">'
+'@include(../title)' +'@source(../title)'
+'</slot>'
+'\n'
+'</h1>\n' +'</h1>\n'
+'<br>\n' +'<br>\n'
+'<div class="text" tabindex="0"> @include(..) </div>\n' +'\n'
+'<slot name="page-content">\n'
+'<include src=".." class="text" saveto=".." tabindex="0"/>\n'
+'</slot>\n'
+'\n'
+'<hr>\n' +'<hr>\n'
+'<a href="#/">home</a>\n' +'<a href="#/">home</a>\n'
+'\n', +'\n',
@ -540,16 +639,17 @@ var data = {
text: '\n' text: '\n'
+'<!-- @filter(-wikiword) -->\n' +'<!-- @filter(-wikiword) -->\n'
+'\n' +'\n'
+'<div>' +'<include src="../_view"/>\n'
+'<a href="#tree">&#x2630;</a> \n' +'\n'
+'@include(../path) (<a href="#..">view</a>)\n' +'<slot name="toggle-edit-link">'
+'</div>\n' +'(<a href="#..">view</a>)'
+'<hr>\n' +'</slot>\n'
+'<h1 class ="title" contenteditable>@include(../title)</h1>\n' +'\n'
+'<br>\n' +'<slot name="page-content">\n'
+'<code><pre class="raw" saveto=".." contenteditable>@source(../raw)</pre></code>\n' +'<code><pre>'
+'<hr>\n' +'<quote src="../raw" class="raw" saveto=".." contenteditable/>'
+'<a href="#/">home</a>\n' +'</pre></code>\n'
+'</slot>'
+'', +'',
}, },
} }