fusioncharts javascript render doesn't work inside liferay - liferay

I am using liferay portal and displaying graphs on portlet...
The manual says the 3 js files(FusionCharts.js, highcharts.js and jquery.min.js) need to be placed in a folder and only FusionCharts.js needs to be included to render using javascript on ipad.
FusionCharts.js is loading other script on demand if it dont find it displays blank portlet.
I have included FusionCharts.js but it displays blank portlet
here is my code to display map
FusionCharts._fallbackJSChartWhenNoFlash();
var myChart = new FusionCharts("Column3D.swf", "myChartId11", "400", "300", "0", "0");
myChart.setDataXML(" <chart caption='Weekly Sales Summary' xAxisName='Week' yAxisName='Sales' numberPrefix='$'> <set label='Week 1' value='14400' /><set label='Week 2' value='19600' /><set label='Week 3' value='24000' /><set label='Week 4' value='15700' /></chart>");
myChart.render("chartContainer");
Is it possible to disable ondemand load and load the other 2 scripts manually?
Or anyone suggest any other fix?

Simply load the other scripts. The external script loader of FusionCharts takes care of that. Do it in the following order:
jquery.min.js
highcharts.js
FusionCharts.js

Related

Custom page template not showing up when using a pagebuilder theme (mostly Elementor)

I've installed a theme (that i bought) that's mainly made with Elementor.
Since I've been running into some issues with customizing this theme, (and still refuse to also pay money for Elementor Pro) I decided it would be easier to create a custom template myself.
I have done this before when I used a custom theme I made myself from scratch (I thought I was saving myself some time this time around...).
So my problem: I saved this template called page-home.php to my Child theme (that I made of the purchased Theme) in a folder called page templates.
It is not showing in the drop down menu when creating a new page.
I then just copied it to the main theme, activated that...and still not showing.
Is this because the Theme is using a page builder like Elementor?
Or do you think the creator of the theme somehow disabled this option?
Thanks in advance for any help.
As far as I know Elementor ignores the most of the standard theme file. It does so i.e. with the header.php for sure. The question is what do you want to put in a theme file what you couldn't do with Elementor. Have a look at the
"Hello Theme" https://github.com/elementor/elementor/issues/14283 - it's a plain theme.
If you don't want to pay for Pro, I recommand the plugin "Elementor – Header, Footer & Blocks Template" (and for better editor handling: "Flexible Elementor Panel")

AEM 6.2 (Drag Component Here) Parsys height 0px

I am using AEM 6.2 and trying to create a parsys component in crx, using the code below
However, the height of this parsys, in edit mode, comes as 0px.
Attached are the screenshots.
When I manually change the height to some values eg. 40px, it looks fine.
Note: I am not using any client library for the above page. (no css and js)
Futher, All sample sites like geomatrix etc have parsys showing correctly.
Could anyone guide me with what I am doing wrong?
I think that the problem is outside the component or any of the code shown here.
I think what's happening is that the css style for the div that gives the droptarget placeholder its dimensions is not loading.
That's loaded as part of the AEM authoring client libraries which you should be inheriting from the foundation page component.
Examine your page component's sling:resourceSuperType property. It should point to either wcm/foundation/components/page or wcm/foundation/components/page or inherit from a component that does.
If that is set then you have may have blocked one of the scripts within it, quite possibly head.html.
Include following code in the head section of the page component's rendering script.
<!--/* Include Adobe Dynamic Tag Management libraries for the header
<sly data-sly-include="/libs/cq/cloudserviceconfigs/components/servicelibs/servicelibs.jsp" data-sly-unwrap/>
*/-->
<!--/* Initializes the Experience Manager authoring UI */-->
<sly data-sly-include="/libs/wcm/core/components/init/init.jsp" data-sly-unwrap/>
For resolving your issue, you need to include init.jsp in the first before writing down the parsys code. I mean write like this.
<head>
<sly data-sly-include='/libs/wcm/core/components/init/init.jsp' />
</head>
<body>
<sly data-sly-resource="${'par' #resourceType='foundation/components/parsys'}" />
</body>
I think #l-klement pointed it out correctly that the problem is outside component. When I rename the landingpage.html file to body.html it starts working fine. I think this may be because of different files like head.html etc present at wcm/foundation/components/page which is required to provide proper styling and load certain required client libraries which assigns proper styling to parsys.
If the above is true, my next question would be, How can I have my own head.html, body.html, header.html, footer.html etc files without compromising with the parsys styling?

Select2 multi-value: How to refresh

I'm using ajax in Rails 4 to load this form. Using select2-rails gem, it renders properly when the document loads:
After I click update, it loads the view partial:
but when I click on edit, the styling doesn't show up, and only the default bootstrap styling shows up:
How do I get this last image to show the select2 styling from the first image? I think it has to do with how select2 styling is loaded when the document is first loaded, but would appreciate a solution. Here is my stylesheet below:
$(document).ready(function(){
$("#e9").select2();
})
Allen:
Hello again by the way...
I had a similar problem in rails 4 and it had to do with turbolinks.
link: http://guides.rubyonrails.org/working_with_javascript_in_rails.html#how-turbolinks-works
In your JS file change your document ready to the function name below, then add the two commands just below the function, which are also below. This may be your issue as well because your page initially loads correctly, however when turbolinks is working, it tries to load only previously loaded files to quicken the load process and may skip your document ready function. Let me know if this helps... (Jake - DBC).
var select2Gem = function(){
$("#e9").select2();
};
$(document).ready(select2Gem);
$(document).on('page:load', select2Gem);

A bit confused with creating custom content parts and placement

I'm trying to create a Custom Part that just drops text into the page. I've created a part using the GUI that I called "Side Feature" and I added a text field called "Featured". I am trying put it on the side bar which I created on my layout, but I don't know how to move it to the sidebar. It shows up on my main content.
How do I move it to the sidebar? I tried using "#Display(Model.Featured)", but that doesn't seem to work. I also read about the placement.info file, but I'm not too sure how that would work in this sense.
I couldn't find a tutorial/blog post online similar to this. Most of them were too advanced. I am very new to Orchard.
You can't without code or additional module: sidebar is a zone for widgets, not for content parts. Placement info only works for local zones within the global Content zone.
If you want to do it through code, follow this: http://weblogs.asp.net/bleroy/archive/2011/03/26/dispatching-orchard-shapes-to-arbitrary-zones.aspx
If you want to use a module, look for Origami on the gallery.

Custom javascript file into amazon webstore

How to include custom javascript file to amazon webstore?
To include a custom js file in Amazon Webstore you:
1.From the homescreen click the customize url button
2.Select "use your own domain name" * Even if you dont plan to use your own you still must choose this.
3.In the custom url field it should say either example.webstorepowered.com or example.hostedbyamazon.com, change your domain name to example.hostedbywebstore.com
Where example is whatever your store would be named
4. check the confirm button and submit.
5. Go to "store design" "file library" from the dropdown and upload your js file to the appropriate folder.
Noe this file will appear with a red "x" over the top of it - this simply means you cannot use this file on any checkout or processing pages so amazon can ensure the integrity and security of the sales.
6.Next you will want to go to "store design" "merchandizing and layout"
7.click "properties" in the upper left corner
8.Choose "css and js" and select and the file so you custom js is loaded with all the other amazon required files.
That should be all you need. I just recently figured this out so post if you have any more questions.
Go to one of the main template pages under "Merchandising & Layout" click Properties on the top right and upload a js file to be included.
You can also place inline script tags within the widgets.
You can insert a script in the page with greasemonkey script, or userscript in the userscript folder in Chrome/Opera.

Resources