Drupal - OpenLayers - Alter popup behavior - javascript

I have modified the popup behavior js file: openlayers_behavior_popup.js directly in the module located at openlayers/plugins/behaviors.
It's working fine per my expected but I do not want to put my own modification in the original module, I want to add it attach to my existing module but I don't know how to do this.
I want the site not to take the behavior at openlayers/plugins/behaviors but follow with my popup behavior code from my own module.
Drupal.openlayers.addBehavior('openlayers_behavior_popup', function (data, options) {
// normal
var popupSelect = new OpenLayers.Control.SelectFeature(layers,
{
// my change here!!
},
onUnselect: function(feature) {
// normal
}
}
);
});
How can I alter the behavior code of openlayers?

I have solved my issue on this topic by load the modification javascript file in my custom module as following:
function mycustom_openlayers_init() {
// you might want to load only at some specific page
// if you want so, please have a look to function arg() of drupal
// place condition before loading the js file below
drupal_add_js ( drupal_get_path ( 'module', 'mycustom_openlayers' ) . '/js/openlayers_behavior_popup.js', array(
'weight' => '9999',
) );
}
By specifying the setting of weight bigger, my javascript is loaded after loading the original openlayers popup file and then it overrides the behavior of the original to take mine instead.
I don't know if it is the right thing to do but it works for me.
Please let me know if other people could give me a programmatic solution on that and better than above.

Related

pdftron copy wrong text

I want to use pdftron and all things work perfect but when i copy text from pdf some characters convert to blank square and question mark, any idea?
here is my pdf.
As you can see below:
I wrote this code:
WebViewer({
path: '/assets/plugins/pdftron',
initialDoc: '/practical.pdf',
fullAPI: true,
disableLogs: true
}, document.getElementById('pdf')).then((instance) => {
// PDFNet is only available with full API enabled
const { PDFNet, docViewer } = instance;
let Feature = instance.Feature;
instance.disableFeatures([Feature.NotesPanel]);
docViewer.on('documentLoaded', () => {
// call methods relating to the loaded document
});
instance.textPopup.add({
type: 'actionButton',
img: '/language.svg',
onClick: () => {
const quads = docViewer.getSelectedTextQuads(docViewer.getCurrentPage());
const text = docViewer.getSelectedText();
$("#out-pdf").html(text);
console.log(quads);
},
});
});
Document does seem to cause incorrect extraction. Extraction is not defined by PDF specification so every viewer handles cases little differently. I your case there is a probably a malformed or incomplete font or unicode map included in the document. We've added multiple fixes to our core components and with those fixes extraction happens correctly. Unfortunately current release of WebViewer does not include these fixes yet. We cannot give exact time schedule when fixes will be land to the WebViewer, but should be at least part of our next major release. For now I would try to see if you can recreate the document and see if that helps. Most of the documents we see and test have no problem with extraction.
Could you create ticket through our support https://www.pdftron.com/form/request/ and attach the document that this happens to the ticket, so I can take a closer look on and get issue resolved faster.

Visual Studio Code Custom Extension Line Based Note

I am trying to create an extension for visual studio code, which requires the ability to annotate lines in a file similar to the references shown in the image, linked below.
I want to be able to add an annotation, such as the one shown in the red rectangle, without modifying the source code file. I would like to be able to do so for every line of the source file. I also want to be able to make dynamic modifications to the annotations' contents.
I have searched VSC's documentation as well as elsewhere. I have not found it. Can anyone guide me in the right direction please?
I know the following is incorrect, but I don't know where else to check for how it should be accomplished.
class TestCodeLensProvider implements vscode.CodeLensProvider {
public provideCodeLenses(document: TextDocument, token: CancellationToken):
CodeLens[] | Thenable<CodeLens[]> {
return new Array<CodeLens>();
}
public resolveCodeLens?(codeLens: CodeLens, token: CancellationToken):
CodeLens | Thenable<CodeLens> {
return new CodeLens(new vscode.Range(new vscode.Position(1, 1), new vscode.Position(1, 2)),/*I also don't know how to specify my command here*/ );
}
}
export function activate(ctx: vscode.ExtensionContext): void {
ctx.subscriptions.push(
vscode.languages.registerCodeLensProvider(
'json', new TestCodeLensProvider()));
The feature in your screenshot is called "Code Lens". More specifcally, you're looking for the registerCodeLensProvider() function of the languages namespace. Or if you're writing a Language Server instead of using the VSCode API directly, the textDocument/codeLens request method.

Custom Unobtrusive Validation Method Not Firing as Per Documentation

I've been attempting to implement a ASP.NET MVC custom validation method. Tutorials I've used such as codeproject explain that you add data-val-customname to the element. Then jQuery.validate.unobtrusive.js then uses the third segment of the attribute
data-val-<customname>
as the name of the rule, as shown below.
$.validator.addMethod('customname', function(value, element, param) {
//... return true or false
});
However I just can't get the customname method to fire. By playing around I have been able to get the below code to work, but according to all the sources I've read Unobtrusive validation should not work like this.
$.validator.addMethod('data-val-customname', function(value, element, param) {
//... return true or false
});
I've posted an example of both methods
jsfiddle example
Any help would be much appreciated
I've updated my question hopefully to make clearer.
I have finally found got there in the end, but still feels like too much hard work and therefore I've probably got something wrong. Initial I was scuppered by a bug in Chrome Canary 62 which refused to allow the adding of a custom method.
My next issue was having to load jQuery, jQuery.validate and jQuery.validate.unobtrusive in the markup and then isolate javascript implementation in a ES6 class. I didn't want to add my adaptors before $().ready() because of my class structure and loading of the app file independent of jQuery. So I had to force $.validator.unobtrusive.parse(document);.
Despite this I was still having issues and finally debugged the source code and found that an existing validator information that is attached to the form was not merging with the updated parsed rules, and essentially ignoring any new adaptors added.
My final work around and admit feels like I've done too much, was to destroy the initial validation information before my forced re-parse.
Here is the working jsfiddle demo
Here is some simplified code
onJQueryReady() {
let formValidator = $.data(document.querySelector('form'), "validator" );
formValidator.destroy();
$.validator.unobtrusive.adapters.add("telephone", [], function (options) {
options.rules['telephone'] = {};
options.messages['telephone'] = options.message;
});
$.validator.unobtrusive.parse(document);
$.validator.addMethod("telephone", this.handleValidateTelephoneNumber);
}

How to deal with DOM elements?

I am learning about writing custom JavaScript for my Odoo 10 addons.
I've written the following piece of code:
odoo.define('ioio.io', function(require) {
'use strict'
const e = $('div.o_sub_menu_footer')
console.log('--testing--'.repeat(7))
console.log(e)
// the "Powered by Odoo" down the secondary menu
e.remove()
})
The code is well loaded and I can see my testing string in the console.
However when this code is being loaded before the target div, so e empty/not yet filled and thus its content is not removed.
Doing it manually from the console works.
My question is what is the right way to do that? And how to know exactly when the code gets executed?
You can
put your html code before the script tag in your file
use jQuery $(document).ready(...);
Place your script at the bottom of the <body> tag to make sure the DOM renders before trying to manipulate it.
This is an Odoo specific question, so you should use the Odoo standard way, which is via its base JS class. That class contains a ready() method which does exactly what you need.
In your case, to use that function, you need to require the class first. Then you can use ready().
Updating your code, it should look like this:
odoo.define('ioio.io', function(require) {
'use strict'
// require base class
var base = require('web_editor.base');
//use its ready method
base.ready().done(function () {
// put all the code you want to get loaded
// once the DOM is loaded within this block
const e = $('div.o_sub_menu_footer')
console.log('--testing--'.repeat(7))
console.log(e)
// the "Powered by Odoo" down the secondary menu
e.remove()
});
})
While your accepted answer leads to the same outcome, you might want to update it to this one since this is the Odoo way. It's generally advised to work within the Odoo framework as much as possible and customise only if really needed. (Though it can be tough to learn what features Odoo already provides because of its poor documentation.)

Rafael: Mapael: Update trigger doesn't work, and no errors are given

Based on this minimal example of Mapael (part of the relevant code is down here):
$('#refresh').on('click', function() {
// Update some plots and areas attributes ...
var updatedOptions = {'areas' : {}, 'plots' : {}};
// add some new plots ...
var newPlots = {
"Dijon" : {
latitude : 47.323056,
longitude : 5.041944
}
}
$(".mapcontainer").trigger('update', [updatedOptions, newPlots, [], {animDuration : 1000}]);
});
I created this example page with an update trigger that works fine. Now I want to move this to my real application php page, and it doesn't work! Please take a look here.
The annoying part is that the console of my Browser doesn't show any errors! How can I debug this problem when I don't see any errors? Please assist!
If you require any additional information, please ask. Thanks for any efforts.
PS: Please ignore the bad styling that the script and css code is in body. I'll fix this once this issue is resolved. I don't think it's the issue, since the example page that works is exactly the same and doesn't have this problem.
First, take a note that you're using different versions of Maphael:
on the page where it works, version is 1.1.0,
on your page it is 2.0.0-dev.
Second, after setting a breakpoint at the "onUpdateEvent" method of Maphael (line 876), it just seems that event data just doesn't get passed into the handler.
Does the "update" event have the same signature for Maphael/Raphael 1.x and 2.x? This is the place you should look at.
Update: I took a look at the 2.0.0-dev internals, and it seems your update code should be something like this:
var updatedOptions = {'areas': {}, 'plots' : {},
// add some new plots ...
newPlots: {
"Dijon" : {
latitude : 47.323056,
longitude : 5.041944
}
},
animDuration : 1000
};
$(".mapcontainer").trigger('update', updatedOptions);
(last line may be:
$(".mapcontainer").trigger('update', [updatedOptions]);
)
Please check if it helps (though I'd recomment you to switch to a stable 1.1.0 release of Maphael).

Categories

Resources