[tw] Re: [TW5] BJ's VisualEditor Plugin - Syntax Highlighting in Code Snippets Created by CKEditor

2017-03-24 Thread AltugOz 
Yes, that makes sense! Thanks for all the help. I submitted a feature 
request  on github.

Best,

Altug

On Friday, March 24, 2017 at 2:27:31 AM UTC-4, BJ wrote:
>
> ah!
> The markup produced by ckeditor is correct, the problem is that the 
> hightlight plugin does not support the standard way of interacting with 
> hightlight.js.
>
> If you know how to use github you can add a feature request (to support 
> ), or I could it.
>
> all the best 
>
> BJ
>
>
>
> On Friday, March 24, 2017 at 5:22:27 AM UTC+1, AltugOz wrote:
>>
>> Hi BJ,
>>
>> Thanks and you are right! That code snippet works. However, this is 
>> because I made a mistake in my original post and somehow got the two code 
>> examples switch places. Sorry, this must have caused a lot of confusion. 
>> The html generated by ckeditor is the other one:
>>
>> import base64
>> with open("t.png", "rb") as imageFile:
>>str = base64.b64encode(imageFile.read())
>>print str
>>
>> The code snippet you tested was the one generated by highlight.js, which 
>> works as expected. 
>>
>> So, the issue remains. There is currently no way that I am aware of, in 
>> which one can edit text in ckeditor that will also show up with syntax 
>> highlighting in the rendered tiddler. 
>>
>> I understand that this is inherently due to the way ckeditor generates 
>> the html using its codesnippet add-on and has nothing to do with 
>> VisualEditor plugin. So, maybe we are out of luck in this case. 
>>
>> Still I am very interested to know if there is another way to markup text 
>> in ckeditor (i.e. not using its code snippet add-on) that will show up as a 
>> syntax highlighted code snippet in Tiddlywiki, hopefully without jumping 
>> through too many hoops.
>>
>> Best,
>>
>> Altug
>>
>> P.S. For completeness, I fix the description of problem in my original 
>> post as follows:
>>
>> ---
>> ... I attached two screenshots, one with ckeditor 'editor view' and one 
>> with the rendered view of the resulting tiddler. Here are my observations:
>>
>> 1. Using ckeditor's codesnippet add-on: Syntax highlighting *works* in 
>> edit view, but doesn't show up in the resulting tiddler.
>>
>> 2. Code snippet with Wikitext markup and TW5 highlight.js plugin: The 
>> result is verbatim text with some html markup.
>>
>> Here is the html source generated by case 1 i.e. using ckeditor and its 
>> codesnippet add-on:
>>
>> import base64
>> with open("t.png", "rb") as imageFile:
>>str = base64.b64encode(imageFile.read())
>>print str
>>
>> in comparison to what is generated using TW5 highlight.js plugin (in a 
>> separate tiddler where syntax highlighting works):
>> with open(
>> "t.png", "rb") > "hljs-keyword">as imageFile:
>>str = base64.b64encode(imageFile.read())
>>print str
>>
>> ...
>> ---
>>
>>
>>
>> On Thursday, March 23, 2017 at 8:03:31 AM UTC-4, BJ wrote:
>>>
>>> Hi Altug,
>>>
>>> If I go to http://tiddlywiki.com/plugins/tiddlywiki/highlight/ and 
>>> paste this html (i.e. your example) into a new tiddler it shows correctly. 
>>> So I guess that you have not got the tiddlywiki highlight plugin setup 
>>> correctly.
>>>
>>> all the best
>>>
>>> BJ
>>>
>>>
>>> import 
>>> base64
>>>  
>>> with open(
>>> "t.png", "rb") >> "hljs-keyword">as imageFile:
>>> str = base64.b64encode(imageFile.read())
>>> print str
>>>
>>>
>>>
>>> On Sunday, March 19, 2017 at 4:36:19 PM UTC+1, AltugOz wrote:

 Dear All,

 I have been using BJ's wonderful Visual Editor Plugin (
 http://bjtools.tiddlyspot.com/#VisualEditor) to put down my notes in a 
 WYSIWYG manner and I finally managed to get things work to my liking 
 except 
 for the appearance of the code snippets.

 My aim is to get a form of syntax highlighting in the resulting tiddler 
 similar to the way done by highlight.js plugin in TW5 but using the 
 CKEditor. I am using a custom build of CKeditor with the codesnippet 
 add-on 
 and also have thehighlight.js plugin installed on TW5 (5.1.13). 
 Unfortunately I couldn't get it to work so far. I wonder whether anyone 
 has 
 tackled with this problem before or has suggestions on the direction to 
 proceed.

 I attached two screenshots, one with ckeditor 'editor view' and one 
 with the rendered view of the resulting tiddler. Here are my observations:

 1. Using ckeditor's codesnippet add-on: Syntax highlighting *works* in 
 edit view, but doesn't show up in the resulting tiddler.

 2. Code snippet with Wikitext markup and TW5 highlight.js plugin: The 
 result is verbatim text with some html markup.

 Here is the html source generated by case 1 i.e. using ckeditor and its 
 codesnippet add-on:

 import 
 base64
  
 with open(>>> class="hljs-string">"t.png", "rb") 
 as imageFile:
 str = base64.b64encode(imageFile.read())
 print str

 in comparison to what is

[tw] Re: [TW5] BJ's VisualEditor Plugin - Syntax Highlighting in Code Snippets Created by CKEditor

2017-03-24 Thread BJ 
ah!
The markup produced by ckeditor is correct, the problem is that the 
hightlight plugin does not support the standard way of interacting with 
hightlight.js.

If you know how to use github you can add a feature request (to support 
), or I could it.

all the best 



On Friday, March 24, 2017 at 5:22:27 AM UTC+1, AltugOz wrote:
>
> Hi BJ,
>
> Thanks and you are right! That code snippet works. However, this is 
> because I made a mistake in my original post and somehow got the two code 
> examples switch places. Sorry, this must have caused a lot of confusion. 
> The html generated by ckeditor is the other one:
>
> import base64
> with open("t.png", "rb") as imageFile:
>str = base64.b64encode(imageFile.read())
>print str
>
> The code snippet you tested was the one generated by highlight.js, which 
> works as expected. 
>
> So, the issue remains. There is currently no way that I am aware of, in 
> which one can edit text in ckeditor that will also show up with syntax 
> highlighting in the rendered tiddler. 
>
> I understand that this is inherently due to the way ckeditor generates the 
> html using its codesnippet add-on and has nothing to do with VisualEditor 
> plugin. So, maybe we are out of luck in this case. 
>
> Still I am very interested to know if there is another way to markup text 
> in ckeditor (i.e. not using its code snippet add-on) that will show up as a 
> syntax highlighted code snippet in Tiddlywiki, hopefully without jumping 
> through too many hoops.
>
> Best,
>
> Altug
>
> P.S. For completeness, I fix the description of problem in my original 
> post as follows:
>
> ---
> ... I attached two screenshots, one with ckeditor 'editor view' and one 
> with the rendered view of the resulting tiddler. Here are my observations:
>
> 1. Using ckeditor's codesnippet add-on: Syntax highlighting *works* in 
> edit view, but doesn't show up in the resulting tiddler.
>
> 2. Code snippet with Wikitext markup and TW5 highlight.js plugin: The 
> result is verbatim text with some html markup.
>
> Here is the html source generated by case 1 i.e. using ckeditor and its 
> codesnippet add-on:
>
> import base64
> with open("t.png", "rb") as imageFile:
>str = base64.b64encode(imageFile.read())
>print str
>
> in comparison to what is generated using TW5 highlight.js plugin (in a 
> separate tiddler where syntax highlighting works):
> with open(
> "t.png", "rb")  "hljs-keyword">as imageFile:
>str = base64.b64encode(imageFile.read())
>print str
>
> ...
> ---
>
>
>
> On Thursday, March 23, 2017 at 8:03:31 AM UTC-4, BJ wrote:
>>
>> Hi Altug,
>>
>> If I go to http://tiddlywiki.com/plugins/tiddlywiki/highlight/ and paste 
>> this html (i.e. your example) into a new tiddler it shows correctly. So I 
>> guess that you have not got the tiddlywiki highlight plugin setup correctly.
>>
>> all the best
>>
>> BJ
>>
>>
>> import 
>> base64
>>  
>> with open(
>> "t.png", "rb") > "hljs-keyword">as imageFile:
>> str = base64.b64encode(imageFile.read())
>> print str
>>
>>
>>
>> On Sunday, March 19, 2017 at 4:36:19 PM UTC+1, AltugOz wrote:
>>>
>>> Dear All,
>>>
>>> I have been using BJ's wonderful Visual Editor Plugin (
>>> http://bjtools.tiddlyspot.com/#VisualEditor) to put down my notes in a 
>>> WYSIWYG manner and I finally managed to get things work to my liking except 
>>> for the appearance of the code snippets.
>>>
>>> My aim is to get a form of syntax highlighting in the resulting tiddler 
>>> similar to the way done by highlight.js plugin in TW5 but using the 
>>> CKEditor. I am using a custom build of CKeditor with the codesnippet add-on 
>>> and also have thehighlight.js plugin installed on TW5 (5.1.13). 
>>> Unfortunately I couldn't get it to work so far. I wonder whether anyone has 
>>> tackled with this problem before or has suggestions on the direction to 
>>> proceed.
>>>
>>> I attached two screenshots, one with ckeditor 'editor view' and one with 
>>> the rendered view of the resulting tiddler. Here are my observations:
>>>
>>> 1. Using ckeditor's codesnippet add-on: Syntax highlighting *works* in 
>>> edit view, but doesn't show up in the resulting tiddler.
>>>
>>> 2. Code snippet with Wikitext markup and TW5 highlight.js plugin: The 
>>> result is verbatim text with some html markup.
>>>
>>> Here is the html source generated by case 1 i.e. using ckeditor and its 
>>> codesnippet add-on:
>>>
>>> import 
>>> base64
>>>  
>>> with open(>> class="hljs-string">"t.png", "rb") 
>>> as imageFile:
>>> str = base64.b64encode(imageFile.read())
>>> print str
>>>
>>> in comparison to what is generated using TW5 highlight.js plugin (in a 
>>> separate tiddler where syntax highlighting works):
>>> import base64
>>>  
>>> with open("t.png", "rb") as imageFile:
>>> str = base64.b64encode(imageFile.read())
>>> print str
>>>
>>> I am very new to html and js but those look quite different to me. Is 
>>> there a way to reconcile the way CKEditor does syntax highlighting with the 
>>>

[tw] Re: [TW5] BJ's VisualEditor Plugin - Syntax Highlighting in Code Snippets Created by CKEditor

2017-03-23 Thread AltugOz 
Hi BJ,

Thanks and you are right! That code snippet works. However, this is because 
I made a mistake in my original post and somehow got the two code examples 
switch places. Sorry, this must have caused a lot of confusion. The html 
generated by ckeditor is the other one:

import base64
with open("t.png", "rb") as imageFile:
   str = base64.b64encode(imageFile.read())
   print str

The code snippet you tested was the one generated by highlight.js, which 
works as expected. 

So, the issue remains. There is currently no way that I am aware of, in 
which one can edit text in ckeditor that will also show up with syntax 
highlighting in the rendered tiddler. 

I understand that this is inherently due to the way ckeditor generates the 
html using its codesnippet add-on and has nothing to do with VisualEditor 
plugin. So, maybe we are out of luck in this case. 

Still I am very interested to know if there is another way to markup text 
in ckeditor (i.e. not using its code snippet add-on) that will show up as a 
syntax highlighted code snippet in Tiddlywiki, hopefully without jumping 
through too many hoops.

Best,

Altug

P.S. For completeness, I fix the description of problem in my original post 
as follows:

---
... I attached two screenshots, one with ckeditor 'editor view' and one 
with the rendered view of the resulting tiddler. Here are my observations:

1. Using ckeditor's codesnippet add-on: Syntax highlighting *works* in edit 
view, but doesn't show up in the resulting tiddler.

2. Code snippet with Wikitext markup and TW5 highlight.js plugin: The 
result is verbatim text with some html markup.

Here is the html source generated by case 1 i.e. using ckeditor and its 
codesnippet add-on:

import base64
with open("t.png", "rb") as imageFile:
   str = base64.b64encode(imageFile.read())
   print str

in comparison to what is generated using TW5 highlight.js plugin (in a 
separate tiddler where syntax highlighting works):
with open(
"t.png", "rb") as imageFile:
   str = base64.b64encode(imageFile.read())
   print str

...
---



On Thursday, March 23, 2017 at 8:03:31 AM UTC-4, BJ wrote:
>
> Hi Altug,
>
> If I go to http://tiddlywiki.com/plugins/tiddlywiki/highlight/ and paste 
> this html (i.e. your example) into a new tiddler it shows correctly. So I 
> guess that you have not got the tiddlywiki highlight plugin setup correctly.
>
> all the best
>
> BJ
>
>
> import 
> base64
>  
> with open(
> "t.png", "rb")  "hljs-keyword">as imageFile:
> str = base64.b64encode(imageFile.read())
> print str
>
>
>
> On Sunday, March 19, 2017 at 4:36:19 PM UTC+1, AltugOz wrote:
>>
>> Dear All,
>>
>> I have been using BJ's wonderful Visual Editor Plugin (
>> http://bjtools.tiddlyspot.com/#VisualEditor) to put down my notes in a 
>> WYSIWYG manner and I finally managed to get things work to my liking except 
>> for the appearance of the code snippets.
>>
>> My aim is to get a form of syntax highlighting in the resulting tiddler 
>> similar to the way done by highlight.js plugin in TW5 but using the 
>> CKEditor. I am using a custom build of CKeditor with the codesnippet add-on 
>> and also have thehighlight.js plugin installed on TW5 (5.1.13). 
>> Unfortunately I couldn't get it to work so far. I wonder whether anyone has 
>> tackled with this problem before or has suggestions on the direction to 
>> proceed.
>>
>> I attached two screenshots, one with ckeditor 'editor view' and one with 
>> the rendered view of the resulting tiddler. Here are my observations:
>>
>> 1. Using ckeditor's codesnippet add-on: Syntax highlighting *works* in 
>> edit view, but doesn't show up in the resulting tiddler.
>>
>> 2. Code snippet with Wikitext markup and TW5 highlight.js plugin: The 
>> result is verbatim text with some html markup.
>>
>> Here is the html source generated by case 1 i.e. using ckeditor and its 
>> codesnippet add-on:
>>
>> import 
>> base64
>>  
>> with open(> class="hljs-string">"t.png", "rb") 
>> as imageFile:
>> str = base64.b64encode(imageFile.read())
>> print str
>>
>> in comparison to what is generated using TW5 highlight.js plugin (in a 
>> separate tiddler where syntax highlighting works):
>> import base64
>>  
>> with open("t.png", "rb") as imageFile:
>> str = base64.b64encode(imageFile.read())
>> print str
>>
>> I am very new to html and js but those look quite different to me. Is 
>> there a way to reconcile the way CKEditor does syntax highlighting with the 
>> 'default' way TW5 does using the highlight.js plugin?
>>
>> I need to add that I have only found out about Tiddlywiki a few months 
>> ago but it has revolutionized the way I take and organize my notes! Plus 
>> the wonderful community that is active, creative and always willing to help.
>>
>> Thank you!
>>
>> Altug 
>>
>>
>>
>>
>>
>>
>>
>>
>>  
>>
>>
>>
>>

-- 
You received this message because you are subscribed to the Google Groups 
"TiddlyWiki" group.
To unsubscribe from this group and stop receiving emails from it, send an

[tw] Re: [TW5] BJ's VisualEditor Plugin - Syntax Highlighting in Code Snippets Created by CKEditor

2017-03-23 Thread BJ 
Hi Altug,

If I go to http://tiddlywiki.com/plugins/tiddlywiki/highlight/ and paste 
this html (i.e. your example) into a new tiddler it shows correctly. So I 
guess that you have not got the tiddlywiki highlight plugin setup correctly.

all the best

BJ


import 
base64
 
with open(
"t.png", "rb") as imageFile:
str = base64.b64encode(imageFile.read())
print str



On Sunday, March 19, 2017 at 4:36:19 PM UTC+1, AltugOz wrote:
>
> Dear All,
>
> I have been using BJ's wonderful Visual Editor Plugin (
> http://bjtools.tiddlyspot.com/#VisualEditor) to put down my notes in a 
> WYSIWYG manner and I finally managed to get things work to my liking except 
> for the appearance of the code snippets.
>
> My aim is to get a form of syntax highlighting in the resulting tiddler 
> similar to the way done by highlight.js plugin in TW5 but using the 
> CKEditor. I am using a custom build of CKeditor with the codesnippet add-on 
> and also have thehighlight.js plugin installed on TW5 (5.1.13). 
> Unfortunately I couldn't get it to work so far. I wonder whether anyone has 
> tackled with this problem before or has suggestions on the direction to 
> proceed.
>
> I attached two screenshots, one with ckeditor 'editor view' and one with 
> the rendered view of the resulting tiddler. Here are my observations:
>
> 1. Using ckeditor's codesnippet add-on: Syntax highlighting *works* in 
> edit view, but doesn't show up in the resulting tiddler.
>
> 2. Code snippet with Wikitext markup and TW5 highlight.js plugin: The 
> result is verbatim text with some html markup.
>
> Here is the html source generated by case 1 i.e. using ckeditor and its 
> codesnippet add-on:
>
> import 
> base64
>  
> with open( class="hljs-string">"t.png", "rb") 
> as imageFile:
> str = base64.b64encode(imageFile.read())
> print str
>
> in comparison to what is generated using TW5 highlight.js plugin (in a 
> separate tiddler where syntax highlighting works):
> import base64
>  
> with open("t.png", "rb") as imageFile:
> str = base64.b64encode(imageFile.read())
> print str
>
> I am very new to html and js but those look quite different to me. Is 
> there a way to reconcile the way CKEditor does syntax highlighting with the 
> 'default' way TW5 does using the highlight.js plugin?
>
> I need to add that I have only found out about Tiddlywiki a few months ago 
> but it has revolutionized the way I take and organize my notes! Plus the 
> wonderful community that is active, creative and always willing to help.
>
> Thank you!
>
> Altug 
>
>
>
>
>
>
>
>
>  
>
>
>
>

-- 
You received this message because you are subscribed to the Google Groups 
"TiddlyWiki" group.
To unsubscribe from this group and stop receiving emails from it, send an email 
to tiddlywiki+unsubscr...@googlegroups.com.
To post to this group, send email to tiddlywiki@googlegroups.com.
Visit this group at https://groups.google.com/group/tiddlywiki.
To view this discussion on the web visit 
https://groups.google.com/d/msgid/tiddlywiki/ab86ac62-07cf-49b4-a596-204848a8f0a6%40googlegroups.com.
For more options, visit https://groups.google.com/d/optout.