Documentation

Default Js

defaultjs.blade.php

deprecated

file ini berfungsi untuk menampilkan file-file javascript yang ada di tema yang kamu buat. Untuk mempermudah pemanggilan file js, kamu bisa menggunakan helper generate_theme_js()

Contoh file defaultjs.blade.php

{{generate_theme_js("namatema/assets/js/jquery.js")}}
{{generate_theme_js("namatema/assets/js/jquery.nivo.slider.pack.js")}}
{{generate_theme_js("namatema/assets/js/jquery.jcarousel.min.js")}}
{{generate_theme_js("namatema/assets/js/tabs.js")}}

js baru menggunakan require.js untuk js management

Cukup menambahkan code seperti di bawah ini di file defaultjs.blade.php

<script data-main="{{ url(dirTemaToko().'namatema/assets/js/app-main') }}" src="/js/require.js"></script>

Adapun struktur dari folder asset kamu adalah seperti berikut:

- assets
  - css
  - js
    - app-main.js
    - lib
    - pages
  - images

Contoh dari app-main.js yang bisa kamu gunakan adalah:

var dirTema = document.querySelector("meta[name='theme_path']").getAttribute('content');

require.config({
    baseUrl: '/',
    waitSeconds : 20,
    urlArgs: "v=001",
    shim: {
        "bootstrap": {
            deps: ['jquery']
        },
        "cart" : {
            deps : ['jquery'],
        },
        'flexslider' : {
            deps : ['jquery']
        },
        'jq_ui' : {
            deps : ['jquery']
        },
        'mobilegmap' : {
            deps : ['jquery','googlemap']
        },
        "noty"  : {
            deps : ['jquery']
        },
        "noty_util" : {
            deps : ['jquery','noty']
        }
    },

    paths: {
        // LIBRARY
        bootstrap       : '//maxcdn.bootstrapcdn.com/bootstrap/2.2.1/js/bootstrap.min',
        cart            : 'js/shop_cart',
        flexslider      : dirTema+'/assets/js/lib/jquery.flexslider',
        jq_ui           : 'js/jquery-ui',
        jquery          : '//ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min',
        jquery_sharrre  : dirTema+'/assets/js/lib/jquery.sharrre',
        mobilegmap      : dirTema+'/assets/js/lib/jquery.mobilegmap',
        googlemap       : 'http://maps.googleapis.com/maps/api/js?sensor=false',
        noty            : 'js/jquery.noty',
        noty_util       : 'js/utils/noty',
        select_nav      : dirTema+'/assets/js/lib/selectNav',

        // ROUTE
        router          : 'js/router',

        // CONTROLLER
        blog            : dirTema+'/assets/js/pages/blog',
        home            : dirTema+'/assets/js/pages/home',
        kontak          : dirTema+'/assets/js/pages/kontak',
        member          : dirTema+'/assets/js/pages/member',
        main            : dirTema+'/assets/js/pages/default',
        produk          : dirTema+'/assets/js/pages/produk',
    }
});
require([
    'router',
    'bootstrap',
    'main',
    'cart',
], function(router,b,main,cart)
{
    // HOME
    router.define('/', 'home@run');
    router.define('home', 'home@run');

    // KONTAK
    router.define('kontak', 'kontak@run');

    // MEMBER
    router.define('member/*', 'member@run');

    // PRODUK
    router.define('produk/*', 'produk@run');

    // BLOG
    router.define('blog/*', 'blog@run');

    router.run();
    main.run();
    cart.run();
});