Working with editing tools and directives

Example how to work with tools and directives about layer editing

Source code:
		  <link rel="stylesheet" href="js/example_editing.css">
  <div>        
    <!--  Sezione mappa -->
    <section style="overflow: hidden; border: 1px;">
      <div>
        <!-- Sezione TOC-->
        <div ng-controller="toccontroller" style="float:left; border: 1px; width: 20%; height: 500px; padding: 10px; border-radius: 5px; margin: auto; border: 1px solid gray;">
          <toc-directive mapid="mappa1" template='js/template/toc.html'></toc-directive>
        </div>

        <!--  Sezione MAPPA -->
        <div ng-controller="maphistorycontroller" style="float:left; border: 1px; width: 80%;" >
          <map-directive  id="mappa1" center="activeCenter" width="100%" height='500' template='js/template/map.html'>
            <osm-layer-directive 
              order=0 
              classname="layerosm" 
              name="OSM"  
              opacity="0.5"
            ></osm-layer-directive>
            <geojson-layer-directive 
              order=1 
              name="geoJson" 
              classname="layergeojson"  
              opacity="0.7" 
              visible="true"  
              url="js/data/json/countries.json" 
              styles="js/style/geoJsonStyle.json"
            ></geojson-layer-directive>
            <wkt-layer-directive 
              order=3 
              name="Wkt" 
              classname="layerwkt"  
              url="js/data/wkt/wktData" 
              projection="EPSG:3857" 
              styles='js/style/gpxStyle.json'
            ></wkt-layer-directive>
            <gpx-layer-directive
              order=2
              name="gpxlayer" 
              classname="layergpx"  
              url="js/data/gpx/rome.gpx" 
              styles='js/style/gpxStyle.json'
            ></gpx-layer-directive>
            <kml-layer-directive 
              order=4 
              name="Kml" 
              url="js/data/kml/earthquakes.kml" 
              styles="js/style/gpxStyle.json"
            ></kml-layer-directive>
          </map-directive>          
        </div>
      </div>
    </section>

    <!--  Sezione STRUMENTI -->
    <section style="overflow: hidden; border: 1px;">
      <div style="overflow: hidden; padding: 10px;">
        <!--  Sezione EDITING -->
        <div ng-controller="editingcontroller" style="float:left; width: 100%; height: 100px; background-color:#e8e8e8; border-radius: 5px; margin: auto; border: 1px solid gray;">
		  <toolbar-directive mapid='mappa1' target="editingtoolbar" template="js/template/toolbar_editing.html">
		    <insert-feature-directive label="Punto" geometrytype="Point" classname="fire_button_editing"></insert-feature-directive>
		    <insert-feature-directive layername="geoJson" label="Linea" geometrytype="LineString" classname="fire_button_editing"></insert-feature-directive>
		    <insert-feature-directive layername="geoJson" label="Poligono" geometrytype="Polygon" classname="fire_button_editing"></insert-feature-directive>
		    <insert-feature-directive label="Cerchio" geometrytype="Circle" classname="fire_button_editing"></insert-feature-directive>
		    <modify-feature-directive layername="geoJson" label="Modifica" classname="fire_button_editing"></modify-feature-directive>
		    <select-feature-directive layername="geoJson" label="Seleziona" exclusive=true classname="fire_button_editing"></select-feature-directive>
		    <delete-feature-directive layername="geoJson" label="Elimina" classname="fire_button_editing"></delete-feature-directive>
		    <merge-features-directive layername="geoJson" label="Unisci" classname="fire_button_editing"></merge-features-directive>
		    <unselect-feature-directive-example layername="geoJson" label="Deseleziona" classname="fire_button_editing"></unselect-feature-directive-example>
		  </toolbar-directive>
        </div>
      </div>
    </section>
  </div>


var onload = function(){
};

var options = {
     modules : [fire.Modules.WIDGET]
    ,otherScripts : []
    ,mode : fire.Mode.BUILD
    ,relative: "../lib/fire/"
};
fire.require(onload, options);