I installed web hide menu on https://www.odoo.com/apps/modules/8.0/web_menu_hide_8.0/
I modified to use it on Odoo 10, but the form will be adjusted to full width IF we press the hide button, if we were to change to another view after we pressed hide button, the form page will remain same as original (not full width).
So i need to adjust class "o_form_sheet" on form view after the page has been rendered. May i know how can i do that using javascript? Which class & method do i need to extend?
I'm going to answer my own question.
After some researched, i found out the best option was to inherit ViewManager widget using load_views function.
var ViewManager = require('web.ViewManager');
ViewManager.include({
load_views: function (load_fields) {
var self = this;
// Check if left menu visible
var root=self.$el.parents();
var visible=(root.find('.o_sub_menu').css('display') != 'none')
if (visible) {
// Show menu and resize form components to original values
root.find('.o_form_sheet_bg').css('padding', self.sheetbg_padding);
root.find('.o_form_sheet').css('max-width', self.sheetbg_maxwidth);
root.find('.o_form_view div.oe_chatter').css('max-width', self.chatter_maxwidth);
} else {
// Hide menu and save original values
self.sheetbg_padding=root.find('.o_form_sheet_bg').css('padding');
root.find('.o_form_sheet_bg').css('padding', '16px');
self.sheetbg_maxwidth=root.find('.o_form_sheet').css('max-width');
root.find('.o_form_sheet').css('max-width', '100%');
self.chatter_maxwidth=root.find('.o_form_view div.oe_chatter').css('max-width');
root.find('.o_form_view div.oe_chatter').css('max-width','100%');
}
return this._super.apply(this, arguments, load_fields);
},
});
Related
Is there any way to hide the nav-bar in jqgrid and reappear on selecting the row?
And how to reload the grid dynamically after selecting new value
To show or to hide the navigator bar one need to call show/hide jQuery-method on the div having "navtable" class. The div contains all buttons on the bar. If you use, for example, pager: "#mypager" then to hide the navigator bar one need do the following:
$("#mypager").find(".navtable").hide();
In more common case you can use the method
var visibilityNavBar = function (show) {
var pagerSelector = $(this).jqGrid("getGridParam", "pager");
$(pagerSelector)
.find(".navtable")[show ? "show" : "hide"]();
};
and to call it inside of onSelectRow callback
onSelectRow: function (rowid, status) {
visibilityNavBar.call(this, status);
}
To hide the navigator bar initially you can call
visibilityNavBar.call($("#list")[0], status);
directly after calling of navGrid method.
The demo https://jsfiddle.net/OlegKi/s2qkh9mn/ demonstrates the code. On selecting of a row the nav-bar will be displayed, on deselection it will be hidden.
I want to change the label of a widget when user click it, then I write the code looks like this:
var widgets = require("sdk/widget");
var statusBar = widgets.Widget({
id: "patchouliStatus",
label: "Wait Page Loading...",
contentURL: "http://www.mozilla.org/favicon.ico",
onClick: function(){
this.contentURL = "http://www.google.com/favicon.ico";
this.label = "Clicked";
}
});
When I click the widget, the icon has changed, but nothing happen to the label.I move the mouse to the widget and it still show "Wait Page Loading...".Is there a way to dynamically change the label?
Firefox: v27.0.1
Add-on SDK: v1.15
Widget's label is read-only. You must use tooltip attribute to show the user a text on mouse hover, this way:
var widgets = require("sdk/widget");
var statusBar = widgets.Widget({
id: "patchouliStatus",
label: "Wait Page Loading...",
contentURL: "http://www.mozilla.org/favicon.ico",
onClick: function(){
this.contentURL = "http://www.google.com/favicon.ico";
this.tooltip = "Clicked";
}
});
As docs says somewhere in this section -I think it could be more clearly documented-, tooltip value is an "optional text to show when the user's mouse hovers over the widget. If not given, the label is used". Also, examples in that section don't make it clear enough as I think they should.
Ok man thanks for the XPI, change changeLabel function to this, my above was really bugged.
function changeLabel(str){
var DOMWindows = Services.wm.getEnumerator('navigator:browser');
while (DOMWindows.hasMoreElements()) {
var aDOMWindow = DOMWindows.getNext();
var myWidget = aDOMWindow.document.getElementById('widget:jid1-njALX8gXKY872g#jetpack-patchouliStatus');
if (myWidget) {
Services.appShell.hiddenDOMWindow.console.info('myWidget:', myWidget);
myWidget.setAttribute('label', str);
myWidget.setAttribute('tooltiptext', 'tooltip changed');
} else {
Services.appShell.hiddenDOMWindow.console.info('myWidget null:', myWidget);
}
}
}
It also seems that the id of your widget starts with tyour addon id name.
Now I gave you the enumerator function because that goes over all windows and you can add event listener. But really if you just want to target the one that was clicked just get the most recent window, as that will obviously hold the correct window with your widget as we just clicked there and the event listener fires on click.
Change changeLabel to this:
function changeLabel(str){
var aDOMWindow = Services.wm.getMostRecentWindow('navigator:browser');
var myWidget = aDOMWindow.document.getElementById('widget:jid1-njALX8gXKY872g#jetpack-patchouliStatus');
if (myWidget) {
Services.appShell.hiddenDOMWindow.console.info('myWidget:', myWidget);
myWidget.setAttribute('label', str);
myWidget.setAttribute('tooltiptext', 'tooltip changed');
} else {
Services.appShell.hiddenDOMWindow.console.info('myWidget null:', myWidget);
}
}
Also that Services.appShell.hiddenDOMWindow.console.info is just something nice to debug, I left it in there so you can see how it works. It logs to "Browser Console" (Ctrl+Shift+J).
As a final note I used a non-sdk solution by requiring chrome. they advise you not to do that because they want you to use the SDK functions I don't know about SDK but you can use the getEnumerator and recentWindow function by requiring window/utils it looks like:
Read window/utils article here
I'll give you non-sdk solution here but someone will have to help convert it to sdk solution. You can paste this in your code it will work though.
Im not sure how the element is inserted into the dom but I guessed.
var {Cu, Ci} = require('chrome'); //if you want to paste this into scratchpad with with Environemnt set to Browser than dont need this line, this line is for sdk
var DOMWindows = Services.wm.getWindowEnumerator(null);
while (DOMWindows.hasMoreElements()) {
var aDOMWindow = aXULWindow.QueryInterface(Ci.nsIInterfaceRequestor).getInterface(Ci.nsIDOMWindowInternal || Ci.nsIDOMWindow);
var myWidget = aDOMWindow.querySelector('#patchouliStatus'); //im not exactly sure how the element is inserted in the dom but im guessing here
if (myWidget) {
myWidget.label = 'rawr';
}
}
I try implement Kendo UI PanelBar (see http://demos.kendoui.com/web/panelbar/images.html) If I open some items (Golf, Swimming) and next click to "Videos Records", I have expanded items. But when I do refresh page (click on some link), all expanded structure is lost.
On KendoUI forum I found, that I can get only possition of selected item and after reload page I must calculate all noded. Is there any way, how can I have expanded items in my situation? If do not need, I don't want to use the html frames.
Best regards,
Peter
Thank you for your answer, was very usefull. I add here code of skeleton of jQuery which remember 1 selected item now. Required add jquery.cookie.js [https://github.com/carhartl/jquery-cookie]
function onSelect(e) {
var item = $(e.item),
index = item.parentsUntil(".k-panelbar", ".k-item").map(function () {
return $(this).index();
}).get().reverse();
index.push(item.index());
$.cookie("KendoUiPanelBarSelectedIndex", index);
//alert(index);
}
var panel = $("#panelbar").kendoPanelBar({
select: onSelect
}).data("kendoPanelBar");
//$("button").click(function () {
// select([0, 2]);
//});
function select(position) {
var ul = panel.element;
for (var i = 0; i < position.length; i++) {
var item = ul.children().eq(position[i]);
if (i != position.length - 1) {
ul = item.children("ul");
if (!ul[0])
ul = item.children().children("ul");
panel.expand(item, false);
} else {
panel.select(item);
}
}
}
// on page ready select value from cookies
$(document).ready(function () {
if ($.cookie("KendoUiPanelBarSelectedIndex") != null) {
//alert($.cookie("KendoUiPanelBarSelectedIndex"));
var numbersArray = $.cookie("KendoUiPanelBarSelectedIndex").split(',');
select(numbersArray);
}
else {
// TEST INIT MESSAGE, ON REAL USE DELETE
alert("DocumenReadyFunction: KendoUiPanelBarSelectedIndex IS NULL");
}
});
The opening of the panels happens on the client. When the page is refreshed, the browser will render the provided markup, which does not include any additional markup for the selected panel.
In order to accomplish this, you will need to somehow store a value indicating the opened panel. The easiest way to accomplish this would be with a cookie (either set by JavaScript or do an AJAX call to the server).
Then, when the panelBar is being rendered, it will use the value in the cookie to set the correct tab as the selected one.
You can use this block to work withe the selected. in this example, i am just expanding the panel item. You can do other things such as saving panel item in your dom for later use or may be saving it somewhere to use it later:
var panelBar = $("#importCvPanelbar").data("kendoPanelBar");
panelBar.bind("select", function(e) {
var itemId = $(e.item)[0].id;
panelBar.expand(itemId);// will expand the selected one
});
I am using HP webOS 3.0 and the Enyo framework.
I have simple question that how can I show and hide images on click of a button. I have 2 images and I want to show images on click of one button and hide on click of another button.
I have two panes called left pane and right pane on a single view.
I have around 10 items on left pane.
On each of the item click appropriate view is called on right pane.
I am doing it with following code.
showTaskView: function(){
this.$.rightPane.selectViewByName("taskView");
},
Now I want to know how can access the control's property in the main view containing both left pane and right pane.
For example,
I want to show / hide image in the taskView displayed on the right pane on click of the button that is neither in the left pane or right pane but on the header part of the view that contains both left and right pane.
It is not allowing me to access the control's image.setSrc method from the main view.
I have tried it with the following code.
editTask: function() {
this.$.task.image.setSrc("images/image2.jpg");
}
and
editTask: function() {
this.$.image.setSrc("images/image2.jpg");
}
It gives me the following error:
Cannot read property 'setSrc' of undefined
With VirtualList, your hash will only reference the currently "selected" row. "selected" being either the row receiving an event or one explicitly selected using prepareRow(). If you want to change every row, you should set a property and call refresh() on the list to cause it to rerender.
The below should work (I think ...)
setupRow: function(inSender, inIndex) {
var row = this.data[inIndex];
if (row) {
this.$.caption1.setContent("Greet a " + row.task + ":");
this.$.star.setSrc("images/grey-star.png");
if(this.hideStart) this.$.star.hide();
this.$.caption2.setContent(row.assignto);
return true;
}
},
buttonClick: function(){
this.hideStar = true;
this.$.myVirtualList.refresh();
}
I'm doing some Mac development in a WebView. I want to expand URLs that have been shortened by a url shortener, and display that expanded URL to the user. So, given a link whose src attribute is set to http://is.gd/xizMsr, when the user hovers over the link I want the title tooltip to display http://google.com
My link tag looks like this:
Here's a shortened link to google
And here's the relevant javascript, which will use XMLHttpRequest to fetch the expanded URL and then update the title
var myRequest;
var mousedOverElement;
var isLoading = false;
function myFunction(anObject) {
if (isLoading == false) {
isLoading = true;
mousedOverElement = anObject;
var link = anObject.getAttribute('href');
var encodedURL = encodeURI(link);
var url = 'http://is.gd/forward.php?format=simple&shorturl=' + encodedURL;
myRequest = new XMLHttpRequest();
myRequest.open("GET", url);
myRequest.onreadystatechange = onStateChange;
myRequest.send();
}
}
function onStateChange() {
if (myRequest.readyState==4) {
if (myRequest.status==200) {
mousedOverElement.setAttribute('title',myRequest.responseText);
}
isLoading = false;
}
}
The problem is, when I hover over the link, and then stop moving the cursor, the title attribute is set properly, but the tooltip is not shown. I have to move the mouse again to make the tooltip show up. I don't necessarily have to move the cursor off of the link and then back over it, but simply moving a few pixels while remaining hovered over the link will do the trick.
I know that the title is being set properly from a combination of using the Web Inspector and the Javascript debugger in Safari. In fact, pretty much as soon as I hover over the link, I see the Web Inspector's view of the DOM in the "elements" tab update with the new title. But, if I take my hand off of the mouse, the tooltip never shows.
My assumption here is that WebKit only shows a tooltip when the user is moving the mouse. Is there a way to sort of "wake up" webkit, even if the cursor is not moving? Or am I better off implementing this with some of my own DHTML-ish magic instead of relying on the title attribute?
What about an element (move it over the anchor) or a wrapper (positive z-index) with a transparent background which will (onmouseover):
first add the anchor's title (you will have to modify your function)
and then change its (negative for the covering element) z-index (effectively putting the anchor in the foreground)
This way the title will be readily available. If necessary you can add a setTimeout() between step 1 and 2.
Or you could simply use setAttributeNode to modify the title attribute value.
You said
"The problem is, when I hover over the
link, and then stop moving the cursor,
the title attribute is set properly,
but the tooltip is not shown."
Its likely that because the title did not exist when you started the mouse hover, it could not display any tooltip (there was nothing to display). So no tooltip will appear. When you move the mouse again, this time it does have a title attribute, so it can display a tooltip. Theres not much you can do about that, its just how the browser works.
Instead your could try using a jQuery tooltip: http://www.reynoldsftw.com/2009/03/10-excellent-tooltip-plugins-with-jquery/
With jQuery you should be able control it so that a tooltip appears as soon as the title is set.