I'm using the best_in_place gem to do in-place editing in a Rails application. However, I need (X)HTML editing on some of the text areas, so I need a rich-text editor. TinyMCE is being used elsewhere on the site.
However, it's not trivial to add an editor to best_in_place. To grossly oversimplify, the gem uses jQuery to insert the textarea tag on the fly, and TinyMCE initializes at page load, replacing available textareas with an editor, so when best_in_place puts in its textarea, TinyMCE has already come and gone. I've tried re-initializing TinyMCE after best_in_place inserts its textarea, but I don't think I've found the correct place(s) in the code to do that, because so far it hasn't worked.
There's a rumor that this integration is possible, but no documentation was visible in my web searches, so pointers are welcome. (Likewise this answer is unhelpful, pointing to two broken links.) I think my preferred order of solutions would be something like
Here's how to integrate TinyMCE with best_in_place
It can't be done with TinyMCE but here's how to do it with another rich-text editor
It can't be done with best_in_place but here's another rich-text edit-in-place solution for Rails 3.2.x.
I gave up trying to do this with best_in_place, so this question as written is still open to a better answer. However, for those who might find this question later and wonder what I eventually came up with, here's what I did in the end:
Junked best_in_place.
Forked the jeditable-rails plugin to
get Jeditable as an in-place editor.
Adapted the plugin to provide Jeditable, jWYSIWYG, and the Jeditable-jWYSIWYG custom input as assets for the Rails asset pipeline (along with related CSS and images for jWYSIWYG).
Profit! (Not really.)
Anyway, if you're trying to do rich-text in-place editing in Rails 3.2, try the jeditable-wysiwyg-rails plugin. It's providing the assets for the markItUp editor as well, although because I'm not using it I'm not sure they're all there and/or arranged properly.
Related
I did this:
I downloaded a zip from OpenCart website and put it in xampp/htdocs/mywebsite. I need PhpStorm to autocomplete methods of OpenCart classes but none are recognized I think. And this is not only for OpenCart: I have the same issue with WordPress as well.
Edit: check this screenshot
I want this:
I want external classes to support autocomplete but I don't know what to do.
Solved
So after a year and half practicing opencart, i can now answer this question. In opencart we have a folder called 'model'. there are files in this folder which you can call in any 'controller' you want. And this models are generated dynamicly. Because of that you cant trace them in IDE, like click on them and see the exact file. Thats why opencart sucks.
I just created a new static web project using the Bootstrap template. In my html files it is marking the names of Bootstrap css classes as typos. Surely the worlds smartest IDE is better than that? How do I make it aware of Bootstrap classes? I know I can disable spell checking but that seems like an awful solution.
Please follow WI-4762 for updates to be notified on any progress with it. For now, I can only suggest to either disable the spell checker or add the words shown as typos to dictionary
I recently started to create custom theme for ExtJS 5 by Sencha.
Following http://docs.sencha.com/extjs/5.0.0/core_concepts/theming.html I managed to create ThemeDemoApp, inherit ext-theme-neptune, change $base-color to green and refresh/rebuild ThemeDemoApp with my-custom-theme. All ok.
My problem is, ThemeDemoApp is quite poor for testing a custom theme. A panel, tab, button and a modal window. That's it?
After bit of googling I bumped into http://dev.sencha.com/ext/5.0.0/examples/themes/index.html. (Why isn't this mentioned in the guide?!) Heading says: View and test every Ext component against bundled Ext Themes, or your own custom themes.
My question is: How? How do I test my own custom theme against this example? Do I have to dig into the source (themes.js) and build such page/application myself?
The examples - including the Theme tester - is included in the ExtJS download.
You can modify the list of themes available by editing the shared/options-toolbar.js file.
To get it to find your theme, you'll either need to name it similar to the others (ext-theme-name), or modify themes.js accordingly.
Or you could just hack the theme.js file to hardcode your theme.
(Ext JS 4 used to create an example page for themes automatically - it doesn't seem to do that now, though)
According to advice at How do I include a JavaScript file in another JavaScript file? I decided to load both options-toolbar.js and themes.js (with just minor modification - commenting out Ext.onReady(...) function in themes.js) and I used functions getBasicPanel(), getCollapsedPanel(), etc. in my own application to create the same testing page (absolute-layout container that fits the page).
Anyhow, I guess Robert's answer is the correct one - there is no prearranged, ready-to-use functionality from Sencha :-(
I've got an app that's using JQueryMobile and it's using the awesome ActiveAdmin extensively as well. While I love the ease and simplicity of the ActiveAdmin interface, I'd really like consistency with the rest of my app.
Is it possible (i.e. using standard ActiveAdmin and not modifying its sources) to re-skin ActiveAdmin to use the JQuery-Mobile look and feel?
Its very possible to reskin ActiveAdmin, though it would be a bit of a job to do, and there would likely be quite a number of things that can't perfectly be built to match a mobile presentation, especially if you don't want to get into overriding markup rendering.
You can always simply start adding styles of your own to the active_admin.css file that is generated for you. If you'd like to start without any of ActiveAdmin's styles at all, you can comment out the two sass imports in that css file:
#import "active_admin/mixins";
#import "active_admin/base";
Or at least just the base file. It may be intriguing to you in itself, or informative about the organization of the markup, to view your current admin pages without the base css, or with css turned off in your browser altogether. From that vantage point, you could begin to think through how the bare markup could be restyled to match a mobile presentation.
In my Rails 3 application I'm using Twitter Bootstrap as a frame work for developing an in house project management system. I'm using Formtastic to help me with forms since it save a lot of time and code. My problem is getting the Formtastic code to output the forms in a way that correspond with Bootstrap's conventions. I've read a few items I found on Google suggesting that I should monkey patch Formtastic, but I haven't been able to do this successfully.
How can I customize Formtastic's output to use div's around each field so I can use Bootstrap with it?
Thank you for looking.
Well, today I tried forking formtastic and making it compatible with bootstrap... The markup is incredibly tightly coupled to the code, so I gave up and switched to simple_form instead. Works fine with the advice in Rails: Using simple_form and integrating Twitter Bootstrap
You can use the formtastic-bootstrap gem. You should be able to drop this in and it will generate HTML that will work naturally with Twitter Bootstrap.
If you use the SCSS files from the one of the scss-twitter-bootstrap projects, you can simply comment out or remove the include for the forms part of the CSS.
Simply copy them in to app/stylesheets (Rails 3.0) or app/assets/stylesheets and comment out:
// #import "forms.scss";
Don't forget to add the formtastic CSS back in:
<%= stylesheet_link_tag 'formtastic', 'formtastic_changes' %>