• 设为首页
  • 点击收藏
  • 手机版
    手机扫一扫访问
    迪恩网络手机版
  • 关注官方公众号
    微信扫一扫关注
    公众号

TypeScript alloy.Disabling类代码示例

原作者: [db:作者] 来自: [db:来源] 收藏 邀请

本文整理汇总了TypeScript中@ephox/alloy.Disabling的典型用法代码示例。如果您正苦于以下问题:TypeScript Disabling类的具体用法?TypeScript Disabling怎么用?TypeScript Disabling使用的例子?那么恭喜您, 这里精选的类代码示例或许可以为您提供帮助。



在下文中一共展示了Disabling类的7个代码示例,这些例子默认根据受欢迎程度排序。您可以为喜欢或者感觉有用的代码点赞,您的评价将有助于我们的系统推荐出更棒的TypeScript代码示例。

示例1: function

 const navigationButton = function (direction, directionName, enabled) {
   return Button.sketch({
     dom: UiDomFactory.dom('<span class="${prefix}-icon-' + directionName + ' ${prefix}-icon"></span>'),
     action (button) {
       AlloyTriggers.emitWith(button, navigateEvent, { direction });
     },
     buttonBehaviours: Behaviour.derive([
       Disabling.config({
         disableClass: Styles.resolve('toolbar-navigation-disabled'),
         disabled: !enabled
       })
     ])
   });
 };
开发者ID:aha-app,项目名称:tinymce-word-paste-filter,代码行数:14,代码来源:SerialisedDialog.ts


示例2: function


//.........这里部分代码省略.........
      Tabstopping.config({})
    ])
  });

  const formGroup = (components) => {
    return {
      dom: {
        tag: 'div',
        classes: [ 'tox-form__group' ]
      },
      components
    };
  };

  const getFieldPart = (isField1) => AlloyFormField.parts().field({
    factory: AlloyInput,
    inputClasses: ['tox-textfield'],
    inputBehaviours: Behaviour.derive([
      Tabstopping.config({}),
      AddEventsBehaviour.config('size-input-events', [
        AlloyEvents.run(NativeEvents.focusin(), function (component, simulatedEvent) {
          AlloyTriggers.emitWith(component, ratioEvent, { isField1 });
        }),
        AlloyEvents.run(NativeEvents.change(), function (component, simulatedEvent) {
          AlloyTriggers.emitWith(component, formChangeEvent, { name: spec.name });
        })
      ])
    ]),
    selectOnFocus: false
  });

  const getLabel = (label: string) => {
    return {
      dom: {
        tag: 'label',
        classes: ['tox-label'],
        innerHtml: providersBackstage.translate(label)
      }
    };
  };

  const widthField = AlloyFormCoupledInputs.parts().field1(
    formGroup([ AlloyFormField.parts().label(getLabel('Width')), getFieldPart(true) ])
  );

  const heightField = AlloyFormCoupledInputs.parts().field2(
    formGroup([ AlloyFormField.parts().label(getLabel('Height')), getFieldPart(false) ])
  );

  return AlloyFormCoupledInputs.sketch({
    dom: {
      tag: 'div',
      classes: ['tox-form__group']
    },
    components: [
      {
        dom: {
          tag: 'div',
          classes: ['tox-form__controls-h-stack']
        },
        components: [
          // NOTE: Form coupled inputs to the FormField.sketch themselves.
          widthField,
          heightField,
          formGroup([
            getLabel('&nbsp;'),
            pLock
          ])
        ]
      }
    ],
    field1Name: 'width',
    field2Name: 'height',
    locked: true,

    markers: {
      lockClass: 'tox-locked'
    },
    onLockedChange(current: AlloyComponent, other: AlloyComponent, lock: AlloyComponent) {
      parseSize(Representing.getValue(current)).each((size) => {
        converter(size).each((newSize) => {
          Representing.setValue(other, formatSize(newSize));
        });
      });
    },
    coupledFieldBehaviours: Behaviour.derive([
      Disabling.config({ }),
      AddEventsBehaviour.config('size-input-events2', [
        AlloyEvents.run<RatioEvent>(ratioEvent, function (component, simulatedEvent) {
          const isField1 = simulatedEvent.event().isField1();
          const optCurrent = isField1 ? AlloyFormCoupledInputs.getField1(component) : AlloyFormCoupledInputs.getField2(component);
          const optOther = isField1 ? AlloyFormCoupledInputs.getField2(component) : AlloyFormCoupledInputs.getField1(component);
          const value1 = optCurrent.map<string>(Representing.getValue).getOr('');
          const value2 = optOther.map<string>(Representing.getValue).getOr('');
          converter = makeRatioConverter(value1, value2);
        })
      ])
    ])
  });
};
开发者ID:tinymce,项目名称:tinymce,代码行数:101,代码来源:SizeInput.ts


示例3:

 setDisabled: (state: boolean) => Disabling.set(component, state)
开发者ID:tinymce,项目名称:tinymce,代码行数:1,代码来源:ChoiceItem.ts


示例4: sequence

 const renderField = (s) => {
   return {
     uid: s.uid,
     dom: {
       tag: 'div',
       classes: [ 'tox-dropzone-container' ]
     },
     behaviours: Behaviour.derive([
       RepresentingConfigs.memory([ ]),
       ComposingConfigs.self(),
       Disabling.config({}),
       Toggling.config({
         toggleClass: 'dragenter',
         toggleOnExecute: false
       }),
       AddEventsBehaviour.config('dropzone-events', [
         AlloyEvents.run('dragenter', sequence([ stopper, Toggling.toggle ])),
         AlloyEvents.run('dragleave', sequence([ stopper, Toggling.toggle ])),
         AlloyEvents.run('dragover', stopper),
         AlloyEvents.run('drop', sequence([ stopper, onDrop ])),
         AlloyEvents.run(NativeEvents.change(), onSelect)
       ]),
     ]),
     components: [
       {
         dom: {
           tag: 'div',
           classes: [ 'tox-dropzone' ],
           styles: {}
         },
         components: [
           {
             dom: {
               tag: 'p',
               innerHtml: providersBackstage.translate('Drop an image here')
             }
           },
           Button.sketch({
             dom: {
               tag: 'button',
               innerHtml: providersBackstage.translate('Browse for an image'),
               styles: {
                 position: 'relative'
               },
               classes: [ 'tox-button', 'tox-button--secondary']
             },
             components: [
               memInput.asSpec()
             ],
             action: (comp) => {
               const inputComp = memInput.get(comp);
               inputComp.element().dom().click();
             },
             buttonBehaviours: Behaviour.derive([
               Tabstopping.config({ })
             ])
           })
         ]
       }
     ]
   };
 };
开发者ID:tinymce,项目名称:tinymce,代码行数:62,代码来源:Dropzone.ts


示例5: handleFiles

 const onDrop: AlloyEvents.EventRunHandler<SugarEvent> = (comp, se) => {
   if (! Disabling.isDisabled(comp)) {
     const transferEvent = se.event().raw() as DragEvent;
     handleFiles(comp, transferEvent.dataTransfer.files);
   }
 };
开发者ID:tinymce,项目名称:tinymce,代码行数:6,代码来源:Dropzone.ts


示例6:

 isDisabled: () => Disabling.isDisabled(comp),
开发者ID:tinymce,项目名称:tinymce,代码行数:1,代码来源:ToolbarButtons.ts


示例7:

const item = (disabled: boolean) => Disabling.config({
  disabled,
  disableClass: 'tox-collection__item--state-disabled'
});
开发者ID:tinymce,项目名称:tinymce,代码行数:4,代码来源:DisablingConfigs.ts



注:本文中的@ephox/alloy.Disabling类示例由纯净天空整理自Github/MSDocs等源码及文档管理平台,相关代码片段筛选自各路编程大神贡献的开源项目,源码版权归原作者所有,传播和使用请参考对应项目的License;未经允许,请勿转载。


鲜花

握手

雷人

路过

鸡蛋
该文章已有0人参与评论

请发表评论

全部评论

专题导读
上一篇:
TypeScript alloy.DomFactory类代码示例发布时间:2022-05-28
下一篇:
TypeScript alloy.Debugging类代码示例发布时间:2022-05-28
热门推荐
热门话题
阅读排行榜

扫描微信二维码

查看手机版网站

随时了解更新最新资讯

139-2527-9053

在线客服(服务时间 9:00~18:00)

在线QQ客服
地址:深圳市南山区西丽大学城创智工业园
电邮:jeky_zhao#qq.com
移动电话:139-2527-9053

Powered by 互联科技 X3.4© 2001-2213 极客世界.|Sitemap