Hello Andun,
Here is my review:
1) font files should be removed from the plugin until legal will approve
its license (as well as related css file)
2) public WysiwygBehavior(String selector, String method) constructor
should look like this:
public WysiwygBehavior(String selector, String method){
this(selector, method, new Options());
}
3) for now all buttons can be hardcoded as in you html above
4) WysiwygEditor extends Panel should be created with it's own markup file
(maybe it is possible to extend some of the FormComponents (you can take a
look at *DateTextField as an example)*
5) It should have at least 2 constructors: WE(String id), WE(String id,
IModel<T>) I guess it should be generic as other Wicket components.
Thanks!
On Mon, May 27, 2013 at 8:49 PM, Andun Sameera <[email protected]> wrote:
> Hi Maxim,
>
> Thank you for the instruction. I have corrected the problem by adding
> those fonts as resources. But there was a small issue. I had put following
> code segment to the Sample application's init() method to load font
> resources to run time. Is it the correct way of doing the thing ? Can I
> move this code segment to the Behavior itself to make users life easy ?
>
> IPackageResourceGuard packageResourceGuard =
> getResourceSettings().getPackageResourceGuard();
> if (packageResourceGuard instanceof SecurePackageResourceGuard)
> {
> SecurePackageResourceGuard guard = (SecurePackageResourceGuard)
> packageResourceGuard;
> guard.addPattern("+*.eot");
> guard.addPattern("+*.woff");
> guard.addPattern("+*.ttf");
> }
>
> I found this instructions in the mail thread given at [1].
>
> I have gone through the OFL and found this. I think we can use this under
> AL.
>
> Permission is hereby granted, free of charge, to any person obtaining
> a copy of the Font Software, to use, study, copy, merge, embed, modify,
> redistribute, and sell modified and unmodified copies of the Font
> Software, subject to the following conditions:
>
> 1) Neither the Font Software nor any of its individual components,
> in Original or Modified Versions, may be sold by itself.
>
> 2) Original or Modified Versions of the Font Software may be bundled,
> redistributed and/or sold with any software, provided that each copy
> contains the above copyright notice and this license. These can be
> included either as stand-alone text files, human-readable headers or
> in the appropriate machine-readable metadata fields within text or
> binary files as long as those fields can be easily viewed by the user.
>
> 3) No Modified Version of the Font Software may use the Reserved Font
> Name(s) unless explicit written permission is granted by the corresponding
> Copyright Holder. This restriction only applies to the primary font name as
> presented to the users.
>
> 4) The name(s) of the Copyright Holder(s) or the Author(s) of the Font
> Software shall not be used to promote, endorse or advertise any
> Modified Version, except to acknowledge the contribution(s) of the
> Copyright Holder(s) and the Author(s) or with their explicit written
> permission.
>
> 5) The Font Software, modified or unmodified, in part or in whole,
> must be distributed entirely under this license, and must not be
> distributed under any other license. The requirement for fonts to
> remain under this license does not apply to any document created
> using the Font Software.
> Also I found this site [2]. What is your opinion ?
>
> Also If the things works fine, I can move to the step of creating the
> component to reuse following code which needed to create the tool-bar and
> the editor. Can you give me some instructions regarding the process of
> creating a component and it's best practices.
>
> <div class="container">
> <div class="btn-toolbar" data-role="editor-toolbar"
> data-target="#editor">
> <div class="btn-group">
> <a class="btn dropdown-toggle" data-toggle="dropdown"
> title="Font Size"><i class="icon-text-height"></i> <b
> class="caret"></b></a>
> <ul class="dropdown-menu">
> <li><a data-edit="fontSize 5"><font
> size="5">Huge</font></a></li>
> <li><a data-edit="fontSize 3"><font
> size="3">Normal</font></a></li>
> <li><a data-edit="fontSize 1"><font
> size="1">Small</font></a></li>
> </ul>
> </div>
> <div class="btn-group">
> <a class="btn" data-edit="bold" title="Bold (Ctrl/Cmd+B)"><i
> class="icon-bold"></i></a>
> <a class="btn" data-edit="italic" title="Italic
> (Ctrl/Cmd+I)"><i class="icon-italic"></i></a>
> <a class="btn" data-edit="strikethrough"
> title="Strikethrough"><i class="icon-strikethrough"></i></a>
> <a class="btn" data-edit="underline" title="Underline
> (Ctrl/Cmd+U)"><i class="icon-underline"></i></a>
> </div>
> <div class="btn-group">
> <a class="btn" data-edit="insertunorderedlist" title="Bullet
> list"><i class="icon-list-ul"></i></a>
> <a class="btn" data-edit="insertorderedlist" title="Number
> list"><i class="icon-list-ol"></i></a>
> <a class="btn" data-edit="outdent" title="Reduce indent
> (Shift+Tab)"><i class="icon-indent-left"></i></a>
> <a class="btn" data-edit="indent" title="Indent (Tab)"><i
> class="icon-indent-right"></i></a>
> </div>
> <div class="btn-group">
> <a class="btn" data-edit="justifyleft" title="Align Left
> (Ctrl/Cmd+L)"><i class="icon-align-left"></i></a>
> <a class="btn" data-edit="justifycenter" title="Center
> (Ctrl/Cmd+E)"><i class="icon-align-center"></i></a>
> <a class="btn" data-edit="justifyright" title="Align Right
> (Ctrl/Cmd+R)"><i
> class="icon-align-right"></i></a>
> <a class="btn" data-edit="justifyfull" title="Justify
> (Ctrl/Cmd+J)"><i class="icon-align-justify"></i></a>
> </div>
> <div class="btn-group">
> <a class="btn dropdown-toggle" data-toggle="dropdown"
> title="Hyperlink"><i class="icon-link"></i></a>
>
> <div class="dropdown-menu input-append">
> <input class="span2" placeholder="URL" type="text"
> data-edit="createLink"/>
> <button class="btn" type="button">Add</button>
> </div>
> <a class="btn" data-edit="unlink" title="Remove Hyperlink"><i
> class="icon-cut"></i></a>
>
> </div>
>
> <div class="btn-group">
> <a class="btn" data-edit="undo" title="Undo (Ctrl/Cmd+Z)"><i
> class="icon-undo"></i></a>
> <a class="btn" data-edit="redo" title="Redo (Ctrl/Cmd+Y)"><i
> class="icon-repeat"></i></a>
> </div>
> <input type="text" data-edit="inserttext" id="voiceBtn"
> x-webkit-speech="">
> </div>
>
> <div id="editor">
> Go ahead…
> </div>
> </div>
>
> Thanks!
>
> [1] -
> http://apache-wicket.1842946.n4.nabble.com/Wicket-1-4-20-error-message-quot-Access-denied-to-static-package-resource-quot-td4491886.html
> [2] -
>
> http://www.tldrlegal.com/compare?a=Apache+License+2.0+%28Apache-2.0%29&b=Open+Font+License+%28OFL%29
>
>
> On Mon, May 27, 2013 at 3:04 PM, Maxim Solodovnik <[email protected]>wrote:
>
>> According to this css file:
>>
>> @font-face{
>> font-family:'FontAwesome';*
>> src:url('../font/fontawesome-webfont.eot?v=3.0.2');
>> src:url('../font/fontawesome-webfont.eot?#iefix&v=3.0.2')
>> format('embedded-opentype'),
>> url('../font/fontawesome-webfont.woff?v=3.0.2') format('woff'),
>> url('../font/fontawesome-webfont.ttf?v=3.0.2') format('truetype');*
>> font-weight:normal;
>> font-style:normal }
>>
>>
>> I guess you need font files (in bold above as well)
>>
>> Could you also check if
>>
>> - The Font Awesome font is licensed under the *SIL Open Font License* -
>> http://scripts.sil.org/OFL
>>
>> is compatible with AL?
>>
>>
>> Thanks in advance
>>
>>
>>
>> On Mon, May 27, 2013 at 4:19 PM, Andun Sameera <[email protected]>wrote:
>>
>>> Hi Maxim,
>>>
>>> I am in the final step of creating the Wysiwyg behavior. I have update
>>> the sample also. When I run the sample all the Wysiwyg functionality is
>>> working fine. You can see the attached screen of that.
>>>
>>> But I am facing a weired problem. To show the Icons of the buttons it
>>> need following CSS file,
>>>
>>> <link href="
>>> http://netdna.bootstrapcdn.com/font-awesome/3.0.2/css/font-awesome.css";
>>> rel="stylesheet">
>>>
>>> What I did is download the CSS file and included it as a resource
>>> reference for the behaviour. But the icons are not shown properly. Then
>>> what I did was put the url reference of the CSS file. It also not work.
>>>
>>> Then I created a html file outside wicket. I put the CSS reference as
>>> this,
>>>
>>> <link href="
>>> http://netdna.bootstrapcdn.com/font-awesome/3.0.2/css/font-awesome.css";
>>> rel="stylesheet">
>>>
>>> Then all the things work well. But when I download the file and put the
>>> reference as this,
>>>
>>> <link href="font-awesome.css" rel="stylesheet">
>>>
>>> Icons are not shown. What is going wrong here ? I have attached the html
>>> project which was create out side wicket here.
>>>
>>> Thanks!
>>>
>>>
>>> On Mon, May 27, 2013 at 12:21 PM, Maxim Solodovnik <[email protected]
>>> > wrote:
>>>
>>>> great! thanks!
>>>>
>>>>
>>>> On Mon, May 27, 2013 at 1:45 PM, Andun Sameera <[email protected]>wrote:
>>>>
>>>>> Hi Maxim,
>>>>>
>>>>> I have created two git repos for component
>>>>> https://github.com/andunslg/Wysiwyg-Wicket and sample
>>>>> https://github.com/andunslg/Wysiwyg-Wicket-Sample.
>>>>>
>>>>> I have created the WysiwygBehaviour first. After scefully creating
>>>>> that I will create the component to add the Wysiwyg buttons.
>>>>>
>>>>> Thanks!
>>>>>
>>>>>
>>>>> On Mon, May 27, 2013 at 9:31 AM, Andun Sameera <[email protected]>wrote:
>>>>>
>>>>>> OK Maxim. Will look in to that.
>>>>>>
>>>>>>
>>>>>> On Mon, May 27, 2013 at 9:29 AM, Maxim Solodovnik <
>>>>>> [email protected]> wrote:
>>>>>>
>>>>>>> I would like it as a plugin for wicket-jquery-ui
>>>>>>> I guess this plugin will require both Behavior and Component
>>>>>>> (probably extending TextArea) with configurable buttons
>>>>>>> I believe small number of buttons can be added in initial version
>>>>>>>
>>>>>>>
>>>>>>> On Mon, May 27, 2013 at 10:55 AM, Andun Sameera
>>>>>>> <[email protected]>wrote:
>>>>>>>
>>>>>>>> Hi Maxim,
>>>>>>>>
>>>>>>>> I accept this. What I have to do is creating another wicket module
>>>>>>>> which wraps the bootstrap-wysiwyg plugin. Do I have to create it as a
>>>>>>>> separate project or under wicket-jquery-ui ?
>>>>>>>>
>>>>>>>> Thanks!
>>>>>>>>
>>>>>>>>
>>>>>>>> On Mon, May 27, 2013 at 9:19 AM, Maxim Solodovnik <
>>>>>>>> [email protected]> wrote:
>>>>>>>>
>>>>>>>>> Hello Andun,
>>>>>>>>>
>>>>>>>>> since Sebastian already implemented
>>>>>>>>> emoticons<https://github.com/sebfz1/wicket-jquery-ui/tree/master/wicket-jquery-ui-plugins/src/main/java/com/googlecode/wicket/jquery/ui/plugins/emoticons>
>>>>>>>>> plugin
>>>>>>>>> I propose you to implement additional component: WYSIWYG editor plugin
>>>>>>>>> based on http://mindmup.github.io/bootstrap-wysiwyg/
>>>>>>>>> as described here:
>>>>>>>>> https://issues.apache.org/jira/browse/OPENMEETINGS-558
>>>>>>>>>
>>>>>>>>> Would you accept that?
>>>>>>>>>
>>>>>>>>> --
>>>>>>>>> WBR
>>>>>>>>> Maxim aka solomax
>>>>>>>>>
>>>>>>>>
>>>>>>>>
>>>>>>>>
>>>>>>>> --
>>>>>>>> Regards
>>>>>>>> Andun S.L. Gunawardana
>>>>>>>> Undergraduate
>>>>>>>> Department of Computer Science And Engineering
>>>>>>>> University of Moratuwa
>>>>>>>> Sri Lanka
>>>>>>>>
>>>>>>>> Blog - http://www.insightforfuture.blogspot.com/
>>>>>>>> LinkedIn -
>>>>>>>> http://www.linkedin.com/pub/andun-s-l-gunawardana/34/646/703
>>>>>>>> Twitter -http://twitter.com/AndunSLG
>>>>>>>>
>>>>>>>>
>>>>>>>>
>>>>>>>>
>>>>>>>
>>>>>>>
>>>>>>>
>>>>>>>
>>>>>>> --
>>>>>>> WBR
>>>>>>> Maxim aka solomax
>>>>>>>
>>>>>>
>>>>>>
>>>>>>
>>>>>> --
>>>>>> Regards
>>>>>> Andun S.L. Gunawardana
>>>>>> Undergraduate
>>>>>> Department of Computer Science And Engineering
>>>>>> University of Moratuwa
>>>>>> Sri Lanka
>>>>>>
>>>>>> Blog - http://www.insightforfuture.blogspot.com/
>>>>>> LinkedIn -
>>>>>> http://www.linkedin.com/pub/andun-s-l-gunawardana/34/646/703
>>>>>> Twitter -http://twitter.com/AndunSLG
>>>>>>
>>>>>>
>>>>>>
>>>>>>
>>>>>>
>>>>>
>>>>>
>>>>>
>>>>> --
>>>>> Regards
>>>>> Andun S.L. Gunawardana
>>>>> Undergraduate
>>>>> Department of Computer Science And Engineering
>>>>> University of Moratuwa
>>>>> Sri Lanka
>>>>>
>>>>> Blog - http://www.insightforfuture.blogspot.com/
>>>>> LinkedIn -
>>>>> http://www.linkedin.com/pub/andun-s-l-gunawardana/34/646/703
>>>>> Twitter -http://twitter.com/AndunSLG
>>>>>
>>>>>
>>>>>
>>>>>
>>>>>
>>>>
>>>>
>>>>
>>>> --
>>>> WBR
>>>> Maxim aka solomax
>>>>
>>>
>>>
>>>
>>> --
>>> Regards
>>> Andun S.L. Gunawardana
>>> Undergraduate
>>> Department of Computer Science And Engineering
>>> University of Moratuwa
>>> Sri Lanka
>>>
>>> Blog - http://www.insightforfuture.blogspot.com/
>>> LinkedIn - http://www.linkedin.com/pub/andun-s-l-gunawardana/34/646/703
>>> Twitter -http://twitter.com/AndunSLG
>>>
>>>
>>>
>>>
>>>
>>
>>
>>
>> --
>> WBR
>> Maxim aka solomax
>>
>
>
>
> --
> Regards
> Andun S.L. Gunawardana
> Undergraduate
> Department of Computer Science And Engineering
> University of Moratuwa
> Sri Lanka
>
> Blog - http://www.insightforfuture.blogspot.com/
> LinkedIn - http://www.linkedin.com/pub/andun-s-l-gunawardana/34/646/703
> Twitter -http://twitter.com/AndunSLG
>
>
>
>
>
--
WBR
Maxim aka solomax
