Im using "mavon-editor" from "https://github.com/hinesboy/mavonEditor/blob/HEAD/README-EN.md" and this is my config object:
{
bold: true,
italic: true,
header: true,
underline: true,
strikethrough: true,
mark: true,
superscript: false,
subscript: false,
quote: true,
ol: true,
ul: true,
link: true,
imagelink: true,
code: true,
table: true,
fullscreen: true,
readmodel: true,
htmlcode: false,
help: true,
undo: true,
redo: true,
trash: true,
save: false,
navigation: false,
alignleft: true,
aligncenter: true,
alignright: true,
preview: false,
defaultOpen: 'edit',
subfield: false,
toolbarsFlag: false,
}
Because my "subfield" is false then I can't collapse the preview panel but its always open. There is a reference to the "defaultOpen" but no matter what I do the panel is always in view when I'd like to have it hidden and not have the ability to open the preview panel. Does anyone have any ideas on what I'm doing wrong?
Related
I have to hide my tippy when an element inside it has been clicked (element is i.e. small images acting as links) but I have not been able to find any usefull scripts that works with my tippy.
I have i.e. tried these without luck:
How to show tooltip on mouseenter and hide on click with Tippy.js
https://github.com/atomiks/tippyjs/issues/437
Can anyone help? :-)
Here is my TippyJS :
tippy('#ReactionBar' + val, {
a11y: true,
role: 'tooltip',
allowHTML: true,
animation: 'perspective-extreme',
appendTo: () => document.body,
arrow: true,
arrowType: 'sharp',
boundary: 'HTMLElement',
content: ReactionBarContent.get(0).outerHTML,
delay: 0,
offset: [0, 5],
duration: [325, 275],
hideOnClick: true,
ignoreAttributes: false,
inertia: false,
interactive: true,
interactiveBorder: 2,
interactiveDebounce: 0,
placement: 'top-end',
popperOptions: {},
showOnCreate: false,
size: 'regular',
target: '',
theme: 'light',
touch: true,
trigger: 'mouseenter focus',
triggerTarget: null,
moveTransition: 'transform 0.2s ease-out',
});
I was facing the same issue and found using the onShown prop and instance.hide() method worked. I found the hideOnClick prop wasn't needed for this.
this.tippy = tippy(this.element, {
// your other props
interactive: true,
trigger: 'click',
triggerTarget: this.triggerTarget,
onShown(instance) {
document.querySelector('[data-tippy-root]').addEventListener('click', event => {
instance.hide();
})
}
})
I have material icons installed and it was working perfectly showing JS icon, but recently VS code is loading the react icon for JS files for some reason and I can't figure out why.
Settings.json:
{
"workbench.startupEditor": "newUntitledFile",
"workbench.iconTheme": "material-icon-theme",
"workbench.preferredLightColorTheme": "Monokai++",
"window.menuBarVisibility": "toggle",
"editor.minimap.enabled": false,
"javascript.updateImportsOnFileMove.enabled": "always",
"[dart]": {
"editor.formatOnSave": true,
"editor.formatOnType": true,
"editor.rulers": [
80
],
"editor.selectionHighlight": false,
"editor.suggest.snippetsPreventQuickSuggestions": false,
"editor.suggestSelection": "first",
"editor.tabCompletion": "onlySnippets",
"editor.wordBasedSuggestions": false
},
"dart.previewLsp": true,
"dart.debugExternalLibraries": true,
"dart.debugSdkLibraries": false,
"[javascriptreact]": {
"editor.defaultFormatter": "vscode.typescript-language-features"
},
"liveServer.settings.donotShowInfoMsg": true,
"editor.formatOnSave": true,
"[html]": {
"editor.defaultFormatter": "esbenp.prettier-vscode"
},
"[css]": {
"editor.defaultFormatter": "esbenp.prettier-vscode"
},
"workbench.colorTheme": "Monokai++",
"editor.fontWeight": "normal",
"material-icon-theme.activeIconPack": "none",
"material-icon-theme.folders.associations": {
},
"material-icon-theme.files.associations": {
}
}
Try adding the following setting to your config:
"material-icon-theme.files.associations": {
"**.js": "javascript",
}
With this setting you set the icon for every .js file to the javascript icon
I have collapse navbar but when i hide the navbar the sticky column duplicated or overlapping two last column. Please refer screenshot. Answer is appreciated thanks.
enter image description here
defaultSetting: {
autoWidth: false,
fixedHeader: true,
searchDelay: 500,
processing: true,
serverSide: true,
scrollX: true,
scrollCollapse: false,
scrollResize: true,
responsive: true,
fixedColumns: {
leftColumns: 1,
rightColumns: 1,
}
}
I have smartclient ListGrid with some columns. ListGrid has some text fields with edit mode (double click to enter) and boolean fields.
All I need to do is disable editMode for boolean fields (disable double click) and still enable normal 'one-click' to change boolean value.
Double click should work for other columns.
Any ideas?
My code:
isc.ListGrid.create({
ID: "ColumnsList",
saveLocally: true,
filterLocalData: true,
alternateRecordStyles: true,
canReorderRecords: true,
selectionAppearance: 'rowStyle',
autoFetchData: false,
showRollOver: true,
canRemoveRecords: true,
deferRemoval: false,
initWidget: function () {
this.Super('initWidget', arguments);
var me = this;
var fields = [
{name: 'id', primaryKey: true, required: true, showIf: 'false', canEdit: false, canHide: false},
{
name: 'name',
validOperators: [],
canEdit: true,
canHover: false,
canSort: false,
title: 'DB Column Name'
},
{
name: 'primaryKey',
validOperators: [],
width: '12%',
canEdit: true,
canHover: true,
canSort: false,
//canToggle: true,
title: 'Primary Key',
type: 'boolean',
changed: function (form, item, value) {
// my logic to allow only one value per column is selected
}
}
];
me.setFields(fields);
}
}
You may add recordDoubleClick:"return false" on the boolean field, to prevent the grid-level handler from firing.
isc.ListGrid.create({
ID: "countryList",
width:550, height:224, alternateRecordStyles:true,
// use server-side dataSource so edits are retained across page transitions
dataSource: countryDS,
// display a subset of fields from the datasource
fields:[
{name:"countryCode", title:"Flag", width:40, type:"image", imageURLPrefix:"flags/16/", imageURLSuffix:".png", canEdit:false},
{name:"countryName"},
{name:"continent"},
{name:"member_g8", recordDoubleClick:"return false"},
{name:"population"},
{name:"independence"}
],
autoFetchData: true,
canEdit: true
})
Alternatively if you want to disable double click on all boolean fields you could use the following:
isc.ListGrid.create({
rowDoubleClick: function (record, recordNum, fieldNum) {
if (this.getField(fieldNum).type != "boolean") {
this.Super("rowDoubleClick", arguments);
}
},
fields: [
{ name: "isActive", type: "boolean", canEdit: false },
{ name: "firstName", type: "text", canEdit: true },
{ name: "lastName", type: "text", canEdit: true },
],
data: [
{ isActive: false, firstName: "Alex", lastName: "Smith" },
{ isActive: true, firstName: "Jane", lastName: "Monroe" },
]
});
I'm not 100% I understood the question, but if you're looking for a way to allow/disallow the changing of boolean fields take a look at ListGridField.canToggle
How to change the default zoom level in sencha touch 2?
Presently I am using code like this
var gmaps={
xtype : 'panel',
height : Math.ceil(Ext.Element.getDocumentHeight()*.25),
width : Math.ceil(Ext.Element.getDocumentWidth()*.96),
layout:'card',
items:[{
xtype: 'map',
useCurrentLocation: true,geo: geo, //Ext.util.Geolocation object
useCurrentLocation: geo, //same var geo with geolocation object
config: {
mapOptions:{
zoom: 25,
disableDefaultUI: true,
//--Available Map Options--//
panControl: false,
zoomControl: false,
mapTypeControl: false,
scaleControl: false,
streetViewControl: false,
overviewMapControl: false
},
But even if I change value for zoom, it does not change
That is because you put you mapOptions object in a config object.
Just remove the config object and you should be all set :
xtype: 'map',
useCurrentLocation: true,geo: geo, //Ext.util.Geolocation object
useCurrentLocation: geo, //same var geo with geolocation object
mapOptions:{
zoom: 25,
disableDefaultUI: true,
//--Available Map Options--//
panControl: false,
zoomControl: false,
mapTypeControl: false,
scaleControl: false,
streetViewControl: false,
overviewMapControl: false
},
Hope this helped