If I define my own API and I want to highlight values, classes and methods of my API in editor. How I can do it? Is it possible to assign some of keyword styles to api tokens?
Here is my instead.lua in api folder of ZBS:
return {
instead = {
type = "lib",
description = "Библиотека INSTEAD",
childs = {
tiny = {
type = "value",
description = "Флаг «минималистичного INSTEAD», без графики и множества других возможностей."
}
}
},
}
And this is some code snippet:
if not instead.tiny then
require "autotheme"
end
So I want instead and tiny to be highlighted in my code.
You can use keyword highlighting, but while it works for "instead" and "tiny", it will also have to be set for "instead.tiny", which is not ideal (this looks like a limitation in the version of the Scintilla editor component used by the IDE); see this ticket for a related discussion and explanation. You may also check a proposed highlight property plugin that does something similar (although for all properties).
Related
I'm building a Vue app where a user reactively generates an HTML page from certain selections. Therefore, there is a very long expression that produces said HTML page. This expression/template is stored in a separate .html file. I would like to have that expression as a computed property in my app, but not sure what's the best way. I want to be able to use either the {{ }} template syntax, or at least the syntax you get inside directives, rather than have to plaster this. in front of every property and method I use, which is what I'd have to do if I move the template to JS-land (e.g. a separate module or just directly define it in the computed property).
Right now I got it working, but it's extremely hacky:
let appSpec = {
/* [snip] */
computed: {
/* other computed properties and… */
html () {
return getAppHTML(this);
}
},
};
let sheetTemplate = await (await fetch("sheet-template.html")).text();
let templateVars = [
...Object.keys(INITIAL_DATA),
...Object.keys(appSpec.computed),
...Object.keys(appSpec.methods)
];
let getAppHTML = new Function(`{${ templateVars.join(", ") }}`, "return `" + sheetTemplate + "`");
/* ... */
I’m thinking there must be a better way to do this.
I don't want to inject the expression directly into the places it's going to be used in my app (e.g. <iframe :srcdoc>), because I want to have a property that corresponds to it (for watchers etc).
Note that I'm using the in-browser API, no build step, and I'd rather keep it that way.
I am trying to make a product that will give me a different header based on the forum I am in, that's no problem and complete. My issue lays with using template conditionals inside of said option.
I am currently using a forum option to insert my custom template additions:
In global_complete hook I am using:
global $vbulletin;
if ($GLOBALS[foruminfo]["forumid"]>0) {
$forum_code = '';
$_fid = $GLOBALS[foruminfo]["forumid"];
$forum_info = $vbulletin->forumcache[$_fid];
if ($forum_info["code"]) {
$forum_code = $forum_info["code"];
} elseif ($forum_info["parentid"]) {
while ($forum_code=='' && $forum_info["parentid"]>0) {
$forum_info = $vbulletin->forumcache[$forum_info["parentid"]];
$forum_code = $forum_info["code"];
}
}
}
Then I place $forum_code into my header temple.
I would like to be able to get the conditionals to work so I can only show things to members or usergroups within the header. Is there a way to get the variable to not ignore the conditions? they are included in the DB entry, just being ignored when rendered to the page.
Sample Conditional:
<if condition="$show['member']">Member<else/>Guest</if>
What is actually being rendered:
MemberGuest
The Problem
I just cannot figure out the view model in NativeScript
I am having a hard time understanding how view-models work in NativeScript. I understand the high level concept - that the MVVM pattern allows us to create observable objects - and our UI is updated when values change.
Here is a simple example:
main-page.js
var createViewModel = require("./main-view-model").createViewModel;
function onNavigatingTo(args) {
var page = args.object;
page.bindingContext = createViewModel();
}
exports.onNavigatingTo = onNavigatingTo;
main-view-model.js
var Observable = require("tns-core-modules/data/observable").Observable;
function getMessage(counter) {
if (counter <= 0) {
return "Hoorraaay! You unlocked the NativeScript clicker achievement!";
} else {
return counter + " taps left";
}
}
function createViewModel() {
var viewModel = new Observable();
viewModel.counter = 42;
viewModel.message = getMessage(viewModel.counter);
viewModel.onTap = function() {
this.counter--;
this.set("message", getMessage(this.counter));
}
return viewModel;
}
exports.createViewModel = createViewModel;
I understand , some what, what is happening. But not everything.
Questions I Have ...
How would you add a new function , for instance, an email validation function? Would it go into the View Model page, or just plain Javscript page?
Let's say I added a new textfield to the UI. I have a tap function. Where does my function go?
So in this case, everything related to the UI should go in the createViewModel function? Is that correct?
I have also seen in sample apps, where the developer doesn't use view models at all - it appears he just creates it as an observable object.
Thank you for looking. I know I am close to understanding, but that bindingContext and the viewmodel has me a bit confused. [ I have read everything in NS docs ]
John
The answer is either of it should work. You may put the validation or tap function in view model or in the code behind file, it's upto you to decide which works best for you.
If you put it in the view model, you will use event binding (tap="{{ functionName }}" Or if you put it in code behind file, you will just export the function name and simply refer the function name on XML (tap="functionName").
By giving this flexibility you are allowed to separate your code, keep the files light weighted.
Hey guys I have the following function its working ok but I think it could be better.
methods: {
onFileChange(e, filedName) {
console.log(e.target.files);
console.log(filedName);
const file = e.target.files[0];
const fileToCheck=document.getElementById(filedName);
console.log(fileToCheck);
if(filedName=='thumbnail1'){
if(fileToCheck.value!=''){
this.thumbnail1 = fileToCheck;
this.thumbnail1Url= URL.createObjectURL(file);
} else {
this.thumbnail1=null;
this.thumbnail1Url=null;
}
}
if(filedName=='thumbnail2'){
if(fileToCheck.value!=''){
console.log(fileToCheck);
this.thumbnail2=fileToCheck;
this.thumbnail2Url = URL.createObjectURL(file);
} else {this.thumbnail2=fileToCheck; this.thumbnail2Url=null;}
}
},
Instead of checking the value for
if(fieldName == "something"){
this.something = URL.createObjectURL(file)
}
I would simply pass in a string of the fieldName and bind to it dynamically by just typing this.fieldName (filedName could equal thumbnail1 or thumbnail2 or chicken for all I care I just want to be able to pass in the name of the data atrribute and bind to it that way) but when ever I do this it doesn't work. Any help here would be great.
It's not completely clear to me what you want to accomplish, but I think you're asking about creating a dynamic data property for a view component. If that's the case, there are a couple of things to consider.
First, the example you cite, this.fieldName is not correct JavaScript syntax if fieldName is a string that contains a property name. The correct version is this[fieldName].
Note, though, that you can't simply define a new data property for a Vue component by setting it to a value. That's a limitation of JavaScript that's described in the Vue documentation. If data[fieldName] is an existing property that's defined in the component's data object, then you'll be okay. Even if you don't know the value of the property, you can initialize it, for example, with a value of null and then update the value in your method. Otherwise, you'll need to add the property to an existing non-root-level property as the documentation explains.
When using lesscon the commandline, I can pass the option --modify-var="my-var=my-val".
How can I pass the same option when I use less programmatically via API with less.render(lessInput, options)?
I would somehow hope that I can set a property in options like {modifyVar:'my-var=my-val'}. But this seems not to work and I didn't find any documentation regarding this use case.
Thanks for any help.
Unfortunately the options are not described at the API documentation. The easiest way to understanding them, will be by studying the the source of https://github.com/less/less.js/blob/master/bin/lessc.
Both the options and modifyVars option should be an object. For the modifyVars option each variable should be a key of the object. Keys may but don't have to start with a #.
Example:
var less = require('less/lib/less-node');
var options = {};
options['modifyVars'] = {'color1' : 'blue', '#color2': 'darkblue'};
less.render('#color1: red; #color2:yellow; t {color1: #color1; color2: #color2;}', options)
.then(function(output) {
// output.css = string of css
// output.map = undefined
console.log(output.css);
});
The above should output as follows:
t {
color1: blue;
color2: darkblue;
}