GithubHelp home page GithubHelp logo

aceeditor-bundle's Introduction

Ace Editor Bundle

Bundle provides a ace editor integration into Symfony2 Form component. It automatically register aceeditor form type.

Important

Check your composer.json file and if you have "1.0.@dev" dependency of this bundle change it into "0.1.".

   - "norzechowicz/aceeditor-bundle": "1.0.*@dev",
   + "norzechowicz/aceeditor-bundle": "0.1.*",

Do it before calling composer.phar update to be sure that your code will not be broken.

Installation

Add bundle into your composer.json file.

{
    "require": {
        "norzechowicz/aceeditor-bundle": "0.1.*",
    }
}

Register bundle in AppKernel.php

// app/AppKernel.php

public function registerBundles()
{
    return array(
        new Norzechowicz\AceEditorBundle\NorzechowiczAceEditorBundle(),
        // ...
    );
}

Update project dependencies

$ php composer.phar update

Usage

/* @var $builder \Symfony\Component\Form\FormBuilderInterface */

$builder->add('description', 'ace_editor', array(
    'wrapper_attr' => array(), // aceeditor wrapper html attributes.
    'width' => '100%',
    'height' => 250,
    'font_size' => 12,
    'mode' => 'ace/mode/html', // every single default mode must have ace/mode/* prefix
    'theme' => 'ace/theme/monokai', // every single default theme must have ace/theme/* prefix
    'tab_size' => null,
    'read_only' => null,
    'use_soft_tabs' => null,
    'use_wrap_mode' => null,
    'show_print_margin' => null,
    'show_invisibles' => null,
    'highlight_active_line' => null,
    'options_enable_basic_autocompletion' => true,
    'options_enable_live_autocompletion' => true,
    'options_enable_snippets' => false
));

Above code will create textarea element that will be replaced with ace editor instance. Textarea value is updated on every single change in ace editor.

Configuration

This section is optional, you dont need to configure anything and your ace_editor form type will still work perfectly fine

There are also few options that alows you to manipulate including ace editor javascript sdk.

# app/config/config.yml

norzechowicz_ace_editor:
    base_path: "bundles/norzechowiczaceeditor/ace"
    autoinclude: true
    debug: false # sources not minified with uglify.js, based on kernel.debug but it can force it
    noconflict: true # uses ace.require instead of require

You can also include ace editor directly from github, all you need to do is setting base_path option

norzechowicz_ace_editor:
    base_path: "http://rawgithub.com/ajaxorg/ace-builds/master"

Bitdeli Badge

aceeditor-bundle's People

Contributors

alexeykupershtokh avatar azzra avatar bitdeli-chef avatar norberttech avatar romaricdrigon avatar thvd avatar xanido avatar

Watchers

 avatar  avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.