Last active
December 18, 2015 01:08
-
-
Save tworzenieweb/5701297 to your computer and use it in GitHub Desktop.
jquery hinclude like extension
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| var component = { | |
| components: [], | |
| body: null, | |
| init: function() | |
| { | |
| var self = this; | |
| String.prototype.capitalize = function() { | |
| return this.charAt(0).toUpperCase() + this.slice(1); | |
| }; | |
| this.body = $('body').append('<div class="modal-preloader"><i class="icon-upload icon-white"></i></div>').on({ | |
| // When ajaxStart is fired, add 'loading' to body class | |
| ajaxStart: function() { | |
| $(this).addClass("loading"); | |
| }, | |
| // When ajaxStop is fired, rmeove 'loading' from body class | |
| ajaxStop: function() { | |
| $(this).removeClass("loading"); | |
| } | |
| }); | |
| $('.phpme-component').each(function() { | |
| var url = $(this).data('url'); | |
| self.components.push([url, $(this)]); | |
| console.log("Component with url " + url + " was added"); | |
| }); | |
| return this; | |
| }, | |
| refresh: function(component, action) | |
| { | |
| var self = this; | |
| $.get(action, function(content) { | |
| component.html(content).addClass('loaded'); | |
| self.body.trigger('componentLoaded', {component: component, url: action}); | |
| }); | |
| }, | |
| load: function() | |
| { | |
| var self = this; | |
| for(var i in this.components) | |
| { | |
| var current = this.components[i]; | |
| (function(component) { | |
| var action = component[0]; | |
| var context = component[1]; | |
| self.refresh(context, action); | |
| context.on('componentRefresh', function() { | |
| self.refresh(context,action); | |
| }); | |
| })(current); | |
| } | |
| } | |
| } | |
| jQuery(function($) { | |
| component | |
| .init() | |
| .load(); | |
| }); |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <?php | |
| namespace Phpme\Bundle\ExampleBundle\Twig\Extension; | |
| use Symfony\Bundle\FrameworkBundle\HttpKernel; | |
| class ComponentExtension extends \Twig_Extension | |
| { | |
| private $httpKernel; | |
| /** | |
| * @param \Symfony\Bundle\FrameworkBundle\HttpKernel $httpKernel | |
| */ | |
| public function __construct(HttpKernel $httpKernel) | |
| { | |
| $this->httpKernel = $httpKernel; | |
| } | |
| /** | |
| * Returns a list of functions to add to the existing list. | |
| * | |
| * @return array An array of functions | |
| */ | |
| public function getFunctions() | |
| { | |
| return array( | |
| 'phpme_component' => new \Twig_Function_Method($this, 'renderComponent', array('is_safe' => array('html'))), | |
| ); | |
| } | |
| /** | |
| /** | |
| * Returns the name of the extension. | |
| * | |
| * @return string The extension name | |
| */ | |
| public function getName() | |
| { | |
| return 'phpme_component'; | |
| } | |
| public function renderComponent($name, $controller, array $attributes = array(), array $query = array(), $secure = true) | |
| { | |
| $uri = $this->httpKernel->generateInternalUri($controller, $attributes, $query, $secure); | |
| return <<<HTML | |
| <div class="phpme-component" data-url="{$uri}" data-target="{$name}" id="{$name}"> | |
| <div class="alert alert-info"> | |
| <p><i class="icon-time"></i> Component is loading, please be patient</p> | |
| </div> | |
| </div> | |
| HTML; | |
| } | |
| } |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <h2>List of items in store</h2> | |
| {{ phpme_component( | |
| 'exampleModule', | |
| 'PhpmeExampleBundle:Default:items', | |
| {'section': app.request.get('section')} | |
| ) | |
| }} |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| var Example = { | |
| // just placeholder for DOM node available after AJAX call | |
| exampleModule: null, | |
| /** | |
| * Drag and drop functionality for offers section | |
| */ | |
| initExampleModule: function() { | |
| alert('Example module was loaded and is ready for some events binding'); | |
| }, | |
| initialize: function() | |
| { | |
| $('body').on('componentLoaded', function(e, data) { | |
| var id = data.component.attr('id'); | |
| self[id] = data.component; | |
| self["init" + id.capitalize()](); | |
| }); | |
| } | |
| }; | |
| jQuery(function($) { | |
| Example.initialize(); | |
| }); |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <?xml version="1.0" ?> | |
| <container xmlns="http://symfony.com/schema/dic/services" | |
| xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" | |
| xsi:schemaLocation="http://symfony.com/schema/dic/services http://symfony.com/schema/dic/services/services-1.0.xsd"> | |
| <services> | |
| <service id="phpme.component.twig.extension" class="Phpme\Bundle\ExampleBundle\Twig\Extension\ComponentExtension" public="false"> | |
| <tag name="twig.extension" /> | |
| <argument type="service" id="http_kernel" /> | |
| </service> | |
| </services> | |
| </container> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment