I am working with wirecloud platform and I would like to know the following:
1.- Is is possible to resize the widget's width and height dinamically?
2.- Is it possible to fill a dashboard with widgets and ops dinamically?
Both questions aims to have a menu(widget) where users can click and change between different tabs.
Any help or idea would be highly appreciated.
EDIT 06/08/15
I am able to answer the second question: NO. As I can see in this request, the ability to add/remove widgets dinamically is not available, although is thought to be in future releases of the platform. Next question: when is it going to be available?
EDIT 13/08/15
I expected using:
MashupPlatform.widget.drawAttention();
could trigger a tab change, but no luck.
EDIT 27/08/15
Finally, we found a workaround. We take advantage of the iFrame property by which you can access to parent's document. From there, we are able to read the elements representing the tabs and generate their clicks at will.
Support for adding widgets and operators dynamically will be added on version 0.8.0, you can experiment with this feature if you install WireCloud from the develop branch on github. We are working on improving the documentation and polishing it for a new release at the end of September.
Although is great you find a work around using the iframe property for moving between tabs :), I recommend you to request the addition of such a feature using the WireCloud's issue tracker ;-).
P.D. MashupPlatform.widget.drawAttention(); need some fixes, but the idea is to provide some visual highlighting of widgets so user know there are updates in the widget. Something similar to the way google hangouts uses a green color for indicating the chat has new messages.
Related
I know there are several tools available to find unused CSS on a static web page. But in most real world scenarios I encounter, a lot of the CSS is used after some or the other interaction on the page, maybe a new modal opening up or an options popup etc.
In such scenarios, what would you suggest? How do I keep a tab on my ever-growing render blocking CSS?
The only way I guess one could do that is by running regular unused-css-detector type tools in conjunction with Selenium - test known interactions and see whats left unused. But a big assumption here is that I'd need to know all interactions on my page which could use new CSS. Is there a way to achieve my goal without making this assumption?
In an ideal world, I'd be able to post-back all CSS used by a visitor's browser on my page to my server. Then I'd collect data over a month, aggregate, and get a pretty accurate idea about actual unused CSS.
Any good ideas?
I am the author of a tool that is aiming at doing what you are describing. Everywhere I worked, the CSS is this "append-only" thing that is too risky, too time-consuming to clean up. And even when you try, the ROI is so low that it not worth it.
So I am working on a tool that is very similar to what you are describing. The goal is to bring confidence on what can be removed, and to actually do it automatically by submitting pull requests.
A snippet of JavaScript is running in the browser and sends reports of what is being used to a server. Once enough data is accumulated to build some "confidence score", it can create Pull Request automatically to remove selectors that are actually not used.
It is still very early stage, but you are welcome to try it and give some feedback about it.
https://www.bleachcss.com/
Problem
So we have quite a big project with lots of different Partial Views and a client side data binding framework (Knockout.js in our case).
One of the more problemtic parts is that is getting harder and harder to figure out which partial view is rendering an element that I see on my page.
So I need to debug this particular DIV. Okay, where do I find it?
Usually I try to find a very specific class or ID close by this element and do a search through the whole platform - far from ideal.
Question
So I was thinking about the following; tagging all elements (in debug mode) with the source file where they have been generated.
Right now I'm thinking about something like a precompiler that adds a data-source="" to every element. I might refer to an ID within a dictionary to prevent repeating all the long filenames.
Before I'm reinventing the wheel:
is there already something similar?
are there better alternatives?
We're using ASP.NET MVC, but any hints to how other platforms do this are perfect too.
If you are using Visual Studio, I highly recommend the Web Essentials extension. Among many great features, it has one called "Inspect Mode", part of the larger "Browser Link" feature, that does exactly what you are looking for; it identifies the file that a particular DOM element came from. It might be worth a shot if that option is open to you.
#Dirk, as per my understanding your issue is to easily identify the element/view. Adding data-source can be an option but before that have a look at this link
Editing Styles and DOM - Chrome Dev Tools
This page has many demonstrations which might be helpful to your problem. Furthermore, I do agree with Kevin suggestion.
I have looked through the available widgets in glade 3.20 and can not find anything called StWidget.
Inspecting Gnome Maps, Builder and Nautilus the button is listed as an StWidget, the closest I can find in glade is a MenuButton Widget.
I basically want to make a funky dropdown widget like a lot of the modern gnome apps have started using.
I'm pretty much the farthest thing from an authoritative answer, so I really hope I'm corrected by a developer at some point in the future. However I was researching this class of widgets, so at least I've discovered a few things.
The St widgets are used within gnome-shell, and are not actually related to GTK in implementation. They are implemented on Clutter, so they are from a different linage. I was not able to confirm their future place within GTK, however they've been mentioned in the initial GTK4 discussions.
It also looks like no real documentation exists, so using the St's would be playing on the development edge. Not sure how you found the St widgets in nautilus though, I thought applications were still all GTK... excluding any gnome-shell integration components, those could have St widgets.
If your making Applications, stick with the mainline GTK. However if you wanted a menu like that for gnome-shell, have you investigated making a gnome-shell extension?
One of the web application I developed uses Primefaces 2.2. I'm delaying the migration to 3.X because I think the users are more comfortable with the 'old' look and feel of some components.
In the calendar I liked the 2.2 icon on the popup button and I would like to go on with it. Unfortunately it seems the easy way to achieve this goal, the attribute popupIcon, is no more supported, despite it is still present in the guide for 3.X
FileUpload was completely rewritten and its look is radically changed: now in the auto mode the browse (choose file) button is inside a rounded box with a background image and color set. I preferred the 2.X look, where there is no rounded box. Besides making some tests with Internet Explorer 9 I noticed the UploadedFile.getFileName() gives now the full path of the file, while I have functioning code expecting only the file name without path. The migration guide tells nothing about this change which is completely undocumented.
I believe the original look and feel can be restored with some css override, but I have already tried without success reading also this
Primefaces: how to change the default icon on the button of the calendar field?
and I would like to receive some advices.
My major concern is that css modifications can affect other components, so it is necessary to be very specific.
Thanks
Filippo
I don't think there is a quick fix, in fact I think it will be a lot of work. As you said yourself, the look and feel for some elements has changed a lot. However PrimeFaces is highly customizable when it comes to styling.
I suggest you download the manual from the PrimeFaces site (PDF) and get to work using CSS as your weapon of choice. Maybe you can re-use the CSS of PrimeFaces 2.x as a reference.
Does anybody know of any pre-canned gadget/widget management framework (along the lines of iGoogle etc) that I would be able to use on an ASP.NET MVC site (presumably loading divs via jQuery etc)?
In particular, I'd rather not write all the selection / location code if there is something decent already available. (I would expect to write the actual widgets / content etc myself...)
I was waiting to see if you got an answer on this one as it's something I'm interested in too. As you haven't, I'll tell you what I know (it's probably not so useful but it might get you started...)
I've used something based on the ExtJS portal demo in a previous project - there are some license costs involved depending on the deployment scenario though, and besides, it turned out to be quite slow and cumbersome, and rather tricky to customise - the default for the ext toolset is for the ui to be built entirely from javascript, not from markup, and while it was possible to coerce it into working on top of existing markup, it seemed more difficult than it needed to be. That aside, it worked well in the end, and with the paid version the support is very good.
I've also implemented a widget / portal screen based on jquery-ui sortable which worked really well - the basic implementation was very quick and easy but writing the code to save and load portal settings took more time than I would have liked.
If I were doing a similar project now, I think I'd evaluate this instead - it looks ok from a cursory glance and it's open source - it's built with jquery-ui sortable, so the core should be solid enough, and the slightly uneven animations on the demo version should be easy to sort out assuming it uses the standard jquery-ui sortable options. It has functionality to load/save portal settings too by the looks of it, so it should mean less hand coding that side of things.
I have used Telerik RadDock in the past and found it to be pretty good. It renders in divs and is relatively easy to style.
It doesn't cost too much if you are using it commercially.
http://demos.telerik.com/aspnet-ajax/dock/examples/overview/defaultcs.aspx
http://net.tutsplus.com/tutorials/javascript-ajax/inettuts/
This guy put together a great tutorial on implementing a iGoogle like drag/drop widget interface. Even links to a working example.