Code() in file Code_mobject.py to display code with color highlighted works correctly with updates in text_mobject.py and svg_mobject. #1018

NavpreetDevpuri · 2020-05-01T05:24:55Z

you can use it as follow.
if you put file into "assets/codes" folder then you don't need to specify full file path, just name of file is enough otherwise specify full file path.
if generate_html_file==True it create a html file with color highlighted and save it to "assets/codes/generated_html_files/"

from manimlib.imports import *
class codeExample(Scene):
    def construct(self):
        heading = TextMobject("\"Hello, World\" Program", stroke_width=0).scale(1.3)
        heading.to_edge(UP)
        helloworldc = Code("helloworldc.c",
                           run_time=1,
                           scale_factor=0.6,
                           line_spacing=0.2,
                           tab_spacing=0.6,
                           insert_line_no=False,
                           style=code_styles_list[4],
                           background="rectangle",
                           language=code_languages_list["c"],
                           generate_html_file=True
                           )
        helloworldcpp = Code("helloworldcpp.cpp",
                             run_time=1,
                             scale_factor=0.6,
                             line_spacing=0.2,
                             tab_spacing=0.6,
                             margin=0.3,
                             insert_line_no=True,
                             line_no_from=8,
                             line_no_buff=0.4,
                             style=code_styles_list[9],
                             background="window",
                             corner_radius=0.2,
                             language=code_languages_list["cpp"],
                             generate_html_file=True
                             )
        helloworldc.move_to(np.array([-3.6, 0, 0]))
        helloworldcpp.move_to(np.array([3.1, 0, 0]))
        self.play(Write(heading), run_time=0.5)
        self.play(Write(helloworldc), run_time=1.3)
        self.draw_code_all_lines_at_a_time(helloworldcpp)
        self.wait()

    def draw_code_all_lines_at_a_time(self, Code):
        self.play(Write(Code.background_mobject), run_time=0.3)
        self.play(Write(Code.line_numbers), run_time=0.3)
        self.play(*[Write(Code.code[i]) for i in range(Code.code.__len__())],
                  run_time=Code.run_time)

Output will be looks like

'''
coordinate point is LEFT+UP corner

Code is VGroup() with three things
Code[0] is Code.background_mobject
    which can be a 
        Rectangle() if background == "rectangle" 
        VGroup() of Rectangle() and Dot() for three buttons
Code[1] is Code.line_numbers
    Which is a VGroup() of Text() objects with line numbers as a text, this mean you can use 
        Code.line_numbers[0] or Code[1][0] to access first line number 
Code[2] is Code.code
    Which is a VGroup() of lines with color highlighted, this mean you can use 
        Code.code[1] or Code[2][1] 
            line number 1
        Code.code[1][0] or Code.code[1][0] 
            first character of line number 1
        Code.code[1][0:5] or Code.code[1][0:5] 
            first five characters of line number 1

'''

Updated text_mobject() to use Text() as paragraph.

class Test3(Scene):
    def construct(self):
        t = Text('this is a awesome', 'paragraph', 'With \nNewlines', '\tWith Tabs', '  With Spaces', 'With Alignments',
                 'center', "left", "right", line_spacing=0.1, alignment="left", t2c={"Tabs": RED})
        t.set_alignment("center", 7)
        t.set_alignment("left", 8)
        t.set_alignment("right", 9)
        #t.set_all_lines_alignment("center")
        t[0][0].set_color(GREEN)
        t[1][0:4].set_color(YELLOW)
        self.add(t)
        self.wait()

Output

It solves the following problems

display code with color highlighted
manage to print single '{' or '}' because of using Text() instead of TextMobject() from Using braces #941 (comment)
Solved Text( ) transform animation for " " space character from Text(" ") don't move. Because of that Text("a b") shows wrong transform animation. #1017

NavpreetDevpuri · 2020-05-01T19:56:11Z

text = Text('a', ' ', 'b')
it shows only 'a' to the screen
any one can help ?

NavpreetDevpuri · 2020-05-01T20:49:06Z

text = Text('a', ' ', 'b')
it shows only 'a' to the screen
any one can help ?

Solved !

NavpreetDevpuri · 2020-05-01T20:49:25Z

now everything is working fine.

kevkevinpal · 2020-05-03T13:12:27Z

Only changes I would make is

1.)adding CodeMobject to imports.py

2.) changing some of the variable names to more meaningful things I've noticed you used letters alot which may be confusing to someone who may come about this file in the future

3.)also there seems to be an issue on line 125 i = lines.index("</pre>") where sometimes there is white spaces before </pre> which then results in an error saying that they couldn't find </pre>'s index because its looking for an exact match

otherwise it looks good maybe we can try implementing the conversion of the HTML for the user so they don't need to rewrite code and convert it to a readable version for Manim, instead I'm proposing that we allow the user to add any file type to assets/codes and then we convert for them

NavpreetDevpuri · 2020-05-03T17:27:21Z

Only changes I would make is

1.)adding CodeMobject to imports.py

2.) changing some of the variable names to more meaningful things I've noticed you used letters alot which may be confusing to someone who may come about this file in the future

3.)also there seems to be an issue on line 125 i = lines.index("</pre>") where sometimes there is white spaces before </pre> which then results in an error saying that they couldn't find </pre>'s index because its looking for an exact match

otherwise it looks good maybe we can try implementing the conversion of the HTML for the user so they don't need to rewrite code and convert it to a readable version for Manim, instead I'm proposing that we allow the user to add any file type to assets/codes and then we convert for them

updated !

kevkevinpal

Dude awesome work, lets try and get a code converter working to make code_mobject even better!

NavpreetDevpuri · 2020-05-03T17:31:14Z

implementing the conversion of the HTML

do you mean user input .cpp file or any other and it automatically converts it to html ?

i don't found any better way to do that, i tried pygments but it have only few coding languages options and sometimes don't highlight correctly.

do you have any other better option?

NavpreetDevpuri · 2020-05-03T17:32:13Z

well i can implement that online highlighter in python then it send request to the server and get highlighted html

NavpreetDevpuri · 2020-05-05T16:55:10Z

also, one PR should only do one thing. So if you doesn't mind, I would make a new PR which solve the text spacing problem.

change two files "svg_mobjet.py" and "text_mobject.py"

NavpreetDevpuri · 2020-05-05T16:58:51Z

also, one PR should only do one thing. So if you doesn't mind, I would make a new PR which solve the text spacing problem.

i think its better if a single PR is solving two problems.
as you can see the 2nd one is very small problem.
For this particular PR 1st one is depends upon 2nd one.
without correction in Text_mobject.py code_mobject.py won't work correctly.

NavpreetDevpuri · 2020-05-05T17:05:25Z

as you said "delete background"
Code colors are visible only because of background
if we remove background then according to code's style it colors text according to background for example if background is white then it color text with dark colors so text is visible.

xy-23 · 2020-05-06T00:13:03Z

i think its better if a single PR is solving two problems.
as you can see the 2nd one is very small problem.
For this particular PR 1st one is depends upon 2nd one.
without correction in Text_mobject.py code_mobject.py won't work correctly.

Yeah, that's true. I understand.
But Your PR probably need some testing and change, until that your PR can't be merged.
This would take some time. And that's why I want to make another PR to solve the space character problem, which probably could be merged today.

NavpreetDevpuri · 2020-05-06T00:18:07Z

You can create another one if your PR is merged then this PR will automatically updated and don't show up that text_mobject.py or svg_mobject.py changes in files changes.

TonyCrane · 2020-05-06T02:56:04Z

@NavpreetDevpuri oops, I think you did a wrong thing, you merge my pull request which in the shaders branch but not master. The pull request of master branch is #1030 which is already merged but not 1031 which is waiting for merged.

xy-23 · 2020-05-06T09:38:11Z

You can create another one if your PR is merged then this PR will automatically updated and don't show up that text_mobject.py or svg_mobject.py changes in files changes.

See #1035

NavpreetDevpuri · 2020-05-07T02:16:05Z

@eulertour check updates.

xy-23 · 2020-05-07T02:52:31Z

Please do not try to build a text layout engine by yourself.
This will cause many potential problems.
The space are decided by text layout engine, which means the space between the letters are not the same every time, especially when the text is mixed with different languages.
You can do this (overwrite) in your own code_mobject.py, but not in text_mobject.py.
Though the text layout engine that Text currently used (cairo) is not very good, it is enough for most cases.

And letting Text receive multiple texts is a good idea, but this change(feature) is already big enough that you should open a single PR specifically focus on this thing. Your PR have 48 commits, honestly I think it's too big to be a single PR.

xy-23 · 2020-05-07T03:05:36Z

Also, SingleStringTextMobject is not a good choice.
Adding SingleStringTextMobject would only make the code hard to read.
I have a better idea dealing with multiple texts parameters and grouping them into 2 dimension array.

NavpreetDevpuri · 2020-05-07T03:33:34Z

The space are decided by text layout engine, which means the space between the letters are not the same every time, especially when the text is mixed with different languages.

i just make each line as a separate text i don't changing or doing anything with 'the space between the letters'
i just put those lines next to each other to make a paragraph, there is nothing wrong with this.

xy-23 · 2020-05-07T03:36:45Z

Sorry, I said wrong. I mean the space in the front and back of each line.
You need to add those space because you separate the text by line.
But you actually needn't to do so.

NavpreetDevpuri · 2020-05-07T03:39:56Z

no problem
i just upgraded Text()

NavpreetDevpuri · 2020-05-07T03:55:42Z

reopened with only 6 commits
#1036

* Fix x_min, x_max and color of FunctionGraph * Add graphical unit test to FunctionGraph * Apply review suggestions * Pass color as argument instead of updating kwargs and run black

NavpreetDevpuri added 2 commits May 1, 2020 10:44

Add files via upload

ac7f55f

Update text_mobject.py

516fa05

NavpreetDevpuri mentioned this pull request May 1, 2020

Text(" ") don't move. Because of that Text("a b") shows wrong transform animation. #1017

Closed

NavpreetDevpuri added 7 commits May 1, 2020 11:03

Update text_mobject.py

0d977e5

Update mobject.py

0d71efc

Update mobject.py

b4370a2

Update code_mobject.py

1571ee0

Update text_mobject.py

07f1d06

Update text_mobject.py

41e57f4

Update svg_mobject.py

be4180c

NavpreetDevpuri changed the title ~~CodeMobject to display code with color highlighted and updated Text_mobject~~ CodeMobject to display code with color highlighted and updated Text( ) May 1, 2020

NavpreetDevpuri added 2 commits May 1, 2020 12:20

Update text_mobject.py

e93b254

Update text_mobject.py

68d470f

NavpreetDevpuri added 3 commits May 2, 2020 02:14

Update text_mobject.py

b64f27f

Update text_mobject.py

542010c

Update code_mobject.py

124842d

Update svg_mobject.py

6f0f1d2

NavpreetDevpuri changed the title ~~CodeMobject to display code with color highlighted and updated Text( )~~ CodeMobject to display code with color highlighted and updated svg_mobject May 1, 2020

NavpreetDevpuri changed the title ~~CodeMobject to display code with color highlighted and updated svg_mobject~~ CodeMobject to display code with color highlighted and corrected svg_mobject for " " space character May 1, 2020

Update code_mobject.py

e2ec736

NavpreetDevpuri added 2 commits May 3, 2020 22:55

Update code_mobject.py

142fe5f

Update imports.py

3c5d582

kevkevinpal approved these changes May 3, 2020

View reviewed changes

NavpreetDevpuri changed the title ~~Code() in file Code_mobject.py to display code with color highlighted.~~ Code() in file Code_mobject.py to display code with color highlighted and text_mobject.py and svg_mobject for " " space character May 5, 2020

Update text_mobject.py

5d1fcfa

NavpreetDevpuri mentioned this pull request May 6, 2020

Fix Text Class's bugs in shaders branch (the same as #1030) #1031

Merged

Merge branch 'master' into code_mobject

358f791

NavpreetDevpuri added 3 commits May 7, 2020 00:51

Update text_mobject.py

e7b7491

Update text_mobject.py

301d5dc

Update code_mobject.py

093a2e3

NavpreetDevpuri mentioned this pull request May 7, 2020

Fix space characters problem of Text #1035

Merged

Update text_mobject.py

1d14b81

NavpreetDevpuri added 2 commits May 7, 2020 08:52

Update text_mobject.py

e563e08

Update text_mobject.py

be50ae8

NavpreetDevpuri closed this May 7, 2020

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Code() in file Code_mobject.py to display code with color highlighted works correctly with updates in text_mobject.py and svg_mobject. #1018

Code() in file Code_mobject.py to display code with color highlighted works correctly with updates in text_mobject.py and svg_mobject. #1018

NavpreetDevpuri commented May 1, 2020 •

edited

NavpreetDevpuri commented May 1, 2020

NavpreetDevpuri commented May 1, 2020

NavpreetDevpuri commented May 1, 2020

kevkevinpal commented May 3, 2020 •

edited

NavpreetDevpuri commented May 3, 2020

kevkevinpal left a comment

NavpreetDevpuri commented May 3, 2020

NavpreetDevpuri commented May 3, 2020

NavpreetDevpuri commented May 5, 2020

NavpreetDevpuri commented May 5, 2020 •

edited

NavpreetDevpuri commented May 5, 2020

xy-23 commented May 6, 2020

NavpreetDevpuri commented May 6, 2020

TonyCrane commented May 6, 2020

xy-23 commented May 6, 2020

NavpreetDevpuri commented May 7, 2020

xy-23 commented May 7, 2020 •

edited

xy-23 commented May 7, 2020 •

edited

NavpreetDevpuri commented May 7, 2020 •

edited

xy-23 commented May 7, 2020 •

edited

NavpreetDevpuri commented May 7, 2020

NavpreetDevpuri commented May 7, 2020

Code() in file Code_mobject.py to display code with color highlighted works correctly with updates in text_mobject.py and svg_mobject. #1018

Code() in file Code_mobject.py to display code with color highlighted works correctly with updates in text_mobject.py and svg_mobject. #1018

Conversation

NavpreetDevpuri commented May 1, 2020 • edited

It solves the following problems

NavpreetDevpuri commented May 1, 2020

NavpreetDevpuri commented May 1, 2020

NavpreetDevpuri commented May 1, 2020

kevkevinpal commented May 3, 2020 • edited

NavpreetDevpuri commented May 3, 2020

kevkevinpal left a comment

Choose a reason for hiding this comment

NavpreetDevpuri commented May 3, 2020

NavpreetDevpuri commented May 3, 2020

NavpreetDevpuri commented May 5, 2020

NavpreetDevpuri commented May 5, 2020 • edited

NavpreetDevpuri commented May 5, 2020

xy-23 commented May 6, 2020

NavpreetDevpuri commented May 6, 2020

TonyCrane commented May 6, 2020

xy-23 commented May 6, 2020

NavpreetDevpuri commented May 7, 2020

xy-23 commented May 7, 2020 • edited

xy-23 commented May 7, 2020 • edited

NavpreetDevpuri commented May 7, 2020 • edited

xy-23 commented May 7, 2020 • edited

NavpreetDevpuri commented May 7, 2020

NavpreetDevpuri commented May 7, 2020

NavpreetDevpuri commented May 1, 2020 •

edited

kevkevinpal commented May 3, 2020 •

edited

NavpreetDevpuri commented May 5, 2020 •

edited

xy-23 commented May 7, 2020 •

edited

xy-23 commented May 7, 2020 •

edited

NavpreetDevpuri commented May 7, 2020 •

edited

xy-23 commented May 7, 2020 •

edited