This library is a Grails 2 tag library port of Catharsis Social Web Widgets library.
It provides useful social media widgets to include on web pages of your site.
Support
This project needs your support for further developments ! Please consider donating.
-
Yandex.Money : 41001577953208
-
WebMoney (WMR) : R399275865890
Installation and usage
Grails 2 tag library plugin: Catharsis Widgets
Installation of the plugin follows basic Grails plugin conventions, and custom tags from this library can be used the same way as described in official Grails documentation : Grails Tag Libraries
Some tags make use of core Resources plugin, and therefore <r:require> tag with a proper module name must be included in a <head> section of web page as described.
API examples
Cackle
1. Comments
Requirements: <r:require module="cackle"/> directive
Code:
<cackle:comments account="20049"/>
2. Comments count hyperlink
Requirements: <r:require module="cackle"/> directive
Note: Hyperlinks must have a specific CSS class for this to work, as described in Cackle documentation.
Code:
<cackle:comments_count account="20049"/>
3. Latest comments
Requirements: <r:require module="cackle"/> directive
Code:
<cackle:latest_comments account="20049"/>
<cackle:latest_comments account="20049" max="15" avatar_size="32" title_size="50" text_size="255"/>
4. OAuth login
Requirements: <r:require module="cackle"/> directive
Code:
<cackle:login account="20049"/>
Disqus
1. Comments
Requirements: <r:require module="disqus"/> directive
Code:
<disqus:comments account="v-svete-snov"/>
1. JS API initialization
Requirements: None
Code:
<facebook:initialize app_id="1437917246425293"/>
2. Activity Feed
Requirements: Call to <facebook:initialize>
Code:
<facebook:activity_feed/>
<facebook:activity_feed domain="http://yandex.ru"/>
<facebook:activity_feed domain="http://yandex.ru" header="false" recommendations="true" color_scheme="${FacebookColorScheme.DARK}"/>
3. Recommendations Feed
Requirements: Call to <facebook:initialize>
Code:
<facebook:recommendations_feed/>
<facebook:recommendations_feed domain="yandex.ru"/>
<facebook:recommendations_feed domain="yandex.ru" header="false" color_scheme="${FacebookColorScheme.DARK}"/>
4. Comments
Requirements: Call to <facebook:initialize>
Code:
<facebook:comments/>
<facebook:comments url="http://yandex.ru"/>
<facebook:comments url="http://yandex.ru" order="${FacebookCommentsOrder.REVERSE_TIME}" posts="1" width="500"/>
5. Facepile
Requirements: Call to <facebook:initialize>
Code:
<facebook:facepile/>
<facebook:facepile url="http://yandex.ru"/>
<facebook:facepile url="http://yandex.ru" max_rows="5" photo_size="${FacebookFacepilePhotoSize.LARGE}" height="300"/>
6. Follow Button
Requirements: Call to <facebook:initialize>
Code:
<facebook:follow_button url="http://www.facebook.com/zuck"/>
<facebook:follow_button url="http://www.facebook.com/zuck" kids_mode="true" faces="true" layout="${FacebookButtonLayout.BOX_COUNT}"/>
7. Like Box
Requirements: Call to <facebook:initialize>
Code:
<facebook:like_box url="https://www.facebook.com/pages/Clear-Words/515749945120070"/>
<facebook:like_box url="https://www.facebook.com/pages/Clear-Words/515749945120070" header="false" border="false" faces="false" stream="true" width="500"/>
8. Like Button
Requirements: Call to <facebook:initialize>
Code:
<facebook:like_button/>
<facebook:like_button url="http://yandex.ru"/>
<facebook:like_button url="http://yandex.ru" layout="${FacebookButtonLayout.BOX_COUNT}" faces="true" verb="${FacebookLikeButtonVerb.RECOMMEND}"/>
9. Embedded post
Requirements: Call to <facebook:initialize>
Code:
<facebook:post url="https://www.facebook.com/prokhor.ozornin/posts/10203109769053557" width="640"/>
10. Send Button
Requirements: Call to <facebook:initialize>
Code:
<facebook:send/>
<facebook:send_button url="http://yandex.ru"/>
<facebook:send_button url="url" color_scheme="${FacebookColorScheme.DARK}" kids_mode="true"/>
11. Embedded video
Requirements: None
Code:
<facebook:video height="480" width="640" id="10203121281421359"/>
1. Analytics
Requirements: None
Code:
<google:analytics domain="v-svete-snov.ru" account="UA-27123759-16"/>
2. +1 Button
Requirements: <r:require module="google"/> directive
Code:
<google:plus_one_button/>
<google:plus_one_button url="http://yandex.ru" align="${GooglePlusOneButtonAlign.RIGHT}" size="${GooglePlusOneButtonSize.TALL}" annotation="${GooglePlusOneButtonAnnotation.INLINE}" recommendations="false"/>
Gravatar
1. Avatar image URL
Requirements: None
Code:
<gravatar:image_url email="prokhor.ozornin@yandex.ru"/>
<gravatar:image_url email="prokhor.ozornin@yandex.ru" extension="jpg" force_default="true" size="320"/>
2. User profile URL
Requirements: None
Code:
<gravatar:profile_url email="prokhor.ozornin@yandex.ru"/>
<gravatar:profile_url email="prokhor.ozornin@yandex.ru" format="xml"/>
IntenseDebate
1. Comments
Requirements: None
Code:
<intensedebate:comments account="a639ec3507d53023d4f213666651b6c2"/>
2. Comments count hyperlink
Requirements: None
Code:
<intensedebate:link account="a639ec3507d53023d4f213666651b6c2"/>
LiveJournal
1. Like Button
Requirements: None
Code:
<livejournal:like_button/>
2. Repost Button
Requirements: None
Code:
<livejournal:repost_button/>
<livejournal:repost_button title="title">text</livejournal:repost>
Mail.ru
1. ICQ On-Site
Requirements: None
Code:
<mailru:icq/>
<mailru:icq account="12345678" language="en"/>
2. Embedded video
Requirements: None
Code:
<mailru:video height="480" width="640" id="tommylordau/4271/4279.html"/>
3. Like Button
Requirements: <r:require module="mailru"/> directive
Code:
<mailru:like_button/>
<mailru:like_button layout="${MailRuLikeButtonLayout.FIRST}" text="false" counter_position="${MailRuLikeButtonCounterPosition.UPPER}" size="30"/>
4. Faces
Requirements: <r:require module="mailru"/> directive
Code:
<mailru:faces domain="mail.ru" width="640" height="480"/>
<mailru:faces domain="mail.ru" width="640" height="480" font="${MailRuFacesFont.TAHOMA}" show_title="false" background_color="aaffaa" hyperlink_color="ffaaff" border_color="aaaaaa"/>
5. Groups
Requirements: <r:require module="mailru"/> directive
Code:
<mailru:groups account="mail_ru" width="640" height="480"/>
<mailru:groups account="mail_ru" width="640" height="480" background_color="aaffaa" button_color="ffaaff" subscribers="false" text_color="aaaadd"/>
1. Follow Button
Requirements: <r:require module="pinterest"/> directive
Code:
<pinterest:follow_button account="pinterest"/>
<pinterest:follow_button account="pinterest" label="Pinterest"/>
2. Embedded Pin
Requirements: <r:require module="pinterest"/> directive
Code:
<pinterest:pin id="99360735500167749"/>
3. Board
Requirements: <r:require module="pinterest"/> directive
Code:
<pinterest:board account="pinterest" id="pin-pets"/>
<pinterest:board account="pinterest" id="pin-pets" image="60" height="800" width="150"/>
4. Profile
Requirements: <r:require module="pinterest"/> directive
Code:
<pinterest:profile account="pinterest"/>
<pinterest:profile account="pinterest" image="60" height="800" width="150"/>
5. Pin It Button
Requirements: <r:require module="pinterest"/> directive
Code:
<pinterest:pin_it_button url="http://www.flickr.com/photos/kentbrew/6851755809" image="http://farm8.staticflickr.com/7027/6851755809_df5b2051c9_z.jpg" description="Next stop: Pinterest"/>
<pinterest:pin_it_button url="http://www.flickr.com/photos/kentbrew/6851755809" image="http://farm8.staticflickr.com/7027/6851755809_df5b2051c9_z.jpg" description="Next stop: Pinterest" counter="${PinterestPinItButtonPinCountPosition.NONE}" size="${PinterestPinItButtonSize.LARGE}" color="${PinterestPinItButtonColor.RED}" shape="${PinterestPinItButtonShape.RECTANGULAR}" language="ja"/>
RuTube
1. Embedded video
Requirements: None
Code:
<rutube:video height="480" width="640" id="6785018"/>
SoundCloud
1. User's profile icon
Requirements: None
Code:
<soundcloud:profile_icon account="prokhor-ozornin"/>
<soundcloud:profile_icon account="prokhor-ozornin" color="${SoundCloudProfileIconColor.BLACK_WHITE}" size="${SoundCloudProfileIconSize.SIZE_64}"/>
Surfingbird
1. Surf Button
Requirements: <r:require module="surfingbird"/> directive
Code:
<surfingbird:surf_button/>
<surfingbird:surf_button color="${SurfingbirdSurfButtonColor.BLUE}" counter="true" label="Share" url="http://yandex.ru" layout="${SurfingbirdSurfButtonLayout.COMMON}"/>
Tumblr
1. Follow Button
Requirements: None
Code:
<tumblr:follow_button account="clear-words-en"/>
<tumblr:follow_button account="clear-words-en" color_scheme="${TumblrFollowButtonColorScheme.DARK}" type="${TumblrFollowButtonType.SECOND}"/>
2. Share Button
Requirements: <r:require module="tumblr"/> directive
Code:
<tumblr:share_button/>
<tumblr:share_button color_scheme="${TumblrShareButtonColorScheme.GRAY}" type="${TumblrShareButtonType.THIRD}"/>
1. Tweet Button
Requirements: <r:require module="twitter"/> directive
Code:
<twitter:tweet_button/>
<twitter:tweet_button tags="first,second,third" url="http://yandex.ru" text="Let's share it !" via="Prokhor" suggestions="false"/>
2. Follow Button
Requirements: <r:require module="twitter"/> directive
Code:
<twitter:follow_button account="prokhor_ozornin"/>
<twitter:follow_button account="prokhor_ozornin" suggestions="false" count="false" screen_name="false"/>
Vimeo
1. Embedded video
Requirements: None
Code:
<vimeo:video height="480" width="640" id="55456906"/>
Vkontakte
1. Embedded video
Requirements: None
Code:
<vkontakte:video height="360" hash="7a0cdf6ef7a69e67" user="5707198" width="607" id="167533148" hd="true"/>
2. JS API initialization
Requirements: <r:require module="vkontakte"/> directive
Code:
<vkontakte:initialize api_id="3816272"/>
3. OAuth Button
Requirements: Call to <vkontakte:initialize> (head section)
Code:
<vkontakte:auth_button type="${VkontakteAuthButtonType.STANDARD}" url="http://yandex.ru"/>
<vkontakte:auth_button type="${VkontakteAuthButtonType.DYNAMIC}" callback="onAuth" width="640"/>
4. Comments
Requirements: Call to <vkontakte:initialize> (head section)
Code:
<vkontakte:comments/>
<vkontakte:comments attach="${VkontakteCommentsAttach.ALL}" limit="${VkontakteCommentsLimit.FIFTEEN}" auto_publish="true" auto_update="true" mini="true"/>
5. Community
Requirements: Call to <vkontakte:initialize> (head section)
Code:
<vkontakte:community account="44545550"/>
<vkontakte:community account="44545550" mode="${VkontakteCommunityMode.NEWS}" height="400" width="600" backgroundColor="AABBCC" textColor="FF0000" buttonColor="00FF00"/>
6. Like Button
Requirements: Call to <vkontakte:initialize> (head section)
Code:
<vkontakte:like_button/>
7. Poll
Requirements: Call to <vkontakte:initialize> (head section)
Code:
<vkontakte:poll id="6564504_c2a6ccb7df15aff473"/>
<vkontakte:poll id="6564504_c2a6ccb7df15aff473" width="640"/>
8. Wall Post
Requirements: Call to <vkontakte:initialize> (head section)
Code:
<vkontakte:post id="45616" owner="1" hash="Yss6aNhrrQhOL5FfXZeuga8yKA"/>
<vkontakte:post id="45616" owner="1" hash="Yss6aNhrrQhOL5FfXZeuga8yKA" width="640"/>
9. Recommendations Feed
Requirements: Call to <vkontakte:initialize> (head section)
Code:
<vkontakte:recommendations/>
<vkontakte:recommendations limit="10" max="50" period="${VkontakteRecommendationsPeriod.MONTH}" sorting="${VkontakteRecommendationsSorting.LIKES}" verb="${VkontakteRecommendationsVerb.LIKE}" target="_blank"/>
10. Subscription
Requirements: Call to <vkontakte:initialize> (head section)
Code:
<vkontakte:subscription account="5707198"/>
<vkontakte:subscription account="5707198" only_button="true"/>
Yandex
1. Metrika
Requirements: None
Code:
<yandex:analytics account="12066574"/>
2. Like Button
Requirements: None
Code:
<yandex:like_button/>
<yandex:like_button title="Yandex Main Page" text="Share" url="http://yandex.ru" size="${YandexLikeButtonSize.SMALL}"/>
3. Embedded video
Requirements: None
Code:
<yandex:video height="253" width="450" user="leonevskiy" id="6ea0ugstkx.2528"/>
4. Yandex.Money payment button
Requirements: None
Code:
<yandex:money_button account="41001577953208" sum="15.5" description="Test Payment"/>
<yandex:money_button account="41001577953208" sum="15.5" description="Test Payment" type="${YandexMoneyButtonType.CARD}" text="${YandexMoneyButtonText.BUY}" size="${YandexMoneyButtonSize.MEDIUM}" color="${YandexMoneyButtonColor.WHITE}" ask_payer_address="true" ask_payer_email="true" ask_payer_full_name="true" ask_payer_phone="true"/>
5. Yandex.Money donation form
Requirements: None
Code:
<yandex:money_donate_form account="41001577953208" description_text="Test Donation"/>
<yandex:money_donate_form account="41001577953208" description_text="Test Donation" description="true" sum="15.5" cards="true" project_name="Yandex" project_site="http://yandex.ru" text="${YandexMoneyDonateFormText.GIVE}" ask_payer_phone="true" ask_payer_full_name="true" ask_payer_comment="true" ask_payer_email="true"/>
6. Yandex.Money payment form
Requirements: None
Code:
<yandex:money_payment_form account="41001577953208" description="Test Payment"/>
<yandex:money_payment_form account="41001577953208" description="Test Payment" sum="15.5" cards="false" text="${YandexMoneyPaymentFormText.TRANSFER}" ask_payer_comment="true" ask_payer_email="true" ask_payer_full_name="true" ask_payer_address="true" ask_payer_phone="true" ask_payer_purpose="true" />
7. Share Button
Requirements: <r:require module="yandex"/> directive
Code:
<yandex:share_panel/>
<yandex:share_panel services="facebook" language="en"/>
YouTube
1. Embedded video
Requirements: None
Code:
<youtube:video height="480" width="100%" id="eYJSlHiXegI"/>
VideoJS
1. Media Player
Requirements: <r:require module="videojs"/> directive
Code:
def videos = ["http://vjs.zencdn.net/v/oceans.mp4":"video/mp4","http://vjs.zencdn.net/v/oceans.webm":"video/webm"]
<videojs:player width="640" height="480" videos="${videos}"><track kind="captions" src="http://www.videojs.com/vtt/captions.vtt" srclang="en" label="English"></track></videojs:player>
