LtUpvoteBundle
LtUpvoteBundle is upvote and downvote (thumbs up and thumbs down) component
for Symfony 3.0 project, (*1)
Features
- Configurable vote permissions
- Automatically limit unauthenticated upvotes/downvotes by IP
- Optionally hide upvote/downvote button
- Pure JavaScript frontend component implementation
- Unit tested
System requirements
- Symfony 3.0
- Doctrine bundle with configured database connection
Installation
-
Require LtUpvoteBundle over composer in your existing Symfony project:, (*2)
composer require liubinas/upvote-bundle
-
Initialize it in the app/AppKernel.php file:, (*3)
$bundles[] = new Lt\UpvoteBundle\LtUpvoteBundle();
-
Import LtUpvoteBundle routing:, (*4)
# app/config/routing.yml
lt-upvote:
resource: "@LtUpvoteBundle/Resources/config/routing.xml"
Configuration
The following is an example configuration defining basic context types blog-post and
comment:, (*6)
# app/config/config.yml
lt-upvote-bundle:
types:
blog-post: # Custom context type
show_upvote: true
show_downvote: true
allow_unauthenticated_upvote: true
allow_unauthenticated_downvote: false
comment # Custom context type having the default values all true
Test run
Start web server:, (*7)
$ bin/console server:start
Test page could be accessed by navigating to
http://<dev-host>/lt-upvote-test on your dev environment., (*8)
Front-end
Front-end functionality is implemented in a single dependency free JavaScript file.
Styles are defined in CSS file which could be used out of the box
or adopted according to custom requirements., (*9)
JavaScript
-
Include JavaScrip module file (Twig syntax):, (*10)
<script src="{{asset('/bundles/ltupvote/js/lt-upvote.js')}}"></script>
-
Initialize JavaScript module in your HTML page:, (*11)
<script language="JavaScript"><!--
ltupvote.init();
//-->
</script>
CSS
### Twig
* Include one or more front end components into your page rendered over Controller
{{ render(
controller(
'lt_upvote_bundle.controller.default:renderVoteComponent',
{
'subjectType': '[TYPE]',
'subjectId': '[ID]',
'css_class': '[CLASS]'
}
)
) }}, (*14)
Where:
* `[TYPE]` is context type value.
* `[ID]` is Subject ID value.
* `[CLASS]` is component specific styling CSS class. Predefined styles are `Style1`, `Style2`.
See [test.html.twig](Resources/views/Default/test.html.twig) file for example implementation.
### JavaScript Custom Event handling
On each upvote/downvote action JavaScript event is dispatched.
This action could be handled by adding custom event listener for `ltu` event type.
An example code for unauthenticated downvote handling:
```JavaScript
addEventListener('ltu', function(event) {
if (event.detail.unauthenticatedError) {
alert('This action is permitted for the logged in visitors only.');
}
})
The following properties describing performed action could be accessed from even.detail data object: id, type, counter, action, unauthentificated, unauthentificatedError., (*15)
License
This bundle is under the MIT license. See the complete license in LICENSE file.
f, (*16)
Wallogit.com
