I'm just beginning out with Apache Pivot and started with Hello BXML example on their site. The applet just displays a grey rectangle and nothing more. I've deployed the application under tomcat with following structure:
hellopivot
lib/pivot-*.jar
org.apache.pivot.tutorials.HelloBxml
scripts/deployJava.js
index.html
hello.bxml
index.html:
<script type="text/javascript">var attributes = {
code : "org.apache.pivot.wtk.BrowserApplicationContext$HostApplet",
width : "240",
height : "80"
};
var libraries = [];
libraries.push("lib/pivot-core-2.0.jar");
libraries.push("lib/pivot-wtk-2.0.jar");
libraries.push("lib/pivot-wtk-terra-2.0.jar");
libraries.push("lib/pivot-web-2.0.jar");
libraries.push("lib/pivot-web-server-2.0.jar");
attributes.archive = libraries.join(",");
var parameters = {
codebase_lookup : false,
application_class_name : 'org.apache.pivot.tutorials.HelloBxml'
};
var javaArguments = [ "-Dsun.awt.noerasebackground=true",
"-Dsun.awt.erasebackgroundonresize=true" ];
parameters.java_arguments = javaArguments.join(" ");
deployJava.runApplet(attributes, parameters, "1.6");
</script>
hello.bxml
<Window title="Hello BXML!" maximized="true"
xmlns:bxml="http://pivot.apache.org/bxml"
xmlns="org.apache.pivot.wtk">
<Label text="Hello BXML!"
styles="{font:'Arial bold 24', color:'#ff0000',
horizontalAlignment:'center', verticalAlignment:'center'}"/>
</Window>
HelloBxml.java
#Override
public void startup(Display display, Map<String, String> properties)
throws Exception {
BXMLSerializer bxmlSerializer = new BXMLSerializer();
window = (Window)bxmlSerializer.readObject(HelloBxml.class, "hello.bxml");
window.open(display);
}
What am I doing wrong?
(Disclosure - Apache Pivot PMC member)
How are you attempting to view the applet?
Which OS, JVM, browser etc are you using?
Are you able to view the hosted version of that applet using the same client configuration as the failing 'local' version?
HelloBXML at offical Apache Pivot site
Do you have problems viewing any of the other Pivot applets hosted at the official site? (Demos or Tutorials?)
Issues with applets in linux environments have been reported that sound similar to your experience.
Try adding the "lib/pivot-tutorials-2.0.jar" to your libraries list. That is where the 'org.apache.pivot.tutorials.HelloBxml' class file lives.
Related
I am registering a custom kentico widget.
When it was created, I could not locate it in the collection of other widgets on the page tab in the admin website of the CMS solution.
I also looked for my widget in the CMS_Widget Table with no luck. Is there another table which might house custom widgets?
My Controller
using System.Web.Mvc;
using Website.Contracts;
using Company.Views.FeaturedProduct;
[assembly: RegisterWidget(OptInOptOutWidgetController.Identifier, typeof(OptInOptOutWidgetController), "Opt In Opt Out List", Description = "Lists all products that are opted in", IconClass = "icon-bullseye")]
namespace Website.Controllers.Widgets
{
public class OptInOptOutWidgetController : WidgetController
{
public const string Identifier = "Website.Controllers.Widgets.OptInOptOutWidgetController";
public IApplyLoanService ApplyLoanService { get; }
public OptInOptOutWidgetController( IApplyLoanService _ApplyLoanService)
{
ApplyLoanService = _ApplyLoanService;
}
public ActionResult Index()
{
List<StateInfo> stateInfoList = ApplyLoanService.GetStateDetails();
List<SelectListItem> statesList = new List<SelectListItem>();
OptInOptOutWidgetViewModel viewModel = new OptInOptOutWidgetViewModel();
viewModel.StateList = stateInfoList.Where(x => x.StateName != null).Select(x => new OptInOptOutStateViewModel
{
StateName = x.StateName
}).ToList();
ViewBag.States = viewModel.StateList;
return PartialView("Widgets/OptInOptOut/_OptInOptOutProductList", viewModel);
}
}
}
My View
#using Company.Models.Widgets
#model Company.Models.Widgets.OptInOptOut.OptInOptOutWidgetViewModel
#if (Context.Kentico().PageBuilder().EditMode && Context.Kentico().PageBuilder().Initialized())
{
#Html.Kentico().PageBuilderScripts()
}
<div>
#if (Model.StateList != null)
{
<p>Select State</p>
<select>
#Html.DropDownList("States", new SelectList(Model.StateList), "")
</select>
}
else
{
<p>There are no states</p>
}
</div>
I referenced this post:
Unable to Create New MVC Widget in Kentico 12
I started making updates the code base but still nothing:
The AssemblyDiscoverable was already where it was supposed to be
We have other widgets published to the CMS but there is no clear path on how to reproduce. Are there any suggestions?
The CMS_Widget table is used for Portal Engine Widgets, which are very different from MVC Page Builder Widgets.
Portal Engine Widgets are used to create the Administration UI which is still built on ASP.NET Web Forms technology.
MVC Page Builder Widgets are not used anywhere in the Administration UI, only on the Live Site.
There is no database table that records all Widgets (or any Page Builder components) defined in the Live Site. Instead, these are all discovered at runtime by the Xperience framework based on your [assembly: RegisterX(...)] component registration attributes.
Your Widget will appear in the Page Builder UI in a dialog that opens when you click the + button in a Widget Zone.
If your Widget is registered in the MVC Live Site application, you do not need the AssemblyDiscoverable attribute - that is only required when your Xperience components are in separate class libraries. AssemblyDiscoverable tells Xperience to scan the class library assembly for components - without it, scanning that assembly is skipped.
I am replacing a server side solution that allowed a master application page to fire headless window that talk to the originating page.
Now I am doing it in SPO with SPFx and so far I just used one page and web part with a big dialog that can't get out of the sending page.
My users want to be able to put the dialog on the second monitor so I think I have to do it in a different window / web part. I am planning a version 2.0 and collection ideas how to do it.
So far I think I will use "broadcast-channel" for communicating between the parent page/web part and the child page/web part.
I still need to figure out the following:
How to create a sharepoint page containing just a SPFx web part without all the side and top bla bla. (safe to hide by CSS?)
How to pass the spfxContext from parent to child
how to debug 2 separate SPFx projects at the same time while building the solution.
Any suggestion is welcomed. Samples even more 😘
Thank you in advance.
Try to use an extension:
export default class CssInjectApplicationCustomizer
extends BaseApplicationCustomizer<ICssInjectApplicationCustomizerProperties> {
#override
public onInit(): Promise<void> {
const cssUrl: string = '/SiteAssets/inject.css';
const head: any = document.getElementsByTagName("head")[0] || document.documentElement;
let customStyle: HTMLLinkElement = document.createElement("link");
customStyle.href = cssUrl;
customStyle.rel = "stylesheet";
customStyle.type = "text/css";
head.insertAdjacentElement("beforeEnd", customStyle);
return Promise.resolve();
}
}
inject.css:
/* Hide header */
#SuiteNavPlaceHolder, .od-SuiteNav{
display:none !Important;
}
/** Hide options header **/
div[class^="sideActionsWrapper-"],
.sideActionsWrapper-53 .ms-searchux-searchbox {
display: none;
}
/** Hide header lists**/
.CanvasSection .ms-DetailsList-headerWrapper,
.CanvasSection div[class^="itemsViewDetailsListCommandBar_"]{
display: none;
}
/** Hide Header page **/
div[class^="detailsListContainer_"],
.ControlZoneEmphasisBackground,
.root-63,
.root-76{
background-color:transparent;
}
We have added 4 "Quick Links" web/app part in one section on a SharePoint modern page. We would like to highlight links under "Quick Links web part 2" and "Quick Links web part 4" only. I have added React modern script editor. How do we archive the above requirement using CSS ? If it is not possible in CSS then we would like to introduce JS. I couldn't find a fixed tag name that I can grab and apply CSS except GUID.
You could try to inject CSS by SPFX.
Check the demo shared by hugoabernier.
Main code:
export default class InjectCssApplicationCustomizer
extends BaseApplicationCustomizer<IInjectCssApplicationCustomizerProperties> {
#override
public onInit(): Promise<void> {
Log.info(LOG_SOURCE, `Initialized ${strings.Title}`);
const cssUrl: string = this.properties.cssurl;
if (cssUrl) {
// inject the style sheet
const head: any = document.getElementsByTagName("head")[0] || document.documentElement;
let customStyle: HTMLLinkElement = document.createElement("link");
customStyle.href = cssUrl;
customStyle.rel = "stylesheet";
customStyle.type = "text/css";
head.insertAdjacentElement("beforeEnd", customStyle);
}
return Promise.resolve();
}
}
I am trying to detect the screen resolution of the browser in Angular Universal but I'dont get it, on the side of the browser, I use BreakpointObserver of Angular Material, but on the server is not working:
this.breakpointObserver.observe(['(max-width: 575px)']).pipe(filter(result => result.matches == true)).subscribe((result: any) =>
{
console.log('(max-width: 575px)', result)
this.imageBackground = this.imageBackgroundPortrait;
});
This It is ignored on the server. Any suggestions?
Thanks.
When you want to update on resize you have to mention something like this :
#HostListener('window:resize', ['$event'])
onResize(event) {
this.innerWidth = window.innerWidth;
}
Something like this should definitely work in any devices you encounter:
export class Dashboard {
mobHeight: any;
mobWidth: any;
constructor(private router:Router, private http: Http){
this.mobHeight = (window.screen.height) + "px";
this.mobWidth = (window.screen.width) + "px";
console.log(this.mobHeight);
console.log(this.mobWidth)
}
}
Detect window size using Angular 4
How to get height and width of device display in angular2 using typescript?
This wouldn't work on the server, because on the server there is no "window", there is no "viewport" so it won't be defined. Hence why it's ignored on the server. In reality, you don't need it there.
What you can consider doing is using the picture tag. This allows the browser to use the most appropriate image for the viewport.
<picture>
<source media="(min-width: 1100px)" srcset="https://cdn.dribbble.com/users/31348/screenshots/4892068/newport_1x.jpg" />
<source media="(min-width: 650px)" srcset="https://cdn.dribbble.com/users/107759/screenshots/4891695/iphonex-simple-3_1.gif" />
<img src="https://cdn.dribbble.com/users/1185900/screenshots/4890498/shopping_online_03.png" />
</picture>
Demo on codepen
you can try this on your Component
getScreenSize(event?) {
this.scrHeight = window.innerHeight;
this.scrWidth = window.innerWidth;
console.log(this.scrHeight, this.scrWidth);
}
// Constructor
constructor() {
this.getScreenSize();
}
this is the code to read the complete path with name of all files (images) from the folder inside the project
#{ string[] imgfiles = Directory.GetFiles(#"D:\MVClearningProjects\Demo\Demo\Property_Data\Images\" + item.Property_ID, "*.*");}
this code is to load the first image to cshtml view file
<img src="#Url.Content(imgfiles[0])" alt="carousel bootstrap first" readonly style="width:200px; height:120px;" />
//not allowed local resources when I run this project usig ISS
Like the error message is telling you, you are not allowed to do that. Due to security reasons, most browsers simply will not allow the use of file://. You need to host it with your application and load it from the web server.
Have a look at this great SO answer for an explanation and proposed solution to the problem.
This error was due to using the .physical path instead of virtual in following code
#{ string[] imgfiles = Directory.GetFiles(#"D:\MVClearningProjects\Demo\Demo\Property_Data\Images\" + item.Property_ID, "*.*");}
<img src="#Url.Content(imgfiles[0])" alt="carousel bootstrap first" readonly style="width:200px; height:120px;" />
I fixed it by replacing the physical path with virtual
#{ string[] imgfiles = Directory.GetFiles(#"D:\MVClearningProjects\Demo\Demo\Property_Data\Images\" + item.Property_ID, "*.*");
for (int i = 0; i < imgfiles.Length; i++)
{//converting physical address into virtual
imgfiles[i]= imgfiles[i].Replace(#"D:\MVClearningProjects\Demo\Demo", "~").Replace(#"\", "/");
}
}
<img src="#Url.Content(imgfiles[0])" alt="carousel bootstrap first" readonly style="width:200px; height:120px;" />