Jump to content
kongondo

Visual Page Selector (commercial page picker module for ProcessWire)

Recommended Posts

Visual Page Selector

Released 31 March 2016

https://processwireshop.pw/plugins/visual-page-selector/

 
As of 04 January 2018 ProcessWire versions earlier than 3.x are not supported
 
*******************************************************   ORIGINAL POST   *******************************************************

Introducing VPS, a commercial visual page field selector. 

This is a pre-sale closed-beta version. This post is WIP and will be updated now and then.

############################

Many ProcessWire users use the 'one image per page' principle to manage and reuse images across their sites. This works fine. However, for site editors who mainly work with images, especially for larger sites, it is sometimes difficult to remember the pages where particular images reside. This module helps to solve this challenge.

Harnessing the awesomeness  that is ProcessWire, VPS provides a rich editing experience, enabling editors to search for, view, select, add, remove and delete page-images easily, in an easy to use and friendly interface. ProcessWire Lister is the workhorse behind the lightning-fast searches. Editors will be able to search for images by their descriptions, names, partial names, page names, templates, etc. 

Current Features

  1. Single-image mode
  2. Full search
  3. Batch add/Remove/Delete Image/Delete Page in page fields
  4. Image Browser
  5. Selectable pages as per page field settings + Lister filters
  6. Grid and List View
  7. Draggable sorting
  8. Responsive (almost fully :-)..iframes!)

Planned Features

  1. Multi-image mode (there are times you want to group similar images in multi-image field in one page; e.g. the back, front and side of a car photo)
  2. Configurable CSS on the fly resizing vs real image resizing (image resizing can quickly hog memory)
  3. Other as per feedback from beta testing

FAQs

When will this be available? 

Soon.

How much will it cost?

Reasonably priced. Announcement soon.

Where will I be able to buy this from?

At all fine stores that stock quality ProcessWire products :-)

Do we really need another page field/inputfield select?

See links below.

What type of licenses will be available?

Soon to be announced.

Can I beta test this?

Thanks for the interest but all available slots have been taken.

Video (excuse the video quality please - too many takes....)

 

Screens

post-894-0-74508200-1443695262_thumb.png

post-894-0-08547400-1443695199_thumb.png

post-894-0-57554100-1443696381_thumb.png

post-894-0-91846400-1443695208_thumb.png

post-894-0-93252500-1443695213_thumb.png

post-894-0-23311500-1443695244_thumb.png

Previous Discussions

https://processwire.com/talk/topic/10927-wishlist-select-pages-by-thumbnail/

Edited by kongondo
ProcessWire 3.x support only
  • Like 21

Share this post


Link to post
Share on other sites

Yesssss, I am so excited about this. :D This was the only real stumbling block to using PW for a bunch of projects.

  • Like 1

Share this post


Link to post
Share on other sites

support only pages with single image only?

How about multiple images of a page ?

Planned Features

  • Multi-image mode (there are times you want to group similar images in multi-image field in one page; e.g. the back, front and side of a car photo)

:)  ;)

  • Like 1

Share this post


Link to post
Share on other sites
Visual Page Selector (VPS) module demo and documentation (coming soon)

For now, please refer to the README.txt file in your VPS folder

Would you mind making the README available to prospective purchasers? Likewise the README for Media Manager?

Share this post


Link to post
Share on other sites

Can do, and was gonna do it but thought it is easier for guys to watch the demo videos (as I finish the documentation...)...to understand what's going on :-)

Share this post


Link to post
Share on other sites

Hi all,

I'm going to be away for the next couple of weeks (4-5 weeks possibly) with little if any access to the internet. I will deal with any queries on my return.

Thanks

Share this post


Link to post
Share on other sites

I am back. Might be a while before I go through all pending issues.

On 24/08/2016 at 0:46 PM, gerritvanaaken said:

I get an error message because there is no fancybox present in PW 3.0 ...

@gerritvanaaken. The module is not yet PW 3+ ready...but it will be once we have a stable release of that version of PW, thanks.

Share this post


Link to post
Share on other sites

Hi @kongondo

I have a few pre-purchase questions:

1. Is a PW3-compatible version of Visual Page Selector very far off? How about Media Manager - is that PW3-compatible?

2. Could you say a bit about how the use cases would differ for Visual Page Selector versus Media Manager? They seem similar in many ways (or similar in terms of image management - I know that MM supports more than just images).

3. Media Manager includes an upload feature to go from image files on my computer to page-per-image pages in PW. Does Visual Page Selector have a similar upload feature? If not, how do you recommend images are loaded to pages?

4. One of the main things that appeals to me about the page-per-image approach used in VPS/MM is the ability to add custom fields to the page used to hold the image. But I saw that you commented in the MM thread:

On 8/08/2016 at 0:57 AM, kongondo said:

Custom fields: Yes if you add them directly to the templates but you will not be able to edit those custom fields using the MM interface. In addition, MM pages are hidden in the admin so editing your custom fields will not be ideal (or accessible to normal users). Alternatively, you can use images/files native description and tag fields. These are currently editable directly in your Media Library.

So would VPS be a better option if the editing of custom fields is needed?

5. The demo video for VPS doesn't show if the page holding the image may be opened for editing from the VPS field. In other words, can I click the thumbnail or image title and open the page? Does it open in a modal window?

Thanks,
Robin.

  • Like 1

Share this post


Link to post
Share on other sites

Hi @Robin S,

Thanks for your interest in VPS and MM.

  1. My plan is for these to be ready within 3 weeks. However, some users of MM have reported successfully using it in PW 3 with no hiccups. 
  2. @see below please
  3. No, VPS does not have an upload feature since it functions as a 'normal' page field...i.e. it does not have a central repository of media but includes images you've uploaded yourself to any number of named image fields (named in the settings of VPS
  4. Custom fields: Yes, VPS would be better in that case, although the other benefits of MM probably outweigh this one advantage
  5. No, you can't, currently

#2 Differences between VPS and MM

Media Manager is a complete digital asset management for 4 types of media: audio, document, image and video. Media are stored and managed in one central repository. Uploading, editing and publication of media are tightly controlled by various permissions. Media can be uploaded to a waiting area before uploading to your Media Library. Media can be previewed (e.g. listen to a MP3 file), edited, tagged, filtered, etc with great ease. Media can be inserted in a page in two ways: in a field or in a CKEditor RTE. Media can be infinitely reused across your site. Media Manager has its own API for frontend use.

Visual Page Selector is mainly targeted to those who 'consciously' use  the one page per image approach. It is an Inputfield for Pagefields. Its purpose is to remove the guess work in site editors' minds when they have to include 'pages' in a 'page' in situations where those 'pages' are included on the 'page' for the sole purpose of accessing and reusing images found in those 'pages' (wow, a mouthful, sorry!). VPS does this by offering a visual selector where the editors can see the images contained in those 'pages'.  VPS does not have its own API...it is a Pagefield, hence is accessed like any other Pagefield in ProcessWire.

Hence, the two modules are quite different from each other actually. In MM, your editors don't know and don't care that they are actually dealing with pages. All they see are media, easily accessible via a single Media Library. VPS is a visual interface to a normal Pagefield. This means you will need to set it up like any other Pagefield, with one or two extra details you have to tell it, for instance, the name of the 'image field(s) in the 'pages'. If, on the other hand, you would like a streamlined workflow for your media management, from uploads to inclusion in pages, managing tens or hundreds or thousands of media, all in a single easy to use interface, then MM is for you. 

 

Hope this answers your question. Sorry, I have just seen that I never availed the READMEs for this modules as per your request. I can still send these to you if you wish. Please let me know if you require any more info. 

Cheers.

 

 

  • Like 2

Share this post


Link to post
Share on other sites

Thanks for the answers @kongondo.

Both Media Manager and Visual Page Selector look like useful and clever modules, although the cost/features ratio favours MM.

I think what would be really fantastic is something in between the feature set of MM and VPS, and this could perhaps be accomplished by borrowing some of the features developed for MM into VPS.

To explain, something I think PW is missing is custom fields for images (and I'm not alone: this GitHub request from today has 4 upvotes in 2 hours). There are loads of use cases for this, but one example: you are using images in your site that have a Creative Commons Attribution license. To fulfill the terms of the license each image needs the following fields attached: Author (text), Source link (URL), License (Page select), License link (URL, although in fact you'd probably store the URL for each license in the License page field). The ImageExtra module only supports textarea custom fields so it's not the right solution. What would work is a page-per-image approach with the custom fields for the image stored in the image's page. VPS is a big step towards making this a workable solution, but to use this as a replacement for a standard image field some extra features are needed beyond what is currently offered...

1. There needs to be an easy way to edit the image's custom fields from the Page inputfield. A modal link to Page Edit is all that's needed to begin with - this is something that's possible with existing inputfields such as AsmSelect. Somewhere down the line this could maybe be enhanced with AJAX loading of the custom fields into the list view of VPS, as per repeaters (just dreaming here).

2. There needs to be an easy way to add an image (page) from the inputfield. This is possible with most existing Page inputfields if the template and parent for allowed pages is defined. Basic support for this would be to open the Add Page form in a modal (the Page Field Edit Links module does something like this). But to be a closer match to existing image field functionality it would be nice to be able to upload multiple images at once. This feature is in MM - could it be added to VPS? (when template and parent are defined for the field).

3. There needs to be an easy way to embed an image into CKEditor. This feature is in MM - could it be added to VPS?

Really keen to hear your thoughts on this. Thanks!

 

  • Like 5

Share this post


Link to post
Share on other sites

Hi @Robin S,

Just acknowledging that I've seen this. Really pressed for time currently but would like to give a comprehensive answer, so hope you can wait a bit longer? In summary though, I think I might be able to add some of the features you've suggested (though some might take a while...a long while to implement). My biggest constraint is time (cliche, I know) though,...not lack of willingness :)

 

  • Like 1

Share this post


Link to post
Share on other sites

Thanks for the reply; no hurry at all.

Am currently getting by using PageTable for page-per-image images, and when I get time I will explore Inputfield Selectize also as that looks like it would be good for the task.

One last question for now: do you offer an upgrade path for your commercial modules? That is, if I purchase a Single license and find that I love it and want to use it on all my projects can I pay an upgrade fee to move to a Developer license?

 

Share this post


Link to post
Share on other sites
1 hour ago, Robin S said:

One last question for now: do you offer an upgrade path for your commercial modules? That is, if I purchase a Single license and find that I love it and want to use it on all my projects can I pay an upgrade fee to move to a Developer license?

 

Yes I do. You'd only have to pay the difference. You'd have to send me an email to arrange that. Thanks.

  • Like 1

Share this post


Link to post
Share on other sites

Hi Kongondo, i'm looking for a popup page selector, that would show the pages in a lister – but in my case sometimes no image is needed, only the list - is that something that VPS can do, or could it be something made configurable for the module;  Out of all of the various page pickers, one that i seem to be in need of is a lister style popup, which could be very useful where you have to select a page, but need to see some columns to know what you are picking, and the ability to sort, and filter the selectable pages...

  • Like 1

Share this post


Link to post
Share on other sites

Hi @Macrura,

Sorry for the very late response. Currently, VPS cannot do that. However, if you want a custom solution based on VPS, we could discuss that separately. 

Share this post


Link to post
Share on other sites

ok thanks, i will send a message....

Share this post


Link to post
Share on other sites

Quick note for those following this. As per @Macrura's request above, VPS has received a major upgrade; It can now be used as a normal page field pages' selector or in a 'one-page-per-image' strategy as before. Working on the final release now. Hope to release next week.

  • Like 6

Share this post


Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.


  • Recently Browsing   0 members

    No registered users viewing this page.

  • Similar Content

    • By Mike Rockett
      Jumplinks for ProcessWire
      Release: 1.5.56
      Composer: rockett/jumplinks
      Jumplinks is an enhanced version of the original ProcessRedirects by Antti Peisa.
      The Process module manages your permanent and temporary redirects (we'll call these "jumplinks" from now on, unless in reference to redirects from another module), useful for when you're migrating over to ProcessWire from another system/platform. Each jumplink supports wildcards, shortening the time needed to create them.
      Unlike similar modules for other platforms, wildcards in Jumplinks are much easier to work with, as Regular Expressions are not fully exposed. Instead, parameters wrapped in curly braces are used - these are described in the documentation.
      Under Development: 2.0, to be powered by FastRoute
      As of version 1.5.0, Jumplinks requires at least ProcessWire 2.6.1 to run.
      View on GitLab
      Download via the Modules Directory
      Read the docs
      Features
      The most prominent features include:
      Basic jumplinks (from one fixed route to another) Parameter-based wildcards with "Smart" equivalents Mapping Collections (for converting ID-based routes to their named-equivalents without the need to create multiple jumplinks) Destination Selectors (for finding and redirecting to pages containing legacy location information) Timed Activation (activate and/or deactivate jumplinks at specific times) 404-Monitor (for creating jumplinks based on 404 hits) Additionally, the following features may come in handy:
      Stale jumplink management Legacy domain support for slow migrations An importer (from CSV or ProcessRedirects) Feedback & Feature Requests
      I’d love to know what you think of this module. Please provide some feedback on the module as a whole, or even regarding smaller things that make it whole. Also, please feel free to submit feature requests and their use-cases.
      Note: Features requested so far have been added to the to-do list, and will be added to 2.0, and not the current dev/master branches.
      Open Source

      Jumplinks is an open-source project, and is free to use. In fact, Jumplinks will always be open-source, and will always remain free to use. Forever. If you would like to support the development of Jumplinks, please consider making a small donation via PayPal.
      Enjoy! :)
    • By BitPoet
      As threatened in Ryan's announcement for 3.0.139, I built a little module for sliding toggles as a replacement for checkboxes. Styling of the input is CSS3 only (with all the usual caveats about older browsers), no JS necessary, and may still be a bit "rough around the edges", so to speak, since I didn't have much time for testing on different devices or brushing things up enough so I'd feel comfortable pushing it to the module directory. But here's the link to the GitHub repo for now:
      InputfieldSlideToggle
      Fieldtype and Inputfield that implements smartphone-style toggles as replacement for checkbox inputs. The visualization is CSS-only, no additional JS necessary.
      Status
      Still very alpha, use with caution!
      Features / Field Settings
      Size
      You can render the toggles in four different sizes: small, medium, large and extra large.
      Off Color
      Currently, "unchecked" toggles can be displayed either in grey (default) or red.
      On Color
      "Checked" toggles can be rendered in one of these colors: blue (default), black, green, grey, orange or red.
      Screenshots

      Some examples with checkbox label


      View all Size and Color Combinations
      Small toggles Medium toggles Big toggles Extra big toggles  









    • By Orkun
      Hi Guys
      I needed to add extended functionalities for the InputfieldDatetime Module (module is from processwire version 2.7.3) because of a Request of Customer.
      So I duplicated the module and placed it under /site/modules/.
      I have added 3 new Settings to the InputfieldDatetime Module.
      1. Day Restriction - Restrict different days based on weekdays selection (e.g. saturday, sunday) - WORKING

       
      2. Time Slots - Define Time slots based on custom Integer Value (max is 60 for 1 hour) - WORKING

       
      3. Time Range Rules per Weekday - Define a minTime and MaxTime per Weekday (e.g. Opening Hours of a Restaurant) - NOT WORKING PROPERLY

       
      The Problem
      Time Slots and Day Restriction working fine so far. But the Time Range Rules per Weekday doesn't work right.
      What should happen is, that when you click on a date, it should update the minTime and maxTime of the Time Select.
      But the change on the select only happens if you select a date 2 times or when you select a date 1 time and then close the datepicker and reopen it again.
      The time select doesn't get change when you select a date 1 time and don't close the picker.
      Here is the whole extended InputfieldDatetime Module.
      The Files that I have changed:
      InputfieldDatetime.module InputfieldDatetime.js jquery-ui-timepicker-addon.js (https://trentrichardson.com/examples/timepicker/) - updated it to the newest version, because minTime and maxTime Option was only available in the new version  
      Thats the Part of the JS that is not working correctly:
      if(datetimerules && datetimerules.length){ options.onSelect = function(date, inst) { var day = $(this).datetimepicker("getDate").getDay(); day = day.toString(); var mintime = $(this).attr('data-weekday'+day+'-mintime'); var maxtime = $(this).attr('data-weekday'+day+'-maxtime'); console.log("weekday: "+day); console.log("minTime: "+mintime); console.log("maxTime: "+maxtime); var optionsAll = $(this).datetimepicker( "option", "all" ); optionsAll.minTime = mintime; optionsAll.maxTime = maxtime; $(this).datetimepicker('destroy'); $(this).datetimepicker(optionsAll); $(this).datetimepicker('refresh'); //$.datepicker._selectDate($(this).attr("id"),date); //$.datepicker._base_getDateDatepicker(); // var inst = $.datepicker._getInst($(this)); // $.datepicker._updateDatepicker(inst); /*$(this).datetimepicker('destroy'); InputfieldDatetimeDatepicker($(this), mintime, maxtime); $(this).datetimepicker('refresh'); */ // $(this).datetimepicker('option', {minTime: mintime, maxTime: maxtime}); } } Can you have a look and find out what the Problem is?
      InputfieldDatetime.zip
       
      Kind Regards
      Orkun
    • By teppo
      This module tracks changes, additions, removals etc. of public (as in "not under admin") pages of your site. Like it's name says, it doesn't attempt to be a version control system or anything like that - just a log of what's happened.
      At the moment it's still a work in progress and will most likely be a victim of many ruthless this-won't-work-let's-try-that-instead cycles, but I believe I've nailed basic functionality well enough to post it here.. so, once again, I'll be happy to hear any comments you folks can provide
      https://modules.processwire.com/modules/process-changelog/
      https://github.com/teppokoivula/ProcessChangelog
      How does it work?
      Exactly like it's (sort of) predecessor, Process Changelog actually consists of two modules: Process Changelog and Process Changelog Hooks. Hooks module exists only to serve main module by hooking into various functions within Pages class, collecting data of performed operations, refining it and keeping up a log of events in it's own custom database table (process_changelog.) Visible part is managed by Process Changelog, which provides users a (relatively) pretty view of the contents of said log table.
      How do you use it?
      When installed this module adds new page called Changelog under Admin > Setup which provides you with a table view of collected data and basic filtering tools See attached screenshots to get a general idea about what that page should look like after a while.
      For detailed installation instructions etc. see README.md.
       


    • By Gadgetto
      Status update links (inside this thread) for SnipWire development will be always posted here:
      2019-08-08
      2019-06-15
      2019-06-02
      2019-05-25
      If you are interested, you can test the current state of development:
      https://github.com/gadgetto/SnipWire
      Please note that the software is not yet intended for use in a production system (alpha version).
      If you like, you can also submit feature requests and suggestions for improvement. I also accept pull requests.
      ---- INITIAL POST FROM 2019-05-25 ----
      I wanted to let you know that I am currently working on a new ProcessWire module that fully integrates the Snipcart Shopping Cart System into ProcessWire. (this is a customer project, so I had to postpone the development of my other module GroupMailer).
      The new module SnipWire offers full integration of the Snipcart Shopping Cart System into ProcessWire.
      Here are some highlights:
      simple setup with (optional) pre-installed templates, product fields, sample products (quasi a complete shop system to get started immediately) store dashboard with all data from the snipcart system (no change to the snipcart dashboard itself required) Integrated REST API for controlling and querying snipcart data webhooks to trigger events from Snipcart (new order, new customer, etc.) multi currency support self-defined/configurable tax rates etc. Development is already well advanced and I plan to release the module in the next 2-3 months.
      I'm not sure yet if this will be a "Pro" module or if it will be made available for free.
      I would be grateful for suggestions and hints!
      (please have a look at the screenshots to get an idea what I'm talking about)
       




×
×
  • Create New...