Search in sources :

Example 1 with ImageFormItem

use of org.olat.core.gui.components.image.ImageFormItem in project OpenOLAT by OpenOLAT.

the class FileElementImpl method setPreview.

@Override
public void setPreview(UserSession usess, boolean enable) {
    if (enable) {
        previewEl = new ImageFormItem(usess, this.getName() + "_PREVIEW");
        previewEl.setRootForm(getRootForm());
    } else {
        previewEl = null;
    }
}
Also used : ImageFormItem(org.olat.core.gui.components.image.ImageFormItem)

Example 2 with ImageFormItem

use of org.olat.core.gui.components.image.ImageFormItem in project OpenOLAT by OpenOLAT.

the class FileElementRenderer method render.

/* (non-Javadoc)
	 * @see org.olat.core.gui.components.ComponentRenderer#render(org.olat.core.gui.render.Renderer, org.olat.core.gui.render.StringOutput, org.olat.core.gui.components.Component, org.olat.core.gui.render.URLBuilder, org.olat.core.gui.translator.Translator, org.olat.core.gui.render.RenderResult, java.lang.String[])
	 */
@Override
public void render(Renderer renderer, StringOutput sb, Component source, URLBuilder ubu, Translator translator, RenderResult renderResult, String[] args) {
    // Use translator with flexi form elements fallback
    Translator trans = Util.createPackageTranslator(FileElementRenderer.class, translator.getLocale(), translator);
    // 
    FileElementComponent fileComp = (FileElementComponent) source;
    FileElementImpl fileElem = fileComp.getFileElementImpl();
    String id = fileComp.getFormDispatchId();
    // Calculate current file name: either from already uploaded file or
    // from initial file or empty
    String fileName = fileElem.getUploadFileName();
    if (fileName == null) {
        // try fallback: default file
        File initialFile = fileElem.getInitialFile();
        if (initialFile != null) {
            fileName = initialFile.getName();
        } else {
            fileName = "";
        }
    }
    // Read-write view
    if (fileComp.isEnabled()) {
        ImageFormItem previewCmp = fileElem.getPreviewFormItem();
        if (previewCmp != null && previewCmp.isEnabled() && previewCmp.isVisible()) {
            sb.append("<div class='o_filepreview'>");
            renderer.render(previewCmp.getComponent(), sb, args);
            sb.append("</div>");
        }
        boolean showDeleteButton = fileElem.isDeleteEnabled() && (fileElem.getInitialFile() != null || fileElem.getUploadFile() != null);
        sb.append("<div class='o_fileinput'>");
        // See http://www.quirksmode.org/dom/inputfile.html
        if (fileElem.isButtonsEnabled()) {
            sb.append("<input type='file' name=\"");
            // name for form labeling
            sb.append(id);
            sb.append("\" id=\"");
            // id to make dirty button work
            sb.append(id);
            sb.append("\" class='form-control o_realchooser ").append(" o_chooser_with_delete", showDeleteButton).append("' ");
            // Add on* event handlers
            StringBuilder eventHandlers = FormJSHelper.getRawJSFor(fileElem.getRootForm(), id, fileElem.getAction());
            int onChangePos = eventHandlers.indexOf("onchange=");
            if (onChangePos != -1) {
                // add file upload change handler
                sb.append(eventHandlers.substring(0, onChangePos + 10)).append("b_handleFileUploadFormChange(this, this.form.fake_").append(id).append(", this.form.upload);").append(eventHandlers.substring(onChangePos + 10, eventHandlers.length()));
            } else {
                sb.append(eventHandlers).append(" onchange=\"b_handleFileUploadFormChange(this, this.form.fake_").append(id).append(", this.form.upload)\"");
            }
            // Add pseudo focus marker on fake file chooser button
            sb.append(" onfocus=\"this.form.fake_").append(id).append(".nextSibling.style.border = '1px dotted black';\"").append(" onblur=\"this.form.fake_").append(id).append(".nextSibling.style.border = '0';\"");
            // Add select text (hover)
            sb.append(" title=\"").append(StringEscapeUtils.escapeHtml(trans.translate("file.element.select"))).append("\" />");
        }
        // Add the visible but fake input field and a styled faked file chooser button
        sb.append("<div class='o_fakechooser input-group'>");
        sb.append("<input class='form-control' name='fake_").append(id).append("' value=\"").append(StringEscapeUtils.escapeHtml(fileName)).append("\" placeholder=\"").append(StringEscapeUtils.escapeHtml(trans.translate("file.element.select"))).append("\" />");
        sb.append("<span class='input-group-addon'><a href='javascript:;'><i class='o_icon o_icon_upload'> </i></a></span>");
        if (showDeleteButton) {
            sb.append("<a class='input-group-addon' href=\"javascript:").append(FormJSHelper.getXHRFnCallFor(fileElem.getRootForm(), fileComp.getFormDispatchId(), 1, false, false, new NameValuePair("delete", "delete"))).append(";\" onclick=\"\" ").append(" title=\"").append(StringEscapeUtils.escapeHtml(trans.translate("file.element.delete"))).append("\" ><i class='o_icon o_icon_delete'> </i></a>");
        }
        sb.append("</div></div>");
        // Add example text and  max upload size
        if (fileElem.getExampleText() != null) {
            sb.append("<div class='help-block'>").append(fileElem.getExampleText());
            if (fileElem.getMaxUploadSizeKB() != FileElement.UPLOAD_UNLIMITED) {
                String maxUpload = Formatter.formatBytes(fileElem.getMaxUploadSizeKB() * 1000);
                sb.append(" (").append(trans.translate("file.element.select.maxsize", new String[] { maxUpload })).append(")");
            }
            sb.append("</div>");
        } else if (fileElem.getMaxUploadSizeKB() != FileElement.UPLOAD_UNLIMITED) {
            String maxUpload = Formatter.formatBytes(fileElem.getMaxUploadSizeKB() * 1000);
            sb.append("<div class='help-block o_maxsize'>(").append(trans.translate("file.element.select.maxsize", new String[] { maxUpload })).append(")</div>");
        }
        // Add set dirty form on change
        FormJSHelper.appendFlexiFormDirty(sb, fileElem.getRootForm(), fileComp.getFormDispatchId());
    } else {
        // Read only view
        sb.append("<span id=\"").append(id).append("\" ").append(FormJSHelper.getRawJSFor(fileElem.getRootForm(), id, fileElem.getAction())).append(" >").append("<input type='text' disabled=\"disabled\" class=\"form-control o_disabled\" size=\"").append("\" value=\"").append(StringEscapeUtils.escapeHtml(fileName)).append("\" ").append("\" />").append("</span>");
    }
}
Also used : NameValuePair(org.olat.core.gui.components.form.flexible.impl.NameValuePair) Translator(org.olat.core.gui.translator.Translator) ImageFormItem(org.olat.core.gui.components.image.ImageFormItem) File(java.io.File)

Example 3 with ImageFormItem

use of org.olat.core.gui.components.image.ImageFormItem in project OpenOLAT by OpenOLAT.

the class ImageMediaEditorController method initForm.

@Override
protected void initForm(FormItemContainer formLayout, Controller listener, UserRequest ureq) {
    Media media = mediaPart.getMedia();
    File mediaDir = new File(FolderConfig.getCanonicalRoot(), media.getStoragePath());
    File mediaFile = new File(mediaDir, media.getRootFilename());
    ImageFormItem imageEl = new ImageFormItem(ureq.getUserSession(), "image");
    imageEl.setMedia(mediaFile);
    formLayout.add("image", imageEl);
    alignmentEl = uifactory.addDropdownSingleselect("alignment", null, formLayout, alignmentKeys, alignmentKeys, null);
    alignmentEl.addActionListener(FormEvent.ONCHANGE);
    if (StringHelper.containsNonWhitespace(mediaPart.getLayoutOptions())) {
        for (String alignmentKey : alignmentKeys) {
            if (mediaPart.getLayoutOptions().contains(alignmentKey)) {
                alignmentEl.select(alignmentKey, true);
            }
        }
    }
}
Also used : ImageFormItem(org.olat.core.gui.components.image.ImageFormItem) Media(org.olat.modules.portfolio.Media) File(java.io.File)

Example 4 with ImageFormItem

use of org.olat.core.gui.components.image.ImageFormItem in project openolat by klemens.

the class FileElementRenderer method render.

/* (non-Javadoc)
	 * @see org.olat.core.gui.components.ComponentRenderer#render(org.olat.core.gui.render.Renderer, org.olat.core.gui.render.StringOutput, org.olat.core.gui.components.Component, org.olat.core.gui.render.URLBuilder, org.olat.core.gui.translator.Translator, org.olat.core.gui.render.RenderResult, java.lang.String[])
	 */
@Override
public void render(Renderer renderer, StringOutput sb, Component source, URLBuilder ubu, Translator translator, RenderResult renderResult, String[] args) {
    // Use translator with flexi form elements fallback
    Translator trans = Util.createPackageTranslator(FileElementRenderer.class, translator.getLocale(), translator);
    // 
    FileElementComponent fileComp = (FileElementComponent) source;
    FileElementImpl fileElem = fileComp.getFileElementImpl();
    String id = fileComp.getFormDispatchId();
    // Calculate current file name: either from already uploaded file or
    // from initial file or empty
    String fileName = fileElem.getUploadFileName();
    if (fileName == null) {
        // try fallback: default file
        File initialFile = fileElem.getInitialFile();
        if (initialFile != null) {
            fileName = initialFile.getName();
        } else {
            fileName = "";
        }
    }
    // Read-write view
    if (fileComp.isEnabled()) {
        ImageFormItem previewCmp = fileElem.getPreviewFormItem();
        if (previewCmp != null && previewCmp.isEnabled() && previewCmp.isVisible()) {
            sb.append("<div class='o_filepreview'>");
            renderer.render(previewCmp.getComponent(), sb, args);
            sb.append("</div>");
        }
        boolean showDeleteButton = fileElem.isDeleteEnabled() && (fileElem.getInitialFile() != null || fileElem.getUploadFile() != null);
        sb.append("<div class='o_fileinput'>");
        // See http://www.quirksmode.org/dom/inputfile.html
        if (fileElem.isButtonsEnabled()) {
            sb.append("<input type='file' name=\"");
            // name for form labeling
            sb.append(id);
            sb.append("\" id=\"");
            // id to make dirty button work
            sb.append(id);
            sb.append("\" class='form-control o_realchooser ").append(" o_chooser_with_delete", showDeleteButton).append("' ");
            // Add on* event handlers
            StringBuilder eventHandlers = FormJSHelper.getRawJSFor(fileElem.getRootForm(), id, fileElem.getAction());
            int onChangePos = eventHandlers.indexOf("onchange=");
            if (onChangePos != -1) {
                // add file upload change handler
                sb.append(eventHandlers.substring(0, onChangePos + 10)).append("b_handleFileUploadFormChange(this, this.form.fake_").append(id).append(", this.form.upload);").append(eventHandlers.substring(onChangePos + 10, eventHandlers.length()));
            } else {
                sb.append(eventHandlers).append(" onchange=\"b_handleFileUploadFormChange(this, this.form.fake_").append(id).append(", this.form.upload)\"");
            }
            // Add pseudo focus marker on fake file chooser button
            sb.append(" onfocus=\"this.form.fake_").append(id).append(".nextSibling.style.border = '1px dotted black';\"").append(" onblur=\"this.form.fake_").append(id).append(".nextSibling.style.border = '0';\"");
            // Add select text (hover)
            sb.append(" title=\"").append(StringEscapeUtils.escapeHtml(trans.translate("file.element.select"))).append("\" />");
        }
        // Add the visible but fake input field and a styled faked file chooser button
        sb.append("<div class='o_fakechooser input-group'>");
        sb.append("<input class='form-control' name='fake_").append(id).append("' value=\"").append(StringEscapeUtils.escapeHtml(fileName)).append("\" placeholder=\"").append(StringEscapeUtils.escapeHtml(trans.translate("file.element.select"))).append("\" />");
        sb.append("<span class='input-group-addon'><a href='javascript:;'><i class='o_icon o_icon_upload'> </i></a></span>");
        if (showDeleteButton) {
            sb.append("<a class='input-group-addon' href=\"javascript:").append(FormJSHelper.getXHRFnCallFor(fileElem.getRootForm(), fileComp.getFormDispatchId(), 1, false, false, new NameValuePair("delete", "delete"))).append(";\" onclick=\"\" ").append(" title=\"").append(StringEscapeUtils.escapeHtml(trans.translate("file.element.delete"))).append("\" ><i class='o_icon o_icon_delete'> </i></a>");
        }
        sb.append("</div></div>");
        // Add example text and  max upload size
        if (fileElem.getExampleText() != null) {
            sb.append("<div class='help-block'>").append(fileElem.getExampleText());
            if (fileElem.getMaxUploadSizeKB() != FileElement.UPLOAD_UNLIMITED) {
                String maxUpload = Formatter.formatBytes(fileElem.getMaxUploadSizeKB() * 1000);
                sb.append(" (").append(trans.translate("file.element.select.maxsize", new String[] { maxUpload })).append(")");
            }
            sb.append("</div>");
        } else if (fileElem.getMaxUploadSizeKB() != FileElement.UPLOAD_UNLIMITED) {
            String maxUpload = Formatter.formatBytes(fileElem.getMaxUploadSizeKB() * 1000);
            sb.append("<div class='help-block o_maxsize'>(").append(trans.translate("file.element.select.maxsize", new String[] { maxUpload })).append(")</div>");
        }
        // Add set dirty form on change
        FormJSHelper.appendFlexiFormDirty(sb, fileElem.getRootForm(), fileComp.getFormDispatchId());
    } else {
        // Read only view
        sb.append("<span id=\"").append(id).append("\" ").append(FormJSHelper.getRawJSFor(fileElem.getRootForm(), id, fileElem.getAction())).append(" >").append("<input type='text' disabled=\"disabled\" class=\"form-control o_disabled\" size=\"").append("\" value=\"").append(StringEscapeUtils.escapeHtml(fileName)).append("\" ").append("\" />").append("</span>");
    }
}
Also used : NameValuePair(org.olat.core.gui.components.form.flexible.impl.NameValuePair) Translator(org.olat.core.gui.translator.Translator) ImageFormItem(org.olat.core.gui.components.image.ImageFormItem) File(java.io.File)

Example 5 with ImageFormItem

use of org.olat.core.gui.components.image.ImageFormItem in project openolat by klemens.

the class ImageMediaEditorController method initForm.

@Override
protected void initForm(FormItemContainer formLayout, Controller listener, UserRequest ureq) {
    Media media = mediaPart.getMedia();
    File mediaDir = new File(FolderConfig.getCanonicalRoot(), media.getStoragePath());
    File mediaFile = new File(mediaDir, media.getRootFilename());
    ImageFormItem imageEl = new ImageFormItem(ureq.getUserSession(), "image");
    imageEl.setMedia(mediaFile);
    formLayout.add("image", imageEl);
    alignmentEl = uifactory.addDropdownSingleselect("alignment", null, formLayout, alignmentKeys, alignmentKeys, null);
    alignmentEl.addActionListener(FormEvent.ONCHANGE);
    if (StringHelper.containsNonWhitespace(mediaPart.getLayoutOptions())) {
        for (String alignmentKey : alignmentKeys) {
            if (mediaPart.getLayoutOptions().contains(alignmentKey)) {
                alignmentEl.select(alignmentKey, true);
            }
        }
    }
}
Also used : ImageFormItem(org.olat.core.gui.components.image.ImageFormItem) Media(org.olat.modules.portfolio.Media) File(java.io.File)

Aggregations

ImageFormItem (org.olat.core.gui.components.image.ImageFormItem)6 File (java.io.File)4 NameValuePair (org.olat.core.gui.components.form.flexible.impl.NameValuePair)2 Translator (org.olat.core.gui.translator.Translator)2 Media (org.olat.modules.portfolio.Media)2