104 To display and manage the new paragraph in the ZMI, you should create this associated forms |
104 To display and manage the new paragraph in the ZMI, you should create this associated forms |
105 |
105 |
106 1) Paragraph factory |
106 1) Paragraph factory |
107 -------------------- |
107 -------------------- |
108 |
108 |
109 To create a new element inside the zodb, we need a container to this element. PyAMS provide |
109 To create a new element instance inside the zodb, we need a container to this object. PyAMS provide |
110 `IParagraphContainerTarget`, it's the default container for all paragraphs. We could use this container interface |
110 `IParagraphContainerTarget`, it's the default container for all paragraphs. We could use this container interface |
111 as context to create a new paragraph. |
111 as context to create a new paragraph. |
112 |
112 |
113 We need to create two views |
113 |
114 |
114 Declaration of the **factory** of `ContactPhoneParagraph` |
115 - *HTML* |
115 |
116 |
116 .. code-block:: python |
117 .. code-block:: python |
117 |
|
118 @utility_config(name=CONTACT_PHONE_PARAGRAPH_TYPE, provides=IParagraphFactory) |
|
119 class ContactPhoneParagraphFactory(BaseParagraphFactory): |
|
120 """Contact paragraph factory""" |
|
121 |
|
122 name = _("Contact Phone card") |
|
123 content_type = ContactPhoneParagraph |
|
124 secondary_menu = True |
|
125 |
|
126 |
|
127 Definition of a form to create a new ContactPhone instance |
|
128 |
|
129 .. code-block:: python |
|
130 |
|
131 from pyams_form.form import ajax_config |
|
132 |
118 |
133 |
119 @pagelet_config(name='add-contact-phone-paragraph.html', context=IParagraphContainerTarget, layer=IPyAMSLayer, |
134 @pagelet_config(name='add-contact-phone-paragraph.html', context=IParagraphContainerTarget, layer=IPyAMSLayer, |
120 permission=MANAGE_CONTENT_PERMISSION) |
135 permission=MANAGE_CONTENT_PERMISSION) |
|
136 @ajax_config(name='add-contact-phone-paragraph.json', context=IParagraphContainerTarget, layer=IPyAMSLayer, |
|
137 base=BaseParagraphAJAXAddForm) |
121 class ContactPhoneParagraphAddForm(AdminDialogAddForm): |
138 class ContactPhoneParagraphAddForm(AdminDialogAddForm): |
122 """Contact phone paragraph add form""" |
139 """Contact phone paragraph add form""" |
123 |
140 |
124 legend = _("Add new contact phone card") |
141 legend = _("Add new contact phone card") |
125 dialog_class = 'modal-large' |
142 dialog_class = 'modal-large' |
126 icon_css_class = 'fa fa-fw fa-phone' |
143 icon_css_class = 'fa fa-fw fa-phone' |
127 |
144 |
128 fields = field.Fields(IContactPhoneParagraph).omit('__parent__', '__name__', 'visible') |
145 fields = field.Fields(IContactPhoneParagraph).omit('__parent__', '__name__', 'visible') |
129 ajax_handler = 'add-contact-phone-paragraph.json' #(*) |
|
130 edit_permission = MANAGE_CONTENT_PERMISSION |
146 edit_permission = MANAGE_CONTENT_PERMISSION |
131 |
147 |
132 def create(self, data): |
148 def create(self, data): |
133 return ContactPhoneParagraph() |
149 return ContactPhoneParagraph() |
134 |
150 |
135 def add(self, object): |
151 def add(self, object): |
136 IParagraphContainer(self.context).append(object) |
152 IParagraphContainer(self.context).append(object) |
137 |
153 |
138 |
154 |
139 - *JSON* |
155 2) Create the Paragraph addform button in the menu |
140 |
|
141 .. code-block:: python |
|
142 |
|
143 #(*) |
|
144 @view_config(name='add-contact-phone-1paragraph.json', context=IParagraphContainerTarget, request_type=IPyAMSLayer, |
|
145 permission=MANAGE_CONTENT_PERMISSION, renderer='json', xhr=True) |
|
146 class ContactPhoneParagraphAJAXAddForm(BaseParagraphAJAXAddForm, ContactPhoneParagraphAddForm): |
|
147 """Contact phone paragraph add form, JSON renderer""" |
|
148 |
|
149 |
|
150 2) Append the paragraph addform button in the menu |
|
151 -------------------------------------------------- |
156 -------------------------------------------------- |
152 |
157 |
153 We have created a new form and we want add a quick access button to create a new paragraph |
158 We have created a new form and we want add a quick access button to create a new paragraph |
154 |
159 |
155 .. code-block:: python |
160 .. code-block:: python |
164 url = 'add-contact-paragraph.html' |
169 url = 'add-contact-paragraph.html' |
165 paragraph_type = CONTACT_PARAGRAPH_TYPE |
170 paragraph_type = CONTACT_PARAGRAPH_TYPE |
166 |
171 |
167 |
172 |
168 |
173 |
169 3) Create Edit form |
174 3) Create Edit inner form |
170 ------------------- |
175 ------------------------- |
171 |
176 |
172 .. code-block:: python |
177 .. code-block:: python |
173 |
178 |
174 @adapter_config(context=(IContactPhoneParagraph, IPyAMSLayer), provides=IParagraphInnerEditor) |
179 @adapter_config(context=(IContactPhoneParagraph, IPyAMSLayer), provides=IParagraphInnerEditor) |
|
180 permission=MANAGE_CONTENT_PERMISSION) |
|
181 @ajax_config(name='inner-properties.json', context=IContactPhoneParagraph, layer=IPyAMSLayer, |
|
182 base=BaseParagraphAJAXEditForm) |
175 @implementer(IInnerForm) |
183 @implementer(IInnerForm) |
176 class ContactPhoneParagraphInnerEditForm(ContactPhoneParagraphPropertiesEditForm): |
184 class ContactPhoneParagraphInnerEditForm(ContactPhoneParagraphPropertiesEditForm): |
177 """Contact paragraph inner edit form""" |
185 """Contact paragraph inner edit form""" |
178 |
186 |
179 legend = None |
187 legend = None |
180 ajax_handler = 'inner-properties.json' |
|
181 |
188 |
182 @property |
189 @property |
183 def buttons(self): |
190 def buttons(self): |
184 if self.mode == INPUT_MODE: |
191 if self.mode == INPUT_MODE: |
185 return button.Buttons(IParagraphEditFormButtons) |
192 return button.Buttons(IParagraphEditFormButtons) |
186 else: |
193 else: |
187 return button.Buttons() |
194 return button.Buttons() |
188 |
|
189 |
|
190 |
|
191 .. code-block:: python |
|
192 |
|
193 @view_config(name='inner-properties.json', context=IContactPhoneParagraph, request_type=IPyAMSLayer, |
|
194 permission=MANAGE_CONTENT_PERMISSION, renderer='json', xhr=True) |
|
195 class ContactPhoneParagraphInnerAJAXEditForm(BaseParagraphAJAXEditForm, ContactParagraphInnerEditForm): |
|
196 """Contact paragraph inner edit form, JSON renderer""" |
|
197 |
195 |
198 def get_ajax_output(self, changes): |
196 def get_ajax_output(self, changes): |
199 output = super(ContactParagraphInnerAJAXEditForm, self).get_ajax_output(changes) |
197 output = super(ContactParagraphInnerAJAXEditForm, self).get_ajax_output(changes) |
200 updated = changes.get(IBaseParagraph, ()) |
198 updated = changes.get(IBaseParagraph, ()) |
201 if 'title' in updated: |
199 if 'title' in updated: |
214 ----------------------------- |
212 ----------------------------- |
215 |
213 |
216 This form is used inside modals popup |
214 This form is used inside modals popup |
217 |
215 |
218 |
216 |
219 - *HTML* |
217 .. code-block:: python |
220 |
218 |
221 .. code-block:: python |
219 @ajax_config(name='properties.json', context=IContactPhoneParagraph, request_type=IPyAMSLayer, |
222 |
220 permission=MANAGE_CONTENT_PERMISSION, renderer='json', xhr=True) |
223 @pagelet_config(name='properties.html', context=IContactParagraph, layer=IPyAMSLayer, |
221 @pagelet_config(name='properties.html', context=IContactParagraph, layer=IPyAMSLayer, |
224 permission=MANAGE_CONTENT_PERMISSION) |
222 permission=MANAGE_CONTENT_PERMISSION) |
225 class ContactPhoneParagraphPropertiesEditForm(BaseParagraphPropertiesEditForm): |
223 class ContactPhoneParagraphPropertiesEditForm(BaseParagraphPropertiesEditForm): |
226 """Contact phone paragraph properties edit form""" |
224 """Contact phone paragraph properties edit form""" |
227 |
225 |
231 icon_css_class = 'fa fa-fw fa-id-card-o' |
229 icon_css_class = 'fa fa-fw fa-id-card-o' |
232 |
230 |
233 fields = field.Fields(IContactParagraph).omit('__parent__', '__name__', 'visible') |
231 fields = field.Fields(IContactParagraph).omit('__parent__', '__name__', 'visible') |
234 fields['renderer'].widgetFactory = RendererFieldWidget |
232 fields['renderer'].widgetFactory = RendererFieldWidget |
235 |
233 |
236 ajax_handler = 'properties.json' |
|
237 edit_permission = MANAGE_CONTENT_PERMISSION |
234 edit_permission = MANAGE_CONTENT_PERMISSION |
238 |
235 |
239 |
236 |
240 - *JSON* |
|
241 |
|
242 .. code-block:: python |
|
243 |
|
244 @view_config(name='properties.json', context=IContactPhoneParagraph, request_type=IPyAMSLayer, |
|
245 permission=MANAGE_CONTENT_PERMISSION, renderer='json', xhr=True) |
|
246 class ContactPhoneParagraphPropertiesAJAXEditForm(BaseParagraphAJAXEditForm, ContactParagraphPropertiesEditForm): |
|
247 """Contact phone paragraph properties edit form, JSON renderer""" |
|
248 |
|
249 |
|
250 .. note:: |
237 .. note:: |
251 |
238 |
252 Select the new content block types in ZMI to make it available in tools |
239 Select the new content block types in ZMI to make it available in tools |
253 |
240 |
254 .. image:: _static/select_paragraph.png |
241 .. image:: _static/select_paragraph.png |
|
242 |
|
243 |
|
244 How to associate links or Illustrations to a Paragraph ? |
|
245 ======================================================== |
|
246 |
|
247 Adding the following marker interface, we add new behavior to the Paragraph `ContactPhoneParagraph` . |
|
248 |
|
249 |
|
250 1) Inner form |
|
251 ------------- |
|
252 |
|
253 .. code-block:: python |
|
254 |
|
255 @adapter_config(context=(IContactPhoneParagraph, IPyAMSLayer), provides=IParagraphInnerEditor) |
|
256 @implementer(IInnerForm, IPropertiesEditForm, IAssociationParentForm) |
|
257 class ContactPhoneParagraphInnerEditForm(ContactPhoneParagraphPropertiesEditForm): |
|
258 """Contact paragraph inner edit form""" |
|
259 |
|
260 legend = None |
|
261 ajax_handler = 'inner-properties.json' |
|
262 |
|
263 |
|
264 Marker interfaces: |
|
265 |
|
266 :py:class:`IPropertiesEditForm` |
|
267 |
|
268 :py:class:`IAssociationParentForm` |
|
269 |
|
270 |
|
271 .. image:: _static/associations_form.png |
|
272 |
|
273 |
|
274 |
|
275 2) Inside a dedicated menu |
|
276 -------------------------- |
|
277 |
|
278 .. image:: _static/select_links_n_attachment.png |
|
279 |
|
280 |
|
281 .. code-block:: python |
|
282 |
|
283 @implementer(IContactPhoneParagraph, IIllustrationTarget,ILinkContainerTarget,IExtFileContainerTarget)) |
|
284 @factory_config(provided=IContactPhoneParagraph) |
|
285 class ContactPhoneParagraph(BaseParagraph): |
|
286 """Contact paragraph""" |
|
287 ... |
|
288 |
|
289 |
|
290 Marker interfaces: |
|
291 |
|
292 +--------------------------------+ |
|
293 |:py:class:`IIllustrationTarget` | |
|
294 +===================+============+ |
|
295 | | | |
|
296 +-------------------+------------+ |
|
297 |
|
298 +---------------------------------+ |
|
299 |:py:class:`ILinkContainerTarget` | |
|
300 +==============+==================+ |
|
301 | | Add internal link| |
|
302 | +------------------+ |
|
303 | | Add external link| |
|
304 | +------------------+ |
|
305 | | Add mailto link | |
|
306 +--------------+------------------+ |
|
307 |
|
308 +------------------------------------+ |
|
309 |:py:class:`IExtFileContainerTarget` | |
|
310 +================+===================+ |
|
311 | | Add external file | |
|
312 | +-------------------+ |
|
313 | | Add image | |
|
314 | +-------------------+ |
|
315 | | Add video | |
|
316 | +-------------------+ |
|
317 | | Add audio file | |
|
318 +----------------+-------------------+ |
|
319 |
|
320 |
|
321 ZMI overview: |
|
322 .. image:: _static/select_add_links.png |
|
323 |
|
324 |
|
325 |