Bootstrap Changes to Advanced Editor and Attachments Form


 
Thread Tools Search this Thread
Top Forums Web Development Bootstrap Changes to Advanced Editor and Attachments Form
# 1  
Old 12-05-2018
Bootstrap Changes to Advanced Editor and Attachments Form

I changed the CSS and Javascript in the "Advanced Editor" to clean it up. This is also the editor seen in "New Thread" and "New Reply". Basically I got rid of the mouseover style changes which were messed up due to vB legacy JS code from a decade ago.

While doing this change, I then completed the first phase toward changing the attachment form to a Bootstrap Modal, but did not complete the change because I need to get rid of all the table elements first (there are quite a few). However, I did manage to add some Bootstrap classes and cleaned this form up as well:

Image

I don't want to spend too much time on this, because I plan to change this entire method of uploading attachments to the forums, but this does clean it up a bit.
# 2  
Old 12-05-2018
In addition, while I was at this "editor project".. I made a lot of Bootstrap-related changes to all editors (new thread, quick reply, advanced and edit post).

It's still not so great; but it is much better than it was (had not really updated these editors in around eight years, LOL)
This User Gave Thanks to Neo For This Post:
# 3  
Old 12-05-2018
Looking good, Neo.
BTW, the AdvancedEditor is missing a Colors drop-down icon.
# 4  
Old 12-05-2018
Thanks! Will look into it!
# 5  
Old 12-05-2018
Yeah, that color picker works in the "Quick Reply Editor" but not the "Advanced Editor" ... the code is the same and there are no Javascript errors, so it is disabled until I get around to fixing it.

I have on idea why it works in one editor and not the other with the same code with no errors. Will have to put it on the TODO list.

Just use the Quick Editor when you need colors, or just add them by hand if you really need them [COLOR=red] blah blah [/COLOR]

Code:
<if condition="$show['color_bbcode'] AND FALSE">
  <td>
    <img
      src="$stylevar[imgdir_editor]/separator.gif"
      width="6"
      height="20"
      alt="Editor Icon"
    />
  </td>
  <td>
    <div
      class="imagebutton"
      id="{$editorid}_popup_forecolor"
      title="$vbphrase[colors]"
    >
      <table style="border-spacing:0;border:0">
        <tr>
          <td>
            <div id="{$editorid}_color_out">
              <span
                ><img
                  src="$vboptions[cleargifurl]"
                  id="{$editorid}_color_bar"
                  alt="Color Bar"
                  style="background-color:black"
                  width="21"
                  height="16"
              /></span>
            </div>
          </td>
          <td class="alt_pickbutton">
            <img
              src="$stylevar[imgdir_editor]/menupop.gif"
              alt="Menu"
              width="11"
              height="16"
            />
          </td>
        </tr>
      </table>
    </div>
  </td>
</if>

This User Gave Thanks to Neo For This Post:
# 6  
Old 12-07-2018
OBTW, I forgot to mention.....

The new formats for the attachments are drag and drop, so you can drag into each one of the attachment areas from your desktop and drop into the form.

I am working on the next phase of this to create a Bootstrap modal for uploading.

Looks like this and is close to working well enough to make it available. Soon, I will be an "expert" a Bootstrap modals, LOL


Bootstrap Changes to Advanced Editor and Attachments Form-screen-shot-2018-12-07-114029-pmpng
This User Gave Thanks to Neo For This Post:
# 7  
Old 12-08-2018
Have been working for a day on getting the "manage attachment" popup to work perfectly as a Bootstrap modal; but I cannot get it to work perfectly 100% as a modal, so I have modified the popup to look like a modal, but it is really just a page popup for now:

Image

This works for "new reply" and "edit post" and "advanced editor" but does not work (yet) in the quick reply editor (QRE).

However, it is much better than before, not perfect as modal or working in QRE yet, but drag and drop from the desktop works well.

A bit bored with this for now; I will move on to another modal, perhaps the color picker or smilie picker, or maybe something else.

Have a great weekend!
Login or Register to Ask a Question

Previous Thread | Next Thread

8 More Discussions You Might Find Interesting

1. What is on Your Mind?

New Experimental Attachment Uploader / Manager in Advanced Editor

I have made the experimental Bootstrap attachment manager (modal) available to everyone. It's basically the same thing as the paperclip attachment icon, but this window opens as a Bootstrap modal versus a popup page. The downside of using the modal is that to see the attachments in the editor... (0 Replies)
Discussion started by: Neo
0 Replies

2. What is on Your Mind?

Scrollbars and Bootstrap Tables

Making some progress using CSS from Bootstrap; changing table classes to the Bootstrap "table" class and wrapping those tables in a div with a scroll bar. So, the good news is that now each post with large blocks of code that exceeds the width of the screen will have a scrollbar; but the bad... (0 Replies)
Discussion started by: Neo
0 Replies

3. Shell Programming and Scripting

Remove x lines form top and y lines form bottom using AWK?

How to remove x lines form top and y lines form bottom. This works, but like awk only cat file | head -n-y | awk 'NR>(x-1)' so remove last 3 lines and 5 firstcat file | head -n-3 | awk 'NR>4' (5 Replies)
Discussion started by: Jotne
5 Replies

4. Shell Programming and Scripting

Transpose Data form Different form

HI Guys, I have data in File A.txt RL03 RL03_A_1 RL03_B_1 RL03_C_1 RL03 -119.8 -119.5 -119.5 RL07 RL07_A_1 RL07_B_1 RL07_C_1 RL07 -119.3 -119.5 -119.5 RL15 RL15_A_1 RL15_C_1 RL15 -120.5 -119.4 RL16... (2 Replies)
Discussion started by: asavaliya
2 Replies

5. UNIX for Advanced & Expert Users

How to fix bootstrap failure in unix V4.0D?

hi! my computer is... system: Digital Personal Workstation 433a Processor: Digital Alpha 21164, 433 MHz Memory: 64 MB Operating System: Digital Unix Console(SRM), Digital Unix V4.0D That computer is used for radar display. Application run on Unix. I have a problem now. I can't boot dkc0... (2 Replies)
Discussion started by: akz
2 Replies

6. Shell Programming and Scripting

set EDITOR=vi -> default editor not setting for cron tab

Hi All, I am running a script , working very fine on cmd prompt. The problem is that when I open do crontab -e even after setting editor to vi by set EDITOR=vi it does not open a vi editor , rather it do as below..... ///////////////////////////////////////////////////// $ set... (6 Replies)
Discussion started by: aarora_98
6 Replies

7. Solaris

Redirecting Bootstrap

Exactly how can I redirect bootstrap data generated by Networker to a file? The company's policy is to have this electronically saved remotely. The idea is to have the bootstrap info saved to a file and then use rsync to move that file to a remote server. So instead of sending it to a printer... (0 Replies)
Discussion started by: Jshwon
0 Replies

8. UNIX for Advanced & Expert Users

Changing Unix form to Microsoft Word form to be able to email it to someone.

Please someone I need information on how to change a Unix form/document into a microsoft word document in order to be emailed to another company. Please help ASAP. Thankyou :confused: (8 Replies)
Discussion started by: Cheraunm
8 Replies
Login or Register to Ask a Question